How it works
When you pass a formDef array to <gui-form>, the engine runs it through a small, predictable pipeline:
- Selector resolution. Selectors from
formSelectors(and the chain rootgui.selectors) match against shortcut entries by type, tag, or uid. Matching selectors emit decorator overrides. - Widget merging. For each shortcut, decorator overrides are merged with the shortcut’s own props in a defined precedence order (sensible defaults < selector decorators < shortcut props < per-state overrides).
- Widget mapping. The merged decorator is mapped to a core
FormWidget— the same shape JSON forms produce. - Render. The framework adapter renders each widget through its registered loader, passes data and event hooks, and reactively updates as state changes.
You don’t usually need to know any of this. But if you start writing selectors or composing complex states, the precedence order above is what to keep in mind.
See also
Section titled “See also”- Selectors — the behavior layer.
- Sensible defaults — how the engine fills in labels and placeholders for you.
- Precedence — the full merge order.