@k3-universe/react-kit 0.0.10 → 0.0.11

package/dist/index.js

@@ -3097,116 +3097,127 @@ const createLucideIcon = (iconName, iconNode) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$s = [
+const __iconNode$t = [
   ["path", { d: "M12 5v14", key: "s699le" }],
   ["path", { d: "m19 12-7 7-7-7", key: "1idqje" }]
 ];
-const ArrowDown = createLucideIcon("arrow-down", __iconNode$s);
+const ArrowDown = createLucideIcon("arrow-down", __iconNode$t);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$r = [
+const __iconNode$s = [
   ["path", { d: "m5 12 7-7 7 7", key: "hav0vg" }],
   ["path", { d: "M12 19V5", key: "x0mq9r" }]
 ];
-const ArrowUp = createLucideIcon("arrow-up", __iconNode$r);
+const ArrowUp = createLucideIcon("arrow-up", __iconNode$s);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$q = [
+const __iconNode$r = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
   ["path", { d: "M3 10h18", key: "8toen8" }]
 ];
-const Calendar$1 = createLucideIcon("calendar", __iconNode$q);
+const Calendar$1 = createLucideIcon("calendar", __iconNode$r);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$p = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$p);
+const __iconNode$q = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$q);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$o = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$o);
+const __iconNode$p = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$p);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$n = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
-const ChevronLeft = createLucideIcon("chevron-left", __iconNode$n);
+const __iconNode$o = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
+const ChevronLeft = createLucideIcon("chevron-left", __iconNode$o);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$m = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$m);
+const __iconNode$n = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$n);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$l = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
-const ChevronUp = createLucideIcon("chevron-up", __iconNode$l);
+const __iconNode$m = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
+const ChevronUp = createLucideIcon("chevron-up", __iconNode$m);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$k = [
+const __iconNode$l = [
   ["path", { d: "m11 17-5-5 5-5", key: "13zhaf" }],
   ["path", { d: "m18 17-5-5 5-5", key: "h8a8et" }]
 ];
-const ChevronsLeft = createLucideIcon("chevrons-left", __iconNode$k);
+const ChevronsLeft = createLucideIcon("chevrons-left", __iconNode$l);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$j = [
+const __iconNode$k = [
   ["path", { d: "m6 17 5-5-5-5", key: "xnjwq" }],
   ["path", { d: "m13 17 5-5-5-5", key: "17xmmf" }]
 ];
-const ChevronsRight = createLucideIcon("chevrons-right", __iconNode$j);
+const ChevronsRight = createLucideIcon("chevrons-right", __iconNode$k);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$i = [
+const __iconNode$j = [
   ["path", { d: "m7 15 5 5 5-5", key: "1hf1tw" }],
   ["path", { d: "m7 9 5-5 5 5", key: "sgt6xg" }]
 ];
-const ChevronsUpDown = createLucideIcon("chevrons-up-down", __iconNode$i);
+const ChevronsUpDown = createLucideIcon("chevrons-up-down", __iconNode$j);
+/**
+ * @license lucide-react v0.540.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$i = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
+const Circle = createLucideIcon("circle", __iconNode$i);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$h = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
-const Circle = createLucideIcon("circle", __iconNode$h);
+const __iconNode$h = [
+  ["path", { d: "M12 6v6l4 2", key: "mmk7yg" }],
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
+];
+const Clock = createLucideIcon("clock", __iconNode$h);
 /**
  * @license lucide-react v0.540.0 - ISC
  *
@@ -13719,7 +13730,7 @@ const oppositeAlignmentMap = {
   start: "end",
   end: "start"
 };
-function clamp$1(start, value, end) {
+function clamp$2(start, value, end) {
   return max$1(start, min$1(value, end));
 }
 function evaluate(value, param) {
@@ -14070,7 +14081,7 @@ const arrow$3 = (options) => ({
     const min$1$1 = minPadding;
     const max2 = clientSize - arrowDimensions[length] - maxPadding;
     const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
-    const offset2 = clamp$1(min$1$1, center, max2);
+    const offset2 = clamp$2(min$1$1, center, max2);
     const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset2 && rects.reference[length] / 2 - (center < min$1$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
     const alignmentOffset = shouldAddOffset ? center < min$1$1 ? center - min$1$1 : center - max2 : 0;
     return {
@@ -14367,14 +14378,14 @@ const shift$2 = function(options) {
         const maxSide = mainAxis === "y" ? "bottom" : "right";
         const min2 = mainAxisCoord + overflow[minSide];
         const max2 = mainAxisCoord - overflow[maxSide];
-        mainAxisCoord = clamp$1(min2, mainAxisCoord, max2);
+        mainAxisCoord = clamp$2(min2, mainAxisCoord, max2);
       }
       if (checkCrossAxis) {
         const minSide = crossAxis === "y" ? "top" : "left";
         const maxSide = crossAxis === "y" ? "bottom" : "right";
         const min2 = crossAxisCoord + overflow[minSide];
         const max2 = crossAxisCoord - overflow[maxSide];
-        crossAxisCoord = clamp$1(min2, crossAxisCoord, max2);
+        crossAxisCoord = clamp$2(min2, crossAxisCoord, max2);
       }
       const limitedCoords = limiter.fn({
         ...state,
@@ -18647,7 +18658,7 @@ function TextareaField({ field, value, onChange, className }) {
     }
   );
 }
-function clamp(value, [min2, max2]) {
+function clamp$1(value, [min2, max2]) {
   return Math.min(max2, Math.max(min2, value));
 }
 var VISUALLY_HIDDEN_STYLES = Object.freeze({
@@ -19185,7 +19196,7 @@ var SelectItemAlignedPosition = React.forwardRef((props2, forwardedRef) => {
         const minContentWidth = triggerRect.width + leftDelta;
         const contentWidth = Math.max(minContentWidth, contentRect.width);
         const rightEdge = window.innerWidth - CONTENT_MARGIN;
-        const clampedLeft = clamp(left, [
+        const clampedLeft = clamp$1(left, [
           CONTENT_MARGIN,
           // Prevents the content from going off the starting edge of the
           // viewport. It may still go off the ending edge, but this can be
@@ -19203,7 +19214,7 @@ var SelectItemAlignedPosition = React.forwardRef((props2, forwardedRef) => {
         const minContentWidth = triggerRect.width + rightDelta;
         const contentWidth = Math.max(minContentWidth, contentRect.width);
         const leftEdge = window.innerWidth - CONTENT_MARGIN;
-        const clampedRight = clamp(right, [
+        const clampedRight = clamp$1(right, [
           CONTENT_MARGIN,
           Math.max(CONTENT_MARGIN, leftEdge - contentWidth)
         ]);
@@ -21127,7 +21138,7 @@ function normalizeDates(context, ...dates) {
   );
   return dates.map(normalize);
 }
-function startOfDay$2(date2, options) {
+function startOfDay$4(date2, options) {
   const _date2 = toDate(date2, options == null ? void 0 : options.in);
   _date2.setHours(0, 0, 0, 0);
   return _date2;
@@ -21138,8 +21149,8 @@ function differenceInCalendarDays(laterDate, earlierDate, options) {
     laterDate,
     earlierDate
   );
-  const laterStartOfDay = startOfDay$2(laterDate_);
-  const earlierStartOfDay = startOfDay$2(earlierDate_);
+  const laterStartOfDay = startOfDay$4(laterDate_);
+  const earlierStartOfDay = startOfDay$4(earlierDate_);
   const laterTimestamp = +laterStartOfDay - getTimezoneOffsetInMilliseconds(laterStartOfDay);
   const earlierTimestamp = +earlierStartOfDay - getTimezoneOffsetInMilliseconds(earlierStartOfDay);
   return Math.round((laterTimestamp - earlierTimestamp) / millisecondsInDay);
@@ -21185,7 +21196,7 @@ function isSameDay(laterDate, earlierDate, options) {
     laterDate,
     earlierDate
   );
-  return +startOfDay$2(dateLeft_) === +startOfDay$2(dateRight_);
+  return +startOfDay$4(dateLeft_) === +startOfDay$4(dateRight_);
 }
 function isDate(value) {
   return value instanceof Date || typeof value === "object" && Object.prototype.toString.call(value) === "[object Date]";
@@ -22658,10 +22669,10 @@ function getMonth(date2, options) {
 function getYear(date2, options) {
   return toDate(date2, options == null ? void 0 : options.in).getFullYear();
 }
-function isAfter$2(date2, dateToCompare) {
+function isAfter$4(date2, dateToCompare) {
   return +toDate(date2) > +toDate(dateToCompare);
 }
-function isBefore$2(date2, dateToCompare) {
+function isBefore$4(date2, dateToCompare) {
   return +toDate(date2) < +toDate(dateToCompare);
 }
 function isSameMonth(laterDate, earlierDate, options) {
@@ -22827,11 +22838,11 @@ class DateLib {
     };
     this.isAfter = (date2, dateToCompare) => {
       var _a;
-      return ((_a = this.overrides) == null ? void 0 : _a.isAfter) ? this.overrides.isAfter(date2, dateToCompare) : isAfter$2(date2, dateToCompare);
+      return ((_a = this.overrides) == null ? void 0 : _a.isAfter) ? this.overrides.isAfter(date2, dateToCompare) : isAfter$4(date2, dateToCompare);
     };
     this.isBefore = (date2, dateToCompare) => {
       var _a;
-      return ((_a = this.overrides) == null ? void 0 : _a.isBefore) ? this.overrides.isBefore(date2, dateToCompare) : isBefore$2(date2, dateToCompare);
+      return ((_a = this.overrides) == null ? void 0 : _a.isBefore) ? this.overrides.isBefore(date2, dateToCompare) : isBefore$4(date2, dateToCompare);
     };
     this.isDate = (value) => {
       var _a;
@@ -22871,7 +22882,7 @@ class DateLib {
     };
     this.startOfDay = (date2) => {
       var _a;
-      return ((_a = this.overrides) == null ? void 0 : _a.startOfDay) ? this.overrides.startOfDay(date2) : startOfDay$2(date2);
+      return ((_a = this.overrides) == null ? void 0 : _a.startOfDay) ? this.overrides.startOfDay(date2) : startOfDay$4(date2);
     };
     this.startOfISOWeek = (date2) => {
       var _a;
@@ -24706,27 +24717,27 @@ function CalendarDayButton({
     }
   );
 }
-function isBefore$1(date2, min2) {
+function isBefore$3(date2, min2) {
   return !!(min2 && date2 < new Date(min2.getFullYear(), min2.getMonth(), min2.getDate()));
 }
-function isAfter$1(date2, max2) {
+function isAfter$3(date2, max2) {
   return !!(max2 && date2 > new Date(max2.getFullYear(), max2.getMonth(), max2.getDate()));
 }
-function startOfDay$1(d) {
+function startOfDay$3(d) {
   return new Date(d.getFullYear(), d.getMonth(), d.getDate());
 }
-function sameDay$1(a2, b2) {
+function sameDay$3(a2, b2) {
   return a2.getFullYear() === b2.getFullYear() && a2.getMonth() === b2.getMonth() && a2.getDate() === b2.getDate();
 }
-function inDisabled$1(date2, items) {
+function inDisabled$3(date2, items) {
   if (!items || items.length === 0) return false;
-  const d = startOfDay$1(date2);
+  const d = startOfDay$3(date2);
   for (const it of items) {
     if (it instanceof Date) {
-      if (sameDay$1(d, it)) return true;
+      if (sameDay$3(d, it)) return true;
     } else if (it && "from" in it && "to" in it) {
-      const from = startOfDay$1(it.from);
-      const to = startOfDay$1(it.to);
+      const from = startOfDay$3(it.from);
+      const to = startOfDay$3(it.to);
       if (d >= from && d <= to) return true;
     }
   }
@@ -24749,8 +24760,8 @@ function DatePicker({
   const isOpen = typeof props2.open === "boolean" ? props2.open : internalOpen;
   const setOpen = (o2) => props2.onOpenChange ? props2.onOpenChange(o2) : setInternalOpen(o2);
   const isDisabled = (date2) => {
-    if (isBefore$1(date2, minDate) || isAfter$1(date2, maxDate)) return true;
-    if (inDisabled$1(date2, disabledDates)) return true;
+    if (isBefore$3(date2, minDate) || isAfter$3(date2, maxDate)) return true;
+    if (inDisabled$3(date2, disabledDates)) return true;
     return false;
   };
   const label = value ? format2 ? format2(value) : value.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" }) : placeholder;
@@ -24837,42 +24848,42 @@ function DatePickerField({ field, value, onChange, className }) {
     }
   );
 }
-function sameDay(a2, b2) {
+function sameDay$2(a2, b2) {
   return a2.getFullYear() === b2.getFullYear() && a2.getMonth() === b2.getMonth() && a2.getDate() === b2.getDate();
 }
-function isBefore(date2, min2) {
+function isBefore$2(date2, min2) {
   return !!(min2 && date2 < new Date(min2.getFullYear(), min2.getMonth(), min2.getDate()));
 }
-function isAfter(date2, max2) {
+function isAfter$2(date2, max2) {
   return !!(max2 && date2 > new Date(max2.getFullYear(), max2.getMonth(), max2.getDate()));
 }
-function startOfDay(d) {
+function startOfDay$2(d) {
   return new Date(d.getFullYear(), d.getMonth(), d.getDate());
 }
-function inDisabled(date2, items) {
+function inDisabled$2(date2, items) {
   if (!items || items.length === 0) return false;
-  const d = startOfDay(date2);
+  const d = startOfDay$2(date2);
   for (const it of items) {
     if (it instanceof Date) {
-      if (sameDay(d, it)) return true;
+      if (sameDay$2(d, it)) return true;
     } else if (it && "from" in it && "to" in it) {
-      const from = startOfDay(it.from);
-      const to = startOfDay(it.to);
+      const from = startOfDay$2(it.from);
+      const to = startOfDay$2(it.to);
       if (d >= from && d <= to) return true;
     }
   }
   return false;
 }
-function rangeContainsDisabled(from, to, items) {
+function rangeContainsDisabled$1(from, to, items) {
   if (!from || !to) return false;
   if (!items || items.length === 0) return false;
-  const a2 = startOfDay(from);
-  const b2 = startOfDay(to);
+  const a2 = startOfDay$2(from);
+  const b2 = startOfDay$2(to);
   const start = a2 <= b2 ? a2 : b2;
   const end = a2 <= b2 ? b2 : a2;
   let cur = start;
   while (cur <= end) {
-    if (inDisabled(cur, items)) return true;
+    if (inDisabled$2(cur, items)) return true;
     cur = new Date(cur.getFullYear(), cur.getMonth(), cur.getDate() + 1);
   }
   return false;
@@ -24895,8 +24906,8 @@ function DateRangePicker({
   const isOpen = typeof props2.open === "boolean" ? props2.open : internalOpen;
   const setOpen = (o2) => props2.onOpenChange ? props2.onOpenChange(o2) : setInternalOpen(o2);
   const isDisabled = (date2) => {
-    if (isBefore(date2, minDate) || isAfter(date2, maxDate)) return true;
-    if (inDisabled(date2, disabledDates)) return true;
+    if (isBefore$2(date2, minDate) || isAfter$2(date2, maxDate)) return true;
+    if (inDisabled$2(date2, disabledDates)) return true;
     return false;
   };
   const label = (value == null ? void 0 : value.from) ? format2 ? format2(value.from, value.to) : value.to ? `${value.from.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" })} 	– ${value.to.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" })}` : `${value.from.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" })} 	– …` : placeholder;
@@ -24942,7 +24953,7 @@ function DateRangePicker({
     const out = new Date(yyyy, mm - 1, dd);
     if (minDate && out < new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate())) return void 0;
     if (maxDate && out > new Date(maxDate.getFullYear(), maxDate.getMonth(), maxDate.getDate())) return void 0;
-    if (inDisabled(out, disabledDates)) return void 0;
+    if (inDisabled$2(out, disabledDates)) return void 0;
     return out;
   };
   const onFromChange = (val) => {
@@ -24959,7 +24970,7 @@ function DateRangePicker({
   const toInvalid = toTouched && !!toInput && !toParsed;
   const mergedFrom = fromParsed ?? (draft == null ? void 0 : draft.from) ?? void 0;
   const mergedTo = toParsed ?? (draft == null ? void 0 : draft.to) ?? void 0;
-  const invalidRange = !mergedFrom || !mergedTo || isDisabled(mergedFrom) || isDisabled(mergedTo) || mergedFrom > mergedTo || rangeContainsDisabled(mergedFrom, mergedTo, disabledDates);
+  const invalidRange = !mergedFrom || !mergedTo || isDisabled(mergedFrom) || isDisabled(mergedTo) || mergedFrom > mergedTo || rangeContainsDisabled$1(mergedFrom, mergedTo, disabledDates);
   const applyFromInput = () => {
     setFromTouched(true);
     if (!fromParsed) return;
@@ -24970,7 +24981,7 @@ function DateRangePicker({
     if (!toParsed) return;
     setDraft((prev) => ({ from: prev == null ? void 0 : prev.from, to: toParsed }));
   };
-  const draftInvalidForSelection = !!(draft == null ? void 0 : draft.from) && isDisabled(draft.from) || !!(draft == null ? void 0 : draft.to) && isDisabled(draft.to) || !!(draft == null ? void 0 : draft.from) && !!(draft == null ? void 0 : draft.to) && rangeContainsDisabled(draft.from, draft.to, disabledDates);
+  const draftInvalidForSelection = !!(draft == null ? void 0 : draft.from) && isDisabled(draft.from) || !!(draft == null ? void 0 : draft.to) && isDisabled(draft.to) || !!(draft == null ? void 0 : draft.from) && !!(draft == null ? void 0 : draft.to) && rangeContainsDisabled$1(draft.from, draft.to, disabledDates);
   const selectedRange = draftInvalidForSelection ? void 0 : draft ?? void 0;
   const startOfDay2 = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
   const startOfWeek2 = (d) => {
@@ -25063,7 +25074,7 @@ function DateRangePicker({
   const presets = (props2.presets ?? props2.quickSelectors ?? defaultPresets).filter(Boolean);
   const eqRange = (a2, b2) => {
     if (!(a2 == null ? void 0 : a2.from) || !(a2 == null ? void 0 : a2.to) || !(b2 == null ? void 0 : b2.from) || !(b2 == null ? void 0 : b2.to)) return false;
-    return sameDay(a2.from, b2.from) && sameDay(a2.to, b2.to);
+    return sameDay$2(a2.from, b2.from) && sameDay$2(a2.to, b2.to);
   };
   return /* @__PURE__ */ jsx("div", { className: cn$1("w-fit", className), ...props2, children: /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: (o2) => !disabled && setOpen(o2), children: [
     /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
@@ -25136,7 +25147,7 @@ function DateRangePicker({
                   setDraft({ from, to: void 0 });
                   return;
                 }
-                if (from && to && rangeContainsDisabled(from, to, disabledDates)) {
+                if (from && to && rangeContainsDisabled$1(from, to, disabledDates)) {
                   setDraft(null);
                   setFromTouched(true);
                   setToTouched(true);
@@ -25168,7 +25179,7 @@ function DateRangePicker({
               variant: active ? "secondary" : "ghost",
               className: "justify-between w-full",
               onClick: () => {
-                if (rangeContainsDisabled(pr.from, pr.to, disabledDates)) return;
+                if (rangeContainsDisabled$1(pr.from, pr.to, disabledDates)) return;
                 setDraft(pr);
                 setFromTouched(false);
                 setToTouched(false);
@@ -25907,6 +25918,1167 @@ function MonthRangePickerField({ field, value, onChange, className }) {
     }
   );
 }
+const clamp = (n2, min2, max2) => Math.max(min2, Math.min(max2, n2));
+const pad2$3 = (n2) => String(n2).padStart(2, "0");
+function TimePicker({
+  value,
+  onChange,
+  placeholder = "Pick a time",
+  disabled,
+  precision = "minute",
+  hourCycle = 24,
+  minuteStep = 5,
+  secondStep = 5,
+  className,
+  buttonVariant = "outline",
+  ...props2
+}) {
+  const [internalOpen, setInternalOpen] = React.useState(false);
+  const isOpen = typeof props2.open === "boolean" ? props2.open : internalOpen;
+  const setOpen = (o2) => props2.onOpenChange ? props2.onOpenChange(o2) : setInternalOpen(o2);
+  const [draft, setDraft] = React.useState(value ?? null);
+  React.useEffect(() => {
+    if (isOpen) setDraft(value ?? null);
+  }, [isOpen, value]);
+  const fmtLabel = (d) => {
+    if (!d) return placeholder;
+    const h = d.getHours();
+    const m2 = d.getMinutes();
+    const s2 = d.getSeconds();
+    if (hourCycle === 12) {
+      const period = h >= 12 ? "PM" : "AM";
+      const hour12 = h % 12 === 0 ? 12 : h % 12;
+      if (precision === "hour") return `${hour12} ${period}`;
+      if (precision === "minute") return `${hour12}:${pad2$3(m2)} ${period}`;
+      return `${hour12}:${pad2$3(m2)}:${pad2$3(s2)} ${period}`;
+    }
+    if (precision === "hour") return `${pad2$3(h)}`;
+    if (precision === "minute") return `${pad2$3(h)}:${pad2$3(m2)}`;
+    return `${pad2$3(h)}:${pad2$3(m2)}:${pad2$3(s2)}`;
+  };
+  const setDraftPart = (part, val) => {
+    setDraft((prev) => {
+      const base = prev ? new Date(prev) : (() => {
+        const n2 = /* @__PURE__ */ new Date();
+        return new Date(
+          n2.getFullYear(),
+          n2.getMonth(),
+          n2.getDate(),
+          0,
+          0,
+          0,
+          0
+        );
+      })();
+      if (part === "hour") {
+        let h = Number(val);
+        if (hourCycle === 12) {
+          const isPM = base.getHours() >= 12;
+          h = h % 12;
+          base.setHours(isPM ? h === 12 ? 12 : h + 12 : h === 12 ? 0 : h);
+        } else {
+          base.setHours(clamp(h, 0, 23));
+        }
+      } else if (part === "minute") {
+        base.setMinutes(clamp(Number(val), 0, 59));
+      } else if (part === "second") {
+        base.setSeconds(clamp(Number(val), 0, 59));
+      } else if (part === "period" && (val === "AM" || val === "PM")) {
+        const curH = base.getHours();
+        const isAMNow = curH < 12;
+        if (val === "AM" && !isAMNow) base.setHours(curH - 12);
+        if (val === "PM" && isAMNow) base.setHours(curH + 12);
+      }
+      base.setMilliseconds(0);
+      return new Date(base);
+    });
+  };
+  const hours = React.useMemo(() => {
+    return hourCycle === 12 ? Array.from({ length: 12 }, (_2, i2) => i2 + 1) : Array.from({ length: 24 }, (_2, i2) => i2);
+  }, [hourCycle]);
+  const minutes = React.useMemo(
+    () => Array.from(
+      { length: Math.ceil(60 / minuteStep) },
+      (_2, i2) => i2 * minuteStep
+    ),
+    [minuteStep]
+  );
+  const seconds = React.useMemo(
+    () => Array.from(
+      { length: Math.ceil(60 / secondStep) },
+      (_2, i2) => i2 * secondStep
+    ),
+    [secondStep]
+  );
+  const selectedHour = React.useMemo(() => {
+    if (!draft) return hourCycle === 12 ? 12 : 0;
+    const h = draft.getHours();
+    return hourCycle === 12 ? h % 12 === 0 ? 12 : h % 12 : h;
+  }, [draft, hourCycle]);
+  const selectedMinute = (draft == null ? void 0 : draft.getMinutes()) ?? 0;
+  const selectedSecond = (draft == null ? void 0 : draft.getSeconds()) ?? 0;
+  const selectedPeriod = draft && draft.getHours() >= 12 ? "PM" : "AM";
+  const label = fmtLabel(value ?? null);
+  return /* @__PURE__ */ jsx("div", { className: cn$1("w-fit", className), ...props2, children: /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button$1,
+      {
+        type: "button",
+        disabled,
+        variant: buttonVariant,
+        className: cn$1(
+          "w-[240px] justify-start text-left font-normal",
+          !value && "text-muted-foreground"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Clock, { className: "mr-2 h-4 w-4" }),
+          label
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { className: "p-3 w-auto", align: "start", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Hour" }),
+          /* @__PURE__ */ jsxs(
+            Select$1,
+            {
+              disabled,
+              value: String(selectedHour),
+              onValueChange: (v) => setDraftPart("hour", Number(v)),
+              children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Hour", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                /* @__PURE__ */ jsx(SelectContent, { children: hours.map((h) => /* @__PURE__ */ jsx(SelectItem, { value: String(h), children: hourCycle === 12 ? h : pad2$3(h) }, h)) })
+              ]
+            }
+          )
+        ] }),
+        (precision === "minute" || precision === "second") && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Minute" }),
+          /* @__PURE__ */ jsxs(
+            Select$1,
+            {
+              disabled,
+              value: String(selectedMinute - selectedMinute % minuteStep),
+              onValueChange: (v) => setDraftPart("minute", Number(v)),
+              children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Minute", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                /* @__PURE__ */ jsx(SelectContent, { children: minutes.map((m2) => /* @__PURE__ */ jsx(SelectItem, { value: String(m2), children: pad2$3(m2) }, m2)) })
+              ]
+            }
+          )
+        ] }),
+        precision === "second" && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Second" }),
+          /* @__PURE__ */ jsxs(
+            Select$1,
+            {
+              disabled,
+              value: String(selectedSecond - selectedSecond % secondStep),
+              onValueChange: (v) => setDraftPart("second", Number(v)),
+              children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Second", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                /* @__PURE__ */ jsx(SelectContent, { children: seconds.map((s2) => /* @__PURE__ */ jsx(SelectItem, { value: String(s2), children: pad2$3(s2) }, s2)) })
+              ]
+            }
+          )
+        ] }),
+        hourCycle === 12 && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Period" }),
+          /* @__PURE__ */ jsxs(
+            Select$1,
+            {
+              disabled,
+              value: selectedPeriod,
+              onValueChange: (v) => setDraftPart("period", v),
+              children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Period", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                /* @__PURE__ */ jsxs(SelectContent, { children: [
+                  /* @__PURE__ */ jsx(SelectItem, { value: "AM", children: "AM" }),
+                  /* @__PURE__ */ jsx(SelectItem, { value: "PM", children: "PM" })
+                ] })
+              ]
+            }
+          )
+        ] })
+      ] }),
+      (props2.showFooter ?? true) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 pt-3 mt-3 border-t", children: [
+        /* @__PURE__ */ jsx(
+          Button$1,
+          {
+            type: "button",
+            variant: "outline",
+            size: "sm",
+            onClick: () => setOpen(false),
+            disabled,
+            children: props2.cancelLabel ?? "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Button$1,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              onClick: () => onChange == null ? void 0 : onChange(null),
+              disabled,
+              children: props2.clearLabel ?? "Clear"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button$1,
+            {
+              type: "button",
+              variant: "default",
+              size: "sm",
+              onClick: () => {
+                onChange == null ? void 0 : onChange(draft ?? null);
+                setOpen(false);
+              },
+              children: props2.applyLabel ?? "Apply"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+TimePicker.displayName = "TimePicker";
+function TimePickerField({ field, value, onChange, className }) {
+  const v = React.useMemo(() => {
+    if (!value) return null;
+    if (value instanceof Date) return value;
+    const d = new Date(value);
+    return Number.isNaN(d.getTime()) ? null : d;
+  }, [value]);
+  return /* @__PURE__ */ jsx(
+    TimePicker,
+    {
+      className,
+      value: v,
+      onChange: (d) => onChange(d),
+      placeholder: field.placeholder,
+      precision: field.timePrecision ?? "minute",
+      hourCycle: field.hourCycle ?? 24,
+      minuteStep: field.minuteStep ?? 5,
+      secondStep: field.secondStep ?? 5,
+      showFooter: field.showFooter,
+      cancelLabel: field.cancelLabel,
+      applyLabel: field.applyLabel
+    }
+  );
+}
+const pad2$2 = (n2) => String(n2).padStart(2, "0");
+function TimeUnitSelector({
+  label,
+  hourCycle,
+  precision,
+  minuteStep,
+  secondStep,
+  disabled,
+  value,
+  onChange
+}) {
+  const hours = React.useMemo(() => hourCycle === 12 ? Array.from({ length: 12 }, (_2, i2) => i2 + 1) : Array.from({ length: 24 }, (_2, i2) => i2), [hourCycle]);
+  const minutes = React.useMemo(() => Array.from({ length: Math.ceil(60 / minuteStep) }, (_2, i2) => i2 * minuteStep), [minuteStep]);
+  const seconds = React.useMemo(() => Array.from({ length: Math.ceil(60 / secondStep) }, (_2, i2) => i2 * secondStep), [secondStep]);
+  const selectedHour = React.useMemo(() => {
+    if (!value) return hourCycle === 12 ? 12 : 0;
+    const h = value.getHours();
+    return hourCycle === 12 ? h % 12 === 0 ? 12 : h % 12 : h;
+  }, [value, hourCycle]);
+  const selectedMinute = (value == null ? void 0 : value.getMinutes()) ?? 0;
+  const selectedSecond = (value == null ? void 0 : value.getSeconds()) ?? 0;
+  const selectedPeriod = value && value.getHours() >= 12 ? "PM" : "AM";
+  const setPart = (part, v) => {
+    const base = value ? new Date(value) : (() => {
+      const n2 = /* @__PURE__ */ new Date();
+      return new Date(n2.getFullYear(), n2.getMonth(), n2.getDate(), 0, 0, 0, 0);
+    })();
+    if (part === "hour") {
+      let h = Number(v);
+      if (hourCycle === 12) {
+        const isPM = base.getHours() >= 12;
+        h = h % 12;
+        base.setHours(isPM ? h === 12 ? 12 : h + 12 : h === 12 ? 0 : h);
+      } else {
+        base.setHours(h);
+      }
+    } else if (part === "minute") {
+      base.setMinutes(Number(v));
+    } else if (part === "second") {
+      base.setSeconds(Number(v));
+    } else if (part === "period" && (v === "AM" || v === "PM")) {
+      const curH = base.getHours();
+      const isAMNow = curH < 12;
+      if (v === "AM" && !isAMNow) base.setHours(curH - 12);
+      if (v === "PM" && isAMNow) base.setHours(curH + 12);
+    }
+    base.setMilliseconds(0);
+    onChange(base);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Hour" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedHour), onValueChange: (v) => setPart("hour", Number(v)), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} hour`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: hours.map((h) => /* @__PURE__ */ jsx(SelectItem, { value: String(h), children: hourCycle === 12 ? h : pad2$2(h) }, h)) })
+        ] })
+      ] }),
+      (precision === "minute" || precision === "second") && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Minute" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedMinute - selectedMinute % minuteStep), onValueChange: (v) => setPart("minute", Number(v)), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} minute`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: minutes.map((m2) => /* @__PURE__ */ jsx(SelectItem, { value: String(m2), children: pad2$2(m2) }, m2)) })
+        ] })
+      ] }),
+      precision === "second" && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Second" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedSecond - selectedSecond % secondStep), onValueChange: (v) => setPart("second", Number(v)), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} second`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: seconds.map((s2) => /* @__PURE__ */ jsx(SelectItem, { value: String(s2), children: pad2$2(s2) }, s2)) })
+        ] })
+      ] }),
+      hourCycle === 12 && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Period" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: selectedPeriod, onValueChange: (v) => setPart("period", v), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} period`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: "AM", children: "AM" }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "PM", children: "PM" })
+          ] })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function TimeRangePicker({
+  value,
+  onChange,
+  placeholder = "Pick a time range",
+  disabled,
+  precision = "minute",
+  hourCycle = 24,
+  minuteStep = 5,
+  secondStep = 5,
+  className,
+  buttonVariant = "outline",
+  format: format2,
+  ...props2
+}) {
+  const [internalOpen, setInternalOpen] = React.useState(false);
+  const isOpen = typeof props2.open === "boolean" ? props2.open : internalOpen;
+  const setOpen = (o2) => props2.onOpenChange ? props2.onOpenChange(o2) : setInternalOpen(o2);
+  const [draft, setDraft] = React.useState(value ?? null);
+  React.useEffect(() => {
+    if (isOpen) setDraft(value ?? null);
+  }, [isOpen, value]);
+  const label = React.useMemo(() => {
+    const f = (draft == null ? void 0 : draft.from) ?? (value == null ? void 0 : value.from) ?? null;
+    const t2 = (draft == null ? void 0 : draft.to) ?? (value == null ? void 0 : value.to) ?? null;
+    if (format2) return format2(f ?? null, t2 ?? null);
+    const fs = f ? hourCycle === 12 ? `${f.getHours() % 12 || 12}:${pad2$2(f.getMinutes())}${precision === "second" ? `:${pad2$2(f.getSeconds())}` : ""} ${f.getHours() >= 12 ? "PM" : "AM"}` : `${pad2$2(f.getHours())}:${pad2$2(f.getMinutes())}${precision === "second" ? `:${pad2$2(f.getSeconds())}` : ""}` : null;
+    const ts = t2 ? hourCycle === 12 ? `${t2.getHours() % 12 || 12}:${pad2$2(t2.getMinutes())}${precision === "second" ? `:${pad2$2(t2.getSeconds())}` : ""} ${t2.getHours() >= 12 ? "PM" : "AM"}` : `${pad2$2(t2.getHours())}:${pad2$2(t2.getMinutes())}${precision === "second" ? `:${pad2$2(t2.getSeconds())}` : ""}` : null;
+    return fs && ts ? `${fs} – ${ts}` : placeholder;
+  }, [draft, value, format2, hourCycle, precision, placeholder]);
+  return /* @__PURE__ */ jsx("div", { className: cn$1("w-fit", className), ...props2, children: /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button$1,
+      {
+        type: "button",
+        disabled,
+        variant: buttonVariant,
+        className: cn$1("w-[280px] justify-start text-left font-normal", !value && "text-muted-foreground"),
+        children: [
+          /* @__PURE__ */ jsx(Clock, { className: "mr-2 h-4 w-4" }),
+          label
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { className: "p-3 w-auto", align: "start", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx(
+          TimeUnitSelector,
+          {
+            label: "From",
+            value: (draft == null ? void 0 : draft.from) ?? null,
+            onChange: (d) => setDraft((prev) => ({ ...prev ?? {}, from: d })),
+            hourCycle,
+            precision,
+            minuteStep,
+            secondStep,
+            disabled
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          TimeUnitSelector,
+          {
+            label: "To",
+            value: (draft == null ? void 0 : draft.to) ?? null,
+            onChange: (d) => setDraft((prev) => ({ ...prev ?? {}, to: d })),
+            hourCycle,
+            precision,
+            minuteStep,
+            secondStep,
+            disabled
+          }
+        )
+      ] }),
+      (props2.showFooter ?? true) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 pt-3 mt-3 border-t", children: [
+        /* @__PURE__ */ jsx(
+          Button$1,
+          {
+            type: "button",
+            variant: "outline",
+            size: "sm",
+            onClick: () => setOpen(false),
+            disabled,
+            children: props2.cancelLabel ?? "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Button$1,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              onClick: () => onChange == null ? void 0 : onChange(null),
+              disabled,
+              children: props2.clearLabel ?? "Clear"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button$1,
+            {
+              type: "button",
+              variant: "default",
+              size: "sm",
+              onClick: () => {
+                onChange == null ? void 0 : onChange(draft ?? null);
+                setOpen(false);
+              },
+              children: props2.applyLabel ?? "Apply"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+TimeRangePicker.displayName = "TimeRangePicker";
+function TimeRangePickerField({ field, value, onChange, className }) {
+  const v = React.useMemo(() => {
+    if (!value || typeof value !== "object") return null;
+    const anyVal = value;
+    const toDate2 = (x2) => {
+      if (!x2) return void 0;
+      if (x2 instanceof Date) return x2;
+      const d = new Date(x2);
+      return Number.isNaN(d.getTime()) ? void 0 : d;
+    };
+    const from = toDate2(anyVal.from) ?? null;
+    const to = toDate2(anyVal.to) ?? null;
+    return { from, to };
+  }, [value]);
+  return /* @__PURE__ */ jsx(
+    TimeRangePicker,
+    {
+      className,
+      value: v,
+      onChange: (range) => onChange(range),
+      placeholder: field.placeholder,
+      precision: field.timePrecision ?? "minute",
+      hourCycle: field.hourCycle ?? 24,
+      minuteStep: field.minuteStep ?? 5,
+      secondStep: field.secondStep ?? 5,
+      showFooter: field.showFooter,
+      cancelLabel: field.cancelLabel,
+      applyLabel: field.applyLabel
+    }
+  );
+}
+const startOfDay$1 = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
+const pad2$1 = (n2) => String(n2).padStart(2, "0");
+const isBefore$1 = (date2, min2) => !!(min2 && date2 < startOfDay$1(min2));
+const isAfter$1 = (date2, max2) => !!(max2 && date2 > startOfDay$1(max2));
+function sameDay$1(a2, b2) {
+  return a2.getFullYear() === b2.getFullYear() && a2.getMonth() === b2.getMonth() && a2.getDate() === b2.getDate();
+}
+function inDisabled$1(date2, items) {
+  if (!items || items.length === 0) return false;
+  const d = startOfDay$1(date2);
+  for (const it of items) {
+    if (it instanceof Date) {
+      if (sameDay$1(d, it)) return true;
+    } else if (it && "from" in it && "to" in it) {
+      const from = startOfDay$1(it.from);
+      const to = startOfDay$1(it.to);
+      if (d >= from && d <= to) return true;
+    }
+  }
+  return false;
+}
+function TimeSelectors$1({
+  value,
+  onChange,
+  precision,
+  hourCycle,
+  minuteStep,
+  secondStep,
+  disabled
+}) {
+  const hours = React.useMemo(() => hourCycle === 12 ? Array.from({ length: 12 }, (_2, i2) => i2 + 1) : Array.from({ length: 24 }, (_2, i2) => i2), [hourCycle]);
+  const minutes = React.useMemo(() => Array.from({ length: Math.ceil(60 / minuteStep) }, (_2, i2) => i2 * minuteStep), [minuteStep]);
+  const seconds = React.useMemo(() => Array.from({ length: Math.ceil(60 / secondStep) }, (_2, i2) => i2 * secondStep), [secondStep]);
+  const selectedHour = React.useMemo(() => {
+    if (!value) return hourCycle === 12 ? 12 : 0;
+    const h = value.getHours();
+    return hourCycle === 12 ? h % 12 === 0 ? 12 : h % 12 : h;
+  }, [value, hourCycle]);
+  const selectedMinute = (value == null ? void 0 : value.getMinutes()) ?? 0;
+  const selectedSecond = (value == null ? void 0 : value.getSeconds()) ?? 0;
+  const selectedPeriod = value && value.getHours() >= 12 ? "PM" : "AM";
+  const setPart = (part, v) => {
+    const base = value ? new Date(value) : (() => {
+      const n2 = /* @__PURE__ */ new Date();
+      return new Date(n2.getFullYear(), n2.getMonth(), n2.getDate(), 0, 0, 0, 0);
+    })();
+    if (part === "hour") {
+      let h = Number(v);
+      if (hourCycle === 12) {
+        const isPM = base.getHours() >= 12;
+        h = h % 12;
+        base.setHours(isPM ? h === 12 ? 12 : h + 12 : h === 12 ? 0 : h);
+      } else {
+        base.setHours(h);
+      }
+    } else if (part === "minute") {
+      base.setMinutes(Number(v));
+    } else if (part === "second") {
+      base.setSeconds(Number(v));
+    } else if (part === "period" && (v === "AM" || v === "PM")) {
+      const curH = base.getHours();
+      const isAMNow = curH < 12;
+      if (v === "AM" && !isAMNow) base.setHours(curH - 12);
+      if (v === "PM" && isAMNow) base.setHours(curH + 12);
+    }
+    base.setMilliseconds(0);
+    onChange(base);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Hour" }),
+      /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedHour), onValueChange: (v) => setPart("hour", Number(v)), children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Hour", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsx(SelectContent, { children: hours.map((h) => /* @__PURE__ */ jsx(SelectItem, { value: String(h), children: hourCycle === 12 ? h : pad2$1(h) }, h)) })
+      ] })
+    ] }),
+    (precision === "minute" || precision === "second") && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Minute" }),
+      /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedMinute - selectedMinute % minuteStep), onValueChange: (v) => setPart("minute", Number(v)), children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Minute", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsx(SelectContent, { children: minutes.map((m2) => /* @__PURE__ */ jsx(SelectItem, { value: String(m2), children: pad2$1(m2) }, m2)) })
+      ] })
+    ] }),
+    precision === "second" && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Second" }),
+      /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedSecond - selectedSecond % secondStep), onValueChange: (v) => setPart("second", Number(v)), children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Second", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsx(SelectContent, { children: seconds.map((s2) => /* @__PURE__ */ jsx(SelectItem, { value: String(s2), children: pad2$1(s2) }, s2)) })
+      ] })
+    ] }),
+    hourCycle === 12 && /* @__PURE__ */ jsxs("div", { className: "w-24", children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Period" }),
+      /* @__PURE__ */ jsxs(Select$1, { disabled, value: selectedPeriod, onValueChange: (v) => setPart("period", v), children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Period", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsxs(SelectContent, { children: [
+          /* @__PURE__ */ jsx(SelectItem, { value: "AM", children: "AM" }),
+          /* @__PURE__ */ jsx(SelectItem, { value: "PM", children: "PM" })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function DateTimePicker({
+  value,
+  onChange,
+  placeholder = "Pick a date & time",
+  disabled,
+  minDate,
+  maxDate,
+  disabledDates,
+  timePrecision = "minute",
+  hourCycle = 24,
+  minuteStep = 5,
+  secondStep = 5,
+  className,
+  buttonVariant = "outline",
+  ...props2
+}) {
+  const [internalOpen, setInternalOpen] = React.useState(false);
+  const isOpen = typeof props2.open === "boolean" ? props2.open : internalOpen;
+  const setOpen = (o2) => props2.onOpenChange ? props2.onOpenChange(o2) : setInternalOpen(o2);
+  const [draft, setDraft] = React.useState(value ?? null);
+  React.useEffect(() => {
+    if (isOpen) setDraft(value ?? null);
+  }, [isOpen, value]);
+  const isDisabled = (date2) => {
+    if (isBefore$1(date2, minDate) || isAfter$1(date2, maxDate)) return true;
+    if (inDisabled$1(date2, disabledDates)) return true;
+    return false;
+  };
+  const fmtLabel = (d) => {
+    if (!d) return placeholder;
+    const dateStr = d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" });
+    const h = d.getHours();
+    const m2 = d.getMinutes();
+    const s2 = d.getSeconds();
+    const timeStr = hourCycle === 12 ? `${h % 12 || 12}:${pad2$1(m2)}${timePrecision === "second" ? `:${pad2$1(s2)}` : ""} ${h >= 12 ? "PM" : "AM"}` : `${pad2$1(h)}:${pad2$1(m2)}${timePrecision === "second" ? `:${pad2$1(s2)}` : ""}`;
+    return `${dateStr} ${timeStr}`;
+  };
+  const label = fmtLabel(value ?? null);
+  return /* @__PURE__ */ jsx("div", { className: cn$1("w-fit", className), ...props2, children: /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button$1,
+      {
+        type: "button",
+        disabled,
+        variant: buttonVariant,
+        className: cn$1("w-[280px] justify-start text-left font-normal", !value && "text-muted-foreground"),
+        children: [
+          /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4" }),
+          label
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { className: "p-0", align: "start", children: [
+      /* @__PURE__ */ jsxs("div", { className: "p-3 space-y-3", children: [
+        /* @__PURE__ */ jsx(
+          Calendar,
+          {
+            mode: "single",
+            selected: draft ?? void 0,
+            onSelect: (d) => {
+              if (disabled) return;
+              if (!d) return;
+              if (isDisabled(d)) return;
+              if (draft) {
+                const nd = new Date(d.getFullYear(), d.getMonth(), d.getDate(), draft.getHours(), draft.getMinutes(), draft.getSeconds());
+                setDraft(nd);
+              } else {
+                setDraft(new Date(d.getFullYear(), d.getMonth(), d.getDate(), 0, 0, 0));
+              }
+            },
+            defaultMonth: draft ?? /* @__PURE__ */ new Date(),
+            disabled: isDisabled,
+            buttonVariant: "ghost",
+            showOutsideDays: true
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Time" }),
+          /* @__PURE__ */ jsx(
+            TimeSelectors$1,
+            {
+              value: draft,
+              onChange: (d) => setDraft(d),
+              precision: timePrecision,
+              hourCycle,
+              minuteStep,
+              secondStep,
+              disabled
+            }
+          )
+        ] })
+      ] }),
+      (props2.showFooter ?? true) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 p-2 border-t", children: [
+        /* @__PURE__ */ jsx(Button$1, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(false), disabled, children: props2.cancelLabel ?? "Cancel" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx(Button$1, { type: "button", variant: "ghost", size: "sm", onClick: () => onChange == null ? void 0 : onChange(null), disabled, children: props2.clearLabel ?? "Clear" }),
+          /* @__PURE__ */ jsx(
+            Button$1,
+            {
+              type: "button",
+              variant: "default",
+              size: "sm",
+              onClick: () => {
+                onChange == null ? void 0 : onChange(draft ?? null);
+                setOpen(false);
+              },
+              children: props2.applyLabel ?? "Apply"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+DateTimePicker.displayName = "DateTimePicker";
+function DateTimePickerField({ field, value, onChange, className }) {
+  const v = React.useMemo(() => {
+    if (!value) return null;
+    if (value instanceof Date) return value;
+    const d = new Date(value);
+    return Number.isNaN(d.getTime()) ? null : d;
+  }, [value]);
+  return /* @__PURE__ */ jsx(
+    DateTimePicker,
+    {
+      className,
+      value: v,
+      onChange: (d) => onChange(d),
+      placeholder: field.placeholder,
+      minDate: field.minDate,
+      maxDate: field.maxDate,
+      disabledDates: field.disabledDates,
+      timePrecision: field.timePrecision ?? "minute",
+      hourCycle: field.hourCycle ?? 24,
+      minuteStep: field.minuteStep ?? 5,
+      secondStep: field.secondStep ?? 5,
+      showFooter: field.showFooter,
+      cancelLabel: field.cancelLabel,
+      applyLabel: field.applyLabel
+    }
+  );
+}
+const pad2 = (n2) => String(n2).padStart(2, "0");
+function startOfDay(d) {
+  return new Date(d.getFullYear(), d.getMonth(), d.getDate());
+}
+function sameDay(a2, b2) {
+  return a2.getFullYear() === b2.getFullYear() && a2.getMonth() === b2.getMonth() && a2.getDate() === b2.getDate();
+}
+function isBefore(date2, min2) {
+  return !!(min2 && date2 < startOfDay(min2));
+}
+function isAfter(date2, max2) {
+  return !!(max2 && date2 > startOfDay(max2));
+}
+function inDisabled(date2, items) {
+  if (!items || items.length === 0) return false;
+  const d = startOfDay(date2);
+  for (const it of items) {
+    if (it instanceof Date) {
+      if (sameDay(d, it)) return true;
+    } else if (it && "from" in it && "to" in it) {
+      const from = startOfDay(it.from);
+      const to = startOfDay(it.to);
+      if (d >= from && d <= to) return true;
+    }
+  }
+  return false;
+}
+function rangeContainsDisabled(from, to, items) {
+  if (!from || !to) return false;
+  if (!items || items.length === 0) return false;
+  const a2 = startOfDay(from);
+  const b2 = startOfDay(to);
+  const start = a2 <= b2 ? a2 : b2;
+  const end = a2 <= b2 ? b2 : a2;
+  let cur = start;
+  while (cur <= end) {
+    if (inDisabled(cur, items)) return true;
+    cur = new Date(cur.getFullYear(), cur.getMonth(), cur.getDate() + 1);
+  }
+  return false;
+}
+function TimeSelectors({
+  label,
+  value,
+  onChange,
+  precision,
+  hourCycle,
+  minuteStep,
+  secondStep,
+  disabled,
+  compact: compact2
+}) {
+  const hours = React.useMemo(() => hourCycle === 12 ? Array.from({ length: 12 }, (_2, i2) => i2 + 1) : Array.from({ length: 24 }, (_2, i2) => i2), [hourCycle]);
+  const minutes = React.useMemo(() => Array.from({ length: Math.ceil(60 / minuteStep) }, (_2, i2) => i2 * minuteStep), [minuteStep]);
+  const seconds = React.useMemo(() => Array.from({ length: Math.ceil(60 / secondStep) }, (_2, i2) => i2 * secondStep), [secondStep]);
+  const selectedHour = React.useMemo(() => {
+    if (!value) return hourCycle === 12 ? 12 : 0;
+    const h = value.getHours();
+    return hourCycle === 12 ? h % 12 === 0 ? 12 : h % 12 : h;
+  }, [value, hourCycle]);
+  const selectedMinute = (value == null ? void 0 : value.getMinutes()) ?? 0;
+  const selectedSecond = (value == null ? void 0 : value.getSeconds()) ?? 0;
+  const selectedPeriod = value && value.getHours() >= 12 ? "PM" : "AM";
+  const setPart = (part, v) => {
+    const base = value ? new Date(value) : (() => {
+      const n2 = /* @__PURE__ */ new Date();
+      return new Date(n2.getFullYear(), n2.getMonth(), n2.getDate(), 0, 0, 0, 0);
+    })();
+    if (part === "hour") {
+      let h = Number(v);
+      if (hourCycle === 12) {
+        const isPM = base.getHours() >= 12;
+        h = h % 12;
+        base.setHours(isPM ? h === 12 ? 12 : h + 12 : h === 12 ? 0 : h);
+      } else {
+        base.setHours(h);
+      }
+    } else if (part === "minute") {
+      base.setMinutes(Number(v));
+    } else if (part === "second") {
+      base.setSeconds(Number(v));
+    } else if (part === "period" && (v === "AM" || v === "PM")) {
+      const curH = base.getHours();
+      const isAMNow = curH < 12;
+      if (v === "AM" && !isAMNow) base.setHours(curH - 12);
+      if (v === "PM" && isAMNow) base.setHours(curH + 12);
+    }
+    base.setMilliseconds(0);
+    onChange(base);
+  };
+  const widthClass = compact2 ? "w-16" : "w-24";
+  return /* @__PURE__ */ jsxs("div", { className: compact2 ? "" : "space-y-1", children: [
+    !compact2 && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: label }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: widthClass, children: [
+        !compact2 && /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Hour" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedHour), onValueChange: (v) => setPart("hour", Number(v)), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} hour`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: hours.map((h) => /* @__PURE__ */ jsx(SelectItem, { value: String(h), children: hourCycle === 12 ? h : pad2(h) }, h)) })
+        ] })
+      ] }),
+      (precision === "minute" || precision === "second") && /* @__PURE__ */ jsxs("div", { className: widthClass, children: [
+        !compact2 && /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Minute" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedMinute - selectedMinute % minuteStep), onValueChange: (v) => setPart("minute", Number(v)), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} minute`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: minutes.map((m2) => /* @__PURE__ */ jsx(SelectItem, { value: String(m2), children: pad2(m2) }, m2)) })
+        ] })
+      ] }),
+      precision === "second" && /* @__PURE__ */ jsxs("div", { className: widthClass, children: [
+        !compact2 && /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Second" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: String(selectedSecond - selectedSecond % secondStep), onValueChange: (v) => setPart("second", Number(v)), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} second`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: seconds.map((s2) => /* @__PURE__ */ jsx(SelectItem, { value: String(s2), children: pad2(s2) }, s2)) })
+        ] })
+      ] }),
+      hourCycle === 12 && /* @__PURE__ */ jsxs("div", { className: widthClass, children: [
+        !compact2 && /* @__PURE__ */ jsx("div", { className: "mb-1 block text-xs text-muted-foreground", children: "Period" }),
+        /* @__PURE__ */ jsxs(Select$1, { disabled, value: selectedPeriod, onValueChange: (v) => setPart("period", v), children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": `${label} period`, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: "AM", children: "AM" }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "PM", children: "PM" })
+          ] })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function DateTimeRangePicker({
+  value,
+  onChange,
+  placeholder = "Pick a date & time range",
+  disabled,
+  minDate,
+  maxDate,
+  disabledDates,
+  numberOfMonths = 2,
+  popoverSide,
+  timePrecision = "minute",
+  hourCycle = 24,
+  minuteStep = 5,
+  secondStep = 5,
+  className,
+  buttonVariant = "outline",
+  contentClassName,
+  ...props2
+}) {
+  const [internalOpen, setInternalOpen] = React.useState(false);
+  const isOpen = typeof props2.open === "boolean" ? props2.open : internalOpen;
+  const setOpen = (o2) => props2.onOpenChange ? props2.onOpenChange(o2) : setInternalOpen(o2);
+  const [draft, setDraft] = React.useState(value ?? null);
+  React.useEffect(() => {
+    if (isOpen) setDraft(value ?? null);
+  }, [isOpen, value]);
+  const fmtTime = React.useCallback((d) => {
+    if (!d) return "";
+    const h = d.getHours();
+    const m2 = d.getMinutes();
+    const s2 = d.getSeconds();
+    return hourCycle === 12 ? `${h % 12 || 12}:${pad2(m2)}${timePrecision === "second" ? `:${pad2(s2)}` : ""} ${h >= 12 ? "PM" : "AM"}` : `${pad2(h)}:${pad2(m2)}${timePrecision === "second" ? `:${pad2(s2)}` : ""}`;
+  }, [hourCycle, timePrecision]);
+  const label = React.useMemo(() => {
+    const f = (draft == null ? void 0 : draft.from) ?? (value == null ? void 0 : value.from) ?? null;
+    const t2 = (draft == null ? void 0 : draft.to) ?? (value == null ? void 0 : value.to) ?? null;
+    if (f && t2) {
+      const fd = f.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" });
+      const td = t2.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "2-digit" });
+      return `${fd} ${fmtTime(f)} – ${td} ${fmtTime(t2)}`;
+    }
+    return placeholder;
+  }, [draft, value, placeholder, fmtTime]);
+  const fmtDate = React.useCallback((d) => {
+    if (!d) return "";
+    const dd = String(d.getDate()).padStart(2, "0");
+    const mm = String(d.getMonth() + 1).padStart(2, "0");
+    const yyyy = d.getFullYear();
+    return `${dd} / ${mm} / ${yyyy}`;
+  }, []);
+  const [fromInput, setFromInput] = React.useState(fmtDate((draft == null ? void 0 : draft.from) ?? (value == null ? void 0 : value.from) ?? null));
+  const [toInput, setToInput] = React.useState(fmtDate((draft == null ? void 0 : draft.to) ?? (value == null ? void 0 : value.to) ?? null));
+  React.useEffect(() => {
+    if (isOpen) {
+      setFromInput(fmtDate((value == null ? void 0 : value.from) ?? null));
+      setToInput(fmtDate((value == null ? void 0 : value.to) ?? null));
+    }
+  }, [isOpen, value, fmtDate]);
+  const maskDate = (raw) => {
+    const digits = raw.replace(/\D/g, "").slice(0, 8);
+    const parts = [];
+    const dd = digits.slice(0, Math.min(2, digits.length));
+    if (dd) parts.push(dd);
+    const mm = digits.length > 2 ? digits.slice(2, Math.min(4, digits.length)) : "";
+    if (mm) parts.push(mm);
+    const yyyy = digits.length > 4 ? digits.slice(4) : "";
+    if (yyyy) parts.push(yyyy);
+    return parts.join(" / ");
+  };
+  const parseMasked = (masked) => {
+    const m2 = masked.match(/^(\d{1,2})\s*\/\s*(\d{1,2})\s*\/\s*(\d{4})$/);
+    if (!m2) return void 0;
+    const dd = Number(m2[1]);
+    const mm = Number(m2[2]);
+    const yyyy = Number(m2[3]);
+    if (mm < 1 || mm > 12) return void 0;
+    const lastDay = new Date(yyyy, mm, 0).getDate();
+    if (dd < 1 || dd > lastDay) return void 0;
+    const out = new Date(yyyy, mm - 1, dd);
+    if (isBefore(out, minDate) || isAfter(out, maxDate) || inDisabled(out, disabledDates)) return void 0;
+    return out;
+  };
+  const fromParsed = parseMasked(fromInput);
+  const toParsed = parseMasked(toInput);
+  const mergedFrom = React.useMemo(() => {
+    if (fromParsed) {
+      const base = (draft == null ? void 0 : draft.from) ?? (value == null ? void 0 : value.from) ?? null;
+      if (base) {
+        return new Date(
+          fromParsed.getFullYear(),
+          fromParsed.getMonth(),
+          fromParsed.getDate(),
+          base.getHours(),
+          base.getMinutes(),
+          base.getSeconds()
+        );
+      }
+      return fromParsed;
+    }
+    return (draft == null ? void 0 : draft.from) ?? void 0;
+  }, [fromParsed, draft, value]);
+  const mergedTo = React.useMemo(() => {
+    if (toParsed) {
+      const base = (draft == null ? void 0 : draft.to) ?? (value == null ? void 0 : value.to) ?? null;
+      if (base) {
+        return new Date(
+          toParsed.getFullYear(),
+          toParsed.getMonth(),
+          toParsed.getDate(),
+          base.getHours(),
+          base.getMinutes(),
+          base.getSeconds()
+        );
+      }
+      return toParsed;
+    }
+    return (draft == null ? void 0 : draft.to) ?? void 0;
+  }, [toParsed, draft, value]);
+  const invalidRange = !mergedFrom || !mergedTo || isBefore(mergedFrom, minDate) || isAfter(mergedTo, maxDate) || mergedFrom > mergedTo || rangeContainsDisabled(mergedFrom, mergedTo, disabledDates);
+  return /* @__PURE__ */ jsx("div", { className: cn$1("w-fit", className), ...props2, children: /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button$1, { type: "button", disabled, variant: buttonVariant, className: cn$1("w-[360px] justify-start text-left font-normal", !value && "text-muted-foreground"), children: [
+      /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4" }),
+      label
+    ] }) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { className: "w-auto max-w-none p-4", align: "start", side: popoverSide ?? "bottom", sideOffset: 8, children: [
+      /* @__PURE__ */ jsxs("div", { className: cn$1("w-fit min-w-0", contentClassName), children: [
+        /* @__PURE__ */ jsx("div", { className: "mb-3 rounded-md border border-input bg-background/50 px-3 py-2", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end gap-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                inputMode: "numeric",
+                value: fromInput,
+                onChange: (e) => setFromInput(maskDate(e.target.value)),
+                onBlur: () => {
+                  const p2 = parseMasked(fromInput);
+                  if (p2) {
+                    const prev = (draft == null ? void 0 : draft.from) ?? null;
+                    const withTime = new Date(
+                      p2.getFullYear(),
+                      p2.getMonth(),
+                      p2.getDate(),
+                      prev ? prev.getHours() : 0,
+                      prev ? prev.getMinutes() : 0,
+                      prev ? prev.getSeconds() : 0
+                    );
+                    setDraft((d) => ({ ...d ?? {}, from: withTime }));
+                  }
+                },
+                placeholder: "dd/mm/yyyy",
+                className: "h-9 w-40 rounded-md border bg-background px-3 text-sm shadow-xs outline-hidden"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              TimeSelectors,
+              {
+                label: "From",
+                compact: true,
+                value: (draft == null ? void 0 : draft.from) ?? null,
+                onChange: (d) => setDraft((prev) => ({ ...prev ?? {}, from: d })),
+                precision: timePrecision,
+                hourCycle,
+                minuteStep,
+                secondStep,
+                disabled
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "–" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                inputMode: "numeric",
+                value: toInput,
+                onChange: (e) => setToInput(maskDate(e.target.value)),
+                onBlur: () => {
+                  const p2 = parseMasked(toInput);
+                  if (p2) {
+                    const prev = (draft == null ? void 0 : draft.to) ?? null;
+                    const withTime = new Date(
+                      p2.getFullYear(),
+                      p2.getMonth(),
+                      p2.getDate(),
+                      prev ? prev.getHours() : 0,
+                      prev ? prev.getMinutes() : 0,
+                      prev ? prev.getSeconds() : 0
+                    );
+                    setDraft((d) => ({ ...d ?? {}, to: withTime }));
+                  }
+                },
+                placeholder: "dd/mm/yyyy",
+                className: "h-9 w-40 rounded-md border bg-background px-3 text-sm shadow-xs outline-hidden"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              TimeSelectors,
+              {
+                label: "To",
+                compact: true,
+                value: (draft == null ? void 0 : draft.to) ?? null,
+                onChange: (d) => setDraft((prev) => ({ ...prev ?? {}, to: d })),
+                precision: timePrecision,
+                hourCycle,
+                minuteStep,
+                secondStep,
+                disabled
+              }
+            )
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsx(
+          Calendar,
+          {
+            mode: "range",
+            numberOfMonths,
+            selected: (draft == null ? void 0 : draft.from) && (draft == null ? void 0 : draft.to) ? { from: draft.from, to: draft.to } : void 0,
+            onSelect: (range) => {
+              var _a, _b, _c, _d, _e2, _f;
+              if (disabled) return;
+              if (!range) {
+                setDraft(null);
+                return;
+              }
+              const { from, to } = range;
+              if (from && (isBefore(from, minDate) || isAfter(from, maxDate))) return;
+              if (to && (isBefore(to, minDate) || isAfter(to, maxDate))) return;
+              if (from && to && rangeContainsDisabled(from, to, disabledDates)) return;
+              const prevFrom = (draft == null ? void 0 : draft.from) ?? from;
+              const prevTo = (draft == null ? void 0 : draft.to) ?? to;
+              const nextFrom = from ? new Date(from.getFullYear(), from.getMonth(), from.getDate(), ((_a = prevFrom == null ? void 0 : prevFrom.getHours) == null ? void 0 : _a.call(prevFrom)) ?? 0, ((_b = prevFrom == null ? void 0 : prevFrom.getMinutes) == null ? void 0 : _b.call(prevFrom)) ?? 0, ((_c = prevFrom == null ? void 0 : prevFrom.getSeconds) == null ? void 0 : _c.call(prevFrom)) ?? 0) : void 0;
+              const nextTo = to ? new Date(to.getFullYear(), to.getMonth(), to.getDate(), ((_d = prevTo == null ? void 0 : prevTo.getHours) == null ? void 0 : _d.call(prevTo)) ?? 0, ((_e2 = prevTo == null ? void 0 : prevTo.getMinutes) == null ? void 0 : _e2.call(prevTo)) ?? 0, ((_f = prevTo == null ? void 0 : prevTo.getSeconds) == null ? void 0 : _f.call(prevTo)) ?? 0) : void 0;
+              setDraft({ from: nextFrom ?? null, to: nextTo ?? null });
+              setFromInput(fmtDate(nextFrom ?? null));
+              setToInput(fmtDate(nextTo ?? null));
+            },
+            defaultMonth: (draft == null ? void 0 : draft.from) ?? (value == null ? void 0 : value.from) ?? /* @__PURE__ */ new Date(),
+            disabled: (d) => isBefore(d, minDate) || isAfter(d, maxDate) || inDisabled(d, disabledDates),
+            buttonVariant: "ghost",
+            showOutsideDays: true
+          }
+        )
+      ] }),
+      (props2.showFooter ?? true) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 pt-3 mt-3 border-t", children: [
+        /* @__PURE__ */ jsx(Button$1, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(false), disabled, children: props2.cancelLabel ?? "Cancel" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx(Button$1, { type: "button", variant: "ghost", size: "sm", onClick: () => onChange == null ? void 0 : onChange(null), disabled, children: props2.clearLabel ?? "Clear" }),
+          /* @__PURE__ */ jsx(
+            Button$1,
+            {
+              type: "button",
+              variant: "default",
+              size: "sm",
+              onClick: () => {
+                if (invalidRange || !mergedFrom || !mergedTo) return;
+                onChange == null ? void 0 : onChange({ from: mergedFrom, to: mergedTo });
+                setOpen(false);
+              },
+              disabled: disabled || invalidRange,
+              children: props2.applyLabel ?? "Apply"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+DateTimeRangePicker.displayName = "DateTimeRangePicker";
+function DateTimeRangePickerField({ field, value, onChange, className }) {
+  const v = React.useMemo(() => {
+    if (!value || typeof value !== "object") return null;
+    const anyVal = value;
+    const toDate2 = (x2) => {
+      if (!x2) return void 0;
+      if (x2 instanceof Date) return x2;
+      const d = new Date(x2);
+      return Number.isNaN(d.getTime()) ? void 0 : d;
+    };
+    const from = toDate2(anyVal.from) ?? null;
+    const to = toDate2(anyVal.to) ?? null;
+    return { from, to };
+  }, [value]);
+  return /* @__PURE__ */ jsx(
+    DateTimeRangePicker,
+    {
+      className,
+      value: v,
+      onChange: (range) => onChange(range),
+      placeholder: field.placeholder,
+      minDate: field.minDate,
+      maxDate: field.maxDate,
+      disabledDates: field.disabledDates,
+      numberOfMonths: field.numberOfMonths ?? 2,
+      popoverSide: field.popoverSide,
+      timePrecision: field.timePrecision ?? "minute",
+      hourCycle: field.hourCycle ?? 24,
+      minuteStep: field.minuteStep ?? 5,
+      secondStep: field.secondStep ?? 5,
+      showFooter: field.showFooter,
+      cancelLabel: field.cancelLabel,
+      applyLabel: field.applyLabel
+    }
+  );
+}
 function FileField({ field, onChange, className }) {
   return /* @__PURE__ */ jsx(
     Input,
@@ -26339,6 +27511,54 @@ function FormBuilderField({ field, control, onChange, parentPath }) {
             className: baseClassName
           }
         );
+      case "time":
+        return /* @__PURE__ */ jsx(
+          TimePickerField,
+          {
+            field,
+            control,
+            fieldPath,
+            value: controllerField.value,
+            onChange: handleChange,
+            className: baseClassName
+          }
+        );
+      case "time_range":
+        return /* @__PURE__ */ jsx(
+          TimeRangePickerField,
+          {
+            field,
+            control,
+            fieldPath,
+            value: controllerField.value,
+            onChange: handleChange,
+            className: baseClassName
+          }
+        );
+      case "date_time":
+        return /* @__PURE__ */ jsx(
+          DateTimePickerField,
+          {
+            field,
+            control,
+            fieldPath,
+            value: controllerField.value,
+            onChange: handleChange,
+            className: baseClassName
+          }
+        );
+      case "date_time_range":
+        return /* @__PURE__ */ jsx(
+          DateTimeRangePickerField,
+          {
+            field,
+            control,
+            fieldPath,
+            value: controllerField.value,
+            onChange: handleChange,
+            className: baseClassName
+          }
+        );
       case "file":
         return /* @__PURE__ */ jsx(
           FileField,
@@ -27027,9 +28247,13 @@ function FormBuilder({
           case "date_picker":
           case "month":
           case "date":
+          case "time":
+          case "date_time":
             baseSchema = date();
             break;
           case "date_range":
+          case "time_range":
+          case "date_time_range":
             baseSchema = object({ from: date().optional().nullable(), to: date().optional().nullable() }).nullable();
             break;
           case "month_range":
@@ -27093,9 +28317,13 @@ function FormBuilder({
         case "date_picker":
         case "month":
         case "date":
+        case "time":
+        case "date_time":
           fieldSchema = date();
           break;
         case "date_range":
+        case "time_range":
+        case "date_time_range":
           fieldSchema = object({ from: date().optional().nullable(), to: date().optional().nullable() }).nullable();
           break;
         case "month_range":
@@ -52728,7 +53956,7 @@ function getThumbOffsetFromScroll(scrollPos, sizes, dir = "ltr") {
   const maxScrollPos = sizes.content - sizes.viewport;
   const maxThumbPos = scrollbar - thumbSizePx;
   const scrollClampRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
-  const scrollWithoutMomentum = clamp(scrollPos, scrollClampRange);
+  const scrollWithoutMomentum = clamp$1(scrollPos, scrollClampRange);
   const interpolate = linearScale$1([0, maxScrollPos], [0, maxThumbPos]);
   return interpolate(scrollWithoutMomentum);
 }
@@ -52903,7 +54131,7 @@ var Slider$1 = React.forwardRef(
     function updateValues(value2, atIndex, { commit } = { commit: false }) {
       const decimalCount = getDecimalCount(step);
       const snapToStep = roundValue(Math.round((value2 - min2) / step) * step + min2, decimalCount);
-      const nextValue = clamp(snapToStep, [min2, max2]);
+      const nextValue = clamp$1(snapToStep, [min2, max2]);
       setValues((prevValues = []) => {
         const nextValues = getNextSortedValues(prevValues, nextValue, atIndex);
         if (hasMinStepsBetweenValues(nextValues, minStepsBetweenThumbs * step)) {
@@ -53326,7 +54554,7 @@ function convertValueToPercentage(value, min2, max2) {
   const maxSteps = max2 - min2;
   const percentPerStep = 100 / maxSteps;
   const percentage = percentPerStep * (value - min2);
-  return clamp(percentage, [0, 100]);
+  return clamp$1(percentage, [0, 100]);
 }
 function getLabel(index2, totalValues) {
   if (totalValues > 2) {