{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "relative-time",
  "type": "registry:ui",
  "title": "Relative time",
  "description": "React relative timestamp that renders just now, 5m ago, 3h ago or 2d ago inside a semantic time element, with the full local date shown as a hover title.",
  "dependencies": [],
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/relative-time.tsx",
      "type": "registry:ui",
      "target": "components/ui/relative-time.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\n\n/** RelativeTime — a time element that reads \"3h ago\" and carries the exact ISO timestamp for machines. */\n\n// A fixed offset from now, floored to the minute so server and client agree.\nfunction minutesAgo(minutes: number) {\n  return new Date(Math.floor(Date.now() / 60000) * 60000 - minutes * 60000)\n}\n\ntype RelativeTimeProps = {\n  /** The instant to describe. Defaults to three hours ago. */\n  date?: string | Date\n  className?: string\n}\n\nfunction RelativeTime({ date, className }: RelativeTimeProps) {\n  const d = React.useMemo(() => (date == null ? minutesAgo(180) : typeof date === \"string\" ? new Date(date) : date), [date])\n  const diff = Date.now() - d.getTime()\n  const mins = Math.max(0, Math.floor(diff / 60000))\n  let label = \"just now\"\n  if (mins >= 60 * 24) label = `${Math.floor(mins / (60 * 24))}d ago`\n  else if (mins >= 60) label = `${Math.floor(mins / 60)}h ago`\n  else if (mins >= 1) label = `${mins}m ago`\n  return (\n    <time\n      data-slot=\"relative-time\"\n      dateTime={d.toISOString()}\n      className={cn(\"text-xs text-fg-muted tabular-nums\", className)}\n      title={d.toLocaleString()}\n    >\n      {label}\n    </time>\n  )\n}\nexport { RelativeTime }\nexport type { RelativeTimeProps }\n"
    }
  ]
}