{
  "name": "calendar",
  "type": "registry:ui",
  "dependencies": [
    "reka-ui",
    "@vueuse/core"
  ],
  "registryDependencies": [
    "button"
  ],
  "files": [
    {
      "path": "ui/calendar/Calendar.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarRootEmits, CalendarRootProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarRoot, useForwardPropsEmits } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\nimport { CalendarCell, CalendarCellTrigger, CalendarGrid, CalendarGridBody, CalendarGridHead, CalendarGridRow, CalendarHeadCell, CalendarHeader, CalendarHeading, CalendarNextButton, CalendarPrevButton } from \".\"\n\nconst props = defineProps<CalendarRootProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst emits = defineEmits<CalendarRootEmits>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardPropsEmits(delegatedProps, emits)\n</script>\n\n<template>\n  <CalendarRoot\n    v-slot=\"{ grid, weekDays }\"\n    :class=\"cn('p-3', props.class)\"\n    v-bind=\"forwarded\"\n  >\n    <CalendarHeader>\n      <CalendarPrevButton />\n      <CalendarHeading />\n      <CalendarNextButton />\n    </CalendarHeader>\n\n    <div class=\"flex flex-col gap-y-4 mt-4 sm:flex-row sm:gap-x-4 sm:gap-y-0\">\n      <CalendarGrid v-for=\"month in grid\" :key=\"month.value.toString()\">\n        <CalendarGridHead>\n          <CalendarGridRow>\n            <CalendarHeadCell\n              v-for=\"day in weekDays\" :key=\"day\"\n            >\n              {{ day }}\n            </CalendarHeadCell>\n          </CalendarGridRow>\n        </CalendarGridHead>\n        <CalendarGridBody>\n          <CalendarGridRow v-for=\"(weekDates, index) in month.rows\" :key=\"`weekDate-${index}`\" class=\"mt-2 w-full\">\n            <CalendarCell\n              v-for=\"weekDate in weekDates\"\n              :key=\"weekDate.toString()\"\n              :date=\"weekDate\"\n            >\n              <CalendarCellTrigger\n                :day=\"weekDate\"\n                :month=\"month.value\"\n              />\n            </CalendarCell>\n          </CalendarGridRow>\n        </CalendarGridBody>\n      </CalendarGrid>\n    </div>\n  </CalendarRoot>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarCell.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarCellProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarCell, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<CalendarCellProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarCell\n    :class=\"cn('relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([data-selected])]:rounded-md [&:has([data-selected])]:bg-accent [&:has([data-selected][data-outside-view])]:bg-accent/50', props.class)\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot />\n  </CalendarCell>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarCellTrigger.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarCellTriggerProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarCellTrigger, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\nimport { buttonVariants } from \"@/registry/new-york/ui/button\"\n\nconst props = defineProps<CalendarCellTriggerProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarCellTrigger\n    :class=\"cn(\n      buttonVariants({ variant: 'ghost' }),\n      'h-8 w-8 p-0 font-normal',\n      '[&[data-today]:not([data-selected])]:bg-accent [&[data-today]:not([data-selected])]:text-accent-foreground',\n      // Selected\n      'data-[selected]:bg-primary data-[selected]:text-primary-foreground data-[selected]:opacity-100 data-[selected]:hover:bg-primary data-[selected]:hover:text-primary-foreground data-[selected]:focus:bg-primary data-[selected]:focus:text-primary-foreground',\n      // Disabled\n      'data-[disabled]:text-muted-foreground data-[disabled]:opacity-50',\n      // Unavailable\n      'data-[unavailable]:text-destructive-foreground data-[unavailable]:line-through',\n      // Outside months\n      'data-[outside-view]:text-muted-foreground data-[outside-view]:opacity-50 [&[data-outside-view][data-selected]]:bg-accent/50 [&[data-outside-view][data-selected]]:text-muted-foreground [&[data-outside-view][data-selected]]:opacity-30',\n      props.class,\n    )\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot />\n  </CalendarCellTrigger>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarGrid.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarGridProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarGrid, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<CalendarGridProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarGrid\n    :class=\"cn('w-full border-collapse space-y-1', props.class)\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot />\n  </CalendarGrid>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarGridBody.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarGridBodyProps } from \"reka-ui\"\nimport { CalendarGridBody } from \"reka-ui\"\n\nconst props = defineProps<CalendarGridBodyProps>()\n</script>\n\n<template>\n  <CalendarGridBody v-bind=\"props\">\n    <slot />\n  </CalendarGridBody>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarGridHead.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarGridHeadProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { CalendarGridHead } from \"reka-ui\"\n\nconst props = defineProps<CalendarGridHeadProps & { class?: HTMLAttributes[\"class\"] }>()\n</script>\n\n<template>\n  <CalendarGridHead v-bind=\"props\">\n    <slot />\n  </CalendarGridHead>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarGridRow.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarGridRowProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarGridRow, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<CalendarGridRowProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarGridRow :class=\"cn('flex', props.class)\" v-bind=\"forwardedProps\">\n    <slot />\n  </CalendarGridRow>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarHeadCell.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarHeadCellProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarHeadCell, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<CalendarHeadCellProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarHeadCell :class=\"cn('w-8 rounded-md text-[0.8rem] font-normal text-muted-foreground', props.class)\" v-bind=\"forwardedProps\">\n    <slot />\n  </CalendarHeadCell>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarHeader.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarHeaderProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarHeader, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<CalendarHeaderProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarHeader :class=\"cn('relative flex w-full items-center justify-between pt-1', props.class)\" v-bind=\"forwardedProps\">\n    <slot />\n  </CalendarHeader>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarHeading.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarHeadingProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { CalendarHeading, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<CalendarHeadingProps & { class?: HTMLAttributes[\"class\"] }>()\n\ndefineSlots<{\n  default: (props: { headingValue: string }) => any\n}>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarHeading\n    v-slot=\"{ headingValue }\"\n    :class=\"cn('text-sm font-medium', props.class)\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot :heading-value>\n      {{ headingValue }}\n    </slot>\n  </CalendarHeading>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarNextButton.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarNextProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ChevronRight } from \"lucide-vue-next\"\nimport { CalendarNext, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\nimport { buttonVariants } from \"@/registry/new-york/ui/button\"\n\nconst props = defineProps<CalendarNextProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarNext\n    :class=\"cn(\n      buttonVariants({ variant: 'outline' }),\n      'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100',\n      props.class,\n    )\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot>\n      <ChevronRight class=\"h-4 w-4\" />\n    </slot>\n  </CalendarNext>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/CalendarPrevButton.vue",
      "content": "<script lang=\"ts\" setup>\nimport type { CalendarPrevProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ChevronLeft } from \"lucide-vue-next\"\nimport { CalendarPrev, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\nimport { buttonVariants } from \"@/registry/new-york/ui/button\"\n\nconst props = defineProps<CalendarPrevProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <CalendarPrev\n    :class=\"cn(\n      buttonVariants({ variant: 'outline' }),\n      'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100',\n      props.class,\n    )\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot>\n      <ChevronLeft class=\"h-4 w-4\" />\n    </slot>\n  </CalendarPrev>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/calendar/index.ts",
      "content": "export { default as Calendar } from \"./Calendar.vue\"\nexport { default as CalendarCell } from \"./CalendarCell.vue\"\nexport { default as CalendarCellTrigger } from \"./CalendarCellTrigger.vue\"\nexport { default as CalendarGrid } from \"./CalendarGrid.vue\"\nexport { default as CalendarGridBody } from \"./CalendarGridBody.vue\"\nexport { default as CalendarGridHead } from \"./CalendarGridHead.vue\"\nexport { default as CalendarGridRow } from \"./CalendarGridRow.vue\"\nexport { default as CalendarHeadCell } from \"./CalendarHeadCell.vue\"\nexport { default as CalendarHeader } from \"./CalendarHeader.vue\"\nexport { default as CalendarHeading } from \"./CalendarHeading.vue\"\nexport { default as CalendarNextButton } from \"./CalendarNextButton.vue\"\nexport { default as CalendarPrevButton } from \"./CalendarPrevButton.vue\"\n",
      "type": "registry:ui",
      "target": ""
    }
  ]
}
