Activity Feed

A data-driven vertical timeline of events — actor plus action plus time — each with an avatar or a coloured featured-icon node on the connector rail, and an optional attached card. Composes timeline, avatar and featured-icon.

$bunx shadcn@latest add @nx-ui/activity-feed
Registry item
Installs withavatarfeatured-icontimeline

Mixed actors and system events

People appear with their avatar and a name-then-action headline; system events lead with a coloured featured icon. An event can attach a card (a quoted note here).

  • AO
    Ada Okonkwo approved intake batch #0412
    2 hours ago
  • MB
    Marcus Bell left a note on Round RD-2231
    3 hours ago
    Moisture is trending high — worth a spot check before Friday's run.
  • Round RD-2231 dispatched to Wyke Common
    yesterday
  • New contamination report filed by Verdant Labs
    yesterday
  • Batch #0398 delivered and reconciled
    2 days ago

System-only feed

Without actors, every row uses an icon node — a compact audit log of what the platform did on its own.

  • Collection scheduled for 06:00
    08:12
  • Load flagged for manual review
    11:47
  • Round closed and reconciled
    17:03

API reference

Exported parts and their props, extracted from the component source.

PropTypeDefaultDescription
items*ActivityItem[]——

…extends React.ComponentProps<"ul">