{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comp-149",
  "type": "registry:component",
  "registryDependencies": [
    "https://coss.com/origin/r/checkbox.json"
  ],
  "files": [
    {
      "path": "registry/default/components/comp-149.tsx",
      "content": "import { useId } from \"react\";\n\nimport { Checkbox } from \"@/registry/default/ui/checkbox\";\n\nexport default function Component() {\n  const id = useId();\n\n  const items = [\n    { defaultChecked: true, label: \"Monday\", value: \"1\" },\n    { defaultChecked: true, label: \"Tuesday\", value: \"2\" },\n    { label: \"Wednesday\", value: \"3\" },\n    { defaultChecked: true, label: \"Thursday\", value: \"4\" },\n    { defaultChecked: true, label: \"Friday\", value: \"5\" },\n    { label: \"Saturday\", value: \"6\" },\n    { disabled: true, label: \"Sunday\", value: \"7\" },\n  ];\n\n  return (\n    <fieldset className=\"space-y-4\">\n      <legend className=\"font-medium text-foreground text-sm leading-none\">\n        Days of the week\n      </legend>\n      <div className=\"flex gap-1.5\">\n        {items.map((item) => (\n          <label\n            className=\"relative flex size-9 cursor-pointer flex-col items-center justify-center gap-3 rounded-full border border-input text-center shadow-xs outline-none transition-[color,box-shadow] has-data-disabled:cursor-not-allowed has-data-[state=checked]:border-primary has-focus-visible:border-ring has-data-[state=checked]:bg-primary has-data-[state=checked]:text-primary-foreground has-data-disabled:opacity-50 has-focus-visible:ring-[3px] has-focus-visible:ring-ring/50\"\n            key={`${id}-${item.value}`}\n          >\n            <Checkbox\n              className=\"sr-only after:absolute after:inset-0\"\n              defaultChecked={item.defaultChecked}\n              disabled={item.disabled}\n              id={`${id}-${item.value}`}\n              value={item.value}\n            />\n            <span aria-hidden=\"true\" className=\"font-medium text-sm\">\n              {item.label[0]}\n            </span>\n            <span className=\"sr-only\">{item.label}</span>\n          </label>\n        ))}\n      </div>\n    </fieldset>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "meta": {
    "tags": [
      "checkbox",
      "label",
      "week",
      "calendar",
      "radix"
    ]
  }
}