{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "date-range-picker",
  "title": "Date Range Picker",
  "description": "Compound component date range picker suite.",
  "dependencies": [
    "react-date-range-picker-headless",
    "@floating-ui/react",
    "clsx",
    "tailwind-merge"
  ],
  "files": [
    {
      "path": "registry/components/DatePicker/Compound.tsx",
      "content": "import { forwardRef } from \"react\";\nimport {\n  DatePicker as Primitive,\n  type DatePickerRootProps,\n  type TriggerProps,\n  type ContentProps,\n  type HeaderProps,\n  type NavButtonProps,\n  type TitleProps,\n  type GridProps,\n  type DayProps,\n  type FooterProps,\n  type ActionButtonProps,\n} from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport {\n  rootClassNames,\n  triggerClassNames,\n  contentClassNames,\n  headerClassNames,\n  gridClassNames,\n  dayClassNames,\n  footerClassNames,\n} from \"../../theme\";\n\nexport const Root = forwardRef<HTMLDivElement, DatePickerRootProps>(\n  ({ className, size, ...props }, ref) => (\n    <Primitive.Root\n      ref={ref}\n      className={cn(rootClassNames.root, size && `rdrp-size-${size}`, className)}\n      cn={cn}\n      size={size}\n      {...props}\n    />\n  ),\n);\nRoot.displayName = \"DatePicker.Root\";\n\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(\n  ({ className, placeholderClassName, clearClassName, ...props }, ref) => (\n    <Primitive.Trigger\n      ref={ref}\n      className={cn(triggerClassNames.trigger, className)}\n      placeholderClassName={cn(triggerClassNames.placeholder, placeholderClassName)}\n      clearClassName={cn(triggerClassNames.clear, clearClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTrigger.displayName = \"DatePicker.Trigger\";\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n  ({ className, inlineClassName, ...props }, ref) => (\n    <Primitive.Content\n      ref={ref}\n      className={cn(rootClassNames.root, contentClassNames.content, className)}\n      inlineClassName={cn(contentClassNames.contentInline, inlineClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nContent.displayName = \"DatePicker.Content\";\n\nexport const Header = forwardRef<HTMLDivElement, HeaderProps>(({ className, ...props }, ref) => (\n  <Primitive.Header\n    ref={ref}\n    className={cn(headerClassNames.header, className)}\n    cn={cn}\n    {...props}\n  />\n));\nHeader.displayName = \"DatePicker.Header\";\n\nexport const PrevButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.PrevButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPrevButton.displayName = \"DatePicker.PrevButton\";\n\nexport const NextButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.NextButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nNextButton.displayName = \"DatePicker.NextButton\";\n\nexport const Title = forwardRef<HTMLDivElement, TitleProps>(\n  ({ className, selectClassName, ...props }, ref) => (\n    <Primitive.Title\n      ref={ref}\n      className={cn(headerClassNames.title, className)}\n      selectClassName={cn(headerClassNames.select, selectClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTitle.displayName = \"DatePicker.Title\";\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  ({ className, weekdayClassName, weekdaysClassName, weekClassName, ...props }, ref) => (\n    <Primitive.Grid\n      ref={ref}\n      className={cn(gridClassNames.panel, className)}\n      weekdayClassName={cn(gridClassNames.weekday, weekdayClassName)}\n      weekdaysClassName={cn(gridClassNames.weekdays, weekdaysClassName)}\n      weekClassName={cn(gridClassNames.week, weekClassName)}\n      gridClassName={gridClassNames.grid}\n      dayClassName={dayClassNames.day}\n      dayTodayClassName={dayClassNames.today}\n      daySelectedClassName={dayClassNames.selected}\n      dayDisabledClassName={dayClassNames.disabled}\n      dayOutsideClassName={dayClassNames.outside}\n      dayHighlightedClassName={dayClassNames.highlighted}\n      dayInRangeClassName={dayClassNames.inRange}\n      dayRangeStartClassName={dayClassNames.rangeStart}\n      dayRangeEndClassName={dayClassNames.rangeEnd}\n      dayRangeSingleClassName={dayClassNames.rangeSingle}\n      dayHoverRangeClassName={dayClassNames.hoverRange}\n      dayHoverTargetClassName={dayClassNames.hoverTarget}\n      dayFocusedClassName={dayClassNames.focused}\n      dayEmptyClassName={dayClassNames.empty}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nGrid.displayName = \"DatePicker.Grid\";\n\nexport const Day = forwardRef<HTMLButtonElement, DayProps>(({ className, ...props }, ref) => (\n  <Primitive.Day\n    ref={ref}\n    className={cn(dayClassNames.day, className)}\n    todayClassName={dayClassNames.today}\n    selectedClassName={dayClassNames.selected}\n    disabledClassName={dayClassNames.disabled}\n    outsideClassName={dayClassNames.outside}\n    highlightedClassName={dayClassNames.highlighted}\n    inRangeClassName={dayClassNames.inRange}\n    rangeStartClassName={dayClassNames.rangeStart}\n    rangeEndClassName={dayClassNames.rangeEnd}\n    rangeSingleClassName={dayClassNames.rangeSingle}\n    hoverRangeClassName={dayClassNames.hoverRange}\n    hoverTargetClassName={dayClassNames.hoverTarget}\n    focusedClassName={dayClassNames.focused}\n    emptyClassName={dayClassNames.empty}\n    cn={cn}\n    {...props}\n  />\n));\nDay.displayName = \"DatePicker.Day\";\n\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(({ className, ...props }, ref) => (\n  <Primitive.Footer\n    ref={ref}\n    className={cn(footerClassNames.footer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nFooter.displayName = \"DatePicker.Footer\";\n\nexport const ClearButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ClearButton\n      ref={ref}\n      className={cn(footerClassNames.clearButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nClearButton.displayName = \"DatePicker.ClearButton\";\n\nexport const CancelButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.CancelButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCancelButton.displayName = \"DatePicker.CancelButton\";\n\nexport const ConfirmButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ConfirmButton\n      ref={ref}\n      className={cn(footerClassNames.confirmButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nConfirmButton.displayName = \"DatePicker.ConfirmButton\";\n\nexport const TodayButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TodayButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTodayButton.displayName = \"DatePicker.TodayButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DatePicker/Compound.tsx"
    },
    {
      "path": "registry/components/DatePicker/index.tsx",
      "content": "import * as C from \"./Compound\";\nimport type { DatePickerRootProps } from \"../../ui-primitives/index\";\nimport { rangeClassNames } from \"../../theme\";\n\nexport interface DatePickerProps extends Omit<DatePickerRootProps, \"children\"> {\n  hideHeader?: boolean;\n  hideFooter?: boolean;\n}\n\nexport function DatePickerSimple({ hideHeader, hideFooter, ...props }: DatePickerProps) {\n  const showFooter =\n    hideFooter !== undefined ? !hideFooter : !props.inline && !props.shouldCloseOnSelect;\n  const showNav = props.captionLayout !== \"dropdown\";\n  const numMonths = props.numberOfMonths ?? 1;\n\n  return (\n    <C.Root {...props}>\n      {!props.inline && <C.Trigger />}\n      <C.Content>\n        {!hideHeader && (\n          <C.Header>\n            {showNav && <C.PrevButton />}\n            <C.Title />\n            {showNav && <C.NextButton />}\n          </C.Header>\n        )}\n        {numMonths > 1 ? (\n          <div className={rangeClassNames.calendarsContainer}>\n            {Array.from({ length: numMonths }, (_, i) => (\n              <C.Grid key={i} calendarIndex={i} />\n            ))}\n          </div>\n        ) : (\n          <C.Grid />\n        )}\n        {showFooter && (\n          <C.Footer>\n            <C.ClearButton />\n            <C.CancelButton />\n            <C.ConfirmButton />\n          </C.Footer>\n        )}\n      </C.Content>\n    </C.Root>\n  );\n}\n\nexport const DatePicker = Object.assign(DatePickerSimple, C);\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DatePicker/index.tsx"
    },
    {
      "path": "registry/components/DateRangePicker/Compound.tsx",
      "content": "import { forwardRef } from \"react\";\nimport {\n  DateRangePicker as Primitive,\n  type DateRangePickerRootProps,\n  type TriggerProps,\n  type ContentProps,\n  type HeaderProps,\n  type NavButtonProps,\n  type TitleProps,\n  type GridProps,\n  type DayProps,\n  type FooterProps,\n  type ActionButtonProps,\n  type CalendarsProps,\n  type PresetsProps,\n  type PresetItemProps,\n} from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport {\n  rootClassNames,\n  triggerClassNames,\n  contentClassNames,\n  headerClassNames,\n  gridClassNames,\n  dayClassNames,\n  footerClassNames,\n  rangeClassNames,\n} from \"../../theme\";\n\nexport const Root = forwardRef<HTMLDivElement, DateRangePickerRootProps>(\n  ({ className, size, ...props }, ref) => (\n    <Primitive.Root\n      ref={ref}\n      className={cn(rootClassNames.root, size && `rdrp-size-${size}`, className)}\n      cn={cn}\n      size={size}\n      {...props}\n    />\n  ),\n);\nRoot.displayName = \"DateRangePicker.Root\";\n\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(\n  ({ className, placeholderClassName, clearClassName, ...props }, ref) => (\n    <Primitive.Trigger\n      ref={ref}\n      className={cn(triggerClassNames.trigger, className)}\n      placeholderClassName={cn(triggerClassNames.placeholder, placeholderClassName)}\n      clearClassName={cn(triggerClassNames.clear, clearClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTrigger.displayName = \"DateRangePicker.Trigger\";\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n  ({ className, inlineClassName, ...props }, ref) => (\n    <Primitive.Content\n      ref={ref}\n      className={cn(rootClassNames.root, contentClassNames.content, className)}\n      inlineClassName={cn(contentClassNames.contentInline, inlineClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nContent.displayName = \"DateRangePicker.Content\";\n\nexport const Header = forwardRef<HTMLDivElement, HeaderProps>(({ className, ...props }, ref) => (\n  <Primitive.Header\n    ref={ref}\n    className={cn(headerClassNames.header, className)}\n    cn={cn}\n    {...props}\n  />\n));\nHeader.displayName = \"DateRangePicker.Header\";\n\nexport const PrevButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.PrevButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPrevButton.displayName = \"DateRangePicker.PrevButton\";\n\nexport const NextButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.NextButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nNextButton.displayName = \"DateRangePicker.NextButton\";\n\nexport const Title = forwardRef<HTMLDivElement, TitleProps>(\n  ({ className, selectClassName, ...props }, ref) => (\n    <Primitive.Title\n      ref={ref}\n      className={cn(headerClassNames.title, className)}\n      selectClassName={cn(headerClassNames.select, selectClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTitle.displayName = \"DateRangePicker.Title\";\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  ({ className, weekdayClassName, weekdaysClassName, weekClassName, ...props }, ref) => (\n    <Primitive.Grid\n      ref={ref}\n      className={cn(gridClassNames.panel, className)}\n      weekdayClassName={cn(gridClassNames.weekday, weekdayClassName)}\n      weekdaysClassName={cn(gridClassNames.weekdays, weekdaysClassName)}\n      weekClassName={cn(gridClassNames.week, weekClassName)}\n      gridClassName={gridClassNames.grid}\n      dayClassName={dayClassNames.day}\n      dayTodayClassName={dayClassNames.today}\n      daySelectedClassName={dayClassNames.selected}\n      dayDisabledClassName={dayClassNames.disabled}\n      dayOutsideClassName={dayClassNames.outside}\n      dayHighlightedClassName={dayClassNames.highlighted}\n      dayInRangeClassName={dayClassNames.inRange}\n      dayRangeStartClassName={dayClassNames.rangeStart}\n      dayRangeEndClassName={dayClassNames.rangeEnd}\n      dayRangeSingleClassName={dayClassNames.rangeSingle}\n      dayHoverRangeClassName={dayClassNames.hoverRange}\n      dayHoverTargetClassName={dayClassNames.hoverTarget}\n      dayFocusedClassName={dayClassNames.focused}\n      dayEmptyClassName={dayClassNames.empty}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nGrid.displayName = \"DateRangePicker.Grid\";\n\nexport const Day = forwardRef<HTMLButtonElement, DayProps>(({ className, ...props }, ref) => (\n  <Primitive.Day\n    ref={ref}\n    className={cn(dayClassNames.day, className)}\n    todayClassName={dayClassNames.today}\n    selectedClassName={dayClassNames.selected}\n    disabledClassName={dayClassNames.disabled}\n    outsideClassName={dayClassNames.outside}\n    highlightedClassName={dayClassNames.highlighted}\n    inRangeClassName={dayClassNames.inRange}\n    rangeStartClassName={dayClassNames.rangeStart}\n    rangeEndClassName={dayClassNames.rangeEnd}\n    rangeSingleClassName={dayClassNames.rangeSingle}\n    hoverRangeClassName={dayClassNames.hoverRange}\n    hoverTargetClassName={dayClassNames.hoverTarget}\n    focusedClassName={dayClassNames.focused}\n    emptyClassName={dayClassNames.empty}\n    cn={cn}\n    {...props}\n  />\n));\nDay.displayName = \"DateRangePicker.Day\";\n\nexport const Calendars = forwardRef<HTMLDivElement, CalendarsProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.Calendars\n      ref={ref}\n      className={cn(rangeClassNames.calendarsContainer, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCalendars.displayName = \"DateRangePicker.Calendars\";\n\nexport const Presets = forwardRef<HTMLDivElement, PresetsProps>(({ className, ...props }, ref) => (\n  <Primitive.Presets\n    ref={ref}\n    className={cn(rangeClassNames.presetsContainer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nPresets.displayName = \"DateRangePicker.Presets\";\n\nexport const PresetItem = forwardRef<HTMLButtonElement, PresetItemProps>(\n  ({ className, activeClassName, ...props }, ref) => (\n    <Primitive.PresetItem\n      ref={ref}\n      className={cn(rangeClassNames.presetButton, className)}\n      activeClassName={cn(rangeClassNames.presetButtonActive, activeClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPresetItem.displayName = \"DateRangePicker.PresetItem\";\n\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(({ className, ...props }, ref) => (\n  <Primitive.Footer\n    ref={ref}\n    className={cn(footerClassNames.footer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nFooter.displayName = \"DateRangePicker.Footer\";\n\nexport const ClearButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ClearButton\n      ref={ref}\n      className={cn(footerClassNames.clearButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nClearButton.displayName = \"DateRangePicker.ClearButton\";\n\nexport const CancelButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.CancelButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCancelButton.displayName = \"DateRangePicker.CancelButton\";\n\nexport const ConfirmButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ConfirmButton\n      ref={ref}\n      className={cn(footerClassNames.confirmButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nConfirmButton.displayName = \"DateRangePicker.ConfirmButton\";\n\nexport const TodayButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TodayButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTodayButton.displayName = \"DateRangePicker.TodayButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DateRangePicker/Compound.tsx"
    },
    {
      "path": "registry/components/DateRangePicker/index.tsx",
      "content": "import * as C from \"./Compound\";\nimport type { DateRangePickerRootProps } from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport { headerClassNames, rangeClassNames } from \"../../theme\";\n\nexport interface DateRangePickerProps extends Omit<DateRangePickerRootProps, \"children\"> {\n  hideHeader?: boolean;\n  hideFooter?: boolean;\n}\n\nexport function DateRangePickerSimple({ hideHeader, hideFooter, ...props }: DateRangePickerProps) {\n  const hasPresets = props.presets && props.presets.length > 0;\n  const showFooter =\n    hideFooter !== undefined ? !hideFooter : !props.inline && !props.shouldCloseOnSelect;\n  const showNav = props.captionLayout !== \"dropdown\";\n\n  return (\n    <C.Root {...props}>\n      {!props.inline && <C.Trigger />}\n      <C.Content>\n        <div className={cn(hasPresets && rangeClassNames.presetsLayout)}>\n          {hasPresets && (\n            <C.Presets>\n              {props.presets?.map((p, i) => (\n                <C.PresetItem key={p.label} index={i} />\n              ))}\n            </C.Presets>\n          )}\n          <div>\n            {!hideHeader && (\n              <C.Header>\n                {showNav && <C.PrevButton />}\n                <C.Title calendarIndex={0} />\n                <div className={headerClassNames.spacer} />\n                <C.Title calendarIndex={1} />\n                {showNav && <C.NextButton />}\n              </C.Header>\n            )}\n            <C.Calendars>\n              <C.Grid calendarIndex={0} />\n              <C.Grid calendarIndex={1} />\n            </C.Calendars>\n            {showFooter && (\n              <C.Footer>\n                <C.ClearButton />\n                <C.CancelButton />\n                <C.ConfirmButton />\n              </C.Footer>\n            )}\n          </div>\n        </div>\n      </C.Content>\n    </C.Root>\n  );\n}\n\nexport const DateRangePicker = Object.assign(DateRangePickerSimple, C);\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DateRangePicker/index.tsx"
    },
    {
      "path": "registry/components/DateRangeTimePicker/Compound.tsx",
      "content": "import { forwardRef } from \"react\";\nimport {\n  DateRangeTimePicker as Primitive,\n  type DateRangeTimePickerRootProps,\n  type TriggerProps,\n  type ContentProps,\n  type HeaderProps,\n  type NavButtonProps,\n  type TitleProps,\n  type GridProps,\n  type DayProps,\n  type FooterProps,\n  type ActionButtonProps,\n  type CalendarsProps,\n  type PresetsProps,\n  type PresetItemProps,\n  type StartTimeSectionProps,\n  type EndTimeSectionProps,\n  type TimePanelProps,\n} from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport {\n  rootClassNames,\n  triggerClassNames,\n  contentClassNames,\n  headerClassNames,\n  gridClassNames,\n  dayClassNames,\n  footerClassNames,\n  rangeClassNames,\n  dateTimeClassNames,\n  timePanelClassNames,\n} from \"../../theme\";\n\nexport const Root = forwardRef<HTMLDivElement, DateRangeTimePickerRootProps>(\n  ({ className, size, ...props }, ref) => (\n    <Primitive.Root\n      ref={ref}\n      className={cn(rootClassNames.root, size && `rdrp-size-${size}`, className)}\n      cn={cn}\n      size={size}\n      {...props}\n    />\n  ),\n);\nRoot.displayName = \"DateRangeTimePicker.Root\";\n\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(\n  ({ className, placeholderClassName, clearClassName, ...props }, ref) => (\n    <Primitive.Trigger\n      ref={ref}\n      className={cn(triggerClassNames.trigger, className)}\n      placeholderClassName={cn(triggerClassNames.placeholder, placeholderClassName)}\n      clearClassName={cn(triggerClassNames.clear, clearClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTrigger.displayName = \"DateRangeTimePicker.Trigger\";\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n  ({ className, inlineClassName, ...props }, ref) => (\n    <Primitive.Content\n      ref={ref}\n      className={cn(rootClassNames.root, contentClassNames.content, className)}\n      inlineClassName={cn(contentClassNames.contentInline, inlineClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nContent.displayName = \"DateRangeTimePicker.Content\";\n\nexport const Header = forwardRef<HTMLDivElement, HeaderProps>(({ className, ...props }, ref) => (\n  <Primitive.Header\n    ref={ref}\n    className={cn(headerClassNames.header, className)}\n    cn={cn}\n    {...props}\n  />\n));\nHeader.displayName = \"DateRangeTimePicker.Header\";\n\nexport const PrevButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.PrevButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPrevButton.displayName = \"DateRangeTimePicker.PrevButton\";\n\nexport const NextButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.NextButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nNextButton.displayName = \"DateRangeTimePicker.NextButton\";\n\nexport const Title = forwardRef<HTMLDivElement, TitleProps>(\n  ({ className, selectClassName, ...props }, ref) => (\n    <Primitive.Title\n      ref={ref}\n      className={cn(headerClassNames.title, className)}\n      selectClassName={cn(headerClassNames.select, selectClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTitle.displayName = \"DateRangeTimePicker.Title\";\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  ({ className, weekdayClassName, weekdaysClassName, weekClassName, ...props }, ref) => (\n    <Primitive.Grid\n      ref={ref}\n      className={cn(gridClassNames.panel, className)}\n      weekdayClassName={cn(gridClassNames.weekday, weekdayClassName)}\n      weekdaysClassName={cn(gridClassNames.weekdays, weekdaysClassName)}\n      weekClassName={cn(gridClassNames.week, weekClassName)}\n      gridClassName={gridClassNames.grid}\n      dayClassName={dayClassNames.day}\n      dayTodayClassName={dayClassNames.today}\n      daySelectedClassName={dayClassNames.selected}\n      dayDisabledClassName={dayClassNames.disabled}\n      dayOutsideClassName={dayClassNames.outside}\n      dayHighlightedClassName={dayClassNames.highlighted}\n      dayInRangeClassName={dayClassNames.inRange}\n      dayRangeStartClassName={dayClassNames.rangeStart}\n      dayRangeEndClassName={dayClassNames.rangeEnd}\n      dayRangeSingleClassName={dayClassNames.rangeSingle}\n      dayHoverRangeClassName={dayClassNames.hoverRange}\n      dayHoverTargetClassName={dayClassNames.hoverTarget}\n      dayFocusedClassName={dayClassNames.focused}\n      dayEmptyClassName={dayClassNames.empty}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nGrid.displayName = \"DateRangeTimePicker.Grid\";\n\nexport const Day = forwardRef<HTMLButtonElement, DayProps>(({ className, ...props }, ref) => (\n  <Primitive.Day\n    ref={ref}\n    className={cn(dayClassNames.day, className)}\n    todayClassName={dayClassNames.today}\n    selectedClassName={dayClassNames.selected}\n    disabledClassName={dayClassNames.disabled}\n    outsideClassName={dayClassNames.outside}\n    highlightedClassName={dayClassNames.highlighted}\n    inRangeClassName={dayClassNames.inRange}\n    rangeStartClassName={dayClassNames.rangeStart}\n    rangeEndClassName={dayClassNames.rangeEnd}\n    rangeSingleClassName={dayClassNames.rangeSingle}\n    hoverRangeClassName={dayClassNames.hoverRange}\n    hoverTargetClassName={dayClassNames.hoverTarget}\n    focusedClassName={dayClassNames.focused}\n    emptyClassName={dayClassNames.empty}\n    cn={cn}\n    {...props}\n  />\n));\nDay.displayName = \"DateRangeTimePicker.Day\";\n\nexport const Calendars = forwardRef<HTMLDivElement, CalendarsProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.Calendars\n      ref={ref}\n      className={cn(rangeClassNames.calendarsContainer, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCalendars.displayName = \"DateRangeTimePicker.Calendars\";\n\nexport const Presets = forwardRef<HTMLDivElement, PresetsProps>(({ className, ...props }, ref) => (\n  <Primitive.Presets\n    ref={ref}\n    className={cn(rangeClassNames.presetsContainer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nPresets.displayName = \"DateRangeTimePicker.Presets\";\n\nexport const PresetItem = forwardRef<HTMLButtonElement, PresetItemProps>(\n  ({ className, activeClassName, ...props }, ref) => (\n    <Primitive.PresetItem\n      ref={ref}\n      className={cn(rangeClassNames.presetButton, className)}\n      activeClassName={cn(rangeClassNames.presetButtonActive, activeClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPresetItem.displayName = \"DateRangeTimePicker.PresetItem\";\n\nexport const StartTimeSection = forwardRef<HTMLDivElement, StartTimeSectionProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.StartTimeSection\n      ref={ref}\n      className={cn(dateTimeClassNames.timeSection, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nStartTimeSection.displayName = \"DateRangeTimePicker.StartTimeSection\";\n\nexport const EndTimeSection = forwardRef<HTMLDivElement, EndTimeSectionProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.EndTimeSection\n      ref={ref}\n      className={cn(dateTimeClassNames.timeSection, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nEndTimeSection.displayName = \"DateRangeTimePicker.EndTimeSection\";\n\nexport const TimePanel = forwardRef<HTMLDivElement, TimePanelProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TimePanel\n      ref={ref}\n      className={cn(timePanelClassNames.timePanel, className)}\n      highlightClassName={timePanelClassNames.timeHighlight}\n      columnsClassName={timePanelClassNames.timeColumns}\n      columnClassName={timePanelClassNames.timeColumn}\n      itemClassName={timePanelClassNames.timeItem}\n      itemActiveClassName={timePanelClassNames.timeItemActive}\n      paddingClassName={timePanelClassNames.timePadding}\n      colonClassName={timePanelClassNames.timeColon}\n      periodButtonClassName={timePanelClassNames.timePeriodButton}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTimePanel.displayName = \"DateRangeTimePicker.TimePanel\";\n\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(({ className, ...props }, ref) => (\n  <Primitive.Footer\n    ref={ref}\n    className={cn(footerClassNames.footer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nFooter.displayName = \"DateRangeTimePicker.Footer\";\n\nexport const ClearButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ClearButton\n      ref={ref}\n      className={cn(footerClassNames.clearButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nClearButton.displayName = \"DateRangeTimePicker.ClearButton\";\n\nexport const CancelButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.CancelButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCancelButton.displayName = \"DateRangeTimePicker.CancelButton\";\n\nexport const ConfirmButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ConfirmButton\n      ref={ref}\n      className={cn(footerClassNames.confirmButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nConfirmButton.displayName = \"DateRangeTimePicker.ConfirmButton\";\n\nexport const TodayButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TodayButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTodayButton.displayName = \"DateRangeTimePicker.TodayButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DateRangeTimePicker/Compound.tsx"
    },
    {
      "path": "registry/components/DateRangeTimePicker/index.tsx",
      "content": "import * as C from \"./Compound\";\nimport type { DateRangeTimePickerRootProps } from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport { headerClassNames, rangeClassNames, dateTimeClassNames } from \"../../theme\";\n\nexport interface DateRangeTimePickerProps extends Omit<DateRangeTimePickerRootProps, \"children\"> {\n  hideHeader?: boolean;\n  hideFooter?: boolean;\n}\n\nexport function DateRangeTimePickerSimple({\n  hideHeader,\n  hideFooter,\n  ...props\n}: DateRangeTimePickerProps) {\n  const hasPresets = props.presets && props.presets.length > 0;\n  const showFooter =\n    hideFooter !== undefined ? !hideFooter : !props.inline && !props.shouldCloseOnSelect;\n  const showNav = props.captionLayout !== \"dropdown\";\n\n  return (\n    <C.Root {...props}>\n      {!props.inline && <C.Trigger />}\n      <C.Content>\n        <div className={cn(hasPresets && rangeClassNames.presetsLayout)}>\n          {hasPresets && (\n            <C.Presets>\n              {props.presets?.map((p, i) => (\n                <C.PresetItem key={p.label} index={i} />\n              ))}\n            </C.Presets>\n          )}\n          <div>\n            {!hideHeader && (\n              <C.Header>\n                {showNav && <C.PrevButton />}\n                <C.Title calendarIndex={0} />\n                <div className={headerClassNames.spacer} />\n                <C.Title calendarIndex={1} />\n                {showNav && <C.NextButton />}\n              </C.Header>\n            )}\n            <C.Calendars>\n              <div>\n                <C.Grid calendarIndex={0} />\n                <C.StartTimeSection>\n                  <div className={dateTimeClassNames.timeLabel}>Start Time</div>\n                  <C.TimePanel target=\"start\" />\n                </C.StartTimeSection>\n              </div>\n              <div>\n                <C.Grid calendarIndex={1} />\n                <C.EndTimeSection>\n                  <div className={dateTimeClassNames.timeLabel}>End Time</div>\n                  <C.TimePanel target=\"end\" />\n                </C.EndTimeSection>\n              </div>\n            </C.Calendars>\n            {showFooter && (\n              <C.Footer>\n                <C.ClearButton />\n                <C.CancelButton />\n                <C.ConfirmButton />\n              </C.Footer>\n            )}\n          </div>\n        </div>\n      </C.Content>\n    </C.Root>\n  );\n}\n\nexport const DateRangeTimePicker = Object.assign(DateRangeTimePickerSimple, C);\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DateRangeTimePicker/index.tsx"
    },
    {
      "path": "registry/components/DateTimePicker/Compound.tsx",
      "content": "import { forwardRef } from \"react\";\nimport {\n  DateTimePicker as Primitive,\n  type DateTimePickerRootProps,\n  type TriggerProps,\n  type ContentProps,\n  type HeaderProps,\n  type NavButtonProps,\n  type TitleProps,\n  type GridProps,\n  type DayProps,\n  type FooterProps,\n  type ActionButtonProps,\n  type DateTimeSectionProps,\n  type TimePanelProps,\n} from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport {\n  rootClassNames,\n  triggerClassNames,\n  contentClassNames,\n  headerClassNames,\n  gridClassNames,\n  dayClassNames,\n  footerClassNames,\n  dateTimeClassNames,\n  timePanelClassNames,\n} from \"../../theme\";\n\nexport const Root = forwardRef<HTMLDivElement, DateTimePickerRootProps>(\n  ({ className, size, ...props }, ref) => (\n    <Primitive.Root\n      ref={ref}\n      className={cn(rootClassNames.root, size && `rdrp-size-${size}`, className)}\n      cn={cn}\n      size={size}\n      {...props}\n    />\n  ),\n);\nRoot.displayName = \"DateTimePicker.Root\";\n\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(\n  ({ className, placeholderClassName, clearClassName, ...props }, ref) => (\n    <Primitive.Trigger\n      ref={ref}\n      className={cn(triggerClassNames.trigger, className)}\n      placeholderClassName={cn(triggerClassNames.placeholder, placeholderClassName)}\n      clearClassName={cn(triggerClassNames.clear, clearClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTrigger.displayName = \"DateTimePicker.Trigger\";\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n  ({ className, inlineClassName, ...props }, ref) => (\n    <Primitive.Content\n      ref={ref}\n      className={cn(rootClassNames.root, contentClassNames.content, className)}\n      inlineClassName={cn(contentClassNames.contentInline, inlineClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nContent.displayName = \"DateTimePicker.Content\";\n\nexport const Header = forwardRef<HTMLDivElement, HeaderProps>(({ className, ...props }, ref) => (\n  <Primitive.Header\n    ref={ref}\n    className={cn(headerClassNames.header, className)}\n    cn={cn}\n    {...props}\n  />\n));\nHeader.displayName = \"DateTimePicker.Header\";\n\nexport const PrevButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.PrevButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPrevButton.displayName = \"DateTimePicker.PrevButton\";\n\nexport const NextButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.NextButton\n      ref={ref}\n      className={cn(headerClassNames.navButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nNextButton.displayName = \"DateTimePicker.NextButton\";\n\nexport const Title = forwardRef<HTMLDivElement, TitleProps>(\n  ({ className, selectClassName, ...props }, ref) => (\n    <Primitive.Title\n      ref={ref}\n      className={cn(headerClassNames.title, className)}\n      selectClassName={cn(headerClassNames.select, selectClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTitle.displayName = \"DateTimePicker.Title\";\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  ({ className, weekdayClassName, weekdaysClassName, weekClassName, ...props }, ref) => (\n    <Primitive.Grid\n      ref={ref}\n      className={cn(gridClassNames.panel, className)}\n      weekdayClassName={cn(gridClassNames.weekday, weekdayClassName)}\n      weekdaysClassName={cn(gridClassNames.weekdays, weekdaysClassName)}\n      weekClassName={cn(gridClassNames.week, weekClassName)}\n      gridClassName={gridClassNames.grid}\n      dayClassName={dayClassNames.day}\n      dayTodayClassName={dayClassNames.today}\n      daySelectedClassName={dayClassNames.selected}\n      dayDisabledClassName={dayClassNames.disabled}\n      dayOutsideClassName={dayClassNames.outside}\n      dayHighlightedClassName={dayClassNames.highlighted}\n      dayInRangeClassName={dayClassNames.inRange}\n      dayRangeStartClassName={dayClassNames.rangeStart}\n      dayRangeEndClassName={dayClassNames.rangeEnd}\n      dayRangeSingleClassName={dayClassNames.rangeSingle}\n      dayHoverRangeClassName={dayClassNames.hoverRange}\n      dayHoverTargetClassName={dayClassNames.hoverTarget}\n      dayFocusedClassName={dayClassNames.focused}\n      dayEmptyClassName={dayClassNames.empty}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nGrid.displayName = \"DateTimePicker.Grid\";\n\nexport const Day = forwardRef<HTMLButtonElement, DayProps>(({ className, ...props }, ref) => (\n  <Primitive.Day\n    ref={ref}\n    className={cn(dayClassNames.day, className)}\n    todayClassName={dayClassNames.today}\n    selectedClassName={dayClassNames.selected}\n    disabledClassName={dayClassNames.disabled}\n    outsideClassName={dayClassNames.outside}\n    highlightedClassName={dayClassNames.highlighted}\n    inRangeClassName={dayClassNames.inRange}\n    rangeStartClassName={dayClassNames.rangeStart}\n    rangeEndClassName={dayClassNames.rangeEnd}\n    rangeSingleClassName={dayClassNames.rangeSingle}\n    hoverRangeClassName={dayClassNames.hoverRange}\n    hoverTargetClassName={dayClassNames.hoverTarget}\n    focusedClassName={dayClassNames.focused}\n    emptyClassName={dayClassNames.empty}\n    cn={cn}\n    {...props}\n  />\n));\nDay.displayName = \"DateTimePicker.Day\";\n\nexport const TimeSection = forwardRef<HTMLDivElement, DateTimeSectionProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TimeSection\n      ref={ref}\n      className={cn(dateTimeClassNames.timeSection, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTimeSection.displayName = \"DateTimePicker.TimeSection\";\n\nexport const TimePanel = forwardRef<HTMLDivElement, TimePanelProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TimePanel\n      ref={ref}\n      className={cn(timePanelClassNames.timePanel, className)}\n      highlightClassName={timePanelClassNames.timeHighlight}\n      columnsClassName={timePanelClassNames.timeColumns}\n      columnClassName={timePanelClassNames.timeColumn}\n      itemClassName={timePanelClassNames.timeItem}\n      itemActiveClassName={timePanelClassNames.timeItemActive}\n      paddingClassName={timePanelClassNames.timePadding}\n      colonClassName={timePanelClassNames.timeColon}\n      periodButtonClassName={timePanelClassNames.timePeriodButton}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTimePanel.displayName = \"DateTimePicker.TimePanel\";\n\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(({ className, ...props }, ref) => (\n  <Primitive.Footer\n    ref={ref}\n    className={cn(footerClassNames.footer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nFooter.displayName = \"DateTimePicker.Footer\";\n\nexport const ClearButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ClearButton\n      ref={ref}\n      className={cn(footerClassNames.clearButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nClearButton.displayName = \"DateTimePicker.ClearButton\";\n\nexport const CancelButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.CancelButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCancelButton.displayName = \"DateTimePicker.CancelButton\";\n\nexport const ConfirmButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ConfirmButton\n      ref={ref}\n      className={cn(footerClassNames.confirmButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nConfirmButton.displayName = \"DateTimePicker.ConfirmButton\";\n\nexport const TodayButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TodayButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTodayButton.displayName = \"DateTimePicker.TodayButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DateTimePicker/Compound.tsx"
    },
    {
      "path": "registry/components/DateTimePicker/index.tsx",
      "content": "import * as C from \"./Compound\";\nimport type { DateTimePickerRootProps } from \"../../ui-primitives/index\";\nimport { dateTimeClassNames } from \"../../theme\";\n\nexport interface DateTimePickerProps extends Omit<DateTimePickerRootProps, \"children\"> {\n  hideHeader?: boolean;\n  hideFooter?: boolean;\n}\n\nexport function DateTimePickerSimple({ hideHeader, hideFooter, ...props }: DateTimePickerProps) {\n  const showFooter =\n    hideFooter !== undefined ? !hideFooter : !props.inline && !props.shouldCloseOnSelect;\n  const showNav = props.captionLayout !== \"dropdown\";\n\n  return (\n    <C.Root {...props}>\n      {!props.inline && <C.Trigger />}\n      <C.Content>\n        {!hideHeader && (\n          <C.Header>\n            {showNav && <C.PrevButton />}\n            <C.Title />\n            {showNav && <C.NextButton />}\n          </C.Header>\n        )}\n        <C.Grid />\n        <C.TimeSection>\n          <div className={dateTimeClassNames.timeLabel}>Time</div>\n          <C.TimePanel target=\"single\" />\n        </C.TimeSection>\n        {showFooter && (\n          <C.Footer>\n            <C.ClearButton />\n            <C.CancelButton />\n            <C.ConfirmButton />\n          </C.Footer>\n        )}\n      </C.Content>\n    </C.Root>\n  );\n}\n\nexport const DateTimePicker = Object.assign(DateTimePickerSimple, C);\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/DateTimePicker/index.tsx"
    },
    {
      "path": "registry/components/TimePicker/Compound.tsx",
      "content": "import { forwardRef } from \"react\";\nimport {\n  TimePicker as Primitive,\n  type TimePickerRootProps,\n  type TriggerProps,\n  type ContentProps,\n  type FooterProps,\n  type ActionButtonProps,\n  type TimePanelProps,\n  type TimePickerPeriodToggleProps,\n} from \"../../ui-primitives/index\";\nimport { cn } from \"../../utils\";\nimport {\n  rootClassNames,\n  triggerClassNames,\n  contentClassNames,\n  footerClassNames,\n  timePanelClassNames,\n  timePickerClassNames,\n} from \"../../theme\";\n\nexport const Root = forwardRef<HTMLDivElement, TimePickerRootProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.Root\n      ref={ref}\n      className={cn(rootClassNames.root, timePickerClassNames.root, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nRoot.displayName = \"TimePicker.Root\";\n\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(\n  ({ className, placeholderClassName, clearClassName, ...props }, ref) => (\n    <Primitive.Trigger\n      ref={ref}\n      className={cn(triggerClassNames.trigger, className)}\n      placeholderClassName={cn(triggerClassNames.placeholder, placeholderClassName)}\n      clearClassName={cn(triggerClassNames.clear, clearClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTrigger.displayName = \"TimePicker.Trigger\";\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n  ({ className, inlineClassName, ...props }, ref) => (\n    <Primitive.Content\n      ref={ref}\n      className={cn(\n        rootClassNames.root,\n        contentClassNames.content,\n        timePickerClassNames.content,\n        className,\n      )}\n      inlineClassName={cn(contentClassNames.contentInline, inlineClassName)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nContent.displayName = \"TimePicker.Content\";\n\nexport const TimePanel = forwardRef<HTMLDivElement, TimePanelProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.TimePanel\n      ref={ref}\n      className={cn(timePanelClassNames.timePanel, className)}\n      highlightClassName={timePanelClassNames.timeHighlight}\n      columnsClassName={timePanelClassNames.timeColumns}\n      columnClassName={timePanelClassNames.timeColumn}\n      itemClassName={timePanelClassNames.timeItem}\n      itemActiveClassName={timePanelClassNames.timeItemActive}\n      paddingClassName={timePanelClassNames.timePadding}\n      colonClassName={timePanelClassNames.timeColon}\n      periodButtonClassName={timePanelClassNames.timePeriodButton}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nTimePanel.displayName = \"TimePicker.TimePanel\";\n\nexport const PeriodToggle = forwardRef<HTMLButtonElement, TimePickerPeriodToggleProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.PeriodToggle\n      ref={ref}\n      className={cn(timePanelClassNames.timePeriodButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nPeriodToggle.displayName = \"TimePicker.PeriodToggle\";\n\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(({ className, ...props }, ref) => (\n  <Primitive.Footer\n    ref={ref}\n    className={cn(footerClassNames.footer, className)}\n    cn={cn}\n    {...props}\n  />\n));\nFooter.displayName = \"TimePicker.Footer\";\n\nexport const ClearButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ClearButton\n      ref={ref}\n      className={cn(footerClassNames.clearButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nClearButton.displayName = \"TimePicker.ClearButton\";\n\nexport const CancelButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.CancelButton\n      ref={ref}\n      className={cn(footerClassNames.button, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nCancelButton.displayName = \"TimePicker.CancelButton\";\n\nexport const ConfirmButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, ...props }, ref) => (\n    <Primitive.ConfirmButton\n      ref={ref}\n      className={cn(footerClassNames.confirmButton, className)}\n      cn={cn}\n      {...props}\n    />\n  ),\n);\nConfirmButton.displayName = \"TimePicker.ConfirmButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/TimePicker/Compound.tsx"
    },
    {
      "path": "registry/components/TimePicker/index.tsx",
      "content": "import * as C from \"./Compound\";\nimport type { TimePickerRootProps } from \"../../ui-primitives/index\";\n\nexport interface TimePickerProps extends Omit<TimePickerRootProps, \"children\"> {\n  hideFooter?: boolean;\n}\n\nexport function TimePickerSimple({ hideFooter, ...props }: TimePickerProps) {\n  const showFooter = hideFooter !== undefined ? !hideFooter : !props.inline;\n\n  return (\n    <C.Root {...props}>\n      {!props.inline && <C.Trigger />}\n      <C.Content>\n        <C.TimePanel target=\"single\" />\n        {showFooter && (\n          <C.Footer>\n            <C.ClearButton />\n            <C.CancelButton />\n            <C.ConfirmButton />\n          </C.Footer>\n        )}\n      </C.Content>\n    </C.Root>\n  );\n}\n\nexport const TimePicker = Object.assign(TimePickerSimple, C);\n",
      "type": "registry:component",
      "target": "components/date-range-picker/components/TimePicker/index.tsx"
    },
    {
      "path": "registry/theme.ts",
      "content": "// Theme values for tailwind4\n\nexport const rootClassNames = {\n  root: \"relative w-max font-sans text-[13px] text-foreground select-none\",\n};\n\nexport const triggerClassNames = {\n  trigger:\n    \"flex items-center gap-2 justify-between min-w-[200px] px-3.5 py-2 text-sm bg-background border border-input rounded-md shadow-sm hover:border-ring/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:border-ring\",\n  placeholder: \"text-muted-foreground\",\n  clear:\n    \"ml-2 p-1 -m-1 appearance-none border-0 bg-transparent text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm cursor-pointer\",\n};\n\nexport const headerClassNames = {\n  header: \"flex items-center justify-between mb-3\",\n  navButton:\n    \"flex items-center justify-center w-7 h-7 text-muted-foreground rounded-md hover:bg-accent cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n  title: \"flex-1 flex items-center justify-center gap-1 font-semibold text-[15px] text-foreground\",\n  select:\n    \"px-1 py-0.5 text-sm bg-transparent border border-transparent rounded hover:border-border focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring cursor-pointer\",\n  spacer: \"flex-1\",\n};\n\nexport const gridClassNames = {\n  panel: \"flex flex-col\",\n  weekdays: \"grid grid-cols-7 mb-1\",\n  weekday: \"flex items-center justify-center h-7 text-xs font-medium text-muted-foreground\",\n  grid: \"flex flex-col gap-1\",\n  week: \"grid grid-cols-7\",\n};\n\nexport const dayClassNames = {\n  day: \"flex items-center justify-center min-w-9 h-9 mx-[1px] rounded-lg transition-colors cursor-pointer hover:bg-accent focus-visible:outline-none\",\n  empty: \"invisible pointer-events-none\",\n  today: \"font-bold text-primary\",\n  selected:\n    \"bg-primary text-primary-foreground font-semibold hover:bg-primary hover:text-primary-foreground\",\n  disabled: \"text-muted-foreground opacity-50 pointer-events-none\",\n  outside: \"text-muted-foreground/50\",\n  highlighted:\n    \"relative after:absolute after:bottom-[3px] after:left-1/2 after:-translate-x-1/2 after:w-1 after:h-1 after:bg-primary after:rounded-full\",\n  inRange: \"bg-primary/10 text-foreground rounded-none mx-0 hover:bg-primary/10\",\n  rangeStart:\n    \"bg-primary text-primary-foreground rounded-l-lg rounded-r-none mx-0 hover:bg-primary hover:text-primary-foreground\",\n  rangeEnd:\n    \"bg-primary text-primary-foreground rounded-r-lg rounded-l-none mx-0 hover:bg-primary hover:text-primary-foreground\",\n  rangeSingle:\n    \"bg-primary text-primary-foreground mx-0 hover:bg-primary hover:text-primary-foreground\",\n  hoverRange: \"bg-primary/5 text-foreground rounded-none mx-0\",\n  hoverTarget: \"bg-primary/15 text-foreground\",\n  focused: \"ring-2 ring-ring ring-offset-1 ring-offset-background\",\n};\n\nexport const footerClassNames = {\n  footer: \"flex justify-end gap-2 mt-3 pt-3 border-t border-border\",\n  button:\n    \"px-3.5 py-1.5 text-muted-foreground border border-input hover:bg-accent hover:border-ring/50 rounded-md transition-colors motion-reduce:transition-none cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n  confirmButton:\n    \"px-3.5 py-1.5 text-primary-foreground bg-primary hover:bg-primary/90 rounded-md transition-colors motion-reduce:transition-none disabled:opacity-50 disabled:pointer-events-none cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n  clearButton:\n    \"mr-auto px-3.5 py-1.5 text-destructive hover:text-foreground hover:bg-accent rounded-md transition-colors motion-reduce:transition-none cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n};\n\nexport const contentClassNames = {\n  content:\n    \"absolute top-[calc(100%+8px)] left-0 z-50 p-4 bg-popover text-popover-foreground border border-border rounded-xl shadow-lg\",\n  contentInline: \"static z-auto shadow-none mt-0\",\n};\n\nexport const rangeClassNames = {\n  presetsContainer: \"flex flex-col gap-0.5 pr-4 border-r border-border min-w-[140px]\",\n  presetButton:\n    \"px-4 py-2 text-left rounded-md transition-colors motion-reduce:transition-none hover:bg-accent cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n  presetButtonActive: \"bg-accent text-primary font-medium\",\n  presetsLayout: \"flex flex-wrap gap-4\",\n  calendarsContainer: \"flex flex-wrap gap-6 max-sm:flex-col max-sm:gap-4\",\n};\n\nexport const dateTimeClassNames = {\n  timeSection: \"flex flex-col gap-3 mt-3 pt-3 border-t border-border\",\n  timeLabel: \"text-xs font-medium text-muted-foreground\",\n};\n\nexport const timePanelClassNames = {\n  timePanel: \"relative flex items-center justify-center w-fit mx-auto min-w-[120px] h-[176px]\",\n  timeHighlight: \"absolute left-1 right-1 h-8 rounded-md bg-primary/10 pointer-events-none\",\n  timeColumns: \"relative flex items-center w-full h-full\",\n  timeColumn:\n    \"flex-1 h-[160px] overflow-y-auto [scrollbar-width:none] [scroll-snap-type:y_mandatory] [&::-webkit-scrollbar]:hidden focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset rounded-md\",\n  timeItem:\n    \"h-8 flex items-center justify-center cursor-pointer text-sm text-muted-foreground [scroll-snap-align:center] transition-colors select-none hover:text-foreground\",\n  timeItemActive: \"text-foreground font-semibold\",\n  timePadding: \"h-8 shrink-0\",\n  timeColon: \"text-sm font-semibold text-foreground w-3 text-center shrink-0\",\n  timePeriodButton:\n    \"h-8 flex items-center justify-center cursor-pointer text-sm text-foreground font-semibold border border-border bg-background hover:bg-accent hover:text-accent-foreground rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n};\n\nexport const timePickerClassNames = {\n  root: \"relative w-max font-sans text-[13px] text-foreground select-none\",\n  content:\n    \"min-w-[250px] [&.rdrp-size-small]:min-w-[210px] [&.rdrp-size-large]:min-w-[290px] [&.rdrp-size-x-large]:min-w-[340px]\",\n};\n",
      "type": "registry:component",
      "target": "components/date-range-picker/theme.ts"
    },
    {
      "path": "registry/ui-primitives/DatePicker/Root.tsx",
      "content": "import { mergeRefs } from \"../../utils/mergeRefs\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { usePickerContext, formatBasic } from \"react-date-range-picker-headless\";\n\nimport { DatePickerProvider, type DatePickerProviderProps } from \"react-date-range-picker-headless\";\n\nexport interface DatePickerRootProps extends DatePickerProviderProps {\n  className?: string;\n  cn?: (...args: unknown[]) => string;\n}\n\ninterface InnerProps {\n  className?: string;\n  children?: ReactNode;\n  name?: string;\n  value?: Date | null;\n}\n\nconst Inner = forwardRef<HTMLDivElement, InnerProps>(\n  ({ className, children, name, value }, ref) => {\n    const context = usePickerContext();\n    return (\n      <div ref={mergeRefs(ref, context.containerRef)} className={className} data-slot=\"root\">\n        {name && (\n          <input type=\"hidden\" name={name} value={value ? formatBasic(value, \"YYYY-MM-DD\") : \"\"} />\n        )}\n        {children}\n      </div>\n    );\n  },\n);\nInner.displayName = \"Inner\";\n\nexport const DatePickerRoot = forwardRef<HTMLDivElement, DatePickerRootProps>(\n  ({ className, cn: cnFn, children, ...options }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <DatePickerProvider {...options}>\n        <Inner ref={ref} className={cn(className)} name={options.name} value={options.value}>\n          {children}\n        </Inner>\n      </DatePickerProvider>\n    );\n  },\n);\nDatePickerRoot.displayName = \"DatePickerRoot\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DatePicker/Root.tsx"
    },
    {
      "path": "registry/ui-primitives/DatePicker/index.ts",
      "content": "import { DatePickerRoot } from \"./Root\";\nimport { Trigger } from \"../shared/Trigger\";\nimport { Content } from \"../shared/Content\";\nimport { Header } from \"../shared/Header\";\nimport { PrevButton } from \"../shared/PrevButton\";\nimport { NextButton } from \"../shared/NextButton\";\nimport { Title } from \"../shared/Title\";\nimport { Grid } from \"../shared/Grid\";\nimport { Day } from \"../shared/Day\";\nimport { Footer } from \"../shared/Footer\";\nimport { ClearButton } from \"../shared/ClearButton\";\nimport { CancelButton } from \"../shared/CancelButton\";\nimport { ConfirmButton } from \"../shared/ConfirmButton\";\nimport { TodayButton } from \"../shared/TodayButton\";\n\nexport const DatePicker = {\n  Root: DatePickerRoot,\n  Trigger,\n  Content,\n  Header,\n  PrevButton,\n  NextButton,\n  Title,\n  Grid,\n  Day,\n  Footer,\n  ClearButton,\n  CancelButton,\n  ConfirmButton,\n  TodayButton,\n};\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DatePicker/index.ts"
    },
    {
      "path": "registry/ui-primitives/DateRangePicker/Calendars.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\n\nexport interface CalendarsProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Calendars = forwardRef<HTMLDivElement, CalendarsProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <div ref={ref} className={cn(\"rdrp-calendars-container\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nCalendars.displayName = \"Calendars\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangePicker/Calendars.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangePicker/PresetItem.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface PresetItemProps {\n  index: number;\n  className?: string;\n  activeClassName?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const PresetItem = forwardRef<HTMLButtonElement, PresetItemProps>(\n  ({ index, className, activeClassName, children, cn: cnFn }, ref) => {\n    const { presets, activePresetIndex, handlePresetClick } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    if (!presets) {\n      throw new Error(\"PresetItem can only be used within DateRangePicker, DateRangeTimePicker\");\n    }\n\n    if (!presets[index]) return null;\n    const preset = presets[index];\n    const isActive = index === activePresetIndex;\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\n          \"rdrp-preset-button\",\n          className,\n          isActive && \"rdrp-preset-button-active\",\n          isActive && activeClassName,\n        )}\n        onClick={() => handlePresetClick?.(preset)}\n      >\n        {children || preset.label}\n      </button>\n    );\n  },\n);\nPresetItem.displayName = \"PresetItem\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangePicker/PresetItem.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangePicker/Presets.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface PresetsProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Presets = forwardRef<HTMLDivElement, PresetsProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { presets } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    if (!presets) {\n      throw new Error(\"Presets can only be used within DateRangePicker, DateRangeTimePicker\");\n    }\n    if (presets.length === 0) return null;\n\n    return (\n      <div ref={ref} className={cn(\"rdrp-presets-container\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nPresets.displayName = \"Presets\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangePicker/Presets.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangePicker/Root.tsx",
      "content": "import { mergeRefs } from \"../../utils/mergeRefs\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nimport {\n  DateRangePickerProvider,\n  type DateRangePickerProviderProps,\n} from \"react-date-range-picker-headless\";\nimport { formatBasic } from \"react-date-range-picker-headless\";\n\nexport interface DateRangePickerRootProps extends DateRangePickerProviderProps {\n  className?: string;\n  endName?: string;\n  cn?: (...args: unknown[]) => string;\n}\n\ninterface InnerProps {\n  className?: string;\n  children?: ReactNode;\n  name?: string;\n  endName?: string;\n  value?: { start: Date | null; end: Date | null };\n}\n\nconst Inner = forwardRef<HTMLDivElement, InnerProps>(\n  ({ className, children, name, endName, value }, ref) => {\n    const context = usePickerContext();\n    return (\n      <div ref={mergeRefs(ref, context.containerRef)} className={className} data-slot=\"root\">\n        {name && (\n          <input\n            type=\"hidden\"\n            name={name}\n            value={value?.start && value?.end ? formatBasic(value.start, \"YYYY-MM-DD\") : \"\"}\n          />\n        )}\n        {name && (\n          <input\n            type=\"hidden\"\n            name={endName || `${name}-end`}\n            value={value?.start && value?.end ? formatBasic(value.end, \"YYYY-MM-DD\") : \"\"}\n          />\n        )}\n        {children}\n      </div>\n    );\n  },\n);\nInner.displayName = \"Inner\";\n\nexport const DateRangePickerRoot = forwardRef<HTMLDivElement, DateRangePickerRootProps>(\n  ({ className, cn: cnFn, children, endName, ...options }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <DateRangePickerProvider {...options}>\n        <Inner\n          ref={ref}\n          className={cn(className)}\n          endName={endName}\n          name={options.name}\n          value={options.value}\n        >\n          {children}\n        </Inner>\n      </DateRangePickerProvider>\n    );\n  },\n);\nDateRangePickerRoot.displayName = \"DateRangePickerRoot\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangePicker/Root.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangePicker/index.ts",
      "content": "import { DateRangePickerRoot } from \"./Root\";\nimport { Calendars } from \"./Calendars\";\nimport { Presets } from \"./Presets\";\nimport { PresetItem } from \"./PresetItem\";\nimport { Trigger } from \"../shared/Trigger\";\nimport { Content } from \"../shared/Content\";\nimport { Header } from \"../shared/Header\";\nimport { PrevButton } from \"../shared/PrevButton\";\nimport { NextButton } from \"../shared/NextButton\";\nimport { Title } from \"../shared/Title\";\nimport { Grid } from \"../shared/Grid\";\nimport { Day } from \"../shared/Day\";\nimport { Footer } from \"../shared/Footer\";\nimport { ClearButton } from \"../shared/ClearButton\";\nimport { CancelButton } from \"../shared/CancelButton\";\nimport { ConfirmButton } from \"../shared/ConfirmButton\";\nimport { TodayButton } from \"../shared/TodayButton\";\n\nexport const DateRangePicker = {\n  Root: DateRangePickerRoot,\n  Trigger,\n  Content,\n  Header,\n  PrevButton,\n  NextButton,\n  Title,\n  Grid,\n  Day,\n  Calendars,\n  Presets,\n  PresetItem,\n  Footer,\n  ClearButton,\n  CancelButton,\n  ConfirmButton,\n  TodayButton,\n};\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangePicker/index.ts"
    },
    {
      "path": "registry/ui-primitives/DateRangeTimePicker/EndTimeSection.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\n\nexport interface EndTimeSectionProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const EndTimeSection = forwardRef<HTMLDivElement, EndTimeSectionProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <div ref={ref} className={cn(\"rdrp-time-section\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nEndTimeSection.displayName = \"EndTimeSection\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangeTimePicker/EndTimeSection.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangeTimePicker/Root.tsx",
      "content": "import { mergeRefs } from \"../../utils/mergeRefs\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nimport {\n  DateRangeTimePickerProvider,\n  type DateRangeTimePickerProviderProps,\n} from \"react-date-range-picker-headless\";\nimport { formatBasic } from \"react-date-range-picker-headless\";\n\nexport interface DateRangeTimePickerRootProps extends DateRangeTimePickerProviderProps {\n  className?: string;\n  endName?: string;\n  cn?: (...args: unknown[]) => string;\n}\n\ninterface InnerProps {\n  className?: string;\n  children?: ReactNode;\n  name?: string;\n  endName?: string;\n  value?: { start: Date | null; end: Date | null };\n}\n\nconst Inner = forwardRef<HTMLDivElement, InnerProps>(\n  ({ className, children, name, endName, value }, ref) => {\n    const context = usePickerContext();\n    return (\n      <div ref={mergeRefs(ref, context.containerRef)} className={className} data-slot=\"root\">\n        {name && (\n          <input\n            type=\"hidden\"\n            name={name}\n            value={value?.start && value?.end ? formatBasic(value.start, \"YYYY-MM-DD\") : \"\"}\n          />\n        )}\n        {name && (\n          <input\n            type=\"hidden\"\n            name={endName || `${name}-end`}\n            value={value?.start && value?.end ? formatBasic(value.end, \"YYYY-MM-DD\") : \"\"}\n          />\n        )}\n        {children}\n      </div>\n    );\n  },\n);\nInner.displayName = \"Inner\";\n\nexport const DateRangeTimePickerRoot = forwardRef<HTMLDivElement, DateRangeTimePickerRootProps>(\n  ({ className, cn: cnFn, children, endName, ...options }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <DateRangeTimePickerProvider {...options}>\n        <Inner\n          ref={ref}\n          className={cn(className)}\n          endName={endName}\n          name={options.name}\n          value={options.value}\n        >\n          {children}\n        </Inner>\n      </DateRangeTimePickerProvider>\n    );\n  },\n);\nDateRangeTimePickerRoot.displayName = \"DateRangeTimePickerRoot\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangeTimePicker/Root.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangeTimePicker/StartTimeSection.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\n\nexport interface StartTimeSectionProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const StartTimeSection = forwardRef<HTMLDivElement, StartTimeSectionProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <div ref={ref} className={cn(\"rdrp-time-section\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nStartTimeSection.displayName = \"StartTimeSection\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangeTimePicker/StartTimeSection.tsx"
    },
    {
      "path": "registry/ui-primitives/DateRangeTimePicker/index.ts",
      "content": "import { DateRangeTimePickerRoot } from \"./Root\";\nimport { StartTimeSection } from \"./StartTimeSection\";\nimport { EndTimeSection } from \"./EndTimeSection\";\nimport { Calendars } from \"../DateRangePicker/Calendars\";\nimport { Presets } from \"../DateRangePicker/Presets\";\nimport { PresetItem } from \"../DateRangePicker/PresetItem\";\nimport { Trigger } from \"../shared/Trigger\";\nimport { Content } from \"../shared/Content\";\nimport { Header } from \"../shared/Header\";\nimport { PrevButton } from \"../shared/PrevButton\";\nimport { NextButton } from \"../shared/NextButton\";\nimport { Title } from \"../shared/Title\";\nimport { Grid } from \"../shared/Grid\";\nimport { Day } from \"../shared/Day\";\nimport { Footer } from \"../shared/Footer\";\nimport { ClearButton } from \"../shared/ClearButton\";\nimport { CancelButton } from \"../shared/CancelButton\";\nimport { ConfirmButton } from \"../shared/ConfirmButton\";\nimport { TodayButton } from \"../shared/TodayButton\";\nimport { TimePanel } from \"../shared/TimePanel\";\n\nexport const DateRangeTimePicker = {\n  Root: DateRangeTimePickerRoot,\n  Trigger,\n  Content,\n  Header,\n  PrevButton,\n  NextButton,\n  Title,\n  Grid,\n  Day,\n  Calendars,\n  Presets,\n  PresetItem,\n  StartTimeSection,\n  EndTimeSection,\n  TimePanel,\n  Footer,\n  ClearButton,\n  CancelButton,\n  ConfirmButton,\n  TodayButton,\n};\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateRangeTimePicker/index.ts"
    },
    {
      "path": "registry/ui-primitives/DateTimePicker/Root.tsx",
      "content": "import { mergeRefs } from \"../../utils/mergeRefs\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nimport {\n  DateTimePickerProvider,\n  type DateTimePickerProviderProps,\n  formatBasic,\n} from \"react-date-range-picker-headless\";\n\nexport interface DateTimePickerRootProps extends DateTimePickerProviderProps {\n  className?: string;\n  cn?: (...args: unknown[]) => string;\n}\n\ninterface InnerProps {\n  className?: string;\n  children?: ReactNode;\n  name?: string;\n  value?: Date | null;\n}\n\nconst Inner = forwardRef<HTMLDivElement, InnerProps>(\n  ({ className, children, name, value }, ref) => {\n    const context = usePickerContext();\n    return (\n      <div ref={mergeRefs(ref, context.containerRef)} className={className} data-slot=\"root\">\n        {name && (\n          <input\n            type=\"hidden\"\n            name={name}\n            value={value ? formatBasic(value, \"YYYY-MM-DD HH:mm:ss\") : \"\"}\n          />\n        )}\n        {children}\n      </div>\n    );\n  },\n);\nInner.displayName = \"Inner\";\n\nexport const DateTimePickerRoot = forwardRef<HTMLDivElement, DateTimePickerRootProps>(\n  ({ className, cn: cnFn, children, ...options }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <DateTimePickerProvider {...options}>\n        <Inner ref={ref} className={cn(className)} name={options.name} value={options.value}>\n          {children}\n        </Inner>\n      </DateTimePickerProvider>\n    );\n  },\n);\nDateTimePickerRoot.displayName = \"DateTimePickerRoot\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateTimePicker/Root.tsx"
    },
    {
      "path": "registry/ui-primitives/DateTimePicker/TimeSection.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\n\nexport interface TimeSectionProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const TimeSection = forwardRef<HTMLDivElement, TimeSectionProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <div ref={ref} className={cn(\"rdrp-time-section\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nTimeSection.displayName = \"TimeSection\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateTimePicker/TimeSection.tsx"
    },
    {
      "path": "registry/ui-primitives/DateTimePicker/index.ts",
      "content": "import { DateTimePickerRoot } from \"./Root\";\nimport { TimeSection } from \"./TimeSection\";\nimport { Trigger } from \"../shared/Trigger\";\nimport { Content } from \"../shared/Content\";\nimport { Header } from \"../shared/Header\";\nimport { PrevButton } from \"../shared/PrevButton\";\nimport { NextButton } from \"../shared/NextButton\";\nimport { Title } from \"../shared/Title\";\nimport { Grid } from \"../shared/Grid\";\nimport { Day } from \"../shared/Day\";\nimport { Footer } from \"../shared/Footer\";\nimport { ClearButton } from \"../shared/ClearButton\";\nimport { CancelButton } from \"../shared/CancelButton\";\nimport { ConfirmButton } from \"../shared/ConfirmButton\";\nimport { TodayButton } from \"../shared/TodayButton\";\nimport { TimePanel } from \"../shared/TimePanel\";\n\nexport const DateTimePicker = {\n  Root: DateTimePickerRoot,\n  Trigger,\n  Content,\n  Header,\n  PrevButton,\n  NextButton,\n  Title,\n  Grid,\n  Day,\n  TimeSection,\n  TimePanel,\n  Footer,\n  ClearButton,\n  CancelButton,\n  ConfirmButton,\n  TodayButton,\n};\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/DateTimePicker/index.ts"
    },
    {
      "path": "registry/ui-primitives/TimePicker/PeriodToggle.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { useStandaloneTimePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface TimePickerPeriodToggleProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const TimePickerPeriodToggle = forwardRef<HTMLButtonElement, TimePickerPeriodToggleProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { tempPeriod, handlePeriodChange, locale } = useStandaloneTimePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-time-period-button\", className)}\n        onClick={() => handlePeriodChange(tempPeriod === \"AM\" ? \"PM\" : \"AM\")}\n      >\n        {children || (tempPeriod === \"AM\" ? locale.am : locale.pm)}\n      </button>\n    );\n  },\n);\nTimePickerPeriodToggle.displayName = \"TimePickerPeriodToggle\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/TimePicker/PeriodToggle.tsx"
    },
    {
      "path": "registry/ui-primitives/TimePicker/Root.tsx",
      "content": "import { mergeRefs } from \"../../utils/mergeRefs\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nimport {\n  StandaloneTimePickerProvider,\n  type StandaloneTimePickerProviderProps,\n  formatBasic,\n} from \"react-date-range-picker-headless\";\n\nexport interface TimePickerRootProps extends StandaloneTimePickerProviderProps {\n  className?: string;\n  cn?: (...args: unknown[]) => string;\n}\n\ninterface InnerProps {\n  className?: string;\n  children?: ReactNode;\n  name?: string;\n  value?: Date | null;\n}\n\nconst Inner = forwardRef<HTMLDivElement, InnerProps>(\n  ({ className, children, name, value }, ref) => {\n    const context = usePickerContext();\n    return (\n      <div\n        ref={mergeRefs(ref, context.containerRef)}\n        className={`rdrp-root${className ? ` ${className}` : \"\"}`}\n        data-slot=\"root\"\n      >\n        {name && (\n          <input type=\"hidden\" name={name} value={value ? formatBasic(value, \"HH:mm:ss\") : \"\"} />\n        )}\n        {children}\n      </div>\n    );\n  },\n);\nInner.displayName = \"Inner\";\n\nexport const TimePickerRoot = forwardRef<HTMLDivElement, TimePickerRootProps>(\n  ({ className, cn: cnFn, children, ...options }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <StandaloneTimePickerProvider {...options}>\n        <Inner\n          ref={ref}\n          className={cn(\"rdrp-time-picker\", className)}\n          name={options.name}\n          value={options.value}\n        >\n          {children}\n        </Inner>\n      </StandaloneTimePickerProvider>\n    );\n  },\n);\nTimePickerRoot.displayName = \"TimePickerRoot\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/TimePicker/Root.tsx"
    },
    {
      "path": "registry/ui-primitives/TimePicker/index.ts",
      "content": "import { TimePickerRoot } from \"./Root\";\nimport { TimePickerPeriodToggle } from \"./PeriodToggle\";\nimport { Trigger } from \"../shared/Trigger\";\nimport { Content } from \"../shared/Content\";\nimport { TimePanel } from \"../shared/TimePanel\";\nimport { Footer } from \"../shared/Footer\";\nimport { ClearButton } from \"../shared/ClearButton\";\nimport { CancelButton } from \"../shared/CancelButton\";\nimport { ConfirmButton } from \"../shared/ConfirmButton\";\n\nexport const TimePicker = {\n  Root: TimePickerRoot,\n  Trigger,\n  Content,\n  TimePanel,\n  PeriodToggle: TimePickerPeriodToggle,\n  Footer,\n  ClearButton,\n  CancelButton,\n  ConfirmButton,\n};\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/TimePicker/index.ts"
    },
    {
      "path": "registry/ui-primitives/index.ts",
      "content": "// Utils\n\n// Components\n\n// Types\nexport type {\n  TriggerRenderProps,\n  HeaderRenderProps,\n  WeekdayRowRenderProps,\n  DayCellRenderProps,\n  FooterRenderProps,\n  TimeSectionRenderProps,\n  RangeTimeSectionRenderProps,\n  PresetsBarRenderProps,\n  RenderProps,\n  VisualProps,\n  FormNameProps,\n  RangeFormNameProps,\n  DatePickerProps,\n  DateRangePickerProps,\n  DateTimePickerProps,\n  DateRangeTimePickerProps,\n  CalendarGridProps,\n  TimePanelInternalProps,\n  // ClassNames types\n  CalendarGridClassNames,\n  TimePanelClassNames,\n  BasePickerClassNames,\n  DatePickerClassNames,\n  DateRangePickerClassNames,\n  DateTimePickerClassNames,\n  DateRangeTimePickerClassNames,\n  // User-facing classNames prop types\n  DatePickerUserClassNames,\n  DateRangePickerUserClassNames,\n  DateTimePickerUserClassNames,\n  DateRangeTimePickerUserClassNames,\n  TimePickerProps,\n  TimePickerUserClassNames,\n  TimePickerClassNames,\n} from \"./types\";\n\nexport { DatePicker } from \"./DatePicker\";\nexport { DateRangePicker } from \"./DateRangePicker\";\nexport { DateTimePicker } from \"./DateTimePicker\";\nexport { DateRangeTimePicker } from \"./DateRangeTimePicker\";\nexport { TimePicker } from \"./TimePicker\";\n\nexport type { DatePickerRootProps } from \"./DatePicker/Root\";\nexport type { DateRangePickerRootProps } from \"./DateRangePicker/Root\";\nexport type { DateTimePickerRootProps } from \"./DateTimePicker/Root\";\nexport type { DateRangeTimePickerRootProps } from \"./DateRangeTimePicker/Root\";\nexport type { TimePickerRootProps } from \"./TimePicker/Root\";\nexport type { TimePickerPeriodToggleProps } from \"./TimePicker/PeriodToggle\";\n\nexport type { ContentProps } from \"./shared/Content\";\nexport type { HeaderProps } from \"./shared/Header\";\nexport type { NavButtonProps } from \"./shared/PrevButton\";\nexport type { TitleProps } from \"./shared/Title\";\nexport type { GridProps } from \"./shared/Grid\";\nexport type { DayProps, DayRenderProps } from \"./shared/Day\";\nexport type { FooterProps } from \"./shared/Footer\";\nexport type { ActionButtonProps } from \"./shared/ClearButton\";\nexport type { TimePanelProps } from \"./shared/TimePanel\";\nexport type { CalendarsProps } from \"./DateRangePicker/Calendars\";\nexport type { PresetsProps } from \"./DateRangePicker/Presets\";\nexport type { PresetItemProps } from \"./DateRangePicker/PresetItem\";\nexport type { TimeSectionProps as DateTimeSectionProps } from \"./DateTimePicker/TimeSection\";\nexport type { StartTimeSectionProps } from \"./DateRangeTimePicker/StartTimeSection\";\nexport type { EndTimeSectionProps } from \"./DateRangeTimePicker/EndTimeSection\";\nexport type { TriggerProps } from \"./shared/Trigger\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/index.ts"
    },
    {
      "path": "registry/ui-primitives/types.ts",
      "content": "import type { CSSProperties, ReactNode } from \"react\";\nimport type {\n  Locale,\n  DayProps,\n  DatePickerSize,\n  DateRangePreset,\n  CaptionLayout,\n  CalendarMonth,\n  UseDatePickerOptions,\n  UseDateRangePickerOptions,\n  UseDateTimePickerOptions,\n  UseDateRangeTimePickerOptions,\n  TimeConfig,\n  TimePeriod,\n  UseStandaloneTimePickerOptions,\n} from \"react-date-range-picker-headless\";\n\n// ── Render prop context types ──\n\nexport interface TriggerRenderProps {\n  displayValue: string;\n  placeholder: string;\n  hasValue: boolean;\n  isOpen: boolean;\n  onToggle: () => void;\n  onClear: () => void;\n  locale: Locale;\n  /** Callback ref to attach to the trigger element for Floating UI positioning. */\n  triggerRef: (node: HTMLElement | null) => void;\n}\n\nexport interface HeaderRenderProps {\n  month: Date;\n  formattedMonthYear: string;\n  onPrevMonth: () => void;\n  onNextMonth: () => void;\n  locale: Locale;\n  captionLayout: CaptionLayout;\n  years: number[];\n  months: number[];\n  onYearSelect: (year: number) => void;\n  onMonthSelect: (month: number) => void;\n}\n\nexport interface WeekdayRowRenderProps {\n  weekdays: string[];\n}\n\nexport interface DayCellRenderProps extends DayProps {\n  /** Unique id for the day cell, used by aria-activedescendant on the dialog. */\n  id: string;\n  onClick: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n}\n\nexport interface FooterRenderProps {\n  canConfirm: boolean;\n  hasValue: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  onClear: () => void;\n  locale: Locale;\n}\n\nexport interface TimeSectionRenderProps {\n  displayValue: string;\n  label: string;\n  timeConfig: Required<TimeConfig>;\n  hour: number;\n  minute: number;\n  second: number;\n  period: TimePeriod;\n}\n\nexport interface RangeTimeSectionRenderProps {\n  timeConfig: Required<TimeConfig>;\n  start: {\n    displayValue: string;\n    label: string;\n    hour: number;\n    minute: number;\n    second: number;\n    period: TimePeriod;\n  };\n  end: {\n    displayValue: string;\n    label: string;\n    hour: number;\n    minute: number;\n    second: number;\n    period: TimePeriod;\n  };\n}\n\nexport interface PresetsBarRenderProps {\n  presets: DateRangePreset[];\n  activePresetIndex: number;\n  onPresetClick: (preset: DateRangePreset) => void;\n}\n\n// ── Shared visual/render props ──\n\nexport interface RenderProps {\n  renderTrigger?: (props: TriggerRenderProps) => ReactNode;\n  renderHeader?: (props: HeaderRenderProps) => ReactNode;\n  renderWeekdayRow?: (props: WeekdayRowRenderProps) => ReactNode;\n  renderDayCell?: (props: DayCellRenderProps) => ReactNode;\n  renderFooter?: (props: FooterRenderProps) => ReactNode;\n  renderTimeSection?: (props: TimeSectionRenderProps) => ReactNode;\n  renderPresetsBar?: (props: PresetsBarRenderProps) => ReactNode;\n}\n\nexport interface VisualProps {\n  className?: string;\n  style?: CSSProperties;\n  inline?: boolean;\n  hideHeader?: boolean;\n  hideFooter?: boolean;\n  hideWeekdays?: boolean;\n}\n\n// ── Form integration props ──\n\nexport interface FormNameProps {\n  /** When provided, renders a hidden `<input>` with the selected value for native form submission. */\n  name?: string;\n}\n\nexport interface RangeFormNameProps extends FormNameProps {\n  /** Name for the end-date hidden input. Defaults to `${name}-end` when only `name` is provided. */\n  endName?: string;\n}\n\n// ── User-facing classNames prop types ──\n\nexport interface DatePickerUserClassNames extends Partial<DatePickerClassNames> {\n  calendar?: Partial<CalendarGridClassNames>;\n}\n\nexport interface DateRangePickerUserClassNames extends Partial<DateRangePickerClassNames> {\n  calendar?: Partial<CalendarGridClassNames>;\n}\n\nexport interface DateTimePickerUserClassNames extends Partial<DateTimePickerClassNames> {\n  calendar?: Partial<CalendarGridClassNames>;\n  timePanel?: Partial<TimePanelClassNames>;\n}\n\nexport interface DateRangeTimePickerUserClassNames extends Partial<DateRangeTimePickerClassNames> {\n  calendar?: Partial<CalendarGridClassNames>;\n  timePanel?: Partial<TimePanelClassNames>;\n}\n\nexport interface TimePickerUserClassNames extends Partial<TimePickerClassNames> {\n  timePanel?: Partial<TimePanelClassNames>;\n}\n\n// ── Public component props ──\n\nexport interface DatePickerProps\n  extends UseDatePickerOptions, VisualProps, RenderProps, FormNameProps {\n  classNames?: DatePickerUserClassNames;\n}\n\nexport interface DateRangePickerProps\n  extends UseDateRangePickerOptions, VisualProps, RenderProps, RangeFormNameProps {\n  classNames?: DateRangePickerUserClassNames;\n}\n\nexport interface DateTimePickerProps\n  extends UseDateTimePickerOptions, VisualProps, RenderProps, FormNameProps {\n  classNames?: DateTimePickerUserClassNames;\n}\n\nexport interface DateRangeTimePickerProps\n  extends\n    UseDateRangeTimePickerOptions,\n    VisualProps,\n    Omit<RenderProps, \"renderTimeSection\">,\n    RangeFormNameProps {\n  renderTimeSection?: (props: RangeTimeSectionRenderProps) => ReactNode;\n  classNames?: DateRangeTimePickerUserClassNames;\n}\n\nexport interface TimePickerProps extends UseStandaloneTimePickerOptions, FormNameProps {\n  size?: DatePickerSize;\n  className?: string;\n  style?: CSSProperties;\n  inline?: boolean;\n  hideFooter?: boolean;\n  renderFooter?: (props: FooterRenderProps) => ReactNode;\n  classNames?: TimePickerUserClassNames;\n}\n\n// ── ClassNames types (for theme injection) ──\n\nexport interface CalendarGridClassNames {\n  calendarPanel?: string;\n  header?: string;\n  headerTitle?: string;\n  captionSelect?: string;\n  weekdays?: string;\n  weekday?: string;\n  grid?: string;\n  week?: string;\n  day?: string;\n  dayEmpty?: string;\n  dayToday?: string;\n  daySelected?: string;\n  dayDisabled?: string;\n  dayOutside?: string;\n  dayHighlighted?: string;\n  dayInRange?: string;\n  dayRangeStart?: string;\n  dayRangeEnd?: string;\n  dayRangeSingle?: string;\n  dayHoverRange?: string;\n  dayHoverTarget?: string;\n  dayFocused?: string;\n}\n\nexport interface TimePanelClassNames {\n  timePanel?: string;\n  timeHighlight?: string;\n  timeColumns?: string;\n  timeColumn?: string;\n  timeItem?: string;\n  timeItemActive?: string;\n  timePadding?: string;\n  timeColon?: string;\n  timePeriodButton?: string;\n}\n\n/** Common classNames shared by all picker components */\nexport interface BasePickerClassNames {\n  root?: string;\n  content?: string;\n  contentInline?: string;\n  trigger?: string;\n  triggerPlaceholder?: string;\n  triggerClear?: string;\n  header?: string;\n  headerNavButton?: string;\n  headerTitle?: string;\n  headerSelect?: string;\n  headerSpacer?: string;\n  footer?: string;\n  footerButton?: string;\n  footerClearButton?: string;\n  footerConfirmButton?: string;\n}\n\nexport type DatePickerClassNames = BasePickerClassNames;\n\nexport interface DateRangePickerClassNames extends BasePickerClassNames {\n  presetsContainer?: string;\n  presetButton?: string;\n  presetButtonActive?: string;\n  presetsLayout?: string;\n  calendarsContainer?: string;\n}\n\nexport interface DateTimePickerClassNames extends BasePickerClassNames {\n  timeSection?: string;\n  timeLabel?: string;\n}\n\nexport interface DateRangeTimePickerClassNames extends BasePickerClassNames {\n  presetsContainer?: string;\n  presetButton?: string;\n  presetButtonActive?: string;\n  presetsLayout?: string;\n  calendarsContainer?: string;\n  timeSection?: string;\n  timeLabel?: string;\n}\n\nexport type TimePickerClassNames = BasePickerClassNames;\n\n// ── Internal CalendarGrid props ──\n\nexport interface CalendarGridProps {\n  calendar: CalendarMonth;\n  locale: Locale;\n  focusedDate?: Date | null;\n  getDayProps: (date: Date, referenceMonth?: Date) => DayProps;\n  onDateClick: (date: Date) => void;\n  onDateHover?: (date: Date | null) => void;\n  showTitle?: boolean;\n  hideWeekdays?: boolean;\n  captionLayout?: CaptionLayout;\n  years?: number[];\n  monthOptions?: number[];\n  onYearSelect?: (year: number, calendarIndex?: number) => void;\n  onMonthSelect?: (month: number, calendarIndex?: number) => void;\n  calendarIndex?: number;\n  renderWeekdayRow?: (props: WeekdayRowRenderProps) => ReactNode;\n  renderDayCell?: (props: DayCellRenderProps) => ReactNode;\n}\n\n// ── Internal TimePanelInternal props ──\n\nexport interface TimePanelInternalProps {\n  hour: number;\n  minute: number;\n  second: number;\n  period: TimePeriod;\n  onHourChange: (h: number) => void;\n  onMinuteChange: (m: number) => void;\n  onSecondChange: (s: number) => void;\n  onPeriodChange: (p: TimePeriod) => void;\n  timeConfig: Required<TimeConfig>;\n}\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/types.ts"
    },
    {
      "path": "registry/ui-primitives/shared/CancelButton.tsx",
      "content": "import { forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport type { ActionButtonProps } from \"./ClearButton\";\n\nexport const CancelButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { handleCancel, locale } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-footer-button\", className)}\n        onClick={handleCancel}\n      >\n        {children || locale.cancel}\n      </button>\n    );\n  },\n);\nCancelButton.displayName = \"CancelButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/CancelButton.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/ClearButton.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface ActionButtonProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const ClearButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { handleClear, locale, hasValue } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    if (!hasValue) return null;\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-footer-clear-button\", className)}\n        onClick={handleClear}\n      >\n        {children || locale.clear}\n      </button>\n    );\n  },\n);\nClearButton.displayName = \"ClearButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/ClearButton.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/ConfirmButton.tsx",
      "content": "import { forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport type { ActionButtonProps } from \"./ClearButton\";\n\nexport const ConfirmButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { handleConfirm, canConfirm, locale } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-footer-confirm-button\", className)}\n        onClick={handleConfirm}\n        disabled={!canConfirm}\n      >\n        {children || locale.confirm}\n      </button>\n    );\n  },\n);\nConfirmButton.displayName = \"ConfirmButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/ConfirmButton.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Content.tsx",
      "content": "import { type ReactNode, forwardRef, useRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport {\n  useFloating,\n  autoUpdate,\n  offset,\n  flip,\n  shift,\n  FloatingPortal,\n  FloatingFocusManager,\n} from \"@floating-ui/react\";\nimport { mergeRefs } from \"../../utils/mergeRefs\";\n\nexport interface ContentProps {\n  className?: string;\n  inlineClassName?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Content = forwardRef<HTMLDivElement, ContentProps>(\n  ({ className, inlineClassName, children, cn: cnFn }, forwardedRef) => {\n    const context = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    const {\n      isOpen,\n      inline,\n      containerRef,\n      popupRef,\n      handleKeyDown,\n      locale,\n      focusedDate,\n      calendars,\n    } = context;\n    const localPopupRef = useRef<HTMLDivElement>(null);\n    const showContent = inline || isOpen;\n\n    const {\n      refs,\n      floatingStyles,\n      context: floatingContext,\n    } = useFloating({\n      open: !inline && isOpen,\n      placement: \"bottom-start\",\n      middleware: [offset(8), flip(), shift({ padding: 8 })],\n      whileElementsMounted: autoUpdate,\n    });\n\n    if (!inline && containerRef?.current && !refs.reference.current) {\n      refs.setPositionReference(containerRef.current);\n    }\n\n    if (!showContent) return null;\n\n    // Find which calendar \"owns\" the focused date (matching month) for unique id\n    let focusedCalIdx = 0;\n    if (focusedDate && calendars.length > 1) {\n      const idx = calendars.findIndex(\n        (cal) =>\n          cal.month.getFullYear() === focusedDate.getFullYear() &&\n          cal.month.getMonth() === focusedDate.getMonth(),\n      );\n      if (idx >= 0) focusedCalIdx = idx;\n    }\n    const activeDescendant = focusedDate\n      ? `rdrp-day-${focusedCalIdx}-${locale.formatDate(focusedDate)}`\n      : undefined;\n\n    if (inline) {\n      return (\n        <div\n          ref={mergeRefs(forwardedRef, popupRef, localPopupRef)}\n          className={cn(\n            \"rdrp-root\",\n            \"rdrp-content\",\n            \"rdrp-content-inline\",\n            className,\n            inlineClassName,\n          )}\n          onKeyDown={handleKeyDown}\n          tabIndex={0}\n          role=\"group\"\n          aria-label={locale.placeholder}\n          aria-activedescendant={activeDescendant}\n        >\n          {children}\n        </div>\n      );\n    }\n\n    return (\n      <FloatingPortal>\n        <FloatingFocusManager context={floatingContext} initialFocus={localPopupRef} returnFocus>\n          <div\n            ref={mergeRefs(forwardedRef, refs.setFloating, popupRef, localPopupRef)}\n            style={floatingStyles}\n            className={cn(\"rdrp-root\", \"rdrp-content\", className)}\n            onKeyDown={handleKeyDown}\n            tabIndex={0}\n            role=\"dialog\"\n            aria-label={locale.placeholder}\n            aria-activedescendant={activeDescendant}\n          >\n            {children}\n          </div>\n        </FloatingFocusManager>\n      </FloatingPortal>\n    );\n  },\n);\nContent.displayName = \"Content\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Content.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Day.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface DayRenderProps {\n  date: Date;\n  day: number;\n  isToday: boolean;\n  isSelected: boolean;\n  isDisabled: boolean;\n  isInRange: boolean;\n  isRangeStart: boolean;\n  isRangeEnd: boolean;\n  isInHoverRange: boolean;\n  isHoverTarget: boolean;\n  hasLeftConnection: boolean;\n  hasRightConnection: boolean;\n  isConsecutiveRange: boolean;\n  isFocused: boolean;\n  dayOfWeek: number;\n  isOutsideDay: boolean;\n  isHighlighted: boolean;\n  isRangeSingle: boolean;\n  onClick: () => void;\n  onMouseEnter: () => void;\n  onMouseLeave: () => void;\n}\n\nexport interface DayProps {\n  date: Date;\n  calendarIndex?: number;\n  className?: string;\n  todayClassName?: string;\n  selectedClassName?: string;\n  disabledClassName?: string;\n  outsideClassName?: string;\n  highlightedClassName?: string;\n  inRangeClassName?: string;\n  rangeStartClassName?: string;\n  rangeEndClassName?: string;\n  rangeSingleClassName?: string;\n  hoverRangeClassName?: string;\n  hoverTargetClassName?: string;\n  focusedClassName?: string;\n  emptyClassName?: string;\n  children?: ReactNode | ((props: DayRenderProps) => ReactNode);\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Day = forwardRef<HTMLButtonElement, DayProps>(\n  (\n    {\n      date,\n      calendarIndex = 0,\n      className,\n      todayClassName,\n      selectedClassName,\n      disabledClassName,\n      outsideClassName,\n      highlightedClassName,\n      inRangeClassName,\n      rangeStartClassName,\n      rangeEndClassName,\n      rangeSingleClassName,\n      hoverRangeClassName,\n      hoverTargetClassName,\n      focusedClassName,\n      emptyClassName: _emptyClassName,\n      children,\n      cn: cnFn,\n    },\n    ref,\n  ) => {\n    const context = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    // Pass reference month if needed for outside days computation\n    const props = context.getDayProps(date);\n\n    const onClick = () => context.handleDateClick(date);\n    const onMouseEnter = () => context.handleDateHover?.(date);\n    const onMouseLeave = () => context.handleDateHover?.(null);\n\n    if (typeof children === \"function\") {\n      return (\n        <>\n          {children({\n            ...props,\n            onClick,\n            onMouseEnter,\n            onMouseLeave,\n          })}\n        </>\n      );\n    }\n\n    const {\n      day,\n      isToday,\n      isSelected,\n      isDisabled,\n      isInRange,\n      isRangeStart,\n      isRangeEnd,\n      isInHoverRange,\n      isHoverTarget,\n      isFocused,\n      isOutsideDay,\n      isHighlighted,\n      isRangeSingle,\n    } = props;\n\n    const showFocusRing = isFocused && !isSelected && !isRangeStart && !isRangeEnd;\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        id={`rdrp-day-${calendarIndex}-${context.locale.formatDate(date)}`}\n        className={cn(\n          \"rdrp-day\",\n          className,\n          isToday && \"rdrp-day-today\",\n          isToday && todayClassName,\n          isOutsideDay && \"rdrp-day-outside\",\n          isOutsideDay && outsideClassName,\n          isInHoverRange && \"rdrp-day-hover-range\",\n          isInHoverRange && hoverRangeClassName,\n          isHoverTarget && \"rdrp-day-hover-target\",\n          isHoverTarget && hoverTargetClassName,\n          isInRange && \"rdrp-day-in-range\",\n          isInRange && inRangeClassName,\n          isHighlighted && \"rdrp-day-highlighted\",\n          isHighlighted && highlightedClassName,\n          isSelected && \"rdrp-day-selected\",\n          isSelected && selectedClassName,\n          isRangeStart && \"rdrp-day-range-start\",\n          isRangeStart && rangeStartClassName,\n          isRangeEnd && \"rdrp-day-range-end\",\n          isRangeEnd && rangeEndClassName,\n          isRangeSingle && \"rdrp-day-range-single\",\n          isRangeSingle && rangeSingleClassName,\n          isDisabled && \"rdrp-day-disabled\",\n          isDisabled && disabledClassName,\n          showFocusRing && \"rdrp-day-focused\",\n          showFocusRing && focusedClassName,\n        )}\n        onClick={onClick}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        disabled={isDisabled}\n        tabIndex={isFocused ? 0 : -1}\n        aria-label={context.locale.formatDate(date)}\n        aria-current={isToday ? \"date\" : undefined}\n        role=\"gridcell\"\n        aria-selected={isSelected}\n        data-slot=\"day\"\n      >\n        {day}\n      </button>\n    );\n  },\n);\nDay.displayName = \"Day\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Day.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Footer.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\n\nexport interface FooterProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <div ref={ref} className={cn(\"rdrp-footer\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nFooter.displayName = \"Footer\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Footer.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Grid.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport { formatBasic } from \"react-date-range-picker-headless\";\nimport { Day } from \"./Day\";\n\nexport interface GridProps {\n  className?: string;\n  weekdayClassName?: string;\n  weekdaysClassName?: string;\n  weekClassName?: string;\n  gridClassName?: string;\n  children?: (props: { date: Date; calendarIndex: number }) => ReactNode;\n  calendarIndex?: number;\n  cn?: (...args: unknown[]) => string;\n  // Fallback for simple usage without custom day renderer\n  dayClassName?: string;\n  dayTodayClassName?: string;\n  daySelectedClassName?: string;\n  dayDisabledClassName?: string;\n  dayOutsideClassName?: string;\n  dayHighlightedClassName?: string;\n  dayInRangeClassName?: string;\n  dayRangeStartClassName?: string;\n  dayRangeEndClassName?: string;\n  dayRangeSingleClassName?: string;\n  dayHoverRangeClassName?: string;\n  dayHoverTargetClassName?: string;\n  dayFocusedClassName?: string;\n  dayEmptyClassName?: string;\n}\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    {\n      className,\n      weekdayClassName,\n      weekdaysClassName,\n      weekClassName,\n      gridClassName,\n      children,\n      calendarIndex = 0,\n      cn: cnFn,\n      ...dayClasses\n    },\n    ref,\n  ) => {\n    const { calendars, locale } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    const cal = calendars[calendarIndex];\n    if (!cal) return null;\n\n    return (\n      <div ref={ref} className={cn(\"rdrp-grid-panel\", className)}>\n        <div className={cn(\"rdrp-weekdays\", weekdaysClassName)} role=\"row\">\n          {locale.weekdays.map((wd) => (\n            <div key={wd} className={cn(\"rdrp-weekday\", weekdayClassName)} role=\"columnheader\">\n              {wd}\n            </div>\n          ))}\n        </div>\n        <div className={cn(\"rdrp-grid\", gridClassName)} role=\"grid\">\n          {cal.weeks.map((week, wIdx) => (\n            <div key={wIdx} className={cn(\"rdrp-week\", weekClassName)} role=\"row\">\n              {week.map((date, dIdx) => {\n                if (!date) {\n                  return (\n                    <div\n                      key={`empty-${wIdx}-${dIdx}`}\n                      className={cn(\"rdrp-day-empty\", dayClasses.dayEmptyClassName)}\n                    />\n                  );\n                }\n                const key = formatBasic(date, \"YYYY-MM-DD\");\n\n                if (typeof children === \"function\") {\n                  return <span key={key}>{children({ date, calendarIndex })}</span>;\n                }\n\n                return (\n                  <Day\n                    key={key}\n                    date={date}\n                    calendarIndex={calendarIndex}\n                    cn={cnFn}\n                    className={dayClasses.dayClassName}\n                    todayClassName={dayClasses.dayTodayClassName}\n                    selectedClassName={dayClasses.daySelectedClassName}\n                    disabledClassName={dayClasses.dayDisabledClassName}\n                    outsideClassName={dayClasses.dayOutsideClassName}\n                    highlightedClassName={dayClasses.dayHighlightedClassName}\n                    inRangeClassName={dayClasses.dayInRangeClassName}\n                    rangeStartClassName={dayClasses.dayRangeStartClassName}\n                    rangeEndClassName={dayClasses.dayRangeEndClassName}\n                    rangeSingleClassName={dayClasses.dayRangeSingleClassName}\n                    hoverRangeClassName={dayClasses.dayHoverRangeClassName}\n                    hoverTargetClassName={dayClasses.dayHoverTargetClassName}\n                    focusedClassName={dayClasses.dayFocusedClassName}\n                    emptyClassName={dayClasses.dayEmptyClassName}\n                  />\n                );\n              })}\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  },\n);\nGrid.displayName = \"Grid\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Grid.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Header.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\n\nexport interface HeaderProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Header = forwardRef<HTMLDivElement, HeaderProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <div ref={ref} className={cn(\"rdrp-header\", className)}>\n        {children}\n      </div>\n    );\n  },\n);\nHeader.displayName = \"Header\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Header.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/NextButton.tsx",
      "content": "import { forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport type { NavButtonProps } from \"./PrevButton\";\n\nexport const NextButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { handleNextMonth, locale } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-header-nav-button\", className)}\n        onClick={handleNextMonth}\n        aria-label={locale.nextMonthLabel}\n      >\n        {children || locale.nextMonth}\n      </button>\n    );\n  },\n);\nNextButton.displayName = \"NextButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/NextButton.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/PrevButton.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface NavButtonProps {\n  className?: string;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const PrevButton = forwardRef<HTMLButtonElement, NavButtonProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { handlePrevMonth, locale } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-header-nav-button\", className)}\n        onClick={handlePrevMonth}\n        aria-label={locale.prevMonthLabel}\n      >\n        {children || locale.prevMonth}\n      </button>\n    );\n  },\n);\nPrevButton.displayName = \"PrevButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/PrevButton.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/TimePanel.tsx",
      "content": "import { forwardRef, useEffect } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport { useTimePicker } from \"react-date-range-picker-headless\";\n\nexport interface TimePanelProps {\n  target?: \"start\" | \"end\" | \"single\";\n  className?: string;\n  highlightClassName?: string;\n  columnsClassName?: string;\n  columnClassName?: string;\n  itemClassName?: string;\n  itemActiveClassName?: string;\n  paddingClassName?: string;\n  colonClassName?: string;\n  periodButtonClassName?: string;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const TimePanel = forwardRef<HTMLDivElement, TimePanelProps>(\n  (\n    {\n      target = \"single\",\n      className,\n      highlightClassName,\n      columnsClassName,\n      columnClassName,\n      itemClassName,\n      itemActiveClassName,\n      paddingClassName,\n      colonClassName,\n      periodButtonClassName,\n      cn: cnFn,\n    },\n    ref,\n  ) => {\n    const context = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    let config = context.resolvedTimeConfig;\n    if (!config) config = {} as Required<import(\"react-date-range-picker-headless\").TimeConfig>; // Not a time picker\n\n    let hour, minute, second, period, onHour, onMinute, onSecond, onPeriod;\n\n    if (target === \"single\") {\n      hour = context.tempHour ?? 0;\n      minute = context.tempMinute ?? 0;\n      second = context.tempSecond ?? 0;\n      period = context.tempPeriod ?? \"AM\";\n      onHour = context.handleHourChange!;\n      onMinute = context.handleMinuteChange!;\n      onSecond = context.handleSecondChange!;\n      onPeriod = context.handlePeriodChange!;\n    } else if (target === \"start\") {\n      hour = context.startHour ?? 0;\n      minute = context.startMinute ?? 0;\n      second = context.startSecond ?? 0;\n      period = context.startPeriod ?? \"AM\";\n      onHour = context.handleStartHourChange!;\n      onMinute = context.handleStartMinuteChange!;\n      onSecond = context.handleStartSecondChange!;\n      onPeriod = context.handleStartPeriodChange!;\n    } else {\n      hour = context.endHour ?? 0;\n      minute = context.endMinute ?? 0;\n      second = context.endSecond ?? 0;\n      period = context.endPeriod ?? \"AM\";\n      onHour = context.handleEndHourChange!;\n      onMinute = context.handleEndMinuteChange!;\n      onSecond = context.handleEndSecondChange!;\n      onPeriod = context.handleEndPeriodChange!;\n    }\n\n    const tp = useTimePicker({\n      hour,\n      minute,\n      second,\n      period,\n      onHourChange: onHour,\n      onMinuteChange: onMinute,\n      onSecondChange: onSecond,\n      onPeriodChange: onPeriod,\n      precision: config?.precision,\n      hourFormat: config?.hourFormat,\n      minuteStep: config?.minuteStep,\n      secondStep: config?.secondStep,\n      itemHeight: config?.itemHeight,\n    });\n\n    // Auto scroll when panel appears\n    useEffect(() => {\n      tp.scrollToValues();\n    }, [tp.scrollToValues]);\n\n    return (\n      <div ref={ref} className={cn(\"rdrp-time-panel\", className)}>\n        <div className={cn(\"rdrp-time-highlight\", highlightClassName)} />\n        <div className={cn(\"rdrp-time-columns\", columnsClassName)}>\n          <div\n            ref={tp.hourListRef}\n            className={cn(\"rdrp-time-column\", columnClassName)}\n            onScroll={tp.handleHourScroll}\n            tabIndex={0}\n            role=\"listbox\"\n            aria-label={context.locale.hourLabel}\n            aria-orientation=\"vertical\"\n          >\n            {tp.hours.map((val, i) => (\n              <div\n                key={`hour-${val}-${i}`}\n                role={val !== -1 ? \"option\" : \"presentation\"}\n                tabIndex={val !== -1 ? 0 : -1}\n                aria-selected={val !== -1 ? i === tp.hourIndex : undefined}\n                className={cn(\n                  val === -1 ? \"rdrp-time-padding\" : \"rdrp-time-item\",\n                  val === -1 ? paddingClassName : itemClassName,\n                  i === tp.hourIndex && val !== -1 && \"rdrp-time-item-active\",\n                  i === tp.hourIndex && val !== -1 && itemActiveClassName,\n                )}\n                onClick={() => {\n                  if (val !== -1) tp.handleHourClick(val);\n                }}\n                onKeyDown={(e) => {\n                  if (val !== -1 && (e.key === \"Enter\" || e.key === \" \")) {\n                    e.preventDefault();\n                    tp.handleHourClick(val);\n                  }\n                }}\n              >\n                {val !== -1 ? val.toString().padStart(2, \"0\") : \"\"}\n              </div>\n            ))}\n          </div>\n\n          {tp.showMinutes && (\n            <>\n              <div className={cn(\"rdrp-time-colon\", colonClassName)}>:</div>\n              <div\n                ref={tp.minuteListRef}\n                className={cn(\"rdrp-time-column\", columnClassName)}\n                onScroll={tp.handleMinuteScroll}\n                tabIndex={0}\n                role=\"listbox\"\n                aria-label={context.locale.minuteLabel}\n                aria-orientation=\"vertical\"\n              >\n                {tp.minutes.map((val, i) => (\n                  <div\n                    key={`min-${val}-${i}`}\n                    role={val !== -1 ? \"option\" : \"presentation\"}\n                    tabIndex={val !== -1 ? 0 : -1}\n                    aria-selected={val !== -1 ? i === tp.minuteIndex : undefined}\n                    className={cn(\n                      val === -1 ? \"rdrp-time-padding\" : \"rdrp-time-item\",\n                      val === -1 ? paddingClassName : itemClassName,\n                      i === tp.minuteIndex && val !== -1 && \"rdrp-time-item-active\",\n                      i === tp.minuteIndex && val !== -1 && itemActiveClassName,\n                    )}\n                    onClick={() => {\n                      if (val !== -1) tp.handleMinuteClick(val);\n                    }}\n                    onKeyDown={(e) => {\n                      if (val !== -1 && (e.key === \"Enter\" || e.key === \" \")) {\n                        e.preventDefault();\n                        tp.handleMinuteClick(val);\n                      }\n                    }}\n                  >\n                    {val !== -1 ? val.toString().padStart(2, \"0\") : \"\"}\n                  </div>\n                ))}\n              </div>\n            </>\n          )}\n\n          {tp.showSeconds && (\n            <>\n              <div className={cn(\"rdrp-time-colon\", colonClassName)}>:</div>\n              <div\n                ref={tp.secondListRef}\n                className={cn(\"rdrp-time-column\", columnClassName)}\n                onScroll={tp.handleSecondScroll}\n                tabIndex={0}\n                role=\"listbox\"\n                aria-label={context.locale.secondLabel}\n                aria-orientation=\"vertical\"\n              >\n                {tp.seconds.map((val, i) => (\n                  <div\n                    key={`sec-${val}-${i}`}\n                    role={val !== -1 ? \"option\" : \"presentation\"}\n                    tabIndex={val !== -1 ? 0 : -1}\n                    aria-selected={val !== -1 ? i === tp.secondIndex : undefined}\n                    className={cn(\n                      val === -1 ? \"rdrp-time-padding\" : \"rdrp-time-item\",\n                      val === -1 ? paddingClassName : itemClassName,\n                      i === tp.secondIndex && val !== -1 && \"rdrp-time-item-active\",\n                      i === tp.secondIndex && val !== -1 && itemActiveClassName,\n                    )}\n                    onClick={() => {\n                      if (val !== -1) tp.handleSecondClick(val);\n                    }}\n                    onKeyDown={(e) => {\n                      if (val !== -1 && (e.key === \"Enter\" || e.key === \" \")) {\n                        e.preventDefault();\n                        tp.handleSecondClick(val);\n                      }\n                    }}\n                  >\n                    {val !== -1 ? val.toString().padStart(2, \"0\") : \"\"}\n                  </div>\n                ))}\n              </div>\n            </>\n          )}\n\n          {tp.is12Hour && (\n            <button\n              type=\"button\"\n              className={cn(\"rdrp-time-period-button\", periodButtonClassName)}\n              aria-label={`${tp.period === \"AM\" ? context.locale.am : context.locale.pm}, toggle AM/PM`}\n              onClick={tp.handlePeriodToggle}\n            >\n              {tp.period === \"AM\" ? context.locale.am : context.locale.pm}\n            </button>\n          )}\n        </div>\n      </div>\n    );\n  },\n);\nTimePanel.displayName = \"TimePanel\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/TimePanel.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Title.tsx",
      "content": "import { type ReactNode, forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\n\nexport interface TitleProps {\n  className?: string;\n  selectClassName?: string;\n  calendarIndex?: number;\n  children?: ReactNode;\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Title = forwardRef<HTMLDivElement, TitleProps>(\n  ({ className, selectClassName, calendarIndex = 0, children, cn: cnFn }, ref) => {\n    const { calendars, locale, captionLayout, years, months, handleYearSelect, handleMonthSelect } =\n      usePickerContext();\n\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n    const monthObj = calendars[calendarIndex]?.month;\n    if (!monthObj) return null;\n\n    if (captionLayout === \"dropdown\") {\n      return (\n        <div ref={ref} className={cn(\"rdrp-header-title\", className)}>\n          <select\n            className={cn(\"rdrp-header-select\", selectClassName)}\n            value={monthObj.getMonth()}\n            onChange={(e) => handleMonthSelect(Number(e.target.value), calendarIndex)}\n            aria-label={locale.selectMonthLabel}\n          >\n            {months.map((m) => (\n              <option key={m} value={m}>\n                {locale.months[m]}\n              </option>\n            ))}\n          </select>\n          <select\n            className={cn(\"rdrp-header-select\", selectClassName)}\n            value={monthObj.getFullYear()}\n            onChange={(e) => handleYearSelect(Number(e.target.value), calendarIndex)}\n            aria-label={locale.selectYearLabel}\n          >\n            {years.map((y) => (\n              <option key={y} value={y}>\n                {y}\n              </option>\n            ))}\n          </select>\n        </div>\n      );\n    }\n\n    return (\n      <div ref={ref} className={cn(\"rdrp-header-title\", className)}>\n        {children || locale.formatMonthYear(monthObj)}\n      </div>\n    );\n  },\n);\nTitle.displayName = \"Title\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Title.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/TodayButton.tsx",
      "content": "import { forwardRef } from \"react\";\nimport { usePickerContext } from \"react-date-range-picker-headless\";\nimport type { ActionButtonProps } from \"./ClearButton\";\n\nexport const TodayButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  ({ className, children, cn: cnFn }, ref) => {\n    const { handleGoToToday, locale } = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-footer-button\", className)}\n        onClick={handleGoToToday}\n      >\n        {children || locale.today}\n      </button>\n    );\n  },\n);\nTodayButton.displayName = \"TodayButton\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/TodayButton.tsx"
    },
    {
      "path": "registry/ui-primitives/shared/Trigger.tsx",
      "content": "import { type ReactNode, forwardRef, type MutableRefObject } from \"react\";\nimport { usePickerContext, type Locale } from \"react-date-range-picker-headless\";\n\nexport interface TriggerRenderProps {\n  displayValue: string;\n  placeholder: string;\n  hasValue: boolean;\n  isOpen: boolean;\n  onToggle: () => void;\n  onClear: () => void;\n  locale: Locale;\n  triggerRef: (node: HTMLElement | null) => void;\n}\n\nexport interface TriggerProps {\n  className?: string;\n  placeholderClassName?: string;\n  clearClassName?: string;\n  placeholder?: string;\n  children?: ReactNode | ((props: TriggerRenderProps) => ReactNode);\n  cn?: (...args: unknown[]) => string;\n}\n\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(\n  ({ className, placeholderClassName, clearClassName, placeholder, children, cn: cnFn }, ref) => {\n    const context = usePickerContext();\n    const cn = cnFn ?? ((...args: unknown[]) => args.filter(Boolean).join(\" \"));\n\n    const handleClearClick = (e: React.MouseEvent) => {\n      e.stopPropagation();\n      context.handleClear();\n    };\n\n    const handleClearKeyDown = (e: React.KeyboardEvent) => {\n      if (e.key === \"Enter\" || e.key === \" \") {\n        e.preventDefault();\n        e.stopPropagation();\n        context.handleClear();\n      }\n    };\n\n    if (typeof children === \"function\") {\n      return (\n        <>\n          {children({\n            displayValue: context.displayValue,\n            placeholder: placeholder || context.placeholder || context.locale.placeholder,\n            hasValue: context.hasValue,\n            isOpen: context.isOpen,\n            onToggle: context.handleToggle,\n            onClear: context.handleClear,\n            locale: context.locale,\n            triggerRef: (node) => {\n              if (typeof ref === \"function\") ref(node as unknown as HTMLButtonElement);\n              else if (ref && \"current\" in ref)\n                (ref as MutableRefObject<HTMLElement | null>).current = node;\n            },\n          })}\n        </>\n      );\n    }\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\"rdrp-trigger\", className)}\n        onClick={context.handleToggle}\n        aria-expanded={context.isOpen}\n        aria-haspopup=\"dialog\"\n        data-slot=\"trigger\"\n      >\n        <span\n          className={\n            context.displayValue ? undefined : cn(\"rdrp-trigger-placeholder\", placeholderClassName)\n          }\n        >\n          {context.displayValue || placeholder || context.placeholder || context.locale.placeholder}\n        </span>\n        {context.hasValue && !context.required && (\n          <span\n            role=\"button\"\n            tabIndex={0}\n            className={cn(\"rdrp-trigger-clear\", clearClassName)}\n            aria-label={context.locale.clear}\n            onClick={handleClearClick}\n            onKeyDown={handleClearKeyDown}\n          >\n            ×\n          </span>\n        )}\n      </button>\n    );\n  },\n);\nTrigger.displayName = \"Trigger\";\n",
      "type": "registry:component",
      "target": "components/date-range-picker/ui-primitives/shared/Trigger.tsx"
    },
    {
      "path": "registry/utils.ts",
      "content": "import { clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/** Merge class names with Tailwind conflict resolution. */\nexport function cn(...args: unknown[]): string {\n  return twMerge(clsx(args));\n}\n\nimport type { DatePickerSize } from \"react-date-range-picker-headless\";\n\n/** Return the size modifier class. Uses data-slot attributes set by ui-primitives. */\nexport function sizeClass(size: DatePickerSize = \"medium\"): string {\n  const sizeMap: Record<DatePickerSize, string> = {\n    small:\n      \"text-[11px] [&_[data-slot=day]]:w-7 [&_[data-slot=day]]:h-7 [&_[data-slot=day]]:text-[11px] [&_[data-slot=nav-button]]:w-6 [&_[data-slot=nav-button]]:h-6 [&_[data-slot=trigger]]:min-w-[160px] [&_[data-slot=trigger]]:px-2.5 [&_[data-slot=trigger]]:py-1.5 [&_[data-slot=time-item]]:text-[11px] [&_[data-slot=time-item]]:h-7 [&_[data-slot=time-panel]]:w-[100px] [&_[data-slot=time-panel]]:h-[148px]\",\n    medium:\n      \"text-[13px] [&_[data-slot=day]]:w-9 [&_[data-slot=day]]:h-9 [&_[data-slot=day]]:text-[13px] [&_[data-slot=nav-button]]:w-7 [&_[data-slot=nav-button]]:h-7 [&_[data-slot=trigger]]:min-w-[200px] [&_[data-slot=trigger]]:px-3.5 [&_[data-slot=trigger]]:py-2 [&_[data-slot=time-item]]:text-[14px] [&_[data-slot=time-item]]:h-8 [&_[data-slot=time-panel]]:w-[120px] [&_[data-slot=time-panel]]:h-[176px]\",\n    large:\n      \"text-[14px] [&_[data-slot=day]]:w-11 [&_[data-slot=day]]:h-11 [&_[data-slot=day]]:text-[14px] [&_[data-slot=nav-button]]:w-8 [&_[data-slot=nav-button]]:h-8 [&_[data-slot=trigger]]:min-w-[240px] [&_[data-slot=trigger]]:px-4 [&_[data-slot=trigger]]:py-2.5 [&_[data-slot=time-item]]:text-[15px] [&_[data-slot=time-item]]:h-9 [&_[data-slot=time-panel]]:w-[140px] [&_[data-slot=time-panel]]:h-[196px]\",\n    \"x-large\":\n      \"text-[15px] [&_[data-slot=day]]:w-[52px] [&_[data-slot=day]]:h-[52px] [&_[data-slot=day]]:text-[15px] [&_[data-slot=nav-button]]:w-9 [&_[data-slot=nav-button]]:h-9 [&_[data-slot=trigger]]:min-w-[280px] [&_[data-slot=trigger]]:px-5 [&_[data-slot=trigger]]:py-3 [&_[data-slot=time-item]]:text-[16px] [&_[data-slot=time-item]]:h-10 [&_[data-slot=time-panel]]:w-[160px] [&_[data-slot=time-panel]]:h-[216px]\",\n  };\n  return sizeMap[size] || sizeMap[\"medium\"];\n}\n",
      "type": "registry:component",
      "target": "components/date-range-picker/utils.ts"
    },
    {
      "path": "registry/utils/mergeRefs.ts",
      "content": "import type { MutableRefObject, Ref } from \"react\";\n\n/** Merge multiple refs (callback or object) into a single callback ref. */\nexport function mergeRefs<T>(...refs: (Ref<T> | undefined)[]) {\n  return (node: T | null) => {\n    const cleanups: (() => void)[] = [];\n    refs.forEach((ref) => {\n      if (typeof ref === \"function\") {\n        const cleanup = ref(node);\n        if (typeof cleanup === \"function\") {\n          cleanups.push(cleanup);\n        }\n      } else if (ref) {\n        (ref as MutableRefObject<T | null>).current = node;\n      }\n    });\n    if (cleanups.length > 0) {\n      return () => cleanups.forEach((fn) => fn());\n    }\n  };\n}\n",
      "type": "registry:component",
      "target": "components/date-range-picker/utils/mergeRefs.ts"
    }
  ],
  "type": "registry:component"
}