# `ShadcnUI.Components.Motion.Stagger`
[🔗](https://github.com/pcharbon70/shadcn_ui/blob/main/lib/shadcn_ui/components/motion/stagger.ex#L1)

Complete keyed caller content with optional bounded render-time presentation.

Requires a stable `id` and keyed `item` slots. `as: :div` (default) renders
ordinary div wrappers, not an inferred list; `:ul` / `:ol` use native li items.
Item slots accept `class` and unrelated `rest` globals and preserve trusted
HEEx links/forms in document order. No content is cloned.

Effect defaults to `:none`, with opt-in `:fade` / `:rise`. Preset `:quick`
uses 150ms duration and 50ms intervals; `:default` uses 250ms and 75ms.
Only items whose delay plus duration fits in 1000ms animate; excess items
immediately retain their baseline. Content starts visible (never opacity zero),
focus cancels the effect, and removing styles restores fully visible content.

Motion `:none`, ancestor `data-shadcn-motion="reduce"` and OS reduced motion
override effects. Finite work may finish offscreen. There is no observer,
viewport-enter trigger, persistent replay tracking or animation-once guarantee.
Rendering/replacement or removing and restoring suppression can replay CSS;
callers own patch boundaries, native form values and any restoration.

# `stagger`

Renders visible ordered slot content with an optional finite entrance effect.
## Attributes

* `id` (`:string`) (required)
* `as` (`:atom`) - Defaults to `:div`. Must be one of `:div`, `:ul`, or `:ol`.
* `effect` (`:atom`) - Defaults to `:none`. Must be one of `:none`, `:fade`, or `:rise`.
* `preset` (`:atom`) - Defaults to `:default`. Must be one of `:quick`, or `:default`.
* `motion` (`:atom`) - Defaults to `:system`. Must be one of `:system`, or `:none`.
* `class` (`:any`) - Defaults to `nil`.
* Global attributes are accepted.
## Slots

* `item` (required) - Accepts attributes:

  * `key` (`:string`) (required)
  * `class` (`:any`)
  * `rest` (`:map`)

---

*Consult [api-reference.md](api-reference.md) for complete listing*