Destructive Actions
Use Hold to Confirm only when sustained intent reduces a real risk: permanent deletion, irreversible stop or another rare consequential action. Explain the consequence in plain text near the control.
Live example
Try the interaction before reading the recipe.
real component · keyboard-safe
Destructive Actions · state follows real product work
Purpose
Use Hold to Confirm only when sustained intent reduces a real risk: permanent deletion, irreversible stop or another rare consequential action. Explain the consequence in plain text near the control.
Do not apply it to everyday saves, archive, navigation, checkout or repeated list operations. For complex consequences, use a confirmation dialog; for recoverable actions, prefer undo.
Early release cancels, keyboard users receive an equivalent hold, and reduced motion uses a two-press confirmation. Never make duration excessive or treat completion animation as proof that backend work succeeded.
Source: packages/skills/patterns/destructive-actions.md