Form Builder

The Form Builder is optional. Use it when your product needs an admin surface where users can create or edit Form Definitions.

import { FormBuilder } from "@mackehansson/schemaform-shadcn";

<FormBuilder value={definition} onChange={setDefinition} />;

You can also import it from the explicit renderer entrypoint:

import { FormBuilder } from "@mackehansson/schemaform-shadcn";

Source Map

The builder source lives in packages/schemaform/src/shadcn/form-builder.tsx and packages/schemaform/src/shadcn/rule-editor.tsx. It depends on Core mutations, the React builder hook, the Registry, and the local ShadCN-style components.

Copy the builder source when it should become product-specific admin code.

Dependency Chain

The builder sits above the other layers:

Core -> React hooks -> ShadCN renderer -> Form Builder

It uses Core mutations through useFormBuilder, then renders a concrete ShadCN admin UI around those operations.

App Responsibilities

The copied builder edits a Form Definition in memory. Your app still owns:

• loading the initial Form Definition
• saving changes
• permissions and publishing workflow
• routing and page chrome
• persistence and versioning policy

What To Customize

The builder is expected to become product code. Common changes include:

• limiting the widget palette
• adding product-specific field templates
• hiding advanced rule features
• changing the layout editor UX
• integrating save, preview, publish, and audit actions
• replacing ShadCN controls with your admin design system