Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA side sheet for editing a record that says No changes or Unsaved changes in text, enables Save only after a change, asks inline before discarding and keeps edits after a failed save.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
Use this to edit a row of a table or a card in place, where the list stays visible behind the sheet.
Do not use it for creating long records (use a page) or when edits autosave (see dialog-autosave).
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
trigger | ReactNode | - | Opens the sheet. |
record | { name, email } | - | The saved values. |
onSave | (values) => Promise<void> | - | Save; a rejection shows its message. |
alertdialog ("Discard your changes?") with Keep editing focused, rather than stacking a second modal.role="alert" message and keeps every edit; fields are disabled while saving.| Key | Action |
|---|---|
| Enter in a field | saves |
| Escape | closes, or asks Discard changes? first |
| Tab | Keep editing is focused when the question appears |
The pattern ships a Testing Library test (sheet-edit-record.test.tsx) that covers the change status and Save state, saving, the inline discard question, a clean close and a failed save.