Widgets
AI Widget Builder
Describe a widget in natural language, get a fully-functional component back — code, schema, default example, and placeholder functions, all generated.
What it does
From a plain-English description (or a starter template), the builder produces:
- Code — the visual implementation, ready to render
- Schema — the data structure the widget expects
- Default example — pre-populated demo values
- Functions and states — scaffolded UI behaviours, configured manually
Workflow
- Click a template (contact form, product card, comparison table…) or type a description of what you want
- Refine conversationally: “make the button blue”, “add a phone field”, “rename the heading”
- Live preview updates as the builder regenerates code, schema, and examples in lockstep
- Undo any step to return to the previous version
Limits
The builder generates placeholder functions (default to dismiss-type) and states (simple visibility rules). After generation, switch to the Functions and States tabs to wire the real behaviour.
Related