07 · Frontend
Does it work with React — components, hooks, and Context?
React is built in. A component compiles to a React function
component, JSX lowers to createElement, custom hooks are just functions —
and complex state is safer than plain TypeScript.
Why it matters
A lot of the code agents write is React. Glyph treats it as a first-class target, not a
bolt-on: component is its own keyword (so grep "^component "
audits your whole UI), and hooks work exactly as you'd expect because they're ordinary
function calls.
See it
A custom hook is a function that calls hooks. Reducer state gets something React alone can't give you — compile-time exhaustiveness on every action:
type Action = Inc | Dec | Reset
fn reducer(n: number, a: Action) -> number {
return match a {
Inc => n + 1,
Dec => n - 1,
Reset => 0,
// add an Action variant ⇒ this match fails to compile
}
}
fn use_counter() -> StateHandle<number> {
return use_reducer(reducer, 0)
}
Add a SetTo(number) action and every reducer that doesn't handle it stops
compiling — the bug a plain TypeScript switch would let ship. React
Context works today through createContext /
useContext, and member-expression element names
(<ThemeContext.Provider>) work directly — no workaround.
The honest edge: a component takes a single props record (not multiple positional params), and some React-library patterns — prop spreading, zod's value-derived types — need a thin adapter today. See using your libraries and the hardening page for exactly where that boundary is.
Where it stands
Shipping today
Components, JSX, fragments (<>...</>), member-expression element names (<Ctx.Provider>), built-in and custom hooks, useReducer with exhaustive tagged-union actions, and Context via createContext/useContext.
On the way
Smoother interop for prop-spread-heavy component libraries.