Timeline · activity
Activity feeds, order journeys and changelogs: icons, avatars or status dots on a line, day headers, “5 min ago” times that stay current, items that fade in as they scroll into view, live arrivals and a pending step.
An order's journey · horizontal
-
Ordered
-
Packed
-
Shipped
Istanbul hub
-
Out for delivery
-
Delivered
A live feed · grouped by day · times keep themselves current · new events slide in
- Today
-
Ada merged “Tree view” into main
3 commits · 12 files changed
-
Build #482 passed
-
Grace commented on “Kanban limits”
Can a column refuse cards when it's full? A flag would do.
- Yesterday
-
Deploy to production
v2.3.0 · deck.kartex.net
-
Alan opened “Tour on mobile”
- Waiting for the next build…
A changelog · both sides of the line · they fade in as you scroll
-
v2.4 · Components
Tree view, sortable lists, kanban and tours.
-
v2.3 · Forms
OTP, rating, time picker and file upload.
-
v2.2 · Reports
A banded report designer and viewer.
-
v2.1 · Grid
Grouping, pivots and charts in the grid.
Usage
import { signal } from "./index.js";import { Timeline } from "./components/timeline.js"; Timeline({ items: [{ title: "Shipped", time: "Sep 20", status: "done" }, { title: "Out for delivery", status: "current" }], mode: "horizontal" }) const feed = signal([{ id: 1, title: "Build passed", icon: "✓", tone: "success", time: new Date() }]);Timeline({ items: feed, groupBy: "day", limit: 5, pending: "Waiting for the next build…" })feed.update((l) => [{ id: 2, title: "Deployed", time: new Date() }, ...l]); // slides in at the top Timeline({ items: releases, mode: "alternate" }) // "left" (default) | "alternate" | "horizontal"