@devalok/shilp-sutra 0.56.0 → 0.59.0

package/dist/composed/date-picker/index.js

@@ -78,7 +78,7 @@ var k = [
 						tabIndex: o === f ? 0 : -1,
 						disabled: l || !1,
 						onClick: () => !l && r(o),
-						className: e("h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", l && "opacity-action-disabled pointer-events-none cursor-not-allowed", s && "bg-accent-9 text-accent-fg", !s && !l && "hover:bg-surface-raised-hover text-surface-fg"),
+						className: e("h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", l && "opacity-action-disabled pointer-events-none cursor-not-allowed", s && "bg-accent-9 text-accent-fg", !s && !l && "hover:bg-surface-panel-hover text-surface-fg"),
 						children: i
 					}, i);
 				})
@@ -154,7 +154,7 @@ var j = s.forwardRef(function({ currentYear: t, selectedYear: n, onYearSelect: r
 						tabIndex: i === m ? 0 : -1,
 						disabled: o || !1,
 						onClick: () => !o && r(t),
-						className: e("h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", o && "opacity-action-disabled pointer-events-none cursor-not-allowed", a && "bg-accent-9 text-accent-fg", !a && !o && "hover:bg-surface-raised-hover text-surface-fg"),
+						className: e("h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", o && "opacity-action-disabled pointer-events-none cursor-not-allowed", a && "bg-accent-9 text-accent-fg", !a && !o && "hover:bg-surface-panel-hover text-surface-fg"),
 						children: t
 					}, t);
 				})
@@ -216,7 +216,7 @@ var M = s.forwardRef(function({ value: o, onChange: u, placeholder: f = "Pick a
 				type: "button",
 				"aria-label": o ? `Change date, ${g(o, m)}` : f,
 				...y,
-				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", p),
+				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-interactive-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", p),
 				children: [/* @__PURE__ */ c(t, {
 					icon: d,
 					size: "sm",
@@ -322,7 +322,7 @@ var N = {
 					let { start: e, end: t } = r.getRange();
 					n(e, t);
 				},
-				className: e("h-ds-sm w-full rounded-control px-ds-03 text-left text-body-sm", "text-surface-fg transition-colors", "hover:bg-surface-raised-hover", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9"),
+				className: e("h-ds-sm w-full rounded-control px-ds-03 text-left text-body-sm", "text-surface-fg transition-colors", "hover:bg-surface-panel-hover", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9"),
 				children: r.label
 			}, t) : null;
 		})
@@ -418,7 +418,7 @@ var F = s.forwardRef(function({ startDate: o, endDate: u, onChange: f, placehold
 				type: "button",
 				"aria-label": I && R ? `Change date range, ${X()}` : m,
 				...D,
-				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", h),
+				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-interactive-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", h),
 				children: [/* @__PURE__ */ c(t, {
 					icon: d,
 					size: "sm",
@@ -509,7 +509,7 @@ var R = s.forwardRef(function({ value: o, onChange: d, minDate: f, maxDate: p, d
 				maxDate: p
 			});
 		}
-	}, Q = "h-ds-sm rounded-control border border-surface-border-strong bg-surface-overlay px-ds-02 text-body-md text-surface-fg transition-colors duration-fast-01 ease-productive-standard hover:border-surface-border-strong focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 cursor-pointer appearance-none";
+	}, Q = "h-ds-sm rounded-control border border-surface-border-interactive bg-surface-panel-hover px-ds-02 text-body-md text-surface-fg transition-colors duration-fast-01 ease-productive-standard hover:border-surface-border-interactive-strong focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 cursor-pointer appearance-none";
 	return /* @__PURE__ */ l(n, {
 		open: E,
 		onOpenChange: D,
@@ -519,7 +519,7 @@ var R = s.forwardRef(function({ value: o, onChange: d, minDate: f, maxDate: p, d
 				ref: T,
 				type: "button",
 				...w,
-				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", S),
+				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-interactive-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", S),
 				"aria-label": X ? `Selected: ${X}` : v,
 				children: [/* @__PURE__ */ c(t, {
 					icon: u,
@@ -638,7 +638,7 @@ var V = s.forwardRef(function({ value: a, onChange: o, format: u = "12h", minute
 		a,
 		u,
 		m
-	]), H = u === "12h" ? A : E, U = "flex flex-col gap-ds-01 overflow-y-auto max-h-[200px] px-ds-01", W = "flex h-ds-sm w-full items-center justify-center rounded-control text-body-md transition-colors duration-fast-01 ease-productive-standard cursor-pointer", G = "bg-accent-9 text-accent-fg", K = "text-surface-fg hover:bg-surface-raised-hover";
+	]), H = u === "12h" ? A : E, U = "flex flex-col gap-ds-01 overflow-y-auto max-h-[200px] px-ds-01", W = "flex h-ds-sm w-full items-center justify-center rounded-control text-body-md transition-colors duration-fast-01 ease-productive-standard cursor-pointer", G = "bg-accent-9 text-accent-fg", K = "text-surface-fg hover:bg-surface-panel-hover";
 	return /* @__PURE__ */ l(n, {
 		open: w,
 		onOpenChange: T,
@@ -649,7 +649,7 @@ var V = s.forwardRef(function({ value: a, onChange: o, format: u = "12h", minute
 				type: "button",
 				disabled: v,
 				...x,
-				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", v && "opacity-action-disabled pointer-events-none", _),
+				className: e("inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard", "hover:border-surface-border-interactive-strong", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", v && "opacity-action-disabled pointer-events-none", _),
 				"aria-label": V ? `Selected time: ${V}` : h,
 				children: [/* @__PURE__ */ c(t, {
 					icon: f,

package/dist/composed/date-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/composed/date-picker/month-picker.tsx","../../../src/composed/date-picker/year-picker.tsx","../../../src/composed/date-picker/date-picker.tsx","../../../src/composed/date-picker/presets.tsx","../../../src/composed/date-picker/date-range-picker.tsx","../../../src/composed/date-picker/date-time-picker.tsx","../../../src/composed/date-picker/time-picker.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\n\nimport { cn } from '../../ui/lib/utils'\n\nconst MONTHS = [\n  'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',\n  'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec',\n]\n\nexport interface MonthPickerProps extends React.ComponentPropsWithoutRef<'div'> {\n  currentYear: number\n  selectedMonth?: number // 0-11\n  onMonthSelect: (month: number) => void\n  minDate?: Date\n  maxDate?: Date\n}\n\nexport const MonthPicker = React.forwardRef<HTMLDivElement, MonthPickerProps>(\n  function MonthPicker({\n  currentYear,\n  selectedMonth,\n  onMonthSelect,\n  minDate,\n  maxDate,\n  className,\n  ...props\n}, ref) {\n  const COLS = 4\n  const [focusedIndex, setFocusedIndex] = React.useState(selectedMonth ?? 0)\n  const buttonRefs = React.useRef<(HTMLButtonElement | null)[]>([])\n\n  const isMonthDisabled = (index: number) =>\n    (minDate != null &&\n      (currentYear < minDate.getFullYear() ||\n        (currentYear === minDate.getFullYear() && index < minDate.getMonth()))) ||\n    (maxDate != null &&\n      (currentYear > maxDate.getFullYear() ||\n        (currentYear === maxDate.getFullYear() && index > maxDate.getMonth())))\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    let next = focusedIndex\n    switch (e.key) {\n      case 'ArrowRight': next = Math.min(11, focusedIndex + 1); break\n      case 'ArrowLeft': next = Math.max(0, focusedIndex - 1); break\n      case 'ArrowDown': next = Math.min(11, focusedIndex + COLS); break\n      case 'ArrowUp': next = Math.max(0, focusedIndex - COLS); break\n      case 'Home': next = 0; break\n      case 'End': next = 11; break\n      default: return\n    }\n    e.preventDefault()\n    // Skip disabled months\n    while (next !== focusedIndex && isMonthDisabled(next)) {\n      next += (e.key === 'ArrowLeft' || e.key === 'ArrowUp') ? -1 : 1\n      if (next < 0 || next > 11) return\n    }\n    setFocusedIndex(next)\n    buttonRefs.current[next]?.focus()\n  }\n\n  return (\n    <div ref={ref} {...props} className={cn(\"w-[252px]\", className)}>\n      <div className=\"text-center pb-ds-04 text-body-md font-semibold text-surface-fg\">\n        {currentYear}\n      </div>\n      <div role=\"grid\" aria-label=\"Month picker\" tabIndex={-1} onKeyDown={handleKeyDown}>\n        {[0, 1, 2].map((rowIdx) => (\n          <div key={rowIdx} role=\"row\" className=\"grid grid-cols-4 gap-ds-02 mb-ds-02 last:mb-0\">\n            {MONTHS.slice(rowIdx * COLS, rowIdx * COLS + COLS).map((label, colIdx) => {\n              const index = rowIdx * COLS + colIdx\n              const isSelected = index === selectedMonth\n              const isDisabled = isMonthDisabled(index)\n\n              return (\n                <button\n                  key={label}\n                  ref={(el) => { buttonRefs.current[index] = el }}\n                  type=\"button\"\n                  role=\"gridcell\"\n                  tabIndex={index === focusedIndex ? 0 : -1}\n                  disabled={isDisabled || false}\n                  onClick={() => !isDisabled && onMonthSelect(index)}\n                  className={cn(\n                    'h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n                    isDisabled && 'opacity-action-disabled pointer-events-none cursor-not-allowed',\n                    isSelected &&\n                      'bg-accent-9 text-accent-fg',\n                    !isSelected &&\n                      !isDisabled &&\n                      'hover:bg-surface-raised-hover text-surface-fg',\n                  )}\n                >\n                  {label}\n                </button>\n              )\n            })}\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n},\n)\n\nMonthPicker.displayName = 'MonthPicker'\n","'use client'\n\nimport * as React from 'react'\n\nimport { cn } from '../../ui/lib/utils'\n\nexport interface YearPickerProps extends React.ComponentPropsWithoutRef<'div'> {\n  currentYear: number\n  selectedYear?: number\n  onYearSelect: (year: number) => void\n  minDate?: Date\n  maxDate?: Date\n}\n\nexport const YearPicker = React.forwardRef<HTMLDivElement, YearPickerProps>(\n  function YearPicker({\n  currentYear,\n  selectedYear,\n  onYearSelect,\n  minDate,\n  maxDate,\n  className,\n  ...props\n}, ref) {\n  const COLS = 3\n  const startYear = Math.floor(currentYear / 10) * 10\n  const years = Array.from({ length: 12 }, (_, i) => startYear + i)\n  const [focusedIndex, setFocusedIndex] = React.useState(() => {\n    const sel = years.indexOf(selectedYear ?? currentYear)\n    return sel >= 0 ? sel : 0\n  })\n  const buttonRefs = React.useRef<(HTMLButtonElement | null)[]>([])\n\n  const isYearDisabled = (year: number) =>\n    (minDate != null && year < minDate.getFullYear()) ||\n    (maxDate != null && year > maxDate.getFullYear())\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    let next = focusedIndex\n    switch (e.key) {\n      case 'ArrowRight': next = Math.min(11, focusedIndex + 1); break\n      case 'ArrowLeft': next = Math.max(0, focusedIndex - 1); break\n      case 'ArrowDown': next = Math.min(11, focusedIndex + COLS); break\n      case 'ArrowUp': next = Math.max(0, focusedIndex - COLS); break\n      case 'Home': next = 0; break\n      case 'End': next = 11; break\n      default: return\n    }\n    e.preventDefault()\n    while (next !== focusedIndex && isYearDisabled(years[next])) {\n      next += (e.key === 'ArrowLeft' || e.key === 'ArrowUp') ? -1 : 1\n      if (next < 0 || next > 11) return\n    }\n    setFocusedIndex(next)\n    buttonRefs.current[next]?.focus()\n  }\n\n  return (\n    <div ref={ref} {...props} className={cn(\"w-[252px]\", className)}>\n      <div className=\"text-center pb-ds-04 text-body-md font-semibold text-surface-fg\">\n        {startYear} &ndash; {startYear + 11}\n      </div>\n      <div role=\"grid\" aria-label=\"Year picker\" tabIndex={-1} onKeyDown={handleKeyDown}>\n        {[0, 1, 2, 3].map((rowIdx) => (\n          <div key={rowIdx} role=\"row\" className=\"grid grid-cols-3 gap-ds-02 mb-ds-02 last:mb-0\">\n            {years.slice(rowIdx * COLS, rowIdx * COLS + COLS).map((year) => {\n              const index = years.indexOf(year)\n              const isSelected = year === selectedYear\n              const isDisabled = isYearDisabled(year)\n\n              return (\n                <button\n                  key={year}\n                  ref={(el) => { buttonRefs.current[index] = el }}\n                  type=\"button\"\n                  role=\"gridcell\"\n                  tabIndex={index === focusedIndex ? 0 : -1}\n                  disabled={isDisabled || false}\n                  onClick={() => !isDisabled && onYearSelect(year)}\n                  className={cn(\n                    'h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n                    isDisabled && 'opacity-action-disabled pointer-events-none cursor-not-allowed',\n                    isSelected &&\n                      'bg-accent-9 text-accent-fg',\n                    !isSelected &&\n                      !isDisabled &&\n                      'hover:bg-surface-raised-hover text-surface-fg',\n                  )}\n                >\n                  {year}\n                </button>\n              )\n            })}\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n},\n)\n\nYearPicker.displayName = 'YearPicker'\n","'use client'\n\nimport { IconCalendarEvent } from '@tabler/icons-react'\nimport { format, setMonth, setYear } from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\nimport { CalendarGrid } from './calendar-grid'\nimport { MonthPicker } from './month-picker'\nimport { YearPicker } from './year-picker'\n\ntype CalendarView = 'days' | 'months' | 'years'\n\n/**\n * A popover-based date picker with day/month/year drill-down views.\n * Supports min/max date constraints and arbitrary date disabling.\n */\nexport interface DatePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {\n  /** Currently selected date (controlled). */\n  value?: Date | null\n  /** Called when a date is selected. Receives null if cleared. */\n  onChange?: (date: Date | null) => void\n  placeholder?: string\n  /** date-fns format string for the trigger display. @default 'MMM d, yyyy' */\n  formatStr?: string\n  /** Earliest selectable date. */\n  minDate?: Date\n  /** Latest selectable date. */\n  maxDate?: Date\n  /** Predicate to disable specific dates (return true to disable). */\n  disabledDates?: (date: Date) => boolean\n  className?: string\n}\n\nconst DatePicker = React.forwardRef<HTMLButtonElement, DatePickerProps>(\n  function DatePicker(\n    {\n      value,\n      onChange,\n      placeholder = 'Pick a date',\n      className,\n      formatStr = 'MMM d, yyyy',\n      minDate,\n      maxDate,\n      disabledDates,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n  const [currentMonth, setCurrentMonth] = React.useState(\n    value ?? new Date(),\n  )\n  const [view, setView] = React.useState<CalendarView>('days')\n\n  // Reset view when popover closes\n  React.useEffect(() => {\n    if (!open) setView('days')\n  }, [open])\n\n  const handleSelect = (date: Date) => {\n    onChange?.(date)\n    setOpen(false)\n  }\n\n  const handleHeaderClick = () => {\n    setView((prev) => (prev === 'days' ? 'months' : 'years'))\n  }\n\n  const handleMonthSelect = (month: number) => {\n    setCurrentMonth((prev) => setMonth(prev, month))\n    setView('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setCurrentMonth((prev) => setYear(prev, year))\n    setView('months')\n  }\n\n  const renderView = () => {\n    switch (view) {\n      case 'years':\n        return (\n          <YearPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedYear={value?.getFullYear()}\n            onYearSelect={handleYearSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      case 'months':\n        return (\n          <MonthPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedMonth={value?.getMonth()}\n            onMonthSelect={handleMonthSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      default:\n        return (\n          <CalendarGrid\n            currentMonth={currentMonth}\n            selected={value}\n            onSelect={handleSelect}\n            onMonthChange={setCurrentMonth}\n            onHeaderClick={handleHeaderClick}\n            disabledDates={disabledDates}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n    }\n  }\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          aria-label={value ? `Change date, ${format(value, formatStr)}` : placeholder}\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            className,\n          )}\n        >\n          <Icon icon={IconCalendarEvent} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              value\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {value ? format(value, formatStr) : placeholder}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        {renderView()}\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nDatePicker.displayName = 'DatePicker'\n\nexport { DatePicker }\n","'use client'\n\nimport {\n  endOfDay,\n  endOfMonth,\n  startOfDay,\n  startOfMonth,\n  startOfYear,\n  subDays,\n  subMonths,\n} from 'date-fns'\nimport * as React from 'react'\n\nimport { cn } from '../../ui/lib/utils'\n\nexport type PresetKey =\n  | 'today'\n  | 'yesterday'\n  | 'last7days'\n  | 'last30days'\n  | 'thisMonth'\n  | 'lastMonth'\n  | 'thisYear'\n\nexport interface PresetsProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onSelect'> {\n  presets: PresetKey[]\n  onSelect: (start: Date, end: Date) => void\n  className?: string\n}\n\ninterface PresetDefinition {\n  label: string\n  getRange: () => { start: Date; end: Date }\n}\n\nconst PRESET_MAP: Record<PresetKey, PresetDefinition> = {\n  today: {\n    label: 'Today',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfDay(now), end: endOfDay(now) }\n    },\n  },\n  yesterday: {\n    label: 'Yesterday',\n    getRange: () => {\n      const yesterday = subDays(new Date(), 1)\n      return { start: startOfDay(yesterday), end: endOfDay(yesterday) }\n    },\n  },\n  last7days: {\n    label: 'Last 7 days',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfDay(subDays(now, 6)), end: endOfDay(now) }\n    },\n  },\n  last30days: {\n    label: 'Last 30 days',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfDay(subDays(now, 29)), end: endOfDay(now) }\n    },\n  },\n  thisMonth: {\n    label: 'This month',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfMonth(now), end: endOfMonth(now) }\n    },\n  },\n  lastMonth: {\n    label: 'Last month',\n    getRange: () => {\n      const now = new Date()\n      const last = subMonths(now, 1)\n      return { start: startOfMonth(last), end: endOfMonth(last) }\n    },\n  },\n  thisYear: {\n    label: 'This year',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfYear(now), end: endOfDay(now) }\n    },\n  },\n}\n\nexport const Presets = React.forwardRef<HTMLDivElement, PresetsProps>(\n  function Presets({ presets, onSelect, className, ...props }, ref) {\n  return (\n    <div ref={ref} {...props} className={cn('flex flex-col gap-ds-01', className)}>\n      {presets.map((key) => {\n        const preset = PRESET_MAP[key]\n        if (!preset) return null\n        return (\n          <button\n            key={key}\n            type=\"button\"\n            onClick={() => {\n              const { start, end } = preset.getRange()\n              onSelect(start, end)\n            }}\n            className={cn(\n              'h-ds-sm w-full rounded-control px-ds-03 text-left text-body-sm',\n              'text-surface-fg transition-colors',\n              'hover:bg-surface-raised-hover',\n              'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9',\n            )}\n          >\n            {preset.label}\n          </button>\n        )\n      })}\n    </div>\n  )\n},\n)\n\nPresets.displayName = 'Presets'\n","'use client'\n\nimport { IconCalendarEvent } from '@tabler/icons-react'\nimport { addMonths,format, isAfter, isBefore, setMonth, setYear } from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\nimport { CalendarGrid } from './calendar-grid'\nimport { MonthPicker } from './month-picker'\nimport type { PresetKey } from './presets'\nimport { Presets } from './presets'\nimport { YearPicker } from './year-picker'\n\ntype CalendarView = 'days' | 'months' | 'years'\n\nexport interface DateRangePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange'> {\n  startDate?: Date | null\n  endDate?: Date | null\n  onChange?: (range: { start: Date | null; end: Date | null }) => void\n  placeholder?: string\n  className?: string\n  formatStr?: string\n  minDate?: Date\n  maxDate?: Date\n  disabledDates?: (date: Date) => boolean\n  /** Show a presets sidebar with quick date range selections */\n  presets?: PresetKey[]\n  /** Number of calendar months to display side by side (default: 1) */\n  numberOfMonths?: number\n}\n\nconst DateRangePicker = React.forwardRef<HTMLButtonElement, DateRangePickerProps>(\n  function DateRangePicker(\n    {\n      startDate,\n      endDate,\n      onChange,\n      placeholder = 'Pick a date range',\n      className,\n      formatStr = 'MMM d, yyyy',\n      minDate,\n      maxDate,\n      disabledDates,\n      presets,\n      numberOfMonths = 1,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n  const [currentMonth, setCurrentMonth] = React.useState(\n    startDate ?? new Date(),\n  )\n  const [rangeStart, setRangeStart] = React.useState<Date | null>(\n    startDate ?? null,\n  )\n  const [rangeEnd, setRangeEnd] = React.useState<Date | null>(\n    endDate ?? null,\n  )\n  const [hoverDate, setHoverDate] = React.useState<Date | null>(null)\n  const [view, setView] = React.useState<CalendarView>('days')\n\n  const monthCount = Math.max(1, numberOfMonths)\n\n  React.useEffect(() => {\n    setRangeStart(startDate ?? null)\n    setRangeEnd(endDate ?? null)\n  }, [startDate, endDate])\n\n  // Reset view when popover closes\n  React.useEffect(() => {\n    if (!open) setView('days')\n  }, [open])\n\n  const handleSelect = (date: Date) => {\n    if (!rangeStart || (rangeStart && rangeEnd)) {\n      setRangeStart(date)\n      setRangeEnd(null)\n    } else {\n      const start = isBefore(date, rangeStart) ? date : rangeStart\n      const end = isAfter(date, rangeStart) ? date : rangeStart\n      setRangeStart(start)\n      setRangeEnd(end)\n      onChange?.({ start, end })\n      setOpen(false)\n    }\n  }\n\n  const handlePresetSelect = (start: Date, end: Date) => {\n    setRangeStart(start)\n    setRangeEnd(end)\n    onChange?.({ start, end })\n    setOpen(false)\n  }\n\n  const handleHeaderClick = () => {\n    setView((prev) => (prev === 'days' ? 'months' : 'years'))\n  }\n\n  const handleMonthSelect = (month: number) => {\n    setCurrentMonth((prev) => setMonth(prev, month))\n    setView('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setCurrentMonth((prev) => setYear(prev, year))\n    setView('months')\n  }\n\n  const displayText = () => {\n    if (rangeStart && rangeEnd) {\n      return `${format(rangeStart, formatStr)} - ${format(rangeEnd, formatStr)}`\n    }\n    return placeholder\n  }\n\n  const renderCalendarGrids = () => {\n    if (monthCount === 1) {\n      return (\n        <CalendarGrid\n          currentMonth={currentMonth}\n          rangeStart={rangeStart}\n          rangeEnd={rangeEnd}\n          hoverDate={hoverDate}\n          onSelect={handleSelect}\n          onHover={setHoverDate}\n          onMonthChange={setCurrentMonth}\n          onHeaderClick={handleHeaderClick}\n          disabledDates={disabledDates}\n          minDate={minDate}\n          maxDate={maxDate}\n        />\n      )\n    }\n\n    return (\n      <div className=\"flex flex-row gap-ds-04\">\n        {Array.from({ length: monthCount }, (_, i) => (\n          <CalendarGrid\n            key={i}\n            currentMonth={addMonths(currentMonth, i)}\n            rangeStart={rangeStart}\n            rangeEnd={rangeEnd}\n            hoverDate={hoverDate}\n            onSelect={handleSelect}\n            onHover={setHoverDate}\n            onMonthChange={(date) => {\n              // Adjust so the first grid stays in sync\n              setCurrentMonth(addMonths(date, -i))\n            }}\n            onHeaderClick={handleHeaderClick}\n            disabledDates={disabledDates}\n            minDate={minDate}\n            maxDate={maxDate}\n            hidePrevNav={i > 0}\n            hideNextNav={i < monthCount - 1}\n          />\n        ))}\n      </div>\n    )\n  }\n\n  const renderView = () => {\n    switch (view) {\n      case 'years':\n        return (\n          <YearPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedYear={rangeStart?.getFullYear()}\n            onYearSelect={handleYearSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      case 'months':\n        return (\n          <MonthPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedMonth={rangeStart?.getMonth()}\n            onMonthSelect={handleMonthSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      default:\n        return renderCalendarGrids()\n    }\n  }\n\n  const hasPresets = presets && presets.length > 0\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          aria-label={rangeStart && rangeEnd ? `Change date range, ${displayText()}` : placeholder}\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            className,\n          )}\n        >\n          <Icon icon={IconCalendarEvent} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              rangeStart && rangeEnd\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {displayText()}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        {hasPresets ? (\n          <div className=\"flex flex-row gap-ds-04\">\n            <div className=\"min-w-[140px] border-r border-surface-border-strong pr-ds-04\">\n              <Presets presets={presets} onSelect={handlePresetSelect} />\n            </div>\n            <div>{renderView()}</div>\n          </div>\n        ) : (\n          renderView()\n        )}\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nDateRangePicker.displayName = 'DateRangePicker'\n\nexport { DateRangePicker }\n","'use client'\n\nimport { IconCalendarClock } from '@tabler/icons-react'\nimport {\n  format,\n  setHours,\n  setMinutes,\n  setMonth,\n  setYear,\n} from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\nimport { CalendarGrid } from './calendar-grid'\nimport { MonthPicker } from './month-picker'\nimport { YearPicker } from './year-picker'\n\ntype CalendarView = 'days' | 'months' | 'years'\n\nexport interface DateTimePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {\n  /** The currently selected date and time. */\n  value?: Date | null\n  /** Callback fired when the date/time changes. */\n  onChange?: (date: Date | null) => void\n  /** Earliest selectable date. */\n  minDate?: Date\n  /** Latest selectable date. */\n  maxDate?: Date\n  /** Function to disable specific dates. */\n  disabledDates?: (date: Date) => boolean\n  /** Display format for the time portion: 12-hour with AM/PM or 24-hour. */\n  timeFormat?: '12h' | '24h'\n  /** Step interval for the minute selector. */\n  minuteStep?: number\n  /** Placeholder text when no value is set. */\n  placeholder?: string\n  /** Additional class names for the trigger button. */\n  className?: string\n}\n\nfunction padTwo(n: number): string {\n  return n.toString().padStart(2, '0')\n}\n\nfunction generateRange(start: number, end: number, step: number): number[] {\n  const result: number[] = []\n  for (let i = start; i <= end; i += step) {\n    result.push(i)\n  }\n  return result\n}\n\nconst DateTimePicker = React.forwardRef<HTMLButtonElement, DateTimePickerProps>(\n  function DateTimePicker(\n    {\n      value,\n      onChange,\n      minDate,\n      maxDate,\n      disabledDates,\n      timeFormat = '12h',\n      minuteStep = 1,\n      placeholder = 'Pick date & time',\n      className,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n  const [currentMonth, setCurrentMonth] = React.useState(value ?? new Date())\n  const [view, setView] = React.useState<CalendarView>('days')\n\n  // Reset view when popover closes\n  React.useEffect(() => {\n    if (!open) setView('days')\n  }, [open])\n\n  // Derive time parts\n  const hours24 = value ? value.getHours() : 0\n  const minutes = value ? value.getMinutes() : 0\n  const ampm: 'AM' | 'PM' = hours24 >= 12 ? 'PM' : 'AM'\n  const hours12 = hours24 === 0 ? 12 : hours24 > 12 ? hours24 - 12 : hours24\n\n  const hoursRange =\n    timeFormat === '12h' ? generateRange(1, 12, 1) : generateRange(0, 23, 1)\n  const minutesRange = generateRange(0, 59, minuteStep)\n\n  const selectedHour = timeFormat === '12h' ? hours12 : hours24\n\n  // --- Calendar view handlers ---\n\n  const handleDateSelect = (date: Date) => {\n    // Merge with existing time part (or default to current time parts)\n    let merged = setHours(date, value ? value.getHours() : hours24)\n    merged = setMinutes(merged, value ? value.getMinutes() : minutes)\n    onChange?.(merged)\n  }\n\n  const handleHeaderClick = () => {\n    setView((prev) => (prev === 'days' ? 'months' : 'years'))\n  }\n\n  const handleMonthSelect = (month: number) => {\n    setCurrentMonth((prev) => setMonth(prev, month))\n    setView('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setCurrentMonth((prev) => setYear(prev, year))\n    setView('months')\n  }\n\n  // --- Time handlers ---\n\n  const handleHourChange = (hour: number) => {\n    const base = value ? new Date(value) : new Date()\n    let h = hour\n\n    if (timeFormat === '12h') {\n      const currentAmPm = value ? ampm : 'AM'\n      if (currentAmPm === 'AM') {\n        h = hour === 12 ? 0 : hour\n      } else {\n        h = hour === 12 ? 12 : hour + 12\n      }\n    }\n\n    const updated = setHours(base, h)\n    onChange?.(updated)\n  }\n\n  const handleMinuteChange = (minute: number) => {\n    const base = value ? new Date(value) : new Date()\n    const updated = setMinutes(base, minute)\n    onChange?.(updated)\n  }\n\n  const handleAmPmToggle = (period: 'AM' | 'PM') => {\n    const base = value ? new Date(value) : new Date()\n    const currentH = base.getHours()\n    let newH: number\n\n    if (period === 'AM') {\n      newH = currentH >= 12 ? currentH - 12 : currentH\n    } else {\n      newH = currentH < 12 ? currentH + 12 : currentH\n    }\n\n    onChange?.(setHours(base, newH))\n  }\n\n  // --- Display text ---\n\n  const displayText = React.useMemo(() => {\n    if (!value) return null\n    const fmt =\n      timeFormat === '12h' ? 'MMM d, yyyy h:mm a' : 'MMM d, yyyy HH:mm'\n    return format(value, fmt)\n  }, [value, timeFormat])\n\n  // --- Render calendar view ---\n\n  const renderView = () => {\n    switch (view) {\n      case 'years':\n        return (\n          <YearPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedYear={value?.getFullYear()}\n            onYearSelect={handleYearSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      case 'months':\n        return (\n          <MonthPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedMonth={value?.getMonth()}\n            onMonthSelect={handleMonthSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      default:\n        return (\n          <CalendarGrid\n            currentMonth={currentMonth}\n            selected={value}\n            onSelect={handleDateSelect}\n            onMonthChange={setCurrentMonth}\n            onHeaderClick={handleHeaderClick}\n            disabledDates={disabledDates}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n    }\n  }\n\n  // Compact time selector styles\n  const selectBase =\n    'h-ds-sm rounded-control border border-surface-border-strong bg-surface-overlay px-ds-02 text-body-md text-surface-fg transition-colors duration-fast-01 ease-productive-standard hover:border-surface-border-strong focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 cursor-pointer appearance-none'\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            className,\n          )}\n          aria-label={displayText ? `Selected: ${displayText}` : placeholder}\n        >\n          <Icon icon={IconCalendarClock} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              displayText\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {displayText ?? placeholder}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        <div className=\"flex flex-col gap-ds-04\">\n          {/* Calendar portion */}\n          {renderView()}\n\n          {/* Time selection row */}\n          {view === 'days' && (\n            <div className=\"flex items-center gap-ds-02 border-t border-surface-border-strong pt-ds-04\">\n              <span className=\"text-label-xs font-semibold uppercase tracking-wider text-surface-fg-subtle\">\n                Time\n              </span>\n\n              {/* Hour select */}\n              <select\n                value={selectedHour ?? ''}\n                onChange={(e) => handleHourChange(Number(e.target.value))}\n                className={selectBase}\n                aria-label=\"Hour\"\n              >\n                {!value && <option value=\"\">--</option>}\n                {hoursRange.map((h) => (\n                  <option key={h} value={h}>\n                    {timeFormat === '24h' ? padTwo(h) : h}\n                  </option>\n                ))}\n              </select>\n\n              <span className=\"text-body-md font-semibold text-surface-fg-subtle\">\n                :\n              </span>\n\n              {/* Minute select */}\n              <select\n                value={value ? minutes : ''}\n                onChange={(e) => handleMinuteChange(Number(e.target.value))}\n                className={selectBase}\n                aria-label=\"Minute\"\n              >\n                {!value && <option value=\"\">--</option>}\n                {minutesRange.map((m) => (\n                  <option key={m} value={m}>\n                    {padTwo(m)}\n                  </option>\n                ))}\n              </select>\n\n              {/* AM/PM toggle for 12h */}\n              {timeFormat === '12h' && (\n                <select\n                  value={value ? ampm : ''}\n                  onChange={(e) =>\n                    handleAmPmToggle(e.target.value as 'AM' | 'PM')\n                  }\n                  className={selectBase}\n                  aria-label=\"AM or PM\"\n                >\n                  {!value && <option value=\"\">--</option>}\n                  <option value=\"AM\">AM</option>\n                  <option value=\"PM\">PM</option>\n                </select>\n              )}\n            </div>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nDateTimePicker.displayName = 'DateTimePicker'\n\nexport { DateTimePicker }\n","'use client'\n\nimport { IconClock } from '@tabler/icons-react'\nimport { format, setHours, setMinutes, setSeconds } from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\n\nexport interface TimePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {\n  /** The currently selected time (as a Date object). */\n  value?: Date | null\n  /** Callback fired when the time changes. */\n  onChange?: (date: Date) => void\n  /** Display format: 12-hour with AM/PM or 24-hour. */\n  format?: '12h' | '24h'\n  /** Step interval for minutes column. */\n  minuteStep?: number\n  /** Step interval for seconds column. */\n  secondStep?: number\n  /** Whether to show the seconds column. */\n  showSeconds?: boolean\n  /** Placeholder text when no value is set. */\n  placeholder?: string\n  /** Additional class names for the trigger button. */\n  className?: string\n  /** Whether the picker is disabled. */\n  disabled?: boolean\n}\n\nfunction generateRange(start: number, end: number, step: number): number[] {\n  const result: number[] = []\n  for (let i = start; i <= end; i += step) {\n    result.push(i)\n  }\n  return result\n}\n\nfunction padTwo(n: number): string {\n  return n.toString().padStart(2, '0')\n}\n\nconst TimePicker = React.forwardRef<HTMLButtonElement, TimePickerProps>(\n  function TimePicker(\n    {\n      value,\n      onChange,\n      format: timeFormat = '12h',\n      minuteStep = 1,\n      secondStep = 1,\n      showSeconds = false,\n      placeholder = 'Pick a time',\n      className,\n      disabled = false,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n\n  // Derive display parts from value\n  const hours24 = value ? value.getHours() : null\n  const minutes = value ? value.getMinutes() : null\n  const seconds = value ? value.getSeconds() : null\n  const ampm = hours24 !== null ? (hours24 >= 12 ? 'PM' : 'AM') : null\n\n  // For 12h display, convert 24h to 12h\n  const hours12 =\n    hours24 !== null\n      ? hours24 === 0\n        ? 12\n        : hours24 > 12\n          ? hours24 - 12\n          : hours24\n      : null\n\n  const hoursRange =\n    timeFormat === '12h' ? generateRange(1, 12, 1) : generateRange(0, 23, 1)\n  const minutesRange = generateRange(0, 59, minuteStep)\n  const secondsRange = generateRange(0, 59, secondStep)\n\n  const createOrUpdateDate = (\n    overrides: { hours?: number; minutes?: number; seconds?: number; ampm?: 'AM' | 'PM' },\n  ): Date => {\n    const base = value ? new Date(value) : new Date()\n\n    let h = overrides.hours ?? base.getHours()\n    const m = overrides.minutes ?? base.getMinutes()\n    const s = overrides.seconds ?? base.getSeconds()\n\n    // If we're in 12h mode, we need to convert the 12h value to 24h\n    if (timeFormat === '12h' && overrides.hours !== undefined) {\n      const currentAmPm = overrides.ampm ?? ampm ?? 'AM'\n      if (currentAmPm === 'AM') {\n        h = overrides.hours === 12 ? 0 : overrides.hours\n      } else {\n        h = overrides.hours === 12 ? 12 : overrides.hours + 12\n      }\n    }\n\n    let result = setHours(base, h)\n    result = setMinutes(result, m)\n    result = setSeconds(result, s)\n    return result\n  }\n\n  const handleHourSelect = (hour: number) => {\n    const updated = createOrUpdateDate({ hours: hour })\n    onChange?.(updated)\n  }\n\n  const handleMinuteSelect = (minute: number) => {\n    const updated = createOrUpdateDate({ minutes: minute })\n    onChange?.(updated)\n  }\n\n  const handleSecondSelect = (second: number) => {\n    const updated = createOrUpdateDate({ seconds: second })\n    onChange?.(updated)\n  }\n\n  const handleAmPmToggle = (period: 'AM' | 'PM') => {\n    if (!value) {\n      // Create a date with 12:00 in the chosen period\n      const h = period === 'AM' ? 0 : 12\n      let d = new Date()\n      d = setHours(d, h)\n      d = setMinutes(d, 0)\n      d = setSeconds(d, 0)\n      onChange?.(d)\n      return\n    }\n\n    const currentH = value.getHours()\n    let newH: number\n\n    if (period === 'AM') {\n      newH = currentH >= 12 ? currentH - 12 : currentH\n    } else {\n      newH = currentH < 12 ? currentH + 12 : currentH\n    }\n\n    onChange?.(setHours(new Date(value), newH))\n  }\n\n  // Format display string\n  const displayText = React.useMemo(() => {\n    if (!value) return null\n    if (timeFormat === '12h') {\n      const fmt = showSeconds ? 'h:mm:ss a' : 'h:mm a'\n      return format(value, fmt)\n    }\n    const fmt = showSeconds ? 'HH:mm:ss' : 'HH:mm'\n    return format(value, fmt)\n  }, [value, timeFormat, showSeconds])\n\n  const selectedHour = timeFormat === '12h' ? hours12 : hours24\n\n  const columnClass =\n    'flex flex-col gap-ds-01 overflow-y-auto max-h-[200px] px-ds-01'\n\n  const itemBase =\n    'flex h-ds-sm w-full items-center justify-center rounded-control text-body-md transition-colors duration-fast-01 ease-productive-standard cursor-pointer'\n  const itemSelected =\n    'bg-accent-9 text-accent-fg'\n  const itemDefault =\n    'text-surface-fg hover:bg-surface-raised-hover'\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          disabled={disabled}\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-strong bg-surface-overlay px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            disabled && 'opacity-action-disabled pointer-events-none',\n            className,\n          )}\n          aria-label={displayText ? `Selected time: ${displayText}` : placeholder}\n        >\n          <Icon icon={IconClock} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              displayText\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {displayText ?? placeholder}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        <div className=\"flex gap-ds-03\" role=\"group\" aria-label=\"Time picker\">\n          {/* Hours column */}\n          <div className=\"flex flex-col items-center gap-ds-02\">\n            <span className=\"text-caption font-medium text-surface-fg-subtle\">\n              Hr\n            </span>\n            <div className={cn(columnClass, 'min-w-ds-09')}>\n              {hoursRange.map((h) => (\n                <button\n                  key={h}\n                  type=\"button\"\n                  onClick={() => handleHourSelect(h)}\n                  className={cn(\n                    itemBase,\n                    selectedHour === h ? itemSelected : itemDefault,\n                  )}\n                  aria-label={`${h} hours`}\n                  aria-selected={selectedHour === h || undefined}\n                >\n                  {timeFormat === '24h' ? padTwo(h) : h}\n                </button>\n              ))}\n            </div>\n          </div>\n\n          {/* Minutes column */}\n          <div className=\"flex flex-col items-center gap-ds-02\">\n            <span className=\"text-caption font-medium text-surface-fg-subtle\">\n              Min\n            </span>\n            <div className={cn(columnClass, 'min-w-ds-09')}>\n              {minutesRange.map((m) => (\n                <button\n                  key={m}\n                  type=\"button\"\n                  onClick={() => handleMinuteSelect(m)}\n                  className={cn(\n                    itemBase,\n                    minutes === m ? itemSelected : itemDefault,\n                  )}\n                  aria-label={`${padTwo(m)} minutes`}\n                  aria-selected={minutes === m || undefined}\n                >\n                  {padTwo(m)}\n                </button>\n              ))}\n            </div>\n          </div>\n\n          {/* Seconds column */}\n          {showSeconds && (\n            <div className=\"flex flex-col items-center gap-ds-02\">\n              <span className=\"text-caption font-medium text-surface-fg-subtle\">\n                Sec\n              </span>\n              <div className={cn(columnClass, 'min-w-ds-09')}>\n                {secondsRange.map((s) => (\n                  <button\n                    key={s}\n                    type=\"button\"\n                    onClick={() => handleSecondSelect(s)}\n                    className={cn(\n                      itemBase,\n                      seconds === s ? itemSelected : itemDefault,\n                    )}\n                    aria-label={`${padTwo(s)} seconds`}\n                    aria-selected={seconds === s || undefined}\n                  >\n                    {padTwo(s)}\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n\n          {/* AM/PM toggle for 12h format */}\n          {timeFormat === '12h' && (\n            <div className=\"flex flex-col items-center gap-ds-02\">\n              <span className=\"text-caption font-medium text-surface-fg-subtle\">\n                &nbsp;\n              </span>\n              <div className=\"flex flex-col gap-ds-01 px-ds-01\">\n                {(['AM', 'PM'] as const).map((period) => (\n                  <button\n                    key={period}\n                    type=\"button\"\n                    onClick={() => handleAmPmToggle(period)}\n                    className={cn(\n                      itemBase,\n                      'min-w-[44px] font-semibold',\n                      ampm === period ? itemSelected : itemDefault,\n                    )}\n                    aria-label={period}\n                    aria-selected={ampm === period || undefined}\n                  >\n                    {period}\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nTimePicker.displayName = 'TimePicker'\n\nexport { TimePicker }\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/composed/date-picker/month-picker.tsx","../../../src/composed/date-picker/year-picker.tsx","../../../src/composed/date-picker/date-picker.tsx","../../../src/composed/date-picker/presets.tsx","../../../src/composed/date-picker/date-range-picker.tsx","../../../src/composed/date-picker/date-time-picker.tsx","../../../src/composed/date-picker/time-picker.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\n\nimport { cn } from '../../ui/lib/utils'\n\nconst MONTHS = [\n  'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',\n  'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec',\n]\n\nexport interface MonthPickerProps extends React.ComponentPropsWithoutRef<'div'> {\n  currentYear: number\n  selectedMonth?: number // 0-11\n  onMonthSelect: (month: number) => void\n  minDate?: Date\n  maxDate?: Date\n}\n\nexport const MonthPicker = React.forwardRef<HTMLDivElement, MonthPickerProps>(\n  function MonthPicker({\n  currentYear,\n  selectedMonth,\n  onMonthSelect,\n  minDate,\n  maxDate,\n  className,\n  ...props\n}, ref) {\n  const COLS = 4\n  const [focusedIndex, setFocusedIndex] = React.useState(selectedMonth ?? 0)\n  const buttonRefs = React.useRef<(HTMLButtonElement | null)[]>([])\n\n  const isMonthDisabled = (index: number) =>\n    (minDate != null &&\n      (currentYear < minDate.getFullYear() ||\n        (currentYear === minDate.getFullYear() && index < minDate.getMonth()))) ||\n    (maxDate != null &&\n      (currentYear > maxDate.getFullYear() ||\n        (currentYear === maxDate.getFullYear() && index > maxDate.getMonth())))\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    let next = focusedIndex\n    switch (e.key) {\n      case 'ArrowRight': next = Math.min(11, focusedIndex + 1); break\n      case 'ArrowLeft': next = Math.max(0, focusedIndex - 1); break\n      case 'ArrowDown': next = Math.min(11, focusedIndex + COLS); break\n      case 'ArrowUp': next = Math.max(0, focusedIndex - COLS); break\n      case 'Home': next = 0; break\n      case 'End': next = 11; break\n      default: return\n    }\n    e.preventDefault()\n    // Skip disabled months\n    while (next !== focusedIndex && isMonthDisabled(next)) {\n      next += (e.key === 'ArrowLeft' || e.key === 'ArrowUp') ? -1 : 1\n      if (next < 0 || next > 11) return\n    }\n    setFocusedIndex(next)\n    buttonRefs.current[next]?.focus()\n  }\n\n  return (\n    <div ref={ref} {...props} className={cn(\"w-[252px]\", className)}>\n      <div className=\"text-center pb-ds-04 text-body-md font-semibold text-surface-fg\">\n        {currentYear}\n      </div>\n      <div role=\"grid\" aria-label=\"Month picker\" tabIndex={-1} onKeyDown={handleKeyDown}>\n        {[0, 1, 2].map((rowIdx) => (\n          <div key={rowIdx} role=\"row\" className=\"grid grid-cols-4 gap-ds-02 mb-ds-02 last:mb-0\">\n            {MONTHS.slice(rowIdx * COLS, rowIdx * COLS + COLS).map((label, colIdx) => {\n              const index = rowIdx * COLS + colIdx\n              const isSelected = index === selectedMonth\n              const isDisabled = isMonthDisabled(index)\n\n              return (\n                <button\n                  key={label}\n                  ref={(el) => { buttonRefs.current[index] = el }}\n                  type=\"button\"\n                  role=\"gridcell\"\n                  tabIndex={index === focusedIndex ? 0 : -1}\n                  disabled={isDisabled || false}\n                  onClick={() => !isDisabled && onMonthSelect(index)}\n                  className={cn(\n                    'h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n                    isDisabled && 'opacity-action-disabled pointer-events-none cursor-not-allowed',\n                    isSelected &&\n                      'bg-accent-9 text-accent-fg',\n                    !isSelected &&\n                      !isDisabled &&\n                      'hover:bg-surface-panel-hover text-surface-fg',\n                  )}\n                >\n                  {label}\n                </button>\n              )\n            })}\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n},\n)\n\nMonthPicker.displayName = 'MonthPicker'\n","'use client'\n\nimport * as React from 'react'\n\nimport { cn } from '../../ui/lib/utils'\n\nexport interface YearPickerProps extends React.ComponentPropsWithoutRef<'div'> {\n  currentYear: number\n  selectedYear?: number\n  onYearSelect: (year: number) => void\n  minDate?: Date\n  maxDate?: Date\n}\n\nexport const YearPicker = React.forwardRef<HTMLDivElement, YearPickerProps>(\n  function YearPicker({\n  currentYear,\n  selectedYear,\n  onYearSelect,\n  minDate,\n  maxDate,\n  className,\n  ...props\n}, ref) {\n  const COLS = 3\n  const startYear = Math.floor(currentYear / 10) * 10\n  const years = Array.from({ length: 12 }, (_, i) => startYear + i)\n  const [focusedIndex, setFocusedIndex] = React.useState(() => {\n    const sel = years.indexOf(selectedYear ?? currentYear)\n    return sel >= 0 ? sel : 0\n  })\n  const buttonRefs = React.useRef<(HTMLButtonElement | null)[]>([])\n\n  const isYearDisabled = (year: number) =>\n    (minDate != null && year < minDate.getFullYear()) ||\n    (maxDate != null && year > maxDate.getFullYear())\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    let next = focusedIndex\n    switch (e.key) {\n      case 'ArrowRight': next = Math.min(11, focusedIndex + 1); break\n      case 'ArrowLeft': next = Math.max(0, focusedIndex - 1); break\n      case 'ArrowDown': next = Math.min(11, focusedIndex + COLS); break\n      case 'ArrowUp': next = Math.max(0, focusedIndex - COLS); break\n      case 'Home': next = 0; break\n      case 'End': next = 11; break\n      default: return\n    }\n    e.preventDefault()\n    while (next !== focusedIndex && isYearDisabled(years[next])) {\n      next += (e.key === 'ArrowLeft' || e.key === 'ArrowUp') ? -1 : 1\n      if (next < 0 || next > 11) return\n    }\n    setFocusedIndex(next)\n    buttonRefs.current[next]?.focus()\n  }\n\n  return (\n    <div ref={ref} {...props} className={cn(\"w-[252px]\", className)}>\n      <div className=\"text-center pb-ds-04 text-body-md font-semibold text-surface-fg\">\n        {startYear} &ndash; {startYear + 11}\n      </div>\n      <div role=\"grid\" aria-label=\"Year picker\" tabIndex={-1} onKeyDown={handleKeyDown}>\n        {[0, 1, 2, 3].map((rowIdx) => (\n          <div key={rowIdx} role=\"row\" className=\"grid grid-cols-3 gap-ds-02 mb-ds-02 last:mb-0\">\n            {years.slice(rowIdx * COLS, rowIdx * COLS + COLS).map((year) => {\n              const index = years.indexOf(year)\n              const isSelected = year === selectedYear\n              const isDisabled = isYearDisabled(year)\n\n              return (\n                <button\n                  key={year}\n                  ref={(el) => { buttonRefs.current[index] = el }}\n                  type=\"button\"\n                  role=\"gridcell\"\n                  tabIndex={index === focusedIndex ? 0 : -1}\n                  disabled={isDisabled || false}\n                  onClick={() => !isDisabled && onYearSelect(year)}\n                  className={cn(\n                    'h-ds-sm-plus rounded-control text-body-md transition-colors focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n                    isDisabled && 'opacity-action-disabled pointer-events-none cursor-not-allowed',\n                    isSelected &&\n                      'bg-accent-9 text-accent-fg',\n                    !isSelected &&\n                      !isDisabled &&\n                      'hover:bg-surface-panel-hover text-surface-fg',\n                  )}\n                >\n                  {year}\n                </button>\n              )\n            })}\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n},\n)\n\nYearPicker.displayName = 'YearPicker'\n","'use client'\n\nimport { IconCalendarEvent } from '@tabler/icons-react'\nimport { format, setMonth, setYear } from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\nimport { CalendarGrid } from './calendar-grid'\nimport { MonthPicker } from './month-picker'\nimport { YearPicker } from './year-picker'\n\ntype CalendarView = 'days' | 'months' | 'years'\n\n/**\n * A popover-based date picker with day/month/year drill-down views.\n * Supports min/max date constraints and arbitrary date disabling.\n */\nexport interface DatePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {\n  /** Currently selected date (controlled). */\n  value?: Date | null\n  /** Called when a date is selected. Receives null if cleared. */\n  onChange?: (date: Date | null) => void\n  placeholder?: string\n  /** date-fns format string for the trigger display. @default 'MMM d, yyyy' */\n  formatStr?: string\n  /** Earliest selectable date. */\n  minDate?: Date\n  /** Latest selectable date. */\n  maxDate?: Date\n  /** Predicate to disable specific dates (return true to disable). */\n  disabledDates?: (date: Date) => boolean\n  className?: string\n}\n\nconst DatePicker = React.forwardRef<HTMLButtonElement, DatePickerProps>(\n  function DatePicker(\n    {\n      value,\n      onChange,\n      placeholder = 'Pick a date',\n      className,\n      formatStr = 'MMM d, yyyy',\n      minDate,\n      maxDate,\n      disabledDates,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n  const [currentMonth, setCurrentMonth] = React.useState(\n    value ?? new Date(),\n  )\n  const [view, setView] = React.useState<CalendarView>('days')\n\n  // Reset view when popover closes\n  React.useEffect(() => {\n    if (!open) setView('days')\n  }, [open])\n\n  const handleSelect = (date: Date) => {\n    onChange?.(date)\n    setOpen(false)\n  }\n\n  const handleHeaderClick = () => {\n    setView((prev) => (prev === 'days' ? 'months' : 'years'))\n  }\n\n  const handleMonthSelect = (month: number) => {\n    setCurrentMonth((prev) => setMonth(prev, month))\n    setView('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setCurrentMonth((prev) => setYear(prev, year))\n    setView('months')\n  }\n\n  const renderView = () => {\n    switch (view) {\n      case 'years':\n        return (\n          <YearPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedYear={value?.getFullYear()}\n            onYearSelect={handleYearSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      case 'months':\n        return (\n          <MonthPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedMonth={value?.getMonth()}\n            onMonthSelect={handleMonthSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      default:\n        return (\n          <CalendarGrid\n            currentMonth={currentMonth}\n            selected={value}\n            onSelect={handleSelect}\n            onMonthChange={setCurrentMonth}\n            onHeaderClick={handleHeaderClick}\n            disabledDates={disabledDates}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n    }\n  }\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          aria-label={value ? `Change date, ${format(value, formatStr)}` : placeholder}\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-interactive-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            className,\n          )}\n        >\n          <Icon icon={IconCalendarEvent} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              value\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {value ? format(value, formatStr) : placeholder}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        {renderView()}\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nDatePicker.displayName = 'DatePicker'\n\nexport { DatePicker }\n","'use client'\n\nimport {\n  endOfDay,\n  endOfMonth,\n  startOfDay,\n  startOfMonth,\n  startOfYear,\n  subDays,\n  subMonths,\n} from 'date-fns'\nimport * as React from 'react'\n\nimport { cn } from '../../ui/lib/utils'\n\nexport type PresetKey =\n  | 'today'\n  | 'yesterday'\n  | 'last7days'\n  | 'last30days'\n  | 'thisMonth'\n  | 'lastMonth'\n  | 'thisYear'\n\nexport interface PresetsProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onSelect'> {\n  presets: PresetKey[]\n  onSelect: (start: Date, end: Date) => void\n  className?: string\n}\n\ninterface PresetDefinition {\n  label: string\n  getRange: () => { start: Date; end: Date }\n}\n\nconst PRESET_MAP: Record<PresetKey, PresetDefinition> = {\n  today: {\n    label: 'Today',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfDay(now), end: endOfDay(now) }\n    },\n  },\n  yesterday: {\n    label: 'Yesterday',\n    getRange: () => {\n      const yesterday = subDays(new Date(), 1)\n      return { start: startOfDay(yesterday), end: endOfDay(yesterday) }\n    },\n  },\n  last7days: {\n    label: 'Last 7 days',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfDay(subDays(now, 6)), end: endOfDay(now) }\n    },\n  },\n  last30days: {\n    label: 'Last 30 days',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfDay(subDays(now, 29)), end: endOfDay(now) }\n    },\n  },\n  thisMonth: {\n    label: 'This month',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfMonth(now), end: endOfMonth(now) }\n    },\n  },\n  lastMonth: {\n    label: 'Last month',\n    getRange: () => {\n      const now = new Date()\n      const last = subMonths(now, 1)\n      return { start: startOfMonth(last), end: endOfMonth(last) }\n    },\n  },\n  thisYear: {\n    label: 'This year',\n    getRange: () => {\n      const now = new Date()\n      return { start: startOfYear(now), end: endOfDay(now) }\n    },\n  },\n}\n\nexport const Presets = React.forwardRef<HTMLDivElement, PresetsProps>(\n  function Presets({ presets, onSelect, className, ...props }, ref) {\n  return (\n    <div ref={ref} {...props} className={cn('flex flex-col gap-ds-01', className)}>\n      {presets.map((key) => {\n        const preset = PRESET_MAP[key]\n        if (!preset) return null\n        return (\n          <button\n            key={key}\n            type=\"button\"\n            onClick={() => {\n              const { start, end } = preset.getRange()\n              onSelect(start, end)\n            }}\n            className={cn(\n              'h-ds-sm w-full rounded-control px-ds-03 text-left text-body-sm',\n              'text-surface-fg transition-colors',\n              'hover:bg-surface-panel-hover',\n              'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9',\n            )}\n          >\n            {preset.label}\n          </button>\n        )\n      })}\n    </div>\n  )\n},\n)\n\nPresets.displayName = 'Presets'\n","'use client'\n\nimport { IconCalendarEvent } from '@tabler/icons-react'\nimport { addMonths,format, isAfter, isBefore, setMonth, setYear } from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\nimport { CalendarGrid } from './calendar-grid'\nimport { MonthPicker } from './month-picker'\nimport type { PresetKey } from './presets'\nimport { Presets } from './presets'\nimport { YearPicker } from './year-picker'\n\ntype CalendarView = 'days' | 'months' | 'years'\n\nexport interface DateRangePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange'> {\n  startDate?: Date | null\n  endDate?: Date | null\n  onChange?: (range: { start: Date | null; end: Date | null }) => void\n  placeholder?: string\n  className?: string\n  formatStr?: string\n  minDate?: Date\n  maxDate?: Date\n  disabledDates?: (date: Date) => boolean\n  /** Show a presets sidebar with quick date range selections */\n  presets?: PresetKey[]\n  /** Number of calendar months to display side by side (default: 1) */\n  numberOfMonths?: number\n}\n\nconst DateRangePicker = React.forwardRef<HTMLButtonElement, DateRangePickerProps>(\n  function DateRangePicker(\n    {\n      startDate,\n      endDate,\n      onChange,\n      placeholder = 'Pick a date range',\n      className,\n      formatStr = 'MMM d, yyyy',\n      minDate,\n      maxDate,\n      disabledDates,\n      presets,\n      numberOfMonths = 1,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n  const [currentMonth, setCurrentMonth] = React.useState(\n    startDate ?? new Date(),\n  )\n  const [rangeStart, setRangeStart] = React.useState<Date | null>(\n    startDate ?? null,\n  )\n  const [rangeEnd, setRangeEnd] = React.useState<Date | null>(\n    endDate ?? null,\n  )\n  const [hoverDate, setHoverDate] = React.useState<Date | null>(null)\n  const [view, setView] = React.useState<CalendarView>('days')\n\n  const monthCount = Math.max(1, numberOfMonths)\n\n  React.useEffect(() => {\n    setRangeStart(startDate ?? null)\n    setRangeEnd(endDate ?? null)\n  }, [startDate, endDate])\n\n  // Reset view when popover closes\n  React.useEffect(() => {\n    if (!open) setView('days')\n  }, [open])\n\n  const handleSelect = (date: Date) => {\n    if (!rangeStart || (rangeStart && rangeEnd)) {\n      setRangeStart(date)\n      setRangeEnd(null)\n    } else {\n      const start = isBefore(date, rangeStart) ? date : rangeStart\n      const end = isAfter(date, rangeStart) ? date : rangeStart\n      setRangeStart(start)\n      setRangeEnd(end)\n      onChange?.({ start, end })\n      setOpen(false)\n    }\n  }\n\n  const handlePresetSelect = (start: Date, end: Date) => {\n    setRangeStart(start)\n    setRangeEnd(end)\n    onChange?.({ start, end })\n    setOpen(false)\n  }\n\n  const handleHeaderClick = () => {\n    setView((prev) => (prev === 'days' ? 'months' : 'years'))\n  }\n\n  const handleMonthSelect = (month: number) => {\n    setCurrentMonth((prev) => setMonth(prev, month))\n    setView('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setCurrentMonth((prev) => setYear(prev, year))\n    setView('months')\n  }\n\n  const displayText = () => {\n    if (rangeStart && rangeEnd) {\n      return `${format(rangeStart, formatStr)} - ${format(rangeEnd, formatStr)}`\n    }\n    return placeholder\n  }\n\n  const renderCalendarGrids = () => {\n    if (monthCount === 1) {\n      return (\n        <CalendarGrid\n          currentMonth={currentMonth}\n          rangeStart={rangeStart}\n          rangeEnd={rangeEnd}\n          hoverDate={hoverDate}\n          onSelect={handleSelect}\n          onHover={setHoverDate}\n          onMonthChange={setCurrentMonth}\n          onHeaderClick={handleHeaderClick}\n          disabledDates={disabledDates}\n          minDate={minDate}\n          maxDate={maxDate}\n        />\n      )\n    }\n\n    return (\n      <div className=\"flex flex-row gap-ds-04\">\n        {Array.from({ length: monthCount }, (_, i) => (\n          <CalendarGrid\n            key={i}\n            currentMonth={addMonths(currentMonth, i)}\n            rangeStart={rangeStart}\n            rangeEnd={rangeEnd}\n            hoverDate={hoverDate}\n            onSelect={handleSelect}\n            onHover={setHoverDate}\n            onMonthChange={(date) => {\n              // Adjust so the first grid stays in sync\n              setCurrentMonth(addMonths(date, -i))\n            }}\n            onHeaderClick={handleHeaderClick}\n            disabledDates={disabledDates}\n            minDate={minDate}\n            maxDate={maxDate}\n            hidePrevNav={i > 0}\n            hideNextNav={i < monthCount - 1}\n          />\n        ))}\n      </div>\n    )\n  }\n\n  const renderView = () => {\n    switch (view) {\n      case 'years':\n        return (\n          <YearPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedYear={rangeStart?.getFullYear()}\n            onYearSelect={handleYearSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      case 'months':\n        return (\n          <MonthPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedMonth={rangeStart?.getMonth()}\n            onMonthSelect={handleMonthSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      default:\n        return renderCalendarGrids()\n    }\n  }\n\n  const hasPresets = presets && presets.length > 0\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          aria-label={rangeStart && rangeEnd ? `Change date range, ${displayText()}` : placeholder}\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-interactive-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            className,\n          )}\n        >\n          <Icon icon={IconCalendarEvent} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              rangeStart && rangeEnd\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {displayText()}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        {hasPresets ? (\n          <div className=\"flex flex-row gap-ds-04\">\n            <div className=\"min-w-[140px] border-r border-surface-border-strong pr-ds-04\">\n              <Presets presets={presets} onSelect={handlePresetSelect} />\n            </div>\n            <div>{renderView()}</div>\n          </div>\n        ) : (\n          renderView()\n        )}\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nDateRangePicker.displayName = 'DateRangePicker'\n\nexport { DateRangePicker }\n","'use client'\n\nimport { IconCalendarClock } from '@tabler/icons-react'\nimport {\n  format,\n  setHours,\n  setMinutes,\n  setMonth,\n  setYear,\n} from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\nimport { CalendarGrid } from './calendar-grid'\nimport { MonthPicker } from './month-picker'\nimport { YearPicker } from './year-picker'\n\ntype CalendarView = 'days' | 'months' | 'years'\n\nexport interface DateTimePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {\n  /** The currently selected date and time. */\n  value?: Date | null\n  /** Callback fired when the date/time changes. */\n  onChange?: (date: Date | null) => void\n  /** Earliest selectable date. */\n  minDate?: Date\n  /** Latest selectable date. */\n  maxDate?: Date\n  /** Function to disable specific dates. */\n  disabledDates?: (date: Date) => boolean\n  /** Display format for the time portion: 12-hour with AM/PM or 24-hour. */\n  timeFormat?: '12h' | '24h'\n  /** Step interval for the minute selector. */\n  minuteStep?: number\n  /** Placeholder text when no value is set. */\n  placeholder?: string\n  /** Additional class names for the trigger button. */\n  className?: string\n}\n\nfunction padTwo(n: number): string {\n  return n.toString().padStart(2, '0')\n}\n\nfunction generateRange(start: number, end: number, step: number): number[] {\n  const result: number[] = []\n  for (let i = start; i <= end; i += step) {\n    result.push(i)\n  }\n  return result\n}\n\nconst DateTimePicker = React.forwardRef<HTMLButtonElement, DateTimePickerProps>(\n  function DateTimePicker(\n    {\n      value,\n      onChange,\n      minDate,\n      maxDate,\n      disabledDates,\n      timeFormat = '12h',\n      minuteStep = 1,\n      placeholder = 'Pick date & time',\n      className,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n  const [currentMonth, setCurrentMonth] = React.useState(value ?? new Date())\n  const [view, setView] = React.useState<CalendarView>('days')\n\n  // Reset view when popover closes\n  React.useEffect(() => {\n    if (!open) setView('days')\n  }, [open])\n\n  // Derive time parts\n  const hours24 = value ? value.getHours() : 0\n  const minutes = value ? value.getMinutes() : 0\n  const ampm: 'AM' | 'PM' = hours24 >= 12 ? 'PM' : 'AM'\n  const hours12 = hours24 === 0 ? 12 : hours24 > 12 ? hours24 - 12 : hours24\n\n  const hoursRange =\n    timeFormat === '12h' ? generateRange(1, 12, 1) : generateRange(0, 23, 1)\n  const minutesRange = generateRange(0, 59, minuteStep)\n\n  const selectedHour = timeFormat === '12h' ? hours12 : hours24\n\n  // --- Calendar view handlers ---\n\n  const handleDateSelect = (date: Date) => {\n    // Merge with existing time part (or default to current time parts)\n    let merged = setHours(date, value ? value.getHours() : hours24)\n    merged = setMinutes(merged, value ? value.getMinutes() : minutes)\n    onChange?.(merged)\n  }\n\n  const handleHeaderClick = () => {\n    setView((prev) => (prev === 'days' ? 'months' : 'years'))\n  }\n\n  const handleMonthSelect = (month: number) => {\n    setCurrentMonth((prev) => setMonth(prev, month))\n    setView('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setCurrentMonth((prev) => setYear(prev, year))\n    setView('months')\n  }\n\n  // --- Time handlers ---\n\n  const handleHourChange = (hour: number) => {\n    const base = value ? new Date(value) : new Date()\n    let h = hour\n\n    if (timeFormat === '12h') {\n      const currentAmPm = value ? ampm : 'AM'\n      if (currentAmPm === 'AM') {\n        h = hour === 12 ? 0 : hour\n      } else {\n        h = hour === 12 ? 12 : hour + 12\n      }\n    }\n\n    const updated = setHours(base, h)\n    onChange?.(updated)\n  }\n\n  const handleMinuteChange = (minute: number) => {\n    const base = value ? new Date(value) : new Date()\n    const updated = setMinutes(base, minute)\n    onChange?.(updated)\n  }\n\n  const handleAmPmToggle = (period: 'AM' | 'PM') => {\n    const base = value ? new Date(value) : new Date()\n    const currentH = base.getHours()\n    let newH: number\n\n    if (period === 'AM') {\n      newH = currentH >= 12 ? currentH - 12 : currentH\n    } else {\n      newH = currentH < 12 ? currentH + 12 : currentH\n    }\n\n    onChange?.(setHours(base, newH))\n  }\n\n  // --- Display text ---\n\n  const displayText = React.useMemo(() => {\n    if (!value) return null\n    const fmt =\n      timeFormat === '12h' ? 'MMM d, yyyy h:mm a' : 'MMM d, yyyy HH:mm'\n    return format(value, fmt)\n  }, [value, timeFormat])\n\n  // --- Render calendar view ---\n\n  const renderView = () => {\n    switch (view) {\n      case 'years':\n        return (\n          <YearPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedYear={value?.getFullYear()}\n            onYearSelect={handleYearSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      case 'months':\n        return (\n          <MonthPicker\n            currentYear={currentMonth.getFullYear()}\n            selectedMonth={value?.getMonth()}\n            onMonthSelect={handleMonthSelect}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n      default:\n        return (\n          <CalendarGrid\n            currentMonth={currentMonth}\n            selected={value}\n            onSelect={handleDateSelect}\n            onMonthChange={setCurrentMonth}\n            onHeaderClick={handleHeaderClick}\n            disabledDates={disabledDates}\n            minDate={minDate}\n            maxDate={maxDate}\n          />\n        )\n    }\n  }\n\n  // Compact time selector styles\n  const selectBase =\n    'h-ds-sm rounded-control border border-surface-border-interactive bg-surface-panel-hover px-ds-02 text-body-md text-surface-fg transition-colors duration-fast-01 ease-productive-standard hover:border-surface-border-interactive-strong focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 cursor-pointer appearance-none'\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-interactive-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            className,\n          )}\n          aria-label={displayText ? `Selected: ${displayText}` : placeholder}\n        >\n          <Icon icon={IconCalendarClock} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              displayText\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {displayText ?? placeholder}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        <div className=\"flex flex-col gap-ds-04\">\n          {/* Calendar portion */}\n          {renderView()}\n\n          {/* Time selection row */}\n          {view === 'days' && (\n            <div className=\"flex items-center gap-ds-02 border-t border-surface-border-strong pt-ds-04\">\n              <span className=\"text-label-xs font-semibold uppercase tracking-wider text-surface-fg-subtle\">\n                Time\n              </span>\n\n              {/* Hour select */}\n              <select\n                value={selectedHour ?? ''}\n                onChange={(e) => handleHourChange(Number(e.target.value))}\n                className={selectBase}\n                aria-label=\"Hour\"\n              >\n                {!value && <option value=\"\">--</option>}\n                {hoursRange.map((h) => (\n                  <option key={h} value={h}>\n                    {timeFormat === '24h' ? padTwo(h) : h}\n                  </option>\n                ))}\n              </select>\n\n              <span className=\"text-body-md font-semibold text-surface-fg-subtle\">\n                :\n              </span>\n\n              {/* Minute select */}\n              <select\n                value={value ? minutes : ''}\n                onChange={(e) => handleMinuteChange(Number(e.target.value))}\n                className={selectBase}\n                aria-label=\"Minute\"\n              >\n                {!value && <option value=\"\">--</option>}\n                {minutesRange.map((m) => (\n                  <option key={m} value={m}>\n                    {padTwo(m)}\n                  </option>\n                ))}\n              </select>\n\n              {/* AM/PM toggle for 12h */}\n              {timeFormat === '12h' && (\n                <select\n                  value={value ? ampm : ''}\n                  onChange={(e) =>\n                    handleAmPmToggle(e.target.value as 'AM' | 'PM')\n                  }\n                  className={selectBase}\n                  aria-label=\"AM or PM\"\n                >\n                  {!value && <option value=\"\">--</option>}\n                  <option value=\"AM\">AM</option>\n                  <option value=\"PM\">PM</option>\n                </select>\n              )}\n            </div>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nDateTimePicker.displayName = 'DateTimePicker'\n\nexport { DateTimePicker }\n","'use client'\n\nimport { IconClock } from '@tabler/icons-react'\nimport { format, setHours, setMinutes, setSeconds } from 'date-fns'\nimport * as React from 'react'\n\nimport { Icon } from '../../ui/icon'\nimport { cn } from '../../ui/lib/utils'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../ui/popover'\n\nexport interface TimePickerProps extends Omit<React.ComponentPropsWithoutRef<'button'>, 'onChange' | 'value'> {\n  /** The currently selected time (as a Date object). */\n  value?: Date | null\n  /** Callback fired when the time changes. */\n  onChange?: (date: Date) => void\n  /** Display format: 12-hour with AM/PM or 24-hour. */\n  format?: '12h' | '24h'\n  /** Step interval for minutes column. */\n  minuteStep?: number\n  /** Step interval for seconds column. */\n  secondStep?: number\n  /** Whether to show the seconds column. */\n  showSeconds?: boolean\n  /** Placeholder text when no value is set. */\n  placeholder?: string\n  /** Additional class names for the trigger button. */\n  className?: string\n  /** Whether the picker is disabled. */\n  disabled?: boolean\n}\n\nfunction generateRange(start: number, end: number, step: number): number[] {\n  const result: number[] = []\n  for (let i = start; i <= end; i += step) {\n    result.push(i)\n  }\n  return result\n}\n\nfunction padTwo(n: number): string {\n  return n.toString().padStart(2, '0')\n}\n\nconst TimePicker = React.forwardRef<HTMLButtonElement, TimePickerProps>(\n  function TimePicker(\n    {\n      value,\n      onChange,\n      format: timeFormat = '12h',\n      minuteStep = 1,\n      secondStep = 1,\n      showSeconds = false,\n      placeholder = 'Pick a time',\n      className,\n      disabled = false,\n      ...props\n    },\n    ref,\n  ) {\n  const [open, setOpen] = React.useState(false)\n\n  // Derive display parts from value\n  const hours24 = value ? value.getHours() : null\n  const minutes = value ? value.getMinutes() : null\n  const seconds = value ? value.getSeconds() : null\n  const ampm = hours24 !== null ? (hours24 >= 12 ? 'PM' : 'AM') : null\n\n  // For 12h display, convert 24h to 12h\n  const hours12 =\n    hours24 !== null\n      ? hours24 === 0\n        ? 12\n        : hours24 > 12\n          ? hours24 - 12\n          : hours24\n      : null\n\n  const hoursRange =\n    timeFormat === '12h' ? generateRange(1, 12, 1) : generateRange(0, 23, 1)\n  const minutesRange = generateRange(0, 59, minuteStep)\n  const secondsRange = generateRange(0, 59, secondStep)\n\n  const createOrUpdateDate = (\n    overrides: { hours?: number; minutes?: number; seconds?: number; ampm?: 'AM' | 'PM' },\n  ): Date => {\n    const base = value ? new Date(value) : new Date()\n\n    let h = overrides.hours ?? base.getHours()\n    const m = overrides.minutes ?? base.getMinutes()\n    const s = overrides.seconds ?? base.getSeconds()\n\n    // If we're in 12h mode, we need to convert the 12h value to 24h\n    if (timeFormat === '12h' && overrides.hours !== undefined) {\n      const currentAmPm = overrides.ampm ?? ampm ?? 'AM'\n      if (currentAmPm === 'AM') {\n        h = overrides.hours === 12 ? 0 : overrides.hours\n      } else {\n        h = overrides.hours === 12 ? 12 : overrides.hours + 12\n      }\n    }\n\n    let result = setHours(base, h)\n    result = setMinutes(result, m)\n    result = setSeconds(result, s)\n    return result\n  }\n\n  const handleHourSelect = (hour: number) => {\n    const updated = createOrUpdateDate({ hours: hour })\n    onChange?.(updated)\n  }\n\n  const handleMinuteSelect = (minute: number) => {\n    const updated = createOrUpdateDate({ minutes: minute })\n    onChange?.(updated)\n  }\n\n  const handleSecondSelect = (second: number) => {\n    const updated = createOrUpdateDate({ seconds: second })\n    onChange?.(updated)\n  }\n\n  const handleAmPmToggle = (period: 'AM' | 'PM') => {\n    if (!value) {\n      // Create a date with 12:00 in the chosen period\n      const h = period === 'AM' ? 0 : 12\n      let d = new Date()\n      d = setHours(d, h)\n      d = setMinutes(d, 0)\n      d = setSeconds(d, 0)\n      onChange?.(d)\n      return\n    }\n\n    const currentH = value.getHours()\n    let newH: number\n\n    if (period === 'AM') {\n      newH = currentH >= 12 ? currentH - 12 : currentH\n    } else {\n      newH = currentH < 12 ? currentH + 12 : currentH\n    }\n\n    onChange?.(setHours(new Date(value), newH))\n  }\n\n  // Format display string\n  const displayText = React.useMemo(() => {\n    if (!value) return null\n    if (timeFormat === '12h') {\n      const fmt = showSeconds ? 'h:mm:ss a' : 'h:mm a'\n      return format(value, fmt)\n    }\n    const fmt = showSeconds ? 'HH:mm:ss' : 'HH:mm'\n    return format(value, fmt)\n  }, [value, timeFormat, showSeconds])\n\n  const selectedHour = timeFormat === '12h' ? hours12 : hours24\n\n  const columnClass =\n    'flex flex-col gap-ds-01 overflow-y-auto max-h-[200px] px-ds-01'\n\n  const itemBase =\n    'flex h-ds-sm w-full items-center justify-center rounded-control text-body-md transition-colors duration-fast-01 ease-productive-standard cursor-pointer'\n  const itemSelected =\n    'bg-accent-9 text-accent-fg'\n  const itemDefault =\n    'text-surface-fg hover:bg-surface-panel-hover'\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          ref={ref}\n          type=\"button\"\n          disabled={disabled}\n          {...props}\n          className={cn(\n            'inline-flex h-ds-sm-plus items-center gap-ds-03 rounded-surface border border-surface-border-interactive bg-surface-panel-hover px-ds-04 text-left transition-colors duration-fast-01 ease-productive-standard',\n            'hover:border-surface-border-interactive-strong',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n            disabled && 'opacity-action-disabled pointer-events-none',\n            className,\n          )}\n          aria-label={displayText ? `Selected time: ${displayText}` : placeholder}\n        >\n          <Icon icon={IconClock} size=\"sm\" stroke=\"light\" className=\"text-surface-fg-subtle\" />\n          <span\n            className={cn(\n              'text-body-md',\n              displayText\n                ? 'text-surface-fg'\n                : 'text-surface-fg-subtle',\n            )}\n          >\n            {displayText ?? placeholder}\n          </span>\n        </button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-auto border-surface-border-strong bg-surface-overlay p-ds-04\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        <div className=\"flex gap-ds-03\" role=\"group\" aria-label=\"Time picker\">\n          {/* Hours column */}\n          <div className=\"flex flex-col items-center gap-ds-02\">\n            <span className=\"text-caption font-medium text-surface-fg-subtle\">\n              Hr\n            </span>\n            <div className={cn(columnClass, 'min-w-ds-09')}>\n              {hoursRange.map((h) => (\n                <button\n                  key={h}\n                  type=\"button\"\n                  onClick={() => handleHourSelect(h)}\n                  className={cn(\n                    itemBase,\n                    selectedHour === h ? itemSelected : itemDefault,\n                  )}\n                  aria-label={`${h} hours`}\n                  aria-selected={selectedHour === h || undefined}\n                >\n                  {timeFormat === '24h' ? padTwo(h) : h}\n                </button>\n              ))}\n            </div>\n          </div>\n\n          {/* Minutes column */}\n          <div className=\"flex flex-col items-center gap-ds-02\">\n            <span className=\"text-caption font-medium text-surface-fg-subtle\">\n              Min\n            </span>\n            <div className={cn(columnClass, 'min-w-ds-09')}>\n              {minutesRange.map((m) => (\n                <button\n                  key={m}\n                  type=\"button\"\n                  onClick={() => handleMinuteSelect(m)}\n                  className={cn(\n                    itemBase,\n                    minutes === m ? itemSelected : itemDefault,\n                  )}\n                  aria-label={`${padTwo(m)} minutes`}\n                  aria-selected={minutes === m || undefined}\n                >\n                  {padTwo(m)}\n                </button>\n              ))}\n            </div>\n          </div>\n\n          {/* Seconds column */}\n          {showSeconds && (\n            <div className=\"flex flex-col items-center gap-ds-02\">\n              <span className=\"text-caption font-medium text-surface-fg-subtle\">\n                Sec\n              </span>\n              <div className={cn(columnClass, 'min-w-ds-09')}>\n                {secondsRange.map((s) => (\n                  <button\n                    key={s}\n                    type=\"button\"\n                    onClick={() => handleSecondSelect(s)}\n                    className={cn(\n                      itemBase,\n                      seconds === s ? itemSelected : itemDefault,\n                    )}\n                    aria-label={`${padTwo(s)} seconds`}\n                    aria-selected={seconds === s || undefined}\n                  >\n                    {padTwo(s)}\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n\n          {/* AM/PM toggle for 12h format */}\n          {timeFormat === '12h' && (\n            <div className=\"flex flex-col items-center gap-ds-02\">\n              <span className=\"text-caption font-medium text-surface-fg-subtle\">\n                &nbsp;\n              </span>\n              <div className=\"flex flex-col gap-ds-01 px-ds-01\">\n                {(['AM', 'PM'] as const).map((period) => (\n                  <button\n                    key={period}\n                    type=\"button\"\n                    onClick={() => handleAmPmToggle(period)}\n                    className={cn(\n                      itemBase,\n                      'min-w-[44px] font-semibold',\n                      ampm === period ? itemSelected : itemDefault,\n                    )}\n                    aria-label={period}\n                    aria-selected={ampm === period || undefined}\n                  >\n                    {period}\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  )\n  },\n)\n\nTimePicker.displayName = 'TimePicker'\n\nexport { TimePicker }\n"],"mappings":"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"}

package/dist/composed/diff.d.ts

@@ -35,6 +35,24 @@ export interface DiffProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'o
     onAcceptHunk?: (hunk: DiffHunk) => void;
     /** When provided, each hunk shows a Reject control. */
     onRejectHunk?: (hunk: DiffHunk) => void;
+    /**
+     * Syntax-highlight full (non-word-diff) lines as this language. Lazy-loads
+     * `react-syntax-highlighter` with the same one-dark theme as `MarkdownViewer`,
+     * falling back to plain text until it resolves. Only affects `line`
+     * granularity in `inline`/`split` modes — ignored for `word` granularity
+     * (already word-highlighted) and `fields` mode (structured, not code).
+     */
+    language?: string;
+    /**
+     * Custom render for a `before` value that fails to parse as JSON in
+     * `fields` mode. Receives the raw string. @default a plain error message
+     */
+    beforeParseError?: (raw: string) => React.ReactNode;
+    /**
+     * Custom render for an `after` value that fails to parse as JSON in
+     * `fields` mode. Receives the raw string. @default a plain error message
+     */
+    afterParseError?: (raw: string) => React.ReactNode;
 }
 interface Row {
     kind: 'context' | 'del' | 'add';
@@ -74,17 +92,20 @@ interface DiffModel {
     onExpand: (k: number) => void;
     onAcceptHunk?: (h: DiffHunk) => void;
     onRejectHunk?: (h: DiffHunk) => void;
+    language?: string;
+    beforeParseError?: (raw: string) => React.ReactNode;
+    afterParseError?: (raw: string) => React.ReactNode;
 }
 /** Read the diff model inside a `<Diff.Root>`. Throws if used outside one. */
 declare function useDiff(): DiffModel;
-export interface DiffRootProps extends Pick<DiffProps, 'before' | 'after' | 'mode' | 'granularity' | 'collapseUnchanged' | 'collapseThreshold' | 'contextLines' | 'beforeLabel' | 'afterLabel' | 'onAcceptHunk' | 'onRejectHunk'> {
+export interface DiffRootProps extends Pick<DiffProps, 'before' | 'after' | 'mode' | 'granularity' | 'collapseUnchanged' | 'collapseThreshold' | 'contextLines' | 'beforeLabel' | 'afterLabel' | 'onAcceptHunk' | 'onRejectHunk' | 'language' | 'beforeParseError' | 'afterParseError'> {
     children: React.ReactNode;
 }
 /**
  * Computes the diff once and provides it to `Diff.Summary` / `Diff.Body`.
  * Compose your own layout around these parts, or use `<Diff>` for the default.
  */
-declare function DiffRoot({ before, after, mode, granularity, collapseUnchanged, collapseThreshold, contextLines, beforeLabel, afterLabel, onAcceptHunk, onRejectHunk, children, }: DiffRootProps): React.JSX.Element;
+declare function DiffRoot({ before, after, mode, granularity, collapseUnchanged, collapseThreshold, contextLines, beforeLabel, afterLabel, onAcceptHunk, onRejectHunk, language, beforeParseError, afterParseError, children, }: DiffRootProps): React.JSX.Element;
 /** The +N / −N / change-count summary. Reads from `Diff.Root`. */
 declare function DiffSummary({ className }: {
     className?: string;

package/dist/composed/diff.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"diff.d.ts","sourceRoot":"","sources":["../../src/composed/diff.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"diff.d.ts","sourceRoot":"","sources":["../../src/composed/diff.tsx"],"names":[],"mappings":"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"}