{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tailwind-calendar",
  "type": "registry:ui",
  "title": "Calendar",
  "dependencies": [
    "lucide-react",
    "react",
    "react-aria-components",
    "tailwind-variants",
    "tailwindcss-react-aria-components",
    "tw-animate-css"
  ],
  "registryDependencies": [
    "https://react-aria.adobe.com/registry/tailwind-button.json",
    "https://react-aria.adobe.com/registry/tailwind-utils.json"
  ],
  "files": [
    {
      "path": "components/ui/Calendar.tsx",
      "type": "registry:ui",
      "content": "'use client';\nimport {ChevronLeft, ChevronRight} from 'lucide-react';\nimport React from 'react';\nimport {\n  Calendar as AriaCalendar,\n  CalendarGridHeader as AriaCalendarGridHeader,\n  type CalendarProps as AriaCalendarProps,\n  CalendarCell,\n  CalendarGrid,\n  CalendarGridBody,\n  CalendarHeaderCell,\n  CalendarHeading,\n  Text,\n  type DateValue\n} from 'react-aria-components/Calendar';\nimport {useLocale} from 'react-aria-components/I18nProvider';\nimport {tv} from 'tailwind-variants';\nimport {Button} from '@/registry/react-aria/ui/Button';\nimport {composeTailwindRenderProps, focusRing} from '@/registry/react-aria/lib/react-aria-utils';\n\nconst cellStyles = tv({\n  extend: focusRing,\n  base: 'w-[calc(100cqw/7)] aspect-square text-sm cursor-default rounded-full flex items-center justify-center forced-color-adjust-none [-webkit-tap-highlight-color:transparent]',\n  variants: {\n    isSelected: {\n      false:\n        'text-neutral-900 dark:text-neutral-200 hover:bg-neutral-200 dark:hover:bg-neutral-700 pressed:bg-neutral-300 dark:pressed:bg-neutral-600',\n      true: 'bg-blue-600 invalid:bg-red-600 text-white forced-colors:bg-[Highlight] forced-colors:invalid:bg-[Mark] forced-colors:text-[HighlightText]'\n    },\n    isDisabled: {\n      true: 'text-neutral-300 dark:text-neutral-600 forced-colors:text-[GrayText]'\n    }\n  }\n});\n\nexport interface CalendarProps<T extends DateValue> extends AriaCalendarProps<T> {\n  errorMessage?: string;\n}\n\nexport function Calendar<T extends DateValue>({errorMessage, ...props}: CalendarProps<T>) {\n  let {direction} = useLocale();\n  let months = props.visibleDuration?.months || 1;\n  return (\n    <AriaCalendar\n      {...props}\n      className={composeTailwindRenderProps(\n        props.className,\n        'flex font-sans w-full max-w-fit overflow-auto gap-3'\n      )}>\n      {Array.from({length: months}, (_, i) => (\n        <div key={i} className=\"@container flex flex-col w-[calc(9*var(--spacing)*7)]\">\n          <header className=\"flex items-center mb-4\">\n            {i === 0 && (\n              <Button variant=\"quiet\" slot=\"previous\">\n                {direction === 'rtl' ? (\n                  <ChevronRight aria-hidden size={18} />\n                ) : (\n                  <ChevronLeft aria-hidden size={18} />\n                )}\n              </Button>\n            )}\n            <CalendarHeading\n              offset={{months: i}}\n              className=\"flex-1 font-sans font-semibold [font-variation-settings:normal] text-base text-center mx-2 my-0 text-neutral-900 dark:text-neutral-200\"\n            />\n            {i === months - 1 && (\n              <Button variant=\"quiet\" slot=\"next\">\n                {direction === 'rtl' ? (\n                  <ChevronLeft aria-hidden size={18} />\n                ) : (\n                  <ChevronRight aria-hidden size={18} />\n                )}\n              </Button>\n            )}\n          </header>\n          <CalendarGrid offset={{months: i}} className=\"border-spacing-0\">\n            <CalendarGridHeader />\n            <CalendarGridBody>\n              {date => <CalendarCell date={date} className={cellStyles} />}\n            </CalendarGridBody>\n          </CalendarGrid>\n        </div>\n      ))}\n      {errorMessage && (\n        <Text slot=\"errorMessage\" className=\"text-sm text-red-600\">\n          {errorMessage}\n        </Text>\n      )}\n    </AriaCalendar>\n  );\n}\n\nexport function CalendarGridHeader() {\n  return (\n    <AriaCalendarGridHeader>\n      {day => (\n        <CalendarHeaderCell className=\"text-xs text-neutral-500 font-semibold\">\n          {day}\n        </CalendarHeaderCell>\n      )}\n    </AriaCalendarGridHeader>\n  );\n}\n"
    }
  ],
  "css": {
    "@plugin \"tailwindcss-react-aria-components\"": {},
    "@import \"tw-animate-css\"": {}
  }
}