FormDialog

Crisp's own Dialog/DialogBody/DialogFooter, plus everything a record-creating form needs beyond plain chrome (crisp#548): dirty tracking with a discard-changes confirm (any click/change/input inside the form marks it dirty; Escape/backdrop/header-×/Cancel all route through one requestClose, which only asks when something actually changed — a stacked crisp Dialog), a beforeunload guard for a reload or external navigation, and scroll-to-first-invalid-field once a submit attempt finishes (crisp's own FormField already marks every control aria-invalid, so this needs no per-field wiring).

Installation

npm install @crisp-ui-kit/crisp

Props

Notes

• createMode bundles Attio's whole "New Company" create-dialog chrome (crisp#548, measured live): "(optional)" on every non-required field (via useFormDialogOptional, below); a footer of a "Create more" switch and a single "Create record ⌘↵" button with NO Cancel — Attio's own dialog closes only from the header's × — and Cmd/Ctrl+Enter submitting from anywhere inside the dialog, including a portaled Select/DatePicker popover. Only set this on a create dialog; an edit dialog keeps Cancel + submitLabel (unmeasured territory this pass never touched).
• submitLabel is ignored in createMode — Attio's own button always reads "Create record", never the object's name (measured live: "New Company"'s dialog still says "Create record", not "Create company").
• onSubmit(createMore) fires with whether the "Create more" switch was on at that moment — click, Enter in a field, or (in createMode) Cmd/Ctrl+Enter. An edit dialog (no switch, always false) can ignore the argument.
• useFormDialogOptional(required) — call from your own field wrapper as optional={useFormDialogOptional(required)} to pick up createMode's "(optional)" marker automatically; it reads false outside any FormDialog, or on an edit dialog.
• error is for anything the server rejected that belongs to no one field — a per-field error still belongs on that field's own FormField.