Preview live, install via shadcn or copy the source.
This will install the component and its dependencies automatically.
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| children | React.ReactNode[] | — | Yes | Items to flip through (strings or nodes). |
| className | string | — | No | Optional wrapper class. |
| interval | number | 2 | No | Seconds between flips. |
| transition | Transition | { duration: 0.45, ease: [0.22, 1, 0.36, 1] } | No | Framer Motion transition for flip. |
| variants | Variants | — | No | Override the default flip variants. |
| onIndexChange | (index: number) => void | — | No | Callback when the current index changes. |
| trigger | boolean | true | No | Start/stop flipping. |
| mode | AnimatePresenceProps['mode'] | wait | No | AnimatePresence rendering mode. |
| perspective | number | 800 | No | CSS perspective (px) applied to container for 3D flip. |
| depth | number | 10 | No | Transform-origin z-offset (px) for depth of flip. |
| axis | 'x' | 'y' | x | No | Flip axis. x = vertical flip, y = horizontal flip. |