Stagger
Sequence the entrance of a group of elements.
Preview
Import
import { Stagger } from "@sigil-ui/components";Usage
<Stagger>
<Badge>First</Badge>
<Badge>Second</Badge>
<Badge>Third</Badge>
</Stagger>Props
| Prop | Type | Default | Description |
|---|---|---|---|
interval | number | 80 | Delay between each child in ms. |
delay | number | 0 | Base delay before the first child animates in ms. |
yOffset | number | 20 | Vertical offset for each child. |
trigger | "scroll" | "mount" | — | — |
viewOptions | UseInViewOptions | — | — |
Token integration
| CSS Variable | Purpose |
|---|---|
--s-duration-normal | Duration normal |
--s-ease-out | Ease out |
--s-ease-default | Ease default |