{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "select-8",
  "type": "registry:component",
  "title": "Select 8",
  "description": "Select 8. A versatile selection component that provides a sleek, accessible way to choose options from a list.",
  "dependencies": [],
  "registryDependencies": [
    "native-select"
  ],
  "files": [
    {
      "path": "components/watermelon/select-8.tsx",
      "type": "registry:component",
      "content": "import { useId } from 'react';\n\nimport { NativeSelect } from '@/components/base-ui/native-select';\n\nconst Select8 = () => {\n  const id = useId();\n\n  return (\n    <div className=\"group relative w-full max-w-xs transition-all\">\n      <label\n        htmlFor={id}\n        className=\"absolute -top-2 left-3 z-10 bg-white px-1.5 text-[11px] font-semibold text-zinc-500 transition-colors group-focus-within:text-zinc-900 dark:bg-zinc-950 dark:text-zinc-500 dark:group-focus-within:text-zinc-100\"\n      >\n        Execution Priority\n      </label>\n      <NativeSelect \n        id={id} \n        className=\"w-full rounded-xl border-zinc-200 shadow-xs dark:border-zinc-800 dark:bg-zinc-950 transition-all focus:ring-2 focus:ring-zinc-400/20 dark:focus:ring-zinc-500/20 dark:[&_select]:[color-scheme:dark] dark:[&_select]:bg-zinc-950 dark:hover:[&_select]:bg-zinc-950\"\n      >\n        <option value=\"low\" className=\"dark:bg-zinc-950 dark:text-zinc-100\">Low (Background Task)</option>\n        <option value=\"med\" className=\"dark:bg-zinc-950 dark:text-zinc-100\">Medium (Standard Request)</option>\n        <option value=\"high\" className=\"dark:bg-zinc-950 dark:text-zinc-100\">High (Real-time Critical)</option>\n        <option value=\"ultra\" className=\"dark:bg-zinc-950 dark:text-zinc-100\">Ultra (System Interrupt)</option>\n      </NativeSelect>\n    </div>\n  );\n};\n\nexport default Select8;\n"
    }
  ]
}