{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "support-inbox",
  "type": "registry:component",
  "title": "Support inbox",
  "description": "A React support ticket inbox with search and compose actions and a list of threads showing ticket ID, subject, requester, status badge and SLA time left.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/badge.json",
    "https://ui.minidev.pro/r/button.json",
    "https://ui.minidev.pro/r/input.json"
  ],
  "files": [
    {
      "path": "registry/blocks/support-inbox.tsx",
      "type": "registry:ui",
      "target": "components/ui/support-inbox.tsx",
      "content": "\"use client\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport { Input } from \"@/components/ui/input\"\n\nconst THREADS = [\n  { id: \"T-4821\", subject: \"Seat upgrade stuck on invoice\", from: \"sam@acme.co\", status: \"open\", sla: \"2h\" },\n  { id: \"T-4819\", subject: \"Dark mode contrast on tables\", from: \"lee@north.io\", status: \"pending\", sla: \"6h\" },\n  { id: \"T-4810\", subject: \"Can we add SSO to our plan?\", from: \"ava@studio.dev\", status: \"open\", sla: \"1h\" },\n]\n\nfunction SupportInbox() {\n  return (\n    <div data-slot=\"support-inbox\" className=\"overflow-hidden rounded-2xl border border-border bg-surface shadow-highlight\">\n      <div className=\"flex flex-wrap items-center justify-between gap-3 border-b border-border px-4 py-3\">\n        <div>\n          <h3 className=\"text-sm font-medium text-fg\">Support inbox</h3>\n          <p className=\"text-xs text-fg-muted\">3 open · 1 SLA risk</p>\n        </div>\n        <div className=\"flex gap-2\">\n          <Input className=\"h-8 w-44\" placeholder=\"Search tickets\" />\n          <Button size=\"sm\">Compose</Button>\n        </div>\n      </div>\n      <ul>\n        {THREADS.map((t) => (\n          <li key={t.id} className=\"flex flex-wrap items-center justify-between gap-3 border-b border-border px-4 py-3 last:border-b-0\">\n            <div className=\"min-w-0\">\n              <p className=\"font-mono text-[11px] text-fg-muted\">{t.id}</p>\n              <p className=\"truncate text-sm font-medium text-fg\">{t.subject}</p>\n              <p className=\"text-xs text-fg-muted\">{t.from}</p>\n            </div>\n            <div className=\"flex items-center gap-2\">\n              <Badge variant=\"outline\">{t.status}</Badge>\n              <span className=\"font-mono text-xs tabular-nums text-fg-muted\">SLA {t.sla}</span>\n            </div>\n          </li>\n        ))}\n      </ul>\n    </div>\n  )\n}\nexport { SupportInbox }\n"
    }
  ]
}