Context

const ThemeContext = createContext("light");

function App() {
  const [theme, setTheme] = useState("dark");
  return <ThemeContext value={theme}><Page /></ThemeContext>;
}

function Button() {
  const theme = useContext(ThemeContext);
  return <button className={theme}>Ок</button>;
}

Что важно знать

• Подходит для редко меняющихся данных, нужных многим: тема, язык, текущий пользователь.
• При изменении значения перерисовываются все компоненты, читающие контекст. Объект-значение, созданный заново на каждом рендере, перерисует их всегда — оборачивать в useMemo или разделять контексты.
• Часто проблему проброса props лучше решает композиция через children.
• Для часто меняющегося общего состояния — Zustand, Redux Toolkit или библиотеки серверного состояния.