Skip to documentation content

Examples

Try local examples for reactive state, data-query recovery, custom components, and parser diagnostics, with their source code.

These examples run the local renderer and runtime. They use fixed programs and labeled sample data so you can inspect the behavior before connecting a model. Open each Code tab to see the React integration.

For layout, form validation, charts, tabs, and token replay, use the main playground. For sending messages and switching conversations, use the chat demo.

Save and restore state

Add to the count, save a snapshot, change it again, then restore. The emitted state map is visible below the controls. State and forms explains how to store it with a response.

generative-state-demo

Recover a data query

Load the fixture, simulate failure, then retry the query. The source program stays the same. Data and tools explains the provider and recovery hooks.

generative-query-demo

Register a product component

DeliveryStatus is added to the library with a schema and a React implementation using Honest UI Card and Badge. Its values are illustrative; there is no tracking service. Component library explains the extension contract.

generative-custom-demo

Inspect and correct a program

Break the component name to produce parser diagnostics, edit the source, or restore the valid program. Invalid output is kept out of the renderer in this example. This is local validation and manual correction, not model repair.

generative-diagnostics-demo

See Language diagnostics for common causes and Server repair for connecting your own correction model.