no-context-provider

Full Name in eslint-plugin-react-x

react-x/no-context-provider

Full Name in @eslint-react/eslint-plugin

@eslint-react/no-context-provider

Features

🔍 🔄

Presets

core
recommended
recommended-typescript
recommended-type-checked

What it does

Disallows using <Context.Provider>.

In React 19, you can render <Context> as a provider instead of <Context.Provider>.

A safe codemod is available for this rule.

Examples

Failing

const ThemeContext = createContext("");
 
function App({ children }) {
  return (
    <ThemeContext.Provider value="light">
      {children}
    </ThemeContext.Provider>
  );
}

Passing

const ThemeContext = createContext("");
 
function App({ children }) {
  return (
    <ThemeContext value="dark">
      {children}
    </ThemeContext>
  );
}

Implementation

Rule source
Test source