ComponentsTimeline

displaytexulinot agent-emittableapp

Timeline

timeline

Vertical or horizontal chronological list of events.

Live examples

Shipment timeline

Shipment timeline

Loading demo…

Props

Public props for Timeline
NameKindRequiredDefaultDescription
itemsarrayno—Data-driven items (or compose TimelineItem children)
orientationenum (vertical, horizontal)no"vertical"—
labelstringno——
messagesobjectno—Localized label/status words
hrefTrustenum (developer, untrusted)no"developer"—
itemslotno—Extra content under each data item
classstringno——

Keyboard

Keyboard behavior for Timeline
KeyAction
aStatus has a spoken word and marker shape, not color alone

Accessibility

  • Ordered list with an accessible name
  • Status has a spoken word and marker shape, not color alone
  • Item links pass the URL policy

Evidence for timeline

Latest committed gates for timeline (as of 2026-10-23). Static snapshot — not live CI.

Behavior

n/ano behavior scenario

No dedicated behavior scenario for this catalog id (a styled or display surface, covered by its unit and axe tests).

Size (gzip)

texuli/timeline · budget 12.0 KiB

Budget from texuli.budgets.json; re-measure with `pnpm size --filter <entry>`.

Axe

documented

  • tests/e2e/site-component-pages.spec.ts
  • docs/quality (a11y-*)

Site component pages axe gate; package-level a11y docs under docs/quality when present.

Browsers

  • chromium
  • webkit
  • mobile

Playwright projects: Desktop Chrome, Desktop Safari, Pixel 7. Firefox is a known gap on this host.

When to use

Use when

  • Show a sequence of events with status

Don’t use when

Prefer another component

  • A Gantt schedule with dependencies (use @texuli/data/timeline)