TabbedForm

Splits a create/edit form's inputs across tabs.

Installation

import { TabbedForm } from "@chelone/react";

Props

Prop	Type	Default	Description
children	ReactNode	—	`<TabbedForm.Tab>` elements (and any non-tab chrome — badges, toolbars).
defaultValues	TFormData	—	Seed values. Note form-core's `reset(values)` rebaselines these — the post-save reconciliation primitive.
formOptions	Omit<CheloneFormOptions<TFormData>, "defaultValues">	—	Escape hatch to the underlying FormApi options (validators, listeners, …). `defaultValues` lives top-level on the controller options instead. The controller OWNS submission: `onSubmit` is replaced by the save pipeline (use `onSuccess`), `onSubmitInvalid` is chained after the default invalid-form notification, and `validators.onDynamic` is composed after `schema` + `validate` (first error wins per field).
getRecord	() => Partial<TFormData> \| undefined	—	The sanitize baseline (ra: "the record"): empty values whose key exists on it become `null`, others are omitted. The composed controllers wire this to the fetched record / the create seed; standalone forms default to no baseline (every empty key is omitted).
onSuccess	(data: TFormData) => void \| Promise<void>	—	Runs after a successful save, post-reset, with the saved (sanitized) data.
resetOnSuccess	boolean	—	Rebaseline the form from the saved values on success (D5). The STANDALONE controller only knows the submitted values — the composed edit/create controllers reconcile with the SERVER record instead. Default true.
sanitizeEmptyValues	boolean	—	ra parity: nullify/strip empty TOP-LEVEL values before save. Default false.
save	(data: TFormData) => Promise<FieldErrors \| undefined>	—	The P4 save contract: resolves with the server's `fieldErrors` on `ValidationError`, `undefined` otherwise — never rejects for provider errors. Called by the submit pipeline.
schema	StandardSchemaV1<TFormData, unknown>	—	Resource schema (zod or any Standard Schema) — wired as the default form validator by the submit pipeline (T2).
syncWithLocation	boolean	—	Sync the active tab with the URL (default `true`): each tab is a nested route (deep-linkable, back-button aware). `false` → a local `useState` tab.
validate	FormLevelValidate<TFormData>	—	Form-level validate fn (ra contract) — consumed by the submit pipeline (T2).