{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "select-29",
  "title": "Select with inset label",
  "description": "The label lives inside the field, above the value.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.ndekocode.dev/r/field.json",
    "https://ui.ndekocode.dev/r/recipes.json",
    "https://ui.ndekocode.dev/r/select.json",
    "https://ui.ndekocode.dev/r/theme.json",
    "https://ui.ndekocode.dev/r/utils.json"
  ],
  "files": [
    {
      "path": "registry/ndeko/components/select/select-29.tsx",
      "content": "import { CONTROL_RECIPE } from '@/registry/ndeko/lib/recipes';\nimport { cn } from '@/registry/ndeko/lib/utils';\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\nconst FRAMEWORKS = [\n  { value: 'react', label: 'React' },\n  { value: 'nextjs', label: 'Next.js' },\n  { value: 'astro', label: 'Astro' },\n  { value: 'gatsby', label: 'Gatsby' },\n];\n\nconst INSET_FIELD = cn(\n  CONTROL_RECIPE,\n  'max-w-xs gap-0 pt-2',\n  'has-focus-visible:border-foreground/30 has-focus-visible:ring-ring/25 has-focus-visible:ring-[3px]',\n  'has-data-popup-open:border-foreground/30',\n  'has-data-disabled:cursor-not-allowed has-data-disabled:opacity-50'\n);\n\nconst BARE_TRIGGER =\n  'h-7 bg-transparent shadow-none ring-0 focus-visible:border-transparent focus-visible:ring-0 data-popup-open:border-transparent dark:bg-transparent dark:focus-visible:border-transparent';\n\nexport default function Select29() {\n  return (\n    <Field className={INSET_FIELD}>\n      <FieldLabel className='px-2.5 text-xs'>Framework</FieldLabel>\n      <Select items={FRAMEWORKS}>\n        <SelectTrigger className={BARE_TRIGGER}>\n          <SelectValue placeholder='Pick a framework' />\n        </SelectTrigger>\n        <SelectContent>\n          {FRAMEWORKS.map((framework) => (\n            <SelectItem key={framework.value} value={framework.value}>\n              {framework.label}\n            </SelectItem>\n          ))}\n        </SelectContent>\n      </Select>\n    </Field>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "categories": [
    "components",
    "select"
  ],
  "type": "registry:component"
}