@fabio.caffarello/react-design-system 3.12.0 → 4.0.0

package/dist/granular/ui/components/Table/useColumnResizing.js

@@ -1,71 +1,71 @@
 "use client";
-var k = Object.defineProperty, y = Object.defineProperties;
-var I = Object.getOwnPropertyDescriptors;
-var M = Object.getOwnPropertySymbols;
-var U = Object.prototype.hasOwnProperty, j = Object.prototype.propertyIsEnumerable;
-var E = (n, e, t) => e in n ? k(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, L = (n, e) => {
+var b = Object.defineProperty, w = Object.defineProperties;
+var S = Object.getOwnPropertyDescriptors;
+var p = Object.getOwnPropertySymbols;
+var k = Object.prototype.hasOwnProperty, y = Object.prototype.propertyIsEnumerable;
+var C = (n, e, t) => e in n ? b(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, g = (n, e) => {
   for (var t in e || (e = {}))
-    U.call(e, t) && E(n, t, e[t]);
-  if (M)
-    for (var t of M(e))
-      j.call(e, t) && E(n, t, e[t]);
+    k.call(e, t) && C(n, t, e[t]);
+  if (p)
+    for (var t of p(e))
+      y.call(e, t) && C(n, t, e[t]);
   return n;
-}, x = (n, e) => y(n, I(e));
-import { useState as h, useRef as v, useCallback as c } from "react";
-function B(n = {}) {
+}, E = (n, e) => w(n, S(e));
+import { useState as h, useRef as I, useCallback as c, useEffect as U } from "react";
+function A(n = {}) {
   const {
     defaultWidths: e = {},
     minWidth: t = 50,
-    maxWidth: a,
-    resizable: R = !0
-  } = n, [X, z] = h(e), [r, W] = h(!1), [d, p] = h(null), i = v(
+    maxWidth: m,
+    resizable: z = !0
+  } = n, [L, W] = h(e), [i, v] = h(!1), [l, R] = h(null), r = I(
     null
-  ), f = c(
-    (s, u) => {
-      const o = Math.max(
+  ), d = c(
+    (o, s) => {
+      const u = Math.max(
         t,
-        a ? Math.min(u, a) : u
+        m ? Math.min(s, m) : s
       );
-      z((S) => x(L({}, S), {
-        [s]: o
+      W((X) => E(g({}, X), {
+        [o]: u
       }));
     },
-    [t, a]
-  ), b = c(() => {
-    z(e);
-  }, [e]), w = c(
-    (s, u, o) => {
-      R && (W(!0), p(s), i.current = { startX: u, startWidth: o });
+    [t, m]
+  ), x = c(() => {
+    W(e);
+  }, [e]), M = c(
+    (o, s, u) => {
+      z && (v(!0), R(o), r.current = { startX: s, startWidth: u });
     },
-    [R]
-  ), C = c(
-    (s) => {
-      if (!r || !d || !i.current) return;
-      const u = s - i.current.startX, o = i.current.startWidth + u;
-      f(d, o);
+    [z]
+  ), a = c(
+    (o) => {
+      if (!i || !l || !r.current) return;
+      const s = o - r.current.startX, u = r.current.startWidth + s;
+      d(l, u);
     },
-    [r, d, f]
-  ), g = c(() => {
-    W(!1), p(null), i.current = null;
-  }, []), l = v(
-    void 0
-  ), m = v(void 0);
-  return typeof window != "undefined" && (l.current = (s) => {
-    r && C(s.clientX);
-  }, m.current = () => {
-    r && g();
-  }, r ? (document.addEventListener("mousemove", l.current), document.addEventListener("mouseup", m.current)) : (l.current && document.removeEventListener("mousemove", l.current), m.current && document.removeEventListener("mouseup", m.current))), {
-    columnWidths: X,
-    setColumnWidth: f,
-    resetColumnWidths: b,
-    isResizing: r,
-    resizingColumn: d,
-    startResize: w,
-    handleResize: C,
-    endResize: g
+    [i, l, d]
+  ), f = c(() => {
+    v(!1), R(null), r.current = null;
+  }, []);
+  return U(() => {
+    if (!i || typeof window == "undefined") return;
+    const o = (u) => a(u.clientX), s = () => f();
+    return document.addEventListener("mousemove", o), document.addEventListener("mouseup", s), () => {
+      document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", s);
+    };
+  }, [i, a, f]), {
+    columnWidths: L,
+    setColumnWidth: d,
+    resetColumnWidths: x,
+    isResizing: i,
+    resizingColumn: l,
+    startResize: M,
+    handleResize: a,
+    endResize: f
   };
 }
 export {
-  B as useColumnResizing
+  A as useColumnResizing
 };
 //# sourceMappingURL=useColumnResizing.js.map

package/dist/granular/ui/components/Table/useColumnResizing.js.map

@@ -1 +1 @@
-{"version":3,"file":"useColumnResizing.js","sources":["../../../../../src/ui/components/Table/useColumnResizing.ts"],"sourcesContent":["\"use client\";\n\nimport { useState, useCallback, useRef } from \"react\";\n\nexport interface ColumnWidth {\n  [key: string]: number;\n}\n\nexport interface UseColumnResizingOptions {\n  defaultWidths?: ColumnWidth;\n  minWidth?: number;\n  maxWidth?: number;\n  resizable?: boolean;\n}\n\nexport interface UseColumnResizingResult {\n  columnWidths: ColumnWidth;\n  setColumnWidth: (columnKey: string, width: number) => void;\n  resetColumnWidths: () => void;\n  isResizing: boolean;\n  resizingColumn: string | null;\n  startResize: (columnKey: string, startX: number, startWidth: number) => void;\n  handleResize: (currentX: number) => void;\n  endResize: () => void;\n}\n\n/**\n * useColumnResizing Hook\n *\n * Hook for managing column resizing in tables.\n *\n * @example\n * ```tsx\n * const {\n *   columnWidths,\n *   setColumnWidth,\n *   startResize,\n *   handleResize,\n *   endResize,\n * } = useColumnResizing({\n *   defaultWidths: { name: 200, email: 250 },\n *   minWidth: 100,\n * });\n * ```\n */\nexport function useColumnResizing(\n  options: UseColumnResizingOptions = {},\n): UseColumnResizingResult {\n  const {\n    defaultWidths = {},\n    minWidth = 50,\n    maxWidth,\n    resizable = true,\n  } = options;\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidth>(defaultWidths);\n  const [isResizing, setIsResizing] = useState(false);\n  const [resizingColumn, setResizingColumn] = useState<string | null>(null);\n  const resizeStateRef = useRef<{ startX: number; startWidth: number } | null>(\n    null,\n  );\n\n  const setColumnWidth = useCallback(\n    (columnKey: string, width: number) => {\n      const clampedWidth = Math.max(\n        minWidth,\n        maxWidth ? Math.min(width, maxWidth) : width,\n      );\n      setColumnWidths((prev) => ({\n        ...prev,\n        [columnKey]: clampedWidth,\n      }));\n    },\n    [minWidth, maxWidth],\n  );\n\n  const resetColumnWidths = useCallback(() => {\n    setColumnWidths(defaultWidths);\n  }, [defaultWidths]);\n\n  const startResize = useCallback(\n    (columnKey: string, startX: number, startWidth: number) => {\n      if (!resizable) return;\n      setIsResizing(true);\n      setResizingColumn(columnKey);\n      resizeStateRef.current = { startX, startWidth };\n    },\n    [resizable],\n  );\n\n  const handleResize = useCallback(\n    (currentX: number) => {\n      if (!isResizing || !resizingColumn || !resizeStateRef.current) return;\n\n      const deltaX = currentX - resizeStateRef.current.startX;\n      const newWidth = resizeStateRef.current.startWidth + deltaX;\n      setColumnWidth(resizingColumn, newWidth);\n    },\n    [isResizing, resizingColumn, setColumnWidth],\n  );\n\n  const endResize = useCallback(() => {\n    setIsResizing(false);\n    setResizingColumn(null);\n    resizeStateRef.current = null;\n  }, []);\n\n  // Handle mouse move and mouse up globally during resize\n  const handleMouseMoveRef = useRef<((e: MouseEvent) => void) | undefined>(\n    undefined,\n  );\n  const handleMouseUpRef = useRef<(() => void) | undefined>(undefined);\n\n  if (typeof window !== \"undefined\") {\n    handleMouseMoveRef.current = (e: MouseEvent) => {\n      if (isResizing) {\n        handleResize(e.clientX);\n      }\n    };\n\n    handleMouseUpRef.current = () => {\n      if (isResizing) {\n        endResize();\n      }\n    };\n\n    if (isResizing) {\n      document.addEventListener(\"mousemove\", handleMouseMoveRef.current);\n      document.addEventListener(\"mouseup\", handleMouseUpRef.current);\n    } else {\n      if (handleMouseMoveRef.current) {\n        document.removeEventListener(\"mousemove\", handleMouseMoveRef.current);\n      }\n      if (handleMouseUpRef.current) {\n        document.removeEventListener(\"mouseup\", handleMouseUpRef.current);\n      }\n    }\n  }\n\n  return {\n    columnWidths,\n    setColumnWidth,\n    resetColumnWidths,\n    isResizing,\n    resizingColumn,\n    startResize,\n    handleResize,\n    endResize,\n  };\n}\n"],"names":["useColumnResizing","options","defaultWidths","minWidth","maxWidth","resizable","columnWidths","setColumnWidths","useState","isResizing","setIsResizing","resizingColumn","setResizingColumn","resizeStateRef","useRef","setColumnWidth","useCallback","columnKey","width","clampedWidth","prev","__spreadProps","__spreadValues","resetColumnWidths","startResize","startX","startWidth","handleResize","currentX","deltaX","newWidth","endResize","handleMouseMoveRef","handleMouseUpRef","e"],"mappings":";;;;;;;;;;;;;;AA6CO,SAASA,EACdC,IAAoC,IACX;AACzB,QAAM;AAAA,IACJ,eAAAC,IAAgB,CAAA;AAAA,IAChB,UAAAC,IAAW;AAAA,IACX,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,EAAA,IACVJ,GAEE,CAACK,GAAcC,CAAe,IAAIC,EAAsBN,CAAa,GACrE,CAACO,GAAYC,CAAa,IAAIF,EAAS,EAAK,GAC5C,CAACG,GAAgBC,CAAiB,IAAIJ,EAAwB,IAAI,GAClEK,IAAiBC;AAAA,IACrB;AAAA,EAAA,GAGIC,IAAiBC;AAAA,IACrB,CAACC,GAAmBC,MAAkB;AACpC,YAAMC,IAAe,KAAK;AAAA,QACxBhB;AAAA,QACAC,IAAW,KAAK,IAAIc,GAAOd,CAAQ,IAAIc;AAAA,MAAA;AAEzC,MAAAX,EAAgB,CAACa,MAAUC,EAAAC,EAAA,IACtBF,IADsB;AAAA,QAEzB,CAACH,CAAS,GAAGE;AAAA,MAAA,EACb;AAAA,IACJ;AAAA,IACA,CAAChB,GAAUC,CAAQ;AAAA,EAAA,GAGfmB,IAAoBP,EAAY,MAAM;AAC1C,IAAAT,EAAgBL,CAAa;AAAA,EAC/B,GAAG,CAACA,CAAa,CAAC,GAEZsB,IAAcR;AAAA,IAClB,CAACC,GAAmBQ,GAAgBC,MAAuB;AACzD,MAAKrB,MACLK,EAAc,EAAI,GAClBE,EAAkBK,CAAS,GAC3BJ,EAAe,UAAU,EAAE,QAAAY,GAAQ,YAAAC,EAAA;AAAA,IACrC;AAAA,IACA,CAACrB,CAAS;AAAA,EAAA,GAGNsB,IAAeX;AAAA,IACnB,CAACY,MAAqB;AACpB,UAAI,CAACnB,KAAc,CAACE,KAAkB,CAACE,EAAe,QAAS;AAE/D,YAAMgB,IAASD,IAAWf,EAAe,QAAQ,QAC3CiB,IAAWjB,EAAe,QAAQ,aAAagB;AACrD,MAAAd,EAAeJ,GAAgBmB,CAAQ;AAAA,IACzC;AAAA,IACA,CAACrB,GAAYE,GAAgBI,CAAc;AAAA,EAAA,GAGvCgB,IAAYf,EAAY,MAAM;AAClC,IAAAN,EAAc,EAAK,GACnBE,EAAkB,IAAI,GACtBC,EAAe,UAAU;AAAA,EAC3B,GAAG,CAAA,CAAE,GAGCmB,IAAqBlB;AAAA,IACzB;AAAA,EAAA,GAEImB,IAAmBnB,EAAiC,MAAS;AAEnE,SAAI,OAAO,UAAW,gBACpBkB,EAAmB,UAAU,CAACE,MAAkB;AAC9C,IAAIzB,KACFkB,EAAaO,EAAE,OAAO;AAAA,EAE1B,GAEAD,EAAiB,UAAU,MAAM;AAC/B,IAAIxB,KACFsB,EAAA;AAAA,EAEJ,GAEItB,KACF,SAAS,iBAAiB,aAAauB,EAAmB,OAAO,GACjE,SAAS,iBAAiB,WAAWC,EAAiB,OAAO,MAEzDD,EAAmB,WACrB,SAAS,oBAAoB,aAAaA,EAAmB,OAAO,GAElEC,EAAiB,WACnB,SAAS,oBAAoB,WAAWA,EAAiB,OAAO,KAK/D;AAAA,IACL,cAAA3B;AAAA,IACA,gBAAAS;AAAA,IACA,mBAAAQ;AAAA,IACA,YAAAd;AAAA,IACA,gBAAAE;AAAA,IACA,aAAAa;AAAA,IACA,cAAAG;AAAA,IACA,WAAAI;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useColumnResizing.js","sources":["../../../../../src/ui/components/Table/useColumnResizing.ts"],"sourcesContent":["\"use client\";\n\nimport { useState, useCallback, useRef, useEffect } from \"react\";\n\nexport interface ColumnWidth {\n  [key: string]: number;\n}\n\nexport interface UseColumnResizingOptions {\n  defaultWidths?: ColumnWidth;\n  minWidth?: number;\n  maxWidth?: number;\n  resizable?: boolean;\n}\n\nexport interface UseColumnResizingResult {\n  columnWidths: ColumnWidth;\n  setColumnWidth: (columnKey: string, width: number) => void;\n  resetColumnWidths: () => void;\n  isResizing: boolean;\n  resizingColumn: string | null;\n  startResize: (columnKey: string, startX: number, startWidth: number) => void;\n  handleResize: (currentX: number) => void;\n  endResize: () => void;\n}\n\n/**\n * useColumnResizing Hook\n *\n * Hook for managing column resizing in tables.\n *\n * @example\n * ```tsx\n * const {\n *   columnWidths,\n *   setColumnWidth,\n *   startResize,\n *   handleResize,\n *   endResize,\n * } = useColumnResizing({\n *   defaultWidths: { name: 200, email: 250 },\n *   minWidth: 100,\n * });\n * ```\n */\nexport function useColumnResizing(\n  options: UseColumnResizingOptions = {},\n): UseColumnResizingResult {\n  const {\n    defaultWidths = {},\n    minWidth = 50,\n    maxWidth,\n    resizable = true,\n  } = options;\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidth>(defaultWidths);\n  const [isResizing, setIsResizing] = useState(false);\n  const [resizingColumn, setResizingColumn] = useState<string | null>(null);\n  const resizeStateRef = useRef<{ startX: number; startWidth: number } | null>(\n    null,\n  );\n\n  const setColumnWidth = useCallback(\n    (columnKey: string, width: number) => {\n      const clampedWidth = Math.max(\n        minWidth,\n        maxWidth ? Math.min(width, maxWidth) : width,\n      );\n      setColumnWidths((prev) => ({\n        ...prev,\n        [columnKey]: clampedWidth,\n      }));\n    },\n    [minWidth, maxWidth],\n  );\n\n  const resetColumnWidths = useCallback(() => {\n    setColumnWidths(defaultWidths);\n  }, [defaultWidths]);\n\n  const startResize = useCallback(\n    (columnKey: string, startX: number, startWidth: number) => {\n      if (!resizable) return;\n      setIsResizing(true);\n      setResizingColumn(columnKey);\n      resizeStateRef.current = { startX, startWidth };\n    },\n    [resizable],\n  );\n\n  const handleResize = useCallback(\n    (currentX: number) => {\n      if (!isResizing || !resizingColumn || !resizeStateRef.current) return;\n\n      const deltaX = currentX - resizeStateRef.current.startX;\n      const newWidth = resizeStateRef.current.startWidth + deltaX;\n      setColumnWidth(resizingColumn, newWidth);\n    },\n    [isResizing, resizingColumn, setColumnWidth],\n  );\n\n  const endResize = useCallback(() => {\n    setIsResizing(false);\n    setResizingColumn(null);\n    resizeStateRef.current = null;\n  }, []);\n\n  // Bind the global mouse listeners only while resizing, and ONLY from an\n  // effect — never the render body. The old render-body version added a\n  // fresh closure on every re-render during a drag (each handleResize →\n  // setColumnWidth → re-render) without removing the previous one, leaking\n  // one mousemove + one mouseup listener per render and firing handleResize\n  // N times per move. The effect captures the exact handlers it attaches\n  // and tears them down on cleanup, so at most one of each exists at a time.\n  useEffect(() => {\n    if (!isResizing || typeof window === \"undefined\") return;\n    const onMove = (e: MouseEvent) => handleResize(e.clientX);\n    const onUp = () => endResize();\n    document.addEventListener(\"mousemove\", onMove);\n    document.addEventListener(\"mouseup\", onUp);\n    return () => {\n      document.removeEventListener(\"mousemove\", onMove);\n      document.removeEventListener(\"mouseup\", onUp);\n    };\n  }, [isResizing, handleResize, endResize]);\n\n  return {\n    columnWidths,\n    setColumnWidth,\n    resetColumnWidths,\n    isResizing,\n    resizingColumn,\n    startResize,\n    handleResize,\n    endResize,\n  };\n}\n"],"names":["useColumnResizing","options","defaultWidths","minWidth","maxWidth","resizable","columnWidths","setColumnWidths","useState","isResizing","setIsResizing","resizingColumn","setResizingColumn","resizeStateRef","useRef","setColumnWidth","useCallback","columnKey","width","clampedWidth","prev","__spreadProps","__spreadValues","resetColumnWidths","startResize","startX","startWidth","handleResize","currentX","deltaX","newWidth","endResize","useEffect","onMove","e","onUp"],"mappings":";;;;;;;;;;;;;;AA6CO,SAASA,EACdC,IAAoC,IACX;AACzB,QAAM;AAAA,IACJ,eAAAC,IAAgB,CAAA;AAAA,IAChB,UAAAC,IAAW;AAAA,IACX,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,EAAA,IACVJ,GAEE,CAACK,GAAcC,CAAe,IAAIC,EAAsBN,CAAa,GACrE,CAACO,GAAYC,CAAa,IAAIF,EAAS,EAAK,GAC5C,CAACG,GAAgBC,CAAiB,IAAIJ,EAAwB,IAAI,GAClEK,IAAiBC;AAAA,IACrB;AAAA,EAAA,GAGIC,IAAiBC;AAAA,IACrB,CAACC,GAAmBC,MAAkB;AACpC,YAAMC,IAAe,KAAK;AAAA,QACxBhB;AAAA,QACAC,IAAW,KAAK,IAAIc,GAAOd,CAAQ,IAAIc;AAAA,MAAA;AAEzC,MAAAX,EAAgB,CAACa,MAAUC,EAAAC,EAAA,IACtBF,IADsB;AAAA,QAEzB,CAACH,CAAS,GAAGE;AAAA,MAAA,EACb;AAAA,IACJ;AAAA,IACA,CAAChB,GAAUC,CAAQ;AAAA,EAAA,GAGfmB,IAAoBP,EAAY,MAAM;AAC1C,IAAAT,EAAgBL,CAAa;AAAA,EAC/B,GAAG,CAACA,CAAa,CAAC,GAEZsB,IAAcR;AAAA,IAClB,CAACC,GAAmBQ,GAAgBC,MAAuB;AACzD,MAAKrB,MACLK,EAAc,EAAI,GAClBE,EAAkBK,CAAS,GAC3BJ,EAAe,UAAU,EAAE,QAAAY,GAAQ,YAAAC,EAAA;AAAA,IACrC;AAAA,IACA,CAACrB,CAAS;AAAA,EAAA,GAGNsB,IAAeX;AAAA,IACnB,CAACY,MAAqB;AACpB,UAAI,CAACnB,KAAc,CAACE,KAAkB,CAACE,EAAe,QAAS;AAE/D,YAAMgB,IAASD,IAAWf,EAAe,QAAQ,QAC3CiB,IAAWjB,EAAe,QAAQ,aAAagB;AACrD,MAAAd,EAAeJ,GAAgBmB,CAAQ;AAAA,IACzC;AAAA,IACA,CAACrB,GAAYE,GAAgBI,CAAc;AAAA,EAAA,GAGvCgB,IAAYf,EAAY,MAAM;AAClC,IAAAN,EAAc,EAAK,GACnBE,EAAkB,IAAI,GACtBC,EAAe,UAAU;AAAA,EAC3B,GAAG,CAAA,CAAE;AASL,SAAAmB,EAAU,MAAM;AACd,QAAI,CAACvB,KAAc,OAAO,UAAW,YAAa;AAClD,UAAMwB,IAAS,CAACC,MAAkBP,EAAaO,EAAE,OAAO,GAClDC,IAAO,MAAMJ,EAAA;AACnB,oBAAS,iBAAiB,aAAaE,CAAM,GAC7C,SAAS,iBAAiB,WAAWE,CAAI,GAClC,MAAM;AACX,eAAS,oBAAoB,aAAaF,CAAM,GAChD,SAAS,oBAAoB,WAAWE,CAAI;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC1B,GAAYkB,GAAcI,CAAS,CAAC,GAEjC;AAAA,IACL,cAAAzB;AAAA,IACA,gBAAAS;AAAA,IACA,mBAAAQ;AAAA,IACA,YAAAd;AAAA,IACA,gBAAAE;AAAA,IACA,aAAAa;AAAA,IACA,cAAAG;AAAA,IACA,WAAAI;AAAA,EAAA;AAEJ;"}

package/dist/granular/ui/components/TimePicker/TimePicker.js

@@ -1,28 +1,32 @@
 "use client";
-import { jsx as s, jsxs as v } from "react/jsx-runtime";
-import { useState as x, useCallback as E, useEffect as O } from "react";
-import { Clock as U } from "lucide-react";
-import q from "../../primitives/Input/Input.js";
-import F from "../Popover/Popover.js";
-import { Button as o } from "../../primitives/Button/Button.js";
+import { jsx as n, jsxs as M } from "react/jsx-runtime";
+import { useState as p, useCallback as E, useEffect as F } from "react";
+import { Clock as q } from "lucide-react";
+import G from "../../primitives/Input/Input.js";
+import J from "../Popover/Popover.js";
+import { Button as m } from "../../primitives/Button/Button.js";
 import { getSpacingClass as u } from "../../tokens/spacing.js";
-function X({
-  value: A,
-  defaultValue: H,
-  format: r = "24h",
-  onChange: c,
-  disabled: l = !1,
-  label: I,
-  error: b = !1,
-  helperText: z,
-  className: y = ""
+function _({
+  value: k,
+  defaultValue: T,
+  format: s = "24h",
+  onChange: o,
+  disabled: r = !1,
+  label: V,
+  error: K = !1,
+  helperText: U,
+  className: j = ""
 }) {
-  const [T, P] = x(H || ""), [i, S] = x(12), [m, N] = x(0), [a, $] = x("AM"), d = A !== void 0, h = d ? A : T, k = E(
+  const [O, w] = p(T || ""), [i, y] = p(12), [l, P] = p(0), [c, S] = p("AM"), [D, A] = p(!1), f = k !== void 0, h = f ? k : O, g = E(
     (e) => {
       if (!e) return { hours: 12, minutes: 0, amPm: "AM" };
-      if (r === "24h") {
-        const [t, n] = e.split(":").map(Number);
-        return { hours: t || 12, minutes: n || 0, amPm: "AM" };
+      if (s === "24h") {
+        const [t, a] = e.split(":").map(Number);
+        return {
+          hours: Number.isFinite(t) ? t : 12,
+          minutes: Number.isFinite(a) ? a : 0,
+          amPm: "AM"
+        };
       } else {
         const t = e.match(/(\d+):(\d+)\s*(AM|PM)/i);
         return t ? {
@@ -32,91 +36,109 @@ function X({
         } : { hours: 12, minutes: 0, amPm: "AM" };
       }
     },
-    [r]
-  ), p = (e, t, n) => {
-    if (r === "24h")
+    [s]
+  ), v = (e, t, a) => {
+    if (s === "24h")
       return `${String(e).padStart(2, "0")}:${String(t).padStart(2, "0")}`;
     {
-      const M = n === "PM" && e !== 12 ? e + 12 : n === "AM" && e === 12 ? 0 : e;
-      return `${String(M === 0 ? 12 : M > 12 ? M - 12 : M).padStart(2, "0")}:${String(t).padStart(2, "0")} ${n || "AM"}`;
+      const x = a === "PM" && e !== 12 ? e + 12 : a === "AM" && e === 12 ? 0 : e;
+      return `${String(x === 0 ? 12 : x > 12 ? x - 12 : x).padStart(2, "0")}:${String(t).padStart(2, "0")} ${a || "AM"}`;
     }
   };
-  O(() => {
+  F(() => {
     if (h) {
-      const e = k(h);
-      S(e.hours), N(e.minutes), $(e.amPm);
+      const e = g(h);
+      y(e.hours), P(e.minutes), S(e.amPm);
     }
-  }, [h, k]);
-  const f = (e) => {
-    const t = r === "24h" ? Math.max(0, Math.min(23, e)) : Math.max(1, Math.min(12, e));
-    S(t);
-    const n = p(
+  }, [h, g]);
+  const d = (e) => {
+    const t = s === "24h" ? Math.max(0, Math.min(23, e)) : Math.max(1, Math.min(12, e));
+    y(t);
+    const a = v(
       t,
-      m,
-      r === "12h" ? a : void 0
+      l,
+      s === "12h" ? c : void 0
     );
-    d || P(n), c == null || c(n);
-  }, w = (e) => {
+    f || w(a), o == null || o(a);
+  }, N = (e) => {
     const t = Math.max(0, Math.min(59, e));
-    N(t);
-    const n = p(
+    P(t);
+    const a = v(
       i,
       t,
-      r === "12h" ? a : void 0
+      s === "12h" ? c : void 0
     );
-    d || P(n), c == null || c(n);
-  }, g = () => {
-    const e = a === "AM" ? "PM" : "AM";
-    $(e);
-    const t = p(i, m, e);
-    d || P(t), c == null || c(t);
-  }, V = () => {
-    if (r === "24h")
-      f((i + 1) % 24);
+    f || w(a), o == null || o(a);
+  }, $ = () => {
+    const e = c === "AM" ? "PM" : "AM";
+    S(e);
+    const t = v(i, l, e);
+    f || w(t), o == null || o(t);
+  }, b = () => {
+    if (s === "24h")
+      d((i + 1) % 24);
     else {
       const e = i === 12 ? 1 : i + 1;
-      f(e);
+      d(e);
     }
-  }, j = () => {
-    if (r === "24h")
-      f(i === 0 ? 23 : i - 1);
+  }, I = () => {
+    if (s === "24h")
+      d(i === 0 ? 23 : i - 1);
     else {
       const e = i === 1 ? 12 : i - 1;
-      f(e);
+      d(e);
     }
-  }, B = () => {
-    w((m + 1) % 60);
-  }, D = () => {
-    w(m === 0 ? 59 : m - 1);
-  }, C = /* @__PURE__ */ s("div", { className: `${u("base", "p")} min-w-48`, children: /* @__PURE__ */ v(
+  }, H = () => {
+    N((l + 1) % 60);
+  }, z = () => {
+    N(l === 0 ? 59 : l - 1);
+  }, B = (e) => {
+    r || (e.key === "Enter" || e.key === " " ? (e.preventDefault(), A((t) => !t)) : (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), A(!0)));
+  }, C = /* @__PURE__ */ n("div", { className: `${u("base", "p")} min-w-48`, children: /* @__PURE__ */ M(
     "div",
     {
       className: `flex items-center justify-center ${u("base", "gap")}`,
       children: [
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ M(
           "div",
           {
             className: `flex flex-col items-center ${u("sm", "gap")}`,
             children: [
-              /* @__PURE__ */ s(
-                o,
+              /* @__PURE__ */ n(
+                m,
                 {
                   variant: "ghost",
                   size: "sm",
-                  onClick: V,
-                  disabled: l,
+                  onClick: b,
+                  disabled: r,
                   "aria-label": "Increment hours",
                   children: "↑"
                 }
               ),
-              /* @__PURE__ */ s("div", { className: "text-2xl font-mono font-semibold w-12 text-center", children: String(i).padStart(2, "0") }),
-              /* @__PURE__ */ s(
-                o,
+              /* @__PURE__ */ n(
+                "div",
+                {
+                  role: "spinbutton",
+                  tabIndex: r ? -1 : 0,
+                  "aria-label": "Hours",
+                  "aria-valuenow": i,
+                  "aria-valuemin": s === "24h" ? 0 : 1,
+                  "aria-valuemax": s === "24h" ? 23 : 12,
+                  "aria-valuetext": String(i).padStart(2, "0"),
+                  onKeyDown: (e) => {
+                    e.key === "ArrowUp" ? (e.preventDefault(), b()) : e.key === "ArrowDown" && (e.preventDefault(), I());
+                  },
+                  className: "text-2xl font-mono font-semibold w-12 text-center",
+                  children: String(i).padStart(2, "0")
+                }
+              ),
+              /* @__PURE__ */ n(
+                m,
                 {
                   variant: "ghost",
                   size: "sm",
-                  onClick: j,
-                  disabled: l,
+                  onClick: I,
+                  disabled: r,
                   "aria-label": "Decrement hours",
                   children: "↓"
                 }
@@ -124,31 +146,47 @@ function X({
             ]
           }
         ),
-        /* @__PURE__ */ s("div", { className: "text-2xl font-semibold", children: ":" }),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ n("div", { className: "text-2xl font-semibold", children: ":" }),
+        /* @__PURE__ */ M(
           "div",
           {
             className: `flex flex-col items-center ${u("sm", "gap")}`,
             children: [
-              /* @__PURE__ */ s(
-                o,
+              /* @__PURE__ */ n(
+                m,
                 {
                   variant: "ghost",
                   size: "sm",
-                  onClick: B,
-                  disabled: l,
+                  onClick: H,
+                  disabled: r,
                   "aria-label": "Increment minutes",
                   children: "↑"
                 }
               ),
-              /* @__PURE__ */ s("div", { className: "text-2xl font-mono font-semibold w-12 text-center", children: String(m).padStart(2, "0") }),
-              /* @__PURE__ */ s(
-                o,
+              /* @__PURE__ */ n(
+                "div",
+                {
+                  role: "spinbutton",
+                  tabIndex: r ? -1 : 0,
+                  "aria-label": "Minutes",
+                  "aria-valuenow": l,
+                  "aria-valuemin": 0,
+                  "aria-valuemax": 59,
+                  "aria-valuetext": String(l).padStart(2, "0"),
+                  onKeyDown: (e) => {
+                    e.key === "ArrowUp" ? (e.preventDefault(), H()) : e.key === "ArrowDown" && (e.preventDefault(), z());
+                  },
+                  className: "text-2xl font-mono font-semibold w-12 text-center",
+                  children: String(l).padStart(2, "0")
+                }
+              ),
+              /* @__PURE__ */ n(
+                m,
                 {
                   variant: "ghost",
                   size: "sm",
-                  onClick: D,
-                  disabled: l,
+                  onClick: z,
+                  disabled: r,
                   "aria-label": "Decrement minutes",
                   children: "↓"
                 }
@@ -156,28 +194,28 @@ function X({
             ]
           }
         ),
-        r === "12h" && /* @__PURE__ */ v(
+        s === "12h" && /* @__PURE__ */ M(
           "div",
           {
             className: `flex flex-col ${u("sm", "gap")} ${u("sm", "ml")}`,
             children: [
-              /* @__PURE__ */ s(
-                o,
+              /* @__PURE__ */ n(
+                m,
                 {
-                  variant: a === "AM" ? "primary" : "outline",
+                  variant: c === "AM" ? "primary" : "outline",
                   size: "sm",
-                  onClick: () => g(),
-                  disabled: l,
+                  onClick: () => $(),
+                  disabled: r,
                   children: "AM"
                 }
               ),
-              /* @__PURE__ */ s(
-                o,
+              /* @__PURE__ */ n(
+                m,
                 {
-                  variant: a === "PM" ? "primary" : "outline",
+                  variant: c === "PM" ? "primary" : "outline",
                   size: "sm",
-                  onClick: () => g(),
-                  disabled: l,
+                  onClick: () => $(),
+                  disabled: r,
                   children: "PM"
                 }
               )
@@ -187,20 +225,28 @@ function X({
       ]
     }
   ) });
-  return /* @__PURE__ */ s("div", { className: y, children: /* @__PURE__ */ s(
-    F,
+  return /* @__PURE__ */ n("div", { className: j, children: /* @__PURE__ */ n(
+    J,
     {
-      trigger: /* @__PURE__ */ s(
-        q,
+      open: r ? !1 : D,
+      onOpenChange: (e) => {
+        r || A(e);
+      },
+      trigger: /* @__PURE__ */ n(
+        G,
         {
-          label: I,
-          value: h || p(i, m, r === "12h" ? a : void 0),
+          label: V,
+          value: h || v(i, l, s === "12h" ? c : void 0),
           readOnly: !0,
-          disabled: l,
-          error: b,
-          helperText: z,
-          leftIcon: /* @__PURE__ */ s(U, { className: "h-4 w-4" }),
-          className: "cursor-pointer"
+          disabled: r,
+          error: K,
+          helperText: U,
+          leftIcon: /* @__PURE__ */ n(q, { className: "h-4 w-4" }),
+          className: "cursor-pointer",
+          role: "combobox",
+          "aria-haspopup": "dialog",
+          "aria-expanded": !r && D,
+          onKeyDown: B
         }
       ),
       placement: "bottom-start",
@@ -211,6 +257,6 @@ function X({
   ) });
 }
 export {
-  X as default
+  _ as default
 };
 //# sourceMappingURL=TimePicker.js.map

package/dist/granular/ui/components/TimePicker/TimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.js","sources":["../../../../../src/ui/components/TimePicker/TimePicker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useCallback } from \"react\";\nimport { Clock } from \"lucide-react\";\nimport Input from \"../../primitives/Input/Input\";\nimport Popover from \"../Popover/Popover\";\nimport Button from \"../../primitives/Button/Button\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\n\nexport type TimeFormat = \"12h\" | \"24h\";\n\nexport interface TimePickerProps {\n  value?: string; // Format: \"HH:mm\" for 24h or \"hh:mm AM/PM\" for 12h\n  defaultValue?: string;\n  format?: TimeFormat;\n  onChange?: (value: string) => void;\n  disabled?: boolean;\n  label?: string;\n  error?: boolean;\n  helperText?: string;\n  className?: string;\n}\n\n/**\n * TimePicker Component\n *\n * A time picker component for selecting time values.\n * Supports 12h and 24h formats.\n * Follows Atomic Design principles as a Molecule component.\n *\n * @example\n * ```tsx\n * <TimePicker\n *   value=\"14:30\"\n *   format=\"24h\"\n *   onChange={(value) => console.log(value)}\n * />\n * ```\n */\nexport default function TimePicker({\n  value: controlledValue,\n  defaultValue,\n  format = \"24h\",\n  onChange,\n  disabled = false,\n  label,\n  error = false,\n  helperText,\n  className = \"\",\n}: TimePickerProps) {\n  const [internalValue, setInternalValue] = useState(defaultValue || \"\");\n  const [hours, setHours] = useState(12);\n  const [minutes, setMinutes] = useState(0);\n  const [amPm, setAmPm] = useState<\"AM\" | \"PM\">(\"AM\");\n\n  const isControlled = controlledValue !== undefined;\n  const currentValue = isControlled ? controlledValue : internalValue;\n\n  // Parse time value\n  const parseTime = useCallback(\n    (timeStr: string) => {\n      if (!timeStr) return { hours: 12, minutes: 0, amPm: \"AM\" as const };\n\n      if (format === \"24h\") {\n        const [h, m] = timeStr.split(\":\").map(Number);\n        return { hours: h || 12, minutes: m || 0, amPm: \"AM\" as const };\n      } else {\n        const match = timeStr.match(/(\\d+):(\\d+)\\s*(AM|PM)/i);\n        if (match) {\n          return {\n            hours: parseInt(match[1]),\n            minutes: parseInt(match[2]),\n            amPm: match[3].toUpperCase() as \"AM\" | \"PM\",\n          };\n        }\n        return { hours: 12, minutes: 0, amPm: \"AM\" as const };\n      }\n    },\n    [format],\n  );\n\n  // Format time value\n  const formatTime = (h: number, m: number, ap?: \"AM\" | \"PM\"): string => {\n    if (format === \"24h\") {\n      return `${String(h).padStart(2, \"0\")}:${String(m).padStart(2, \"0\")}`;\n    } else {\n      const displayHours =\n        ap === \"PM\" && h !== 12 ? h + 12 : ap === \"AM\" && h === 12 ? 0 : h;\n      return `${String(displayHours === 0 ? 12 : displayHours > 12 ? displayHours - 12 : displayHours).padStart(2, \"0\")}:${String(m).padStart(2, \"0\")} ${ap || \"AM\"}`;\n    }\n  };\n\n  // Initialize from value\n  useEffect(() => {\n    if (currentValue) {\n      const parsed = parseTime(currentValue);\n      setHours(parsed.hours);\n      setMinutes(parsed.minutes);\n      setAmPm(parsed.amPm);\n    }\n  }, [currentValue, parseTime]);\n\n  const handleHoursChange = (newHours: number) => {\n    const validHours =\n      format === \"24h\"\n        ? Math.max(0, Math.min(23, newHours))\n        : Math.max(1, Math.min(12, newHours));\n\n    setHours(validHours);\n    const newValue = formatTime(\n      validHours,\n      minutes,\n      format === \"12h\" ? amPm : undefined,\n    );\n\n    if (!isControlled) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const handleMinutesChange = (newMinutes: number) => {\n    const validMinutes = Math.max(0, Math.min(59, newMinutes));\n    setMinutes(validMinutes);\n    const newValue = formatTime(\n      hours,\n      validMinutes,\n      format === \"12h\" ? amPm : undefined,\n    );\n\n    if (!isControlled) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const handleAmPmToggle = () => {\n    const newAmPm = amPm === \"AM\" ? \"PM\" : \"AM\";\n    setAmPm(newAmPm);\n    const newValue = formatTime(hours, minutes, newAmPm);\n\n    if (!isControlled) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const incrementHours = () => {\n    if (format === \"24h\") {\n      handleHoursChange((hours + 1) % 24);\n    } else {\n      const newHours = hours === 12 ? 1 : hours + 1;\n      handleHoursChange(newHours);\n    }\n  };\n\n  const decrementHours = () => {\n    if (format === \"24h\") {\n      handleHoursChange(hours === 0 ? 23 : hours - 1);\n    } else {\n      const newHours = hours === 1 ? 12 : hours - 1;\n      handleHoursChange(newHours);\n    }\n  };\n\n  const incrementMinutes = () => {\n    handleMinutesChange((minutes + 1) % 60);\n  };\n\n  const decrementMinutes = () => {\n    handleMinutesChange(minutes === 0 ? 59 : minutes - 1);\n  };\n\n  const timePickerContent = (\n    <div className={`${getSpacingClass(\"base\", \"p\")} min-w-48`}>\n      <div\n        className={`flex items-center justify-center ${getSpacingClass(\"base\", \"gap\")}`}\n      >\n        {/* Hours */}\n        <div\n          className={`flex flex-col items-center ${getSpacingClass(\"sm\", \"gap\")}`}\n        >\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={incrementHours}\n            disabled={disabled}\n            aria-label=\"Increment hours\"\n          >\n            ↑\n          </Button>\n          <div className=\"text-2xl font-mono font-semibold w-12 text-center\">\n            {String(hours).padStart(2, \"0\")}\n          </div>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={decrementHours}\n            disabled={disabled}\n            aria-label=\"Decrement hours\"\n          >\n            ↓\n          </Button>\n        </div>\n\n        <div className=\"text-2xl font-semibold\">:</div>\n\n        {/* Minutes */}\n        <div\n          className={`flex flex-col items-center ${getSpacingClass(\"sm\", \"gap\")}`}\n        >\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={incrementMinutes}\n            disabled={disabled}\n            aria-label=\"Increment minutes\"\n          >\n            ↑\n          </Button>\n          <div className=\"text-2xl font-mono font-semibold w-12 text-center\">\n            {String(minutes).padStart(2, \"0\")}\n          </div>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={decrementMinutes}\n            disabled={disabled}\n            aria-label=\"Decrement minutes\"\n          >\n            ↓\n          </Button>\n        </div>\n\n        {/* AM/PM for 12h format */}\n        {format === \"12h\" && (\n          <div\n            className={`flex flex-col ${getSpacingClass(\"sm\", \"gap\")} ${getSpacingClass(\"sm\", \"ml\")}`}\n          >\n            <Button\n              variant={amPm === \"AM\" ? \"primary\" : \"outline\"}\n              size=\"sm\"\n              onClick={() => handleAmPmToggle()}\n              disabled={disabled}\n            >\n              AM\n            </Button>\n            <Button\n              variant={amPm === \"PM\" ? \"primary\" : \"outline\"}\n              size=\"sm\"\n              onClick={() => handleAmPmToggle()}\n              disabled={disabled}\n            >\n              PM\n            </Button>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n\n  return (\n    <div className={className}>\n      <Popover\n        trigger={\n          <Input\n            label={label}\n            value={\n              currentValue ||\n              formatTime(hours, minutes, format === \"12h\" ? amPm : undefined)\n            }\n            readOnly\n            disabled={disabled}\n            error={error}\n            helperText={helperText}\n            leftIcon={<Clock className=\"h-4 w-4\" />}\n            className=\"cursor-pointer\"\n          />\n        }\n        placement=\"bottom-start\"\n        showCloseButton\n        title=\"Select Time\"\n      >\n        {timePickerContent}\n      </Popover>\n    </div>\n  );\n}\n"],"names":["TimePicker","controlledValue","defaultValue","format","onChange","disabled","label","error","helperText","className","internalValue","setInternalValue","useState","hours","setHours","minutes","setMinutes","amPm","setAmPm","isControlled","currentValue","parseTime","useCallback","timeStr","h","m","match","formatTime","ap","displayHours","useEffect","parsed","handleHoursChange","newHours","validHours","newValue","handleMinutesChange","newMinutes","validMinutes","handleAmPmToggle","newAmPm","incrementHours","decrementHours","incrementMinutes","decrementMinutes","timePickerContent","getSpacingClass","jsxs","jsx","Button","Popover","Input","Clock"],"mappings":"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"}
+{"version":3,"file":"TimePicker.js","sources":["../../../../../src/ui/components/TimePicker/TimePicker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useEffect, useCallback, type KeyboardEvent } from \"react\";\nimport { Clock } from \"lucide-react\";\nimport Input from \"../../primitives/Input/Input\";\nimport Popover from \"../Popover/Popover\";\nimport Button from \"../../primitives/Button/Button\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\n\nexport type TimeFormat = \"12h\" | \"24h\";\n\nexport interface TimePickerProps {\n  value?: string; // Format: \"HH:mm\" for 24h or \"hh:mm AM/PM\" for 12h\n  defaultValue?: string;\n  format?: TimeFormat;\n  onChange?: (value: string) => void;\n  disabled?: boolean;\n  label?: string;\n  error?: boolean;\n  helperText?: string;\n  className?: string;\n}\n\n/**\n * TimePicker Component\n *\n * A time picker component for selecting time values.\n * Supports 12h and 24h formats.\n *\n * @example\n * ```tsx\n * <TimePicker\n *   value=\"14:30\"\n *   format=\"24h\"\n *   onChange={(value) => console.log(value)}\n * />\n * ```\n */\nexport default function TimePicker({\n  value: controlledValue,\n  defaultValue,\n  format = \"24h\",\n  onChange,\n  disabled = false,\n  label,\n  error = false,\n  helperText,\n  className = \"\",\n}: TimePickerProps) {\n  const [internalValue, setInternalValue] = useState(defaultValue || \"\");\n  const [hours, setHours] = useState(12);\n  const [minutes, setMinutes] = useState(0);\n  const [amPm, setAmPm] = useState<\"AM\" | \"PM\">(\"AM\");\n  const [open, setOpen] = useState(false);\n\n  const isControlled = controlledValue !== undefined;\n  const currentValue = isControlled ? controlledValue : internalValue;\n\n  // Parse time value\n  const parseTime = useCallback(\n    (timeStr: string) => {\n      if (!timeStr) return { hours: 12, minutes: 0, amPm: \"AM\" as const };\n\n      if (format === \"24h\") {\n        const [h, m] = timeStr.split(\":\").map(Number);\n        return {\n          hours: Number.isFinite(h) ? h : 12,\n          minutes: Number.isFinite(m) ? m : 0,\n          amPm: \"AM\" as const,\n        };\n      } else {\n        const match = timeStr.match(/(\\d+):(\\d+)\\s*(AM|PM)/i);\n        if (match) {\n          return {\n            hours: parseInt(match[1]),\n            minutes: parseInt(match[2]),\n            amPm: match[3].toUpperCase() as \"AM\" | \"PM\",\n          };\n        }\n        return { hours: 12, minutes: 0, amPm: \"AM\" as const };\n      }\n    },\n    [format],\n  );\n\n  // Format time value\n  const formatTime = (h: number, m: number, ap?: \"AM\" | \"PM\"): string => {\n    if (format === \"24h\") {\n      return `${String(h).padStart(2, \"0\")}:${String(m).padStart(2, \"0\")}`;\n    } else {\n      const displayHours =\n        ap === \"PM\" && h !== 12 ? h + 12 : ap === \"AM\" && h === 12 ? 0 : h;\n      return `${String(displayHours === 0 ? 12 : displayHours > 12 ? displayHours - 12 : displayHours).padStart(2, \"0\")}:${String(m).padStart(2, \"0\")} ${ap || \"AM\"}`;\n    }\n  };\n\n  // Initialize from value\n  useEffect(() => {\n    if (currentValue) {\n      const parsed = parseTime(currentValue);\n      setHours(parsed.hours);\n      setMinutes(parsed.minutes);\n      setAmPm(parsed.amPm);\n    }\n  }, [currentValue, parseTime]);\n\n  const handleHoursChange = (newHours: number) => {\n    const validHours =\n      format === \"24h\"\n        ? Math.max(0, Math.min(23, newHours))\n        : Math.max(1, Math.min(12, newHours));\n\n    setHours(validHours);\n    const newValue = formatTime(\n      validHours,\n      minutes,\n      format === \"12h\" ? amPm : undefined,\n    );\n\n    if (!isControlled) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const handleMinutesChange = (newMinutes: number) => {\n    const validMinutes = Math.max(0, Math.min(59, newMinutes));\n    setMinutes(validMinutes);\n    const newValue = formatTime(\n      hours,\n      validMinutes,\n      format === \"12h\" ? amPm : undefined,\n    );\n\n    if (!isControlled) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const handleAmPmToggle = () => {\n    const newAmPm = amPm === \"AM\" ? \"PM\" : \"AM\";\n    setAmPm(newAmPm);\n    const newValue = formatTime(hours, minutes, newAmPm);\n\n    if (!isControlled) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const incrementHours = () => {\n    if (format === \"24h\") {\n      handleHoursChange((hours + 1) % 24);\n    } else {\n      const newHours = hours === 12 ? 1 : hours + 1;\n      handleHoursChange(newHours);\n    }\n  };\n\n  const decrementHours = () => {\n    if (format === \"24h\") {\n      handleHoursChange(hours === 0 ? 23 : hours - 1);\n    } else {\n      const newHours = hours === 1 ? 12 : hours - 1;\n      handleHoursChange(newHours);\n    }\n  };\n\n  const incrementMinutes = () => {\n    handleMinutesChange((minutes + 1) % 60);\n  };\n\n  const decrementMinutes = () => {\n    handleMinutesChange(minutes === 0 ? 59 : minutes - 1);\n  };\n\n  // Keyboard affordance for the readOnly trigger Input: a focused\n  // readOnly <input> never synthesizes a click, so the Popover's\n  // wrapper onClick (mouse-only) leaves keyboard users unable to open\n  // the dialog at all. Enter/Space toggle; ArrowUp/ArrowDown open.\n  // Gated on `disabled` so a disabled control never surfaces its popup.\n  const handleTriggerKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n    if (disabled) return;\n    if (e.key === \"Enter\" || e.key === \" \") {\n      e.preventDefault();\n      setOpen((prev) => !prev);\n    } else if (e.key === \"ArrowDown\" || e.key === \"ArrowUp\") {\n      e.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const timePickerContent = (\n    <div className={`${getSpacingClass(\"base\", \"p\")} min-w-48`}>\n      <div\n        className={`flex items-center justify-center ${getSpacingClass(\"base\", \"gap\")}`}\n      >\n        {/* Hours */}\n        <div\n          className={`flex flex-col items-center ${getSpacingClass(\"sm\", \"gap\")}`}\n        >\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={incrementHours}\n            disabled={disabled}\n            aria-label=\"Increment hours\"\n          >\n            ↑\n          </Button>\n          <div\n            role=\"spinbutton\"\n            tabIndex={disabled ? -1 : 0}\n            aria-label=\"Hours\"\n            aria-valuenow={hours}\n            aria-valuemin={format === \"24h\" ? 0 : 1}\n            aria-valuemax={format === \"24h\" ? 23 : 12}\n            aria-valuetext={String(hours).padStart(2, \"0\")}\n            onKeyDown={(e) => {\n              if (e.key === \"ArrowUp\") {\n                e.preventDefault();\n                incrementHours();\n              } else if (e.key === \"ArrowDown\") {\n                e.preventDefault();\n                decrementHours();\n              }\n            }}\n            className=\"text-2xl font-mono font-semibold w-12 text-center\"\n          >\n            {String(hours).padStart(2, \"0\")}\n          </div>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={decrementHours}\n            disabled={disabled}\n            aria-label=\"Decrement hours\"\n          >\n            ↓\n          </Button>\n        </div>\n\n        <div className=\"text-2xl font-semibold\">:</div>\n\n        {/* Minutes */}\n        <div\n          className={`flex flex-col items-center ${getSpacingClass(\"sm\", \"gap\")}`}\n        >\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={incrementMinutes}\n            disabled={disabled}\n            aria-label=\"Increment minutes\"\n          >\n            ↑\n          </Button>\n          <div\n            role=\"spinbutton\"\n            tabIndex={disabled ? -1 : 0}\n            aria-label=\"Minutes\"\n            aria-valuenow={minutes}\n            aria-valuemin={0}\n            aria-valuemax={59}\n            aria-valuetext={String(minutes).padStart(2, \"0\")}\n            onKeyDown={(e) => {\n              if (e.key === \"ArrowUp\") {\n                e.preventDefault();\n                incrementMinutes();\n              } else if (e.key === \"ArrowDown\") {\n                e.preventDefault();\n                decrementMinutes();\n              }\n            }}\n            className=\"text-2xl font-mono font-semibold w-12 text-center\"\n          >\n            {String(minutes).padStart(2, \"0\")}\n          </div>\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            onClick={decrementMinutes}\n            disabled={disabled}\n            aria-label=\"Decrement minutes\"\n          >\n            ↓\n          </Button>\n        </div>\n\n        {/* AM/PM for 12h format */}\n        {format === \"12h\" && (\n          <div\n            className={`flex flex-col ${getSpacingClass(\"sm\", \"gap\")} ${getSpacingClass(\"sm\", \"ml\")}`}\n          >\n            <Button\n              variant={amPm === \"AM\" ? \"primary\" : \"outline\"}\n              size=\"sm\"\n              onClick={() => handleAmPmToggle()}\n              disabled={disabled}\n            >\n              AM\n            </Button>\n            <Button\n              variant={amPm === \"PM\" ? \"primary\" : \"outline\"}\n              size=\"sm\"\n              onClick={() => handleAmPmToggle()}\n              disabled={disabled}\n            >\n              PM\n            </Button>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n\n  return (\n    <div className={className}>\n      <Popover\n        open={disabled ? false : open}\n        onOpenChange={(next) => {\n          if (!disabled) setOpen(next);\n        }}\n        trigger={\n          <Input\n            label={label}\n            value={\n              currentValue ||\n              formatTime(hours, minutes, format === \"12h\" ? amPm : undefined)\n            }\n            readOnly\n            disabled={disabled}\n            error={error}\n            helperText={helperText}\n            leftIcon={<Clock className=\"h-4 w-4\" />}\n            className=\"cursor-pointer\"\n            role=\"combobox\"\n            aria-haspopup=\"dialog\"\n            aria-expanded={!disabled && open}\n            onKeyDown={handleTriggerKeyDown}\n          />\n        }\n        placement=\"bottom-start\"\n        showCloseButton\n        title=\"Select Time\"\n      >\n        {timePickerContent}\n      </Popover>\n    </div>\n  );\n}\n"],"names":["TimePicker","controlledValue","defaultValue","format","onChange","disabled","label","error","helperText","className","internalValue","setInternalValue","useState","hours","setHours","minutes","setMinutes","amPm","setAmPm","open","setOpen","isControlled","currentValue","parseTime","useCallback","timeStr","h","m","match","formatTime","ap","displayHours","useEffect","parsed","handleHoursChange","newHours","validHours","newValue","handleMinutesChange","newMinutes","validMinutes","handleAmPmToggle","newAmPm","incrementHours","decrementHours","incrementMinutes","decrementMinutes","handleTriggerKeyDown","prev","timePickerContent","getSpacingClass","jsxs","jsx","Button","Popover","next","Input","Clock"],"mappings":"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"}