{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "activity-feed",
  "title": "Activity Feed",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/activity-feed/ActivityFeed.vue",
      "content": "<script setup lang=\"ts\">\nimport { Avatar, AvatarFallback } from '@/components/ui/avatar'\nimport { RelativeTime } from '@/components/ui/relative-time'\nimport { SectionCard } from '@/components/ui/section-card'\nimport { Timeline, TimelineContent, TimelineItem, TimelineMedia } from '@/components/ui/timeline'\n\nconst now = new Date('2026-08-14T12:00:00.000Z')\n</script>\n\n<template>\n  <SectionCard title=\"Activity\" description=\"Latest changes on this record.\">\n    <Timeline>\n      <TimelineItem status=\"success\">\n        <TimelineMedia variant=\"avatar\">\n          <Avatar size=\"sm\">\n            <AvatarFallback>MC</AvatarFallback>\n          </Avatar>\n        </TimelineMedia>\n        <TimelineContent>\n          <p class=\"text-sm\">\n            <span class=\"font-medium\">Maya Chen</span>\n            <span class=\"text-muted-foreground\"> approved the leave request</span>\n          </p>\n          <RelativeTime date=\"2026-08-14T11:18:00.000Z\" :now=\"now\" locale=\"en\" class=\"mt-0.5 block\" />\n        </TimelineContent>\n      </TimelineItem>\n\n      <TimelineItem status=\"info\">\n        <TimelineMedia variant=\"avatar\">\n          <Avatar size=\"sm\">\n            <AvatarFallback>OF</AvatarFallback>\n          </Avatar>\n        </TimelineMedia>\n        <TimelineContent>\n          <p class=\"text-sm\">\n            <span class=\"font-medium\">Omar Farid</span>\n            <span class=\"text-muted-foreground\"> added a comment</span>\n          </p>\n          <p class=\"text-muted-foreground mt-1 text-sm\">Coverage is confirmed for Thursday and Friday.</p>\n          <RelativeTime date=\"2026-08-14T10:04:00.000Z\" :now=\"now\" locale=\"en\" class=\"mt-0.5 block\" />\n        </TimelineContent>\n      </TimelineItem>\n\n      <TimelineItem>\n        <TimelineMedia variant=\"avatar\">\n          <Avatar size=\"sm\">\n            <AvatarFallback>PS</AvatarFallback>\n          </Avatar>\n        </TimelineMedia>\n        <TimelineContent>\n          <p class=\"text-sm\">\n            <span class=\"font-medium\">Priya Shah</span>\n            <span class=\"text-muted-foreground\"> updated the title to “Q3 planning offsite”</span>\n          </p>\n          <RelativeTime date=\"2026-08-13T16:40:00.000Z\" :now=\"now\" locale=\"en\" class=\"mt-0.5 block\" />\n        </TimelineContent>\n      </TimelineItem>\n\n      <TimelineItem status=\"muted\">\n        <TimelineMedia variant=\"avatar\">\n          <Avatar size=\"sm\">\n            <AvatarFallback>LP</AvatarFallback>\n          </Avatar>\n        </TimelineMedia>\n        <TimelineContent>\n          <p class=\"text-sm\">\n            <span class=\"font-medium\">Leo Park</span>\n            <span class=\"text-muted-foreground\"> opened this request</span>\n          </p>\n          <RelativeTime date=\"2026-08-13T09:12:00.000Z\" :now=\"now\" locale=\"en\" class=\"mt-0.5 block\" />\n        </TimelineContent>\n      </TimelineItem>\n    </Timeline>\n  </SectionCard>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/ActivityFeed.vue"
    }
  ],
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/avatar.json",
    "https://uipkge.dev/r/vue/relative-time.json",
    "https://uipkge.dev/r/vue/section-card.json",
    "https://uipkge.dev/r/vue/timeline.json"
  ],
  "description": "Record activity as a Timeline of avatar rows. Each row is spelled out inline — actor, verb, optional comment, relative time. Edit the rows after install; no items wrapper.",
  "categories": [
    "dashboard"
  ]
}