For AI agents: the documentation index is at /llms.txt, and any docs page is available as Markdown by appending .md to its URL.

Timeline

Verified

Events in order, joined by a line, with a title, time, and description.

Deployed to production
Today, 9:00
Build 412 passed all checks.
Review approved
Yesterday, 16:20

When to use

Use when: Events in order, such as a release history or an activity log.
Avoid when: A flow with a current step; use Stepper.

Installation

bunx shelf add timeline

The source lands in src/components/ui/timeline.tsx, along with any Shelf items it builds on, and .shelf/lock.json records what was installed. It's yours to edit.

Usage

import * as Timeline from "@/components/ui/timeline";

<Timeline.Root>
  <Timeline.Item>
    <Timeline.Title>Deployed to production</Timeline.Title>
    <Timeline.Time dateTime="2026-10-03T09:00">9:00</Timeline.Time>
    <Timeline.Description>Build 412 passed all checks.</Timeline.Description>
  </Timeline.Item>
</Timeline.Root>

Built on

Packages: @stylexjs/stylex
Shelf items: foundations, utils
Figma: Optional native Figma library. See Designers.

Verified

Size: 1.3 kB gzipped on its own, 3.0 kB with the Shelf items and packages it builds on. JS and CSS in a production build, without React.
Accessibility: Axe passes on 1 story
Behavior: 1 interaction test in Storybook
React Compiler: Compiles with React Compiler
React Doctor: React Doctor finds nothing