React Timeline / Audit Log

A vertical event log — who did what, when. Each entry carries a typed event (created, updated, deleted, deployed, login, security, comment, approved) with a colored icon, an actor, an action on a target, a timestamp, and optional monospaced detail such as a diff or payload. The connector line threads the events together.

  1. ci-bot deployed aes-core v0.3.1 to production

    2026-07-20 14:22 UTC

    commit a1f9c2e · 42 files changed · pipeline #1892
  2. h.kursun approved pull request #214 “GCM mode + KAT vectors”

    2026-07-20 13:05 UTC

  3. h.kursun updated register map on aes_csr.sv

    2026-07-20 11:40 UTC

    + CTRL.KEYLEN[1:0] · + STATUS.BUSY
  4. security-scan flagged a finding in util/rng.ts

    2026-07-19 22:10 UTC

    weak-seed: fallback RNG used when TRNG unavailable
  5. a.demir created branch feature/gcm

    2026-07-19 09:31 UTC

  6. a.demir signed in from a new device

    2026-07-19 09:28 UTC

Installation

npx shadcn@latest add "https://kelvinui.com/registry/timeline.json"

Props

PropTypeDescription
itemsAuditEntry[]The events, newest first

Each AuditEntry is { actor, action, target?, timestamp, type?, detail? }. type selects the icon and color; detail accepts any node (rendered in a monospaced panel).

New components every week

Get the week's new Kelvin UI components and templates in one short email. No spam, unsubscribe anytime.