{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "calendar",
  "title": "Calendar",
  "description": "A calendar component.",
  "dependencies": [
    "react-day-picker",
    "@hugeicons/react",
    "@hugeicons/core-free-icons"
  ],
  "registryDependencies": [
    "@cubby-ui/button"
  ],
  "files": [
    {
      "path": "registry/default/calendar/calendar.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { DayPicker } from \"react-day-picker\";\n\nimport { buttonVariants } from \"@/registry/default/button/button\";\n\nimport { cn } from \"@/lib/utils\";\n\nimport { HugeiconsIcon } from \"@hugeicons/react\";\nimport ArrowLeft01Icon from \"@hugeicons/core-free-icons/ArrowLeft01Icon\";\nimport ArrowRight01Icon from \"@hugeicons/core-free-icons/ArrowRight01Icon\";\nfunction Calendar({\n  classNames,\n  ...props\n}: React.ComponentProps<typeof DayPicker>) {\n  return (\n    <div\n      className={cn(\n        \"size-fit rounded-md p-0.5 pt-0\",\n        \"bg-muted ring-border/60 ring-1\",\n        props.className,\n      )}\n    >\n      <DayPicker\n        showOutsideDays\n        classNames={{\n          root: cn(\n            \"relative size-fit select-none border-none\",\n            classNames?.root,\n          ),\n          months: cn(\n            \"flex flex-col md:flex-row [&>*:not(:first-child):not(:last-child)]:md:mr-2\",\n            classNames?.months,\n          ),\n          month: cn(\"m-0 text-center\", classNames?.month),\n          month_caption: cn(\n            \"relative flex h-9 items-center justify-center bg-transparent px-10\",\n            classNames?.month_caption,\n          ),\n          caption_label: cn(\"text-sm font-medium\", classNames?.caption_label),\n          today: cn(\"bg-accent\", classNames?.today),\n          week: cn(\"flex justify-center py-0.5 last:pb-2\", classNames?.week),\n          day: cn(\n            \"flex size-9 items-center justify-center rounded-md text-sm font-normal hover:[&:has(>button)]:bg-surface-hover hover:[&:has(>button)]:text-accent-foreground\",\n            classNames?.day,\n          ),\n          day_button: cn(\n            \"size-9 rounded-md focus-visible:outline-ring/50 outline-0 outline-offset-0 outline-transparent outline-solid focus-visible:outline-2 focus-visible:outline-offset-2\",\n            classNames?.day_button,\n          ),\n          weekdays: cn(\n            \"flex justify-center mb-1 px-4 pt-2\",\n            classNames?.weekdays,\n          ),\n          weekday: cn(\n            \"size-9 text-sm font-normal text-muted-foreground\",\n            classNames?.weekday,\n          ),\n          outside: cn(\n            \"text-muted-foreground/80 hover:text-muted-foreground!\",\n            classNames?.outside,\n          ),\n          selected: cn(\n            \"bg-primary! text-primary-foreground! hover:bg-primary! hover:text-primary-foreground!\",\n            classNames?.selected,\n          ),\n          range_middle: cn(\n            \"bg-secondary! text-secondary-foreground! rounded-none first:rounded-l-md last:rounded-r-md hover:bg-secondary! hover:text-secondary-foreground!\",\n            classNames?.range_middle,\n          ),\n          range_start: cn(\n            props.mode === \"range\" &&\n              props.selected?.from?.getTime() !== props.selected?.to?.getTime()\n              ? \" bg-secondary! [&>button]:bg-primary! not-last:[&>button]:rounded-r-none [&>button]:transition-[border-radius]\"\n              : \"\",\n            classNames?.range_start,\n          ),\n          range_end: cn(\n            props.mode === \"range\" &&\n              props.selected?.from?.getTime() !== props.selected?.to?.getTime()\n              ? \" bg-secondary! [&>button]:bg-primary! not-first:[&>button]:rounded-l-none [&>button]:transition-[border-radius]\"\n              : \"\",\n            classNames?.range_end,\n          ),\n          disabled: cn(\n            \"pointer-events-none text-muted-foreground opacity-60\",\n            classNames?.disabled,\n          ),\n          hidden: cn(\"pointer-events-none\", classNames?.hidden),\n          nav: cn(\"\", classNames?.nav),\n          month_grid: cn(\n            \"rounded-sm\",\n            \"bg-card border-border/70 border-1 border-separate border-spacing-0\",\n            classNames?.month_grid,\n          ),\n        }}\n        components={{\n          NextMonthButton: (props) => (\n            <button\n              {...props}\n              className={cn(\n                buttonVariants({ variant: \"ghost\", size: \"icon\" }),\n                \"absolute top-0.5 right-2 z-1 size-8\",\n                classNames?.button_next,\n              )}\n            >\n              <HugeiconsIcon\n                icon={ArrowRight01Icon}\n                className=\"size-4\"\n                strokeWidth={2}\n              />\n            </button>\n          ),\n          PreviousMonthButton: (props) => (\n            <button\n              {...props}\n              className={cn(\n                buttonVariants({ variant: \"ghost\", size: \"icon\" }),\n                \"absolute top-0.5 left-2 z-1 size-8\",\n                classNames?.button_previous,\n              )}\n            >\n              <HugeiconsIcon\n                icon={ArrowLeft01Icon}\n                className=\"size-4\"\n                strokeWidth={2}\n              />\n            </button>\n          ),\n        }}\n        {...props}\n      />\n    </div>\n  );\n}\n\nexport { Calendar };\n",
      "type": "registry:ui",
      "target": "components/ui/cubby-ui/calendar.tsx"
    }
  ],
  "type": "registry:ui"
}