Skip to content
Pinky UI

Swipe Action Row

Use a mobile row gesture to reveal secondary actions without hiding those actions from other users.

Live example

Try the interaction before reading the recipe.

real component · keyboard-safe

Team notes · updated 4m ago

Purpose

Use a mobile row gesture to reveal secondary actions without hiding those actions from other users.

Use when

Archive, delete, or more actions are frequent and row density matters.

Avoid

Critical actions that require a hidden swipe or destructive action without confirmation.

Accessibility

Keep an explicit actions button, label destructive actions, and preserve row semantics.

Keyboard and touch

Swipe has a threshold and snap-back; buttons provide the keyboard and desktop path.

Reduced motion and performance

Use transform animation and snap immediately under reduced motion.

Composition and anti-patterns

Use Action Undo Bar after reversible archive/delete and keep content independently actionable.

Source: packages/skills/lists/swipe-action-row.md