Skip to content
Pinky UI

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

Pending action
Resolved status

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