# EventTicker

> An animated feed of events landing one by one, newest on top, with the exception surfaced: checks pass every few minutes and the one that broke names its failing step, feed items arrive, jobs finish.

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

Renders the feed as an ordered list on a raised surface inside a MotionLoop.
Each row opens in its turn at the top and pushes the older ones down; a hidden copy of
the finished feed holds the surface's height, so the page never shifts while it loops.
Without motion every row shows with its final status. Equal row counts share keyframes.

## Examples

```tsx
<EventTicker
	aria-label="Recent checks"
	title="Checkout flow"
	rows={[{ time: "09:40", label: "Run passed", status: "ok" }]}
	statusLabels={{ ok: "Passed", warn: "Slow", fail: "Failed", pending: "Running" }}
/>
```

## Props

| Prop | Type | Description |
| --- | --- | --- |
| `"aria-label"` | `string` | Accessible name of the feed's list. Required — the library ships no copy. |
| `pauseLabel?` | `string` | Accessible name of the pause toggle. |
| `title?` | `RemixNode` | Header line over the feed, drawn beside a live dot. |
| `rows` | `readonly Row[]` | The events, oldest first; the feed renders them newest first. |
| `statusLabels` | `Record<Status, string>` | The text of each status chip, such as `{ ok: "Passed", fail: "Failed", … }`. |
| `footnote?` | `RemixNode` | A note under the feed, such as how often the checks run. |

Also accepts everything in `Omit<TagProps<"div">, "children" | "title">`.


## Types

| Name | Values | What it decides |
| --- | --- | --- |
| `Status` | `"ok" \| "warn" \| "fail" \| "pending"` | Outcome of one event, drawn as a success, warning, danger or neutral chip. |