# Forms shaped by a schema. Ready for real workflows.

> Schema-driven forms with conditions, steps and drafts.

Language: en
Canonical: https://texuli.com/solutions/forms/
Markdown: https://texuli.com/solutions/forms.md (this page). Every texuli.com page has a Markdown twin at its URL plus `.md` (the home page is https://texuli.com/index.md), and any page URL answers `Accept: text/markdown` with its twin instead of HTML.
Last Updated: 2026-11-13

---

Solution · Forms

Build a multi-step intake, reveal fields when they matter, and keep drafts with storage your app controls. Explore the in-development builder and preview the form beside it.

Status: in development

[Try the forms demo](https://texuli.com/solutions/forms/#demo)[Start with the schema](https://texuli.com/solutions/forms/#quickstart)

## Edit a schema, then try the form

Try this

- In the intake, choose “In person” to reveal the visit step.
- Edit a field and watch the draft notice update; this demo keeps drafts in memory.
- Open the visual builder, add or reorder a field, and inspect its preview and JSON.

Use Reset to return to the starting example.

Interactive preview

 Fictional data · in-memory drafts · no network submission

### Fill the workshop intake

Choose “In person” to reveal the visit step. Edit a field to exercise local autosave.

 SchemaForm

## Community workshop request

A fictional example.com event. Nothing is submitted or stored on a server.

### About you

Share a few details for the workshop team.

 Your name

 Email address

 How will you join?

The sample form is ready. Drafts remain in memory for this page session.

Open the visual builder

The builder was released in @texuli/forms 0.18.0 (in development, pre-1.0).

 Form title

2 fields · schema valid

## Canvas

- ⠿ Your nametext ↑ ↓ ×
- ⠿ Email addressemail ↑ ↓ ×

## Inspector

 Label Field name Required Format Show condition Expression JSON

```
""
```

## Preview

## Workshop contact form

 Your name

 Email address

## Schema

2 fields in the authored schema.

Builder output updates its validated preview and schema JSON as you edit.

If the interactive demo cannot load, use the static preview above.

## One schema, from first draft to a working form.

### Ask the next question at the right time.

Closed expressions control visibility and required state. Conditions read only fields already declared, so the form stays predictable and cycle-free.

- Schema forms

### Keep long intakes in clear steps.

Move through a focused step at a time. The view validates before advancing and can restore the current step with a saved draft.

- Steps and conditions

in development

### Shape fields, then inspect the result.

The visual builder was released in 0.18.0 and is still in development. It edits field order and settings, validates the schema, and shows a live preview.

- Visual builder

## From a closed schema to a form people can finish.

- ### Describe the fields Use a closed schema with named field types, options and validation constraints.Package: `@texuli/forms`
- ### Validate conditions Compile the schema before rendering. Invalid members, expressions and field relationships produce issues.Package: `@texuli/forms`
- ### Render each step Mount SchemaForm with Texuli controls, accessible validation and multi-step navigation.Package: `@texuli/forms`
- ### Choose draft storage Pass a host storage adapter for drafts and autosave. This demo keeps its sample draft in memory only.Package: `@texuli/forms`
- ### Build and preview Use the in-development builder (released in 0.18.0) to arrange fields, edit settings and inspect schema JSON before adoption.Package: `@texuli/forms`

Forms is built from @texuli/forms, on texuli, @texuli/core and @texuli/drag.

Solution

Forms

Packages

- L4[`@texuli/forms`](https://www.npmjs.com/package/@texuli/forms) Schema, model, controls and host rendering are in development and published on npm; the builder was released in 0.18.0. Subpaths: . · ./model · ./controls · ./builder · ./host

Built on

- L3 `texuli` (Styled components)
- L0 `@texuli/core` (Texels and the URL policy)
- L0 `@texuli/drag` (Drag engine)

Build with Forms

## Start with a form schema

### Install

```
pnpm add @texuli/forms@0.18.0
```

### Validate a schema

```
import { validateFormSchema } from '@texuli/forms/model';

const result = validateFormSchema({
  title: 'Contact example.com',
  fields: [
    { name: 'email', type: 'email', label: 'Email address', required: true },
  ],
});

if (result.ok) {
  console.log(result.form.schema.title);
} else {
  console.error(result.issues);
}
```

### Keep a local draft

```
import { createMemoryDrafts } from '@texuli/forms/model';
import { SchemaForm } from '@texuli/forms';

const drafts = { storage: createMemoryDrafts(), key: 'intake-preview' };
// Pass {form, drafts} to SchemaForm. Your app can supply another storage adapter.
```

Verified by `tests/e2e/site-solution-forms.spec.ts`

## Keep building

- ### [Render a validated schema](https://texuli.com/guides/solutions/forms/) Start with a closed schema and mount SchemaForm from the forms package.
- ### [Explore every field control](https://texuli.com/examples/forms-fields/) Browse the package example for supported form field types.

## For agents

A host can validate a schema before rendering it. The builder is a developer-facing authoring tool; it does not execute generated code or send form submissions.

- [MCP server](https://texuli.com/mcp-server/)
- [Agent skill](https://texuli.com/skill/)
- [Building with agents](https://texuli.com/agents-page/)

- `@texuli/forms/model` @texuli/forms/model: In developmentClosed form schema validation and controller logic, available in the in-development package.
- `@texuli/forms/builder` @texuli/forms/builder: PlannedVisual field authoring and preview; present in this branch and planned for the next release.

## Platforms

- ### Web Web: In developmentSvelte 5 packages published on npm (pre-1.0).
- ### Compose Desktop Compose Desktop: PlannedKotlin Multiplatform renderer on the JVM, built in this repository.
- ### Android Android: PlannedNative renderer target.
- ### iOS iOS: PlannedNative renderer target.

[How the native renderer works](https://texuli.com/native/)

## Start building with Forms

Schema-driven forms with conditions, steps and drafts.

[Build a schema form](https://texuli.com/guides/solutions/forms/)[Forms capability reference](https://texuli.com/forms-page/)[@texuli/forms on npm](https://www.npmjs.com/package/@texuli/forms)

 ![A low horizon of stacked cubes rising to one glowing pearl cube under a wide open sky](https://texuli.com/_astro/home-final.BGuYKnjC.webp) ![A low horizon of stacked cubes rising to one glowing pearl cube under a wide open sky](https://texuli.com/_astro/home-final.BGuYKnjC.webp)

## For agents

Fill a multi-step intake: the live Forms demo runs in the browser on fixture data. The intake draft stays in this page session and nothing is submitted. The visual builder subpath is in development: released in 0.18.0. The live parts run in the browser and are not in this Markdown; the operations below do the same work through the read-only MCP server at https://texuli.com/mcp (no sign-in; see https://texuli.com/auth.md).

Limits today:

- @texuli/forms is in development (pre-1.0): a new minor version may break the API.
- The visual builder subpath is in development: released in 0.18.0.
- /forms-page/ stays as the capability reference; it is not redirected (ADR-036).

MCP operations ([reference](https://github.com/DailybotHQ/texuli/blob/main/packages/tools/docs/ops.md#operations)):

- `catalog.search`: Search the component catalog.
- `component.get`: Read a component manifest.
- `blueprint.validate`: Validate a blueprint draft.

Docs:

- [Forms docs](https://texuli.com/guides/solutions/forms/)
- [@texuli/forms README](https://github.com/DailybotHQ/texuli/blob/main/packages/forms/README.md)