{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "invite-members",
  "type": "registry:ui",
  "title": "Invite members",
  "description": "A team invite panel with an email input, a Send button and badges for pending invitations. A starting point for workspace member management in SaaS settings.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/badge.json",
    "https://ui.minidev.pro/r/button.json",
    "https://ui.minidev.pro/r/input.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/invite-members.tsx",
      "type": "registry:ui",
      "target": "components/ui/invite-members.tsx",
      "content": "\"use client\"\nimport { Button } from \"@/components/ui/button\"\nimport { Input } from \"@/components/ui/input\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { cn } from \"@/lib/utils\"\n\nfunction InviteMembers({ className }: { className?: string }) {\n  return (\n    <div data-slot=\"invite-members\" className={cn(\"space-y-4 rounded-2xl border border-border bg-surface p-5 shadow-highlight\", className)}>\n      <div>\n        <h3 className=\"text-sm font-medium text-fg\">Invite members</h3>\n        <p className=\"mt-1 text-xs text-fg-muted\">They get free UI access. Premium unlocks follow the workspace plan.</p>\n      </div>\n      <div className=\"flex gap-2\">\n        <Input placeholder=\"email@company.com\" className=\"flex-1\" />\n        <Button size=\"sm\">Send</Button>\n      </div>\n      <div className=\"flex flex-wrap gap-2\">\n        {[\"sam@acme.co\", \"lee@north.io\"].map((e) => (\n          <Badge key={e} variant=\"outline\">{e} · pending</Badge>\n        ))}\n      </div>\n    </div>\n  )\n}\nexport { InviteMembers }\n"
    }
  ]
}