Staggered List
displayList where items animate in with a sequential stagger delay.
Preview
No preview available
Check the code examples below.
Installation
npm install @launchapp/design-systemImport
import { StaggeredList } from "@launchapp/design-system";Examples
Staggered menu items
<StaggeredList staggerDelay={75}> {["Dashboard", "Projects", "Team", "Settings"].map((item) => ( <div key={item} className="py-2 px-4 rounded-md hover:bg-muted">{item}</div> ))}</StaggeredList>Props
| Prop | Type | Default | Description |
|---|---|---|---|
children* | React.ReactNode | — | List items to stagger. |
staggerDelay | number | 50 | Delay between each item in milliseconds. |