Three actions: save, discard, or cancel
Handle unsaved edits in a dialog with two async actions and an explicit cancel choice.
Unsaved changes
Save your edits, discard them, or cancel to keep editing. During a request, Cancel stops the work and keeps the dialog open.
No changes have been saved or discarded.
<SubmitFlowRoot flow={flow}>
<CancelButton onCancel={closeDialog}>Cancel</CancelButton>
<ActionButton action="discard">Discard changes</ActionButton>
<ActionButton action="save">Save changes</ActionButton>
<SubmitFeedback />
</SubmitFlowRoot>
// Render inside your dialog. Both actions share the flow's busy lock.This demo uses a local, temporary action. It does not send data or write to a service.