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>.

Why is this bad?

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

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>
  );
}