EditGuesser

An edit page whose inputs come from the resource's registered Zod schema.

Installation

pnpm dlx shadcn@latest add @chelone/edit-guesser

<EditGuesser> is an <Edit> with an input for each field of the resource's Zod schema, followed by a <Toolbar>. It leaves out the id field, and the form validates against the same schema on save. A resource without a schema shows <GuesserEmpty> and fetches no record.

Loading preview…

src/App.tsx

<Resource name="posts" edit={EditGuesser} />

Outside production it logs the hand-written edit page it stands in for. Copy that code and replace the guesser when the page needs more. enableLog turns the log off. The guessers guide covers the schema-to-input mapping, the log and Vue.

See also <ListGuesser> and <ShowGuesser>.

Props

Prop	Type	Default	Description
actions	ReactNode	—	Header actions (show/delete buttons); nothing by default.
className	string	—
component	ElementType<any, keyof IntrinsicElements>	—
enableLog	boolean	—	Log the equivalent hand-written edit page once per resource. Defaults to on outside production.
id	Identifier	—	Override the record id (defaults to the `:id` route param).
onSuccess	(record: LooseRecord) => void \| Promise<void>	—	Runs after a successful save with the SERVER record, post-reconciliation.
resource	string	—	Override the ambient resource (defaults to the `<Resource>` context).
sanitizeEmptyValues	boolean	—	ra parity: nullify/strip empty TOP-LEVEL values before save. Default false.
schema	StandardSchemaV1<Partial<LooseRecord>, unknown>	—	Resource schema (zod or any Standard Schema) — wired as the default form validator by the submit pipeline (T2).
title	ReactNode	—	Header title. A string/element renders as an `<h2>`; `false` omits it.
validate	FormLevelValidate<Partial<LooseRecord>>	—	Form-level validate fn (ra contract) — consumed by the submit pipeline (T2).