{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "select-40",
  "title": "Select with portraits",
  "description": "Two-line rows with an avatar, a name and a handle.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.ndekocode.dev/r/avatar.json",
    "https://ui.ndekocode.dev/r/field.json",
    "https://ui.ndekocode.dev/r/select.json",
    "https://ui.ndekocode.dev/r/theme.json"
  ],
  "files": [
    {
      "path": "registry/ndeko/components/select/select-40.tsx",
      "content": "import { Avatar } from '@/registry/ndeko/ui/avatar';\nimport { Field, FieldLabel } from '@/registry/ndeko/ui/field';\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@/registry/ndeko/ui/select';\n\ntype Member = {\n  value: string;\n  name: string;\n  handle: string;\n};\n\nconst MEMBERS: Member[] = [\n  {\n    value: 'jenny',\n    name: 'Jenny Hamilton',\n    handle: '@jennycodes',\n  },\n  { value: 'paul', name: 'Paul Smith', handle: '@paulsmith' },\n  { value: 'luna', name: 'Luna Wyen', handle: '@wyen.luna' },\n];\n\nfunction MemberPortrait({ member }: { member: Member }) {\n  return (\n    <span className='flex min-w-0 items-center gap-2.5'>\n      <Avatar aria-hidden='true' seed={member.name} />\n      <span className='flex min-w-0 flex-col gap-0.5'>\n        <span className='truncate font-medium'>{member.name}</span>\n        <span className='text-muted-foreground truncate text-xs'>\n          {member.handle}\n        </span>\n      </span>\n    </span>\n  );\n}\n\nconst MEMBER_ITEMS = MEMBERS.map((member) => ({\n  value: member.value,\n  label: <MemberPortrait member={member} />,\n}));\n\nexport default function Select40() {\n  return (\n    <Field className='w-full max-w-xs'>\n      <FieldLabel>Reviewer</FieldLabel>\n      <Select items={MEMBER_ITEMS} defaultValue='jenny'>\n        <SelectTrigger className='h-auto py-1.5 ps-1.5'>\n          <SelectValue placeholder='Pick a reviewer' />\n        </SelectTrigger>\n        <SelectContent>\n          {MEMBERS.map((member) => (\n            <SelectItem\n              key={member.value}\n              value={member.value}\n              label={member.name}\n              className='h-auto py-1.5'\n            >\n              <MemberPortrait member={member} />\n            </SelectItem>\n          ))}\n        </SelectContent>\n      </Select>\n    </Field>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "categories": [
    "components",
    "select"
  ],
  "type": "registry:component"
}