Semantic, RTL-safe timeline primitives for events, status history, and activity feeds.
This is a live example. Interact with the available controls and use the keyboard to inspect the component's states and behavior.
aq-uipnpm dlx aq-ui@alpha add timelineImport the parts you need, then jump to an export for its contract.
import { Timeline } from "@/components/ui/timeline"
<Timeline />Semantic, RTL-safe timeline primitives for events, status history, and activity feeds.
const Timeline = React.forwardRef<React.ComponentRef<"ol">, React.ComponentProps<"ol">>(…)React.ComponentProps<"ol">Public const export from Timeline.
const TimelineConnector = React.forwardRef<React.ComponentRef<"span">, React.ComponentProps<"span">>(…)React.ComponentProps<"span">Content export for composing Timeline.
const TimelineContent = React.forwardRef<React.ComponentRef<"div">, React.ComponentProps<"div">>(…)React.ComponentProps<"div">Description export for composing Timeline.
const TimelineDescription = React.forwardRef<React.ComponentRef<"p">, React.ComponentProps<"p">>(…)React.ComponentProps<"p">Item export for composing Timeline.
const TimelineItem = React.forwardRef<React.ComponentRef<"li">, React.ComponentProps<"li">>(…)React.ComponentProps<"li">Public const export from Timeline.
const TimelineMarker = React.forwardRef<React.ComponentRef<"span">, React.ComponentProps<"span">>(…)React.ComponentProps<"span">Public const export from Timeline.
const TimelineTime = React.forwardRef<React.ComponentRef<"time">, React.ComponentProps<"time">>(…)React.ComponentProps<"time">Title export for composing Timeline.
const TimelineTitle = React.forwardRef<React.ComponentRef<"h3">, React.ComponentProps<"h3">>(…)React.ComponentProps<"h3">utils
151 public items passed schema validation.
Typecheck, lint, tests, and static export succeeded.
The alpha package is waiting for approval.