ConstThe context object created via createContext(defaultValue)
The current context value (type-inferred from context)
const ThemeContext = createContext({
bg: "#111",
accent: "#ff3366",
text: "#eee"
});
// Deep in UI tree:
const theme = useContext(ThemeContext);
usePaint(ctx => {
ctx.fillStyle = theme.bg;
ctx.fillRect(0, 0, rect.width, rect.height);
});
// Provider somewhere higher:
<ThemeContext.Provider value={{ bg: "#000", accent: currentThemeColor, text: "#fff" }}>
<HUD />
<World />
</ThemeContext.Provider>
createContext — to create the context object
Reads the current value of a Kayla context.
This hook MUST be called at the top level of a component function — never inside loops, conditions, nested functions, or callbacks. The call order of all hooks is strictly fixed across every refresh; reordering calls will corrupt internal state.
Context lets you share global-ish data (theme, game mode, player reference, audio settings…) down the tree without passing props through every level.
Returns the nearest ancestor
<Provider>'s value — or the default value if no provider is found.