Apple Invites

Animated React invite list component inspired by Apple, with smooth add and remove transitions, drag reordering, and gestures.

Installation

npx smoothui-cli add apple-invites

Features

• Animated add/remove of invitees
• Drag and reorder friendly
• Presence transitions
• Keyboard and screen reader support

Accessibility

Screen Reader

• Event card images include alt text derived from the event title.
• Participant avatar images include descriptive alt text (e.g., "Participant 1").

Reduced Motion

This component respects the prefers-reduced-motion media query via useReducedMotion from Motion. When reduced motion is preferred, card transition spring animations are replaced with instant duration-zero transitions.

Props

Created by

Edu Calvo

Improved by

Powered by

motion.dev

lucide.dev

popmotion.io