# RotatingText

> A word in a headline that cycles through alternatives: each rises in, holds, and leaves upward, in a box as wide as the widest word so the sentence never reflows.

```ts
import { RotatingText } from "@sdxc/ui/landing";
```

Stacks every word in one grid cell and runs one shared keyframe set on each, offset by
its position, so exactly one word shows at a time. The animated words are hidden from
assistive technology, which reads `label` instead.

## Examples

```tsx
<h1>Status pages for <RotatingText words={["startups", "agencies", "platforms"]} /></h1>
```

## Props

| Prop | Type | Description |
| --- | --- | --- |
| `words` | `RemixNode[]` | The alternatives, first one first; two to six read well. |
| `interval?` | `number` | Seconds each word holds. Defaults to DEFAULT_INTERVAL. |
| `iterations?` | `number \| "infinite"` | Passes before settling on the first word, or `"infinite"`; wrap an endless one in a MotionLoop so it can be paused. Defaults to DEFAULT_ITERATIONS. |
| `label?` | `string` | What assistive technology reads in the word's place. Defaults to the words joined with commas, so a listener hears every alternative. |

Also accepts everything in `TagProps<"span">`.