@konstructio/ui 0.1.2-alpha.75 → 0.1.2-alpha.77

package/dist/components/TimePicker/components/HoursList/HoursList.js

@@ -1,125 +1,86 @@
-import { jsx as i } from "react/jsx-runtime";
-import { useRef as k, useCallback as d, useEffect as H } from "react";
-import { cn as l } from "../../../../utils/index.js";
-import { buttonVariants as A, liVariants as v, ulVariants as D } from "../../TimePicker.variants.js";
-import { useTimePickerContext as S } from "../../contexts/time-picker.hook.js";
-const h = ({ hours: a, scrollBehavior: f }) => {
-  const c = k(null), N = k(a), { format: n, isTyping: p, onSelectHour: u } = S(), b = n === "12" && a >= 12 ? a - 12 : a, m = n === "12" ? 12 : 24, y = d(
-    (e, t) => {
-      e.currentTarget?.blur(), u(t);
-    },
-    [u]
-  ), w = d(
-    (e, t) => {
-      const o = c.current?.querySelectorAll("button");
-      if (!o) return;
-      let r = t;
-      if (e.key === "ArrowDown" || e.key === "Tab" && !e.shiftKey)
-        e.preventDefault(), r = (t + 1) % m;
-      else if (e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey)
-        e.preventDefault(), r = (t - 1 + m) % m;
-      else if (e.key === "Enter") {
-        e.preventDefault();
-        const s = n === "12" ? t + 1 : t;
-        u(s), document.querySelector('[aria-label="minutes"]')?.querySelector(
-          'li[data-active="true"] button'
-        )?.focus();
-        return;
-      }
-      r !== t && o[r]?.focus();
-    },
-    [n, m, u]
-  );
-  if (H(() => {
-    const e = c.current, t = N.current, o = n === "12" && t >= 12 ? t - 12 : t, r = o === 0 && n === "12" ? 12 : o;
-    e && e.querySelector(
-      `[data-value="${`0${r}`.slice(-2)}"]`
-    )?.scrollIntoView({
-      behavior: f,
+import { jsx as p } from "react/jsx-runtime";
+import { c as E } from "../../../../compiler-runtime-DA41awpA.js";
+import { useRef as T, useEffect as V } from "react";
+import { cn as b } from "../../../../utils/index.js";
+import { ulVariants as g, buttonVariants as L, liVariants as R } from "../../TimePicker.variants.js";
+import { useTimePickerContext as M } from "../../contexts/time-picker.hook.js";
+const P = (j) => {
+  const t = E.c(31), {
+    hours: i,
+    scrollBehavior: w
+  } = j, y = T(null), C = T(i), {
+    format: l,
+    isTyping: d,
+    onSelectHour: n
+  } = M(), K = l === "12" && i >= 12 ? i - 12 : i, h = l === "12" ? 12 : 24;
+  let k;
+  t[0] !== n ? (k = (o, e) => {
+    o.currentTarget?.blur(), n(e);
+  }, t[0] = n, t[1] = k) : k = t[1];
+  const c = k;
+  let H;
+  t[2] !== l || t[3] !== h || t[4] !== n ? (H = (o, e) => {
+    const r = y.current?.querySelectorAll("button");
+    if (!r)
+      return;
+    let s = e;
+    if (o.key === "ArrowDown" || o.key === "Tab" && !o.shiftKey)
+      o.preventDefault(), s = (e + 1) % h;
+    else if (o.key === "ArrowUp" || o.key === "Tab" && o.shiftKey)
+      o.preventDefault(), s = (e - 1 + h) % h;
+    else if (o.key === "Enter") {
+      o.preventDefault();
+      const $ = l === "12" ? e + 1 : e;
+      n($), document.querySelector('[aria-label="minutes"]')?.querySelector('li[data-active="true"] button')?.focus();
+      return;
+    }
+    s !== e && r[s]?.focus();
+  }, t[2] = l, t[3] = h, t[4] = n, t[5] = H) : H = t[5];
+  const u = H;
+  let v, S;
+  t[6] !== l || t[7] !== w ? (v = () => {
+    const o = y.current, e = C.current, r = l === "12" && e >= 12 ? e - 12 : e, s = r === 0 && l === "12" ? 12 : r;
+    o && o.querySelector(`[data-value="${`0${s}`.slice(-2)}"]`)?.scrollIntoView({
+      behavior: w,
       block: "center"
     });
-  }, [n, f]), H(() => {
-    if (!p) return;
-    const e = c.current, t = n === "12" && a >= 12 ? a - 12 : a, o = t === 0 && n === "12" ? 12 : t;
-    e && e.querySelector(
-      `[data-value="${`0${o}`.slice(-2)}"]`
-    )?.scrollIntoView({
+  }, S = [l, w], t[6] = l, t[7] = w, t[8] = v, t[9] = S) : (v = t[8], S = t[9]), V(v, S);
+  let A, D;
+  if (t[10] !== l || t[11] !== i || t[12] !== d ? (A = () => {
+    if (!d)
+      return;
+    const o = y.current, e = l === "12" && i >= 12 ? i - 12 : i, r = e === 0 && l === "12" ? 12 : e;
+    o && o.querySelector(`[data-value="${`0${r}`.slice(-2)}"]`)?.scrollIntoView({
       behavior: "instant",
       block: "center"
     });
-  }, [a, n, p]), n === "12") {
-    const e = b === 0 ? 12 : b;
-    return /* @__PURE__ */ i(
-      "ul",
-      {
-        ref: c,
-        className: l(D()),
-        "aria-label": "hours",
-        role: "listbox",
-        children: Array.from({ length: 12 }, (t, o) => {
-          const r = e - 1 === o;
-          return /* @__PURE__ */ i(
-            "li",
-            {
-              className: l(v()),
-              "data-value": `0${o + 1}`.slice(-2),
-              "data-active": r,
-              role: "presentation",
-              children: /* @__PURE__ */ i(
-                "button",
-                {
-                  type: "button",
-                  role: "option",
-                  tabIndex: r ? 0 : -1,
-                  className: l(A()),
-                  onClick: (s) => y(s, o + 1),
-                  onKeyDown: (s) => w(s, o),
-                  children: o + 1
-                }
-              )
-            },
-            o
-          );
-        })
-      }
-    );
+  }, D = [i, l, d], t[10] = l, t[11] = i, t[12] = d, t[13] = A, t[14] = D) : (A = t[13], D = t[14]), V(A, D), l === "12") {
+    const o = K === 0 ? 12 : K;
+    let e;
+    t[15] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e = b(g()), t[15] = e) : e = t[15];
+    let r;
+    t[16] !== o || t[17] !== u || t[18] !== c ? (r = Array.from({
+      length: 12
+    }, ($, a) => {
+      const q = o - 1 === a;
+      return /* @__PURE__ */ p("li", { className: b(R()), "data-value": `0${a + 1}`.slice(-2), "data-active": q, role: "presentation", children: /* @__PURE__ */ p("button", { type: "button", role: "option", tabIndex: q ? 0 : -1, className: b(L()), onClick: (B) => c(B, a + 1), onKeyDown: (B) => u(B, a), children: a + 1 }) }, a);
+    }), t[16] = o, t[17] = u, t[18] = c, t[19] = r) : r = t[19];
+    let s;
+    return t[20] !== e || t[21] !== r ? (s = /* @__PURE__ */ p("ul", { ref: y, className: e, "aria-label": "hours", role: "listbox", children: r }), t[20] = e, t[21] = r, t[22] = s) : s = t[22], s;
   }
-  return /* @__PURE__ */ i(
-    "ul",
-    {
-      ref: c,
-      className: l(D()),
-      "aria-label": "hours",
-      role: "listbox",
-      children: Array.from({ length: 24 }, (e, t) => {
-        const o = a === t;
-        return /* @__PURE__ */ i(
-          "li",
-          {
-            className: l(v()),
-            "data-value": `0${t}`.slice(-2),
-            "data-active": o,
-            role: "presentation",
-            children: /* @__PURE__ */ i(
-              "button",
-              {
-                type: "button",
-                role: "option",
-                tabIndex: o ? 0 : -1,
-                className: l(A()),
-                onClick: (r) => y(r, t),
-                onKeyDown: (r) => w(r, t),
-                children: t
-              }
-            )
-          },
-          t
-        );
-      })
-    }
-  );
+  let f;
+  t[23] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (f = b(g()), t[23] = f) : f = t[23];
+  let m;
+  t[24] !== u || t[25] !== c || t[26] !== i ? (m = Array.from({
+    length: 24
+  }, (o, e) => {
+    const r = i === e;
+    return /* @__PURE__ */ p("li", { className: b(R()), "data-value": `0${e}`.slice(-2), "data-active": r, role: "presentation", children: /* @__PURE__ */ p("button", { type: "button", role: "option", tabIndex: r ? 0 : -1, className: b(L()), onClick: (s) => c(s, e), onKeyDown: (s) => u(s, e), children: e }) }, e);
+  }), t[24] = u, t[25] = c, t[26] = i, t[27] = m) : m = t[27];
+  let N;
+  return t[28] !== f || t[29] !== m ? (N = /* @__PURE__ */ p("ul", { ref: y, className: f, "aria-label": "hours", role: "listbox", children: m }), t[28] = f, t[29] = m, t[30] = N) : N = t[30], N;
 };
-h.displayName = "HoursList";
+P.displayName = "HoursList";
 export {
-  h as HoursList
+  P as HoursList
 };

package/dist/components/TimePicker/components/HoursList/HoursList.types.d.ts

@@ -1,4 +1,4 @@
-import { TimePickerProps } from '../../TimePicker.types';
+import { Props as TimePickerProps } from '../../TimePicker.types';
 export type HourListProps = {
     hours: number;
     scrollBehavior?: TimePickerProps['scrollBehavior'];

package/dist/components/TimePicker/components/MeridianList/MeridianList.js

@@ -1,91 +1,82 @@
-import { jsxs as N, jsx as o } from "react/jsx-runtime";
-import { useRef as A, useCallback as p } from "react";
-import { cn as t } from "../../../../utils/index.js";
-import { buttonVariants as b, liVariants as y } from "../../TimePicker.variants.js";
-import { useTimePickerContext as D } from "../../contexts/time-picker.hook.js";
-const M = ({
-  listClassName: k,
-  listItemClassName: n,
-  listItemButtonClassName: c,
-  onClose: f
-}) => {
-  const u = A(null), { format: w, isAM: r, onSelectAM: s, onSelectPM: i } = D(), m = p(
-    (e, a) => {
-      e.currentTarget?.blur(), a();
-    },
-    []
-  ), d = p(
-    (e, a) => {
-      const l = u.current?.querySelectorAll("button");
-      if (!l) return;
-      const x = e.key === "Tab" && !e.shiftKey, h = e.key === "Tab" && e.shiftKey;
-      e.key === "ArrowDown" || e.key === "ArrowUp" || x || h ? (e.preventDefault(), a ? l[1]?.focus() : l[0]?.focus()) : e.key === "Enter" && (e.preventDefault(), a ? s() : i(), f?.());
-    },
-    [s, i, f]
-  );
-  return w === "24" ? null : /* @__PURE__ */ N(
-    "ul",
-    {
-      ref: u,
-      className: t("flex items-center justify-center flex-col", k),
-      "aria-label": "meridian",
-      role: "listbox",
-      children: [
-        /* @__PURE__ */ o(
-          "li",
-          {
-            className: t(y({ className: n })),
-            "data-active": r,
-            role: "presentation",
-            children: /* @__PURE__ */ o(
-              "button",
-              {
-                type: "button",
-                role: "option",
-                tabIndex: r ? 0 : -1,
-                className: t(
-                  b({ className: c }),
-                  {
-                    "dark:text-slate-50": !r
-                  }
-                ),
-                onClick: (e) => m(e, s),
-                onKeyDown: (e) => d(e, !0),
-                children: "AM"
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ o(
-          "li",
-          {
-            className: t(y({ className: n })),
-            "data-active": !r,
-            role: "presentation",
-            children: /* @__PURE__ */ o(
-              "button",
-              {
-                type: "button",
-                role: "option",
-                tabIndex: r ? -1 : 0,
-                className: t(
-                  b({ className: c }),
-                  {
-                    "dark:text-slate-50": r
-                  }
-                ),
-                onClick: (e) => m(e, i),
-                onKeyDown: (e) => d(e, !1),
-                children: "PM"
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
+import { jsx as D, jsxs as U } from "react/jsx-runtime";
+import { c as $ } from "../../../../compiler-runtime-DA41awpA.js";
+import { useRef as z } from "react";
+import { cn as h } from "../../../../utils/index.js";
+import { liVariants as L, buttonVariants as V } from "../../TimePicker.variants.js";
+import { useTimePickerContext as G } from "../../contexts/time-picker.hook.js";
+const H = (M) => {
+  const e = $.c(46), {
+    listClassName: T,
+    listItemClassName: s,
+    listItemButtonClassName: i,
+    onClose: K
+  } = M, S = z(null), {
+    format: g,
+    isAM: l,
+    onSelectAM: o,
+    onSelectPM: r
+  } = G(), B = J;
+  let A;
+  e[0] !== K || e[1] !== o || e[2] !== r ? (A = (t, E) => {
+    const R = S.current?.querySelectorAll("button");
+    if (!R)
+      return;
+    const q = t.key === "Tab" && !t.shiftKey, F = t.key === "Tab" && t.shiftKey;
+    t.key === "ArrowDown" || t.key === "ArrowUp" || q || F ? (t.preventDefault(), E ? R[1]?.focus() : R[0]?.focus()) : t.key === "Enter" && (t.preventDefault(), E ? o() : r(), K?.());
+  }, e[0] = K, e[1] = o, e[2] = r, e[3] = A) : A = e[3];
+  const a = A;
+  if (g === "24")
+    return null;
+  let n;
+  e[4] !== T ? (n = h("flex items-center justify-center flex-col", T), e[4] = T, e[5] = n) : n = e[5];
+  let c;
+  e[6] !== s ? (c = h(L({
+    className: s
+  })), e[6] = s, e[7] = c) : c = e[7];
+  const I = l ? 0 : -1;
+  let f;
+  e[8] !== l || e[9] !== i ? (f = h(V({
+    className: i
+  }), {
+    "dark:text-slate-50": !l
+  }), e[8] = l, e[9] = i, e[10] = f) : f = e[10];
+  let m;
+  e[11] !== o ? (m = (t) => B(t, o), e[11] = o, e[12] = m) : m = e[12];
+  let u;
+  e[13] !== a ? (u = (t) => a(t, !0), e[13] = a, e[14] = u) : u = e[14];
+  let p;
+  e[15] !== I || e[16] !== f || e[17] !== m || e[18] !== u ? (p = /* @__PURE__ */ D("button", { type: "button", role: "option", tabIndex: I, className: f, onClick: m, onKeyDown: u, children: "AM" }), e[15] = I, e[16] = f, e[17] = m, e[18] = u, e[19] = p) : p = e[19];
+  let d;
+  e[20] !== l || e[21] !== c || e[22] !== p ? (d = /* @__PURE__ */ D("li", { className: c, "data-active": l, role: "presentation", children: p }), e[20] = l, e[21] = c, e[22] = p, e[23] = d) : d = e[23];
+  let b;
+  e[24] !== s ? (b = h(L({
+    className: s
+  })), e[24] = s, e[25] = b) : b = e[25];
+  const j = !l, P = l ? -1 : 0;
+  let y;
+  e[26] !== l || e[27] !== i ? (y = h(V({
+    className: i
+  }), {
+    "dark:text-slate-50": l
+  }), e[26] = l, e[27] = i, e[28] = y) : y = e[28];
+  let N;
+  e[29] !== r ? (N = (t) => B(t, r), e[29] = r, e[30] = N) : N = e[30];
+  let k;
+  e[31] !== a ? (k = (t) => a(t, !1), e[31] = a, e[32] = k) : k = e[32];
+  let x;
+  e[33] !== P || e[34] !== y || e[35] !== N || e[36] !== k ? (x = /* @__PURE__ */ D("button", { type: "button", role: "option", tabIndex: P, className: y, onClick: N, onKeyDown: k, children: "PM" }), e[33] = P, e[34] = y, e[35] = N, e[36] = k, e[37] = x) : x = e[37];
+  let w;
+  e[38] !== b || e[39] !== j || e[40] !== x ? (w = /* @__PURE__ */ D("li", { className: b, "data-active": j, role: "presentation", children: x }), e[38] = b, e[39] = j, e[40] = x, e[41] = w) : w = e[41];
+  let C;
+  return e[42] !== w || e[43] !== n || e[44] !== d ? (C = /* @__PURE__ */ U("ul", { ref: S, className: n, "aria-label": "meridian", role: "listbox", children: [
+    d,
+    w
+  ] }), e[42] = w, e[43] = n, e[44] = d, e[45] = C) : C = e[45], C;
 };
-M.displayName = "MeridianList";
+H.displayName = "MeridianList";
+function J(M, e) {
+  M.currentTarget?.blur(), e();
+}
 export {
-  M as MeridianList
+  H as MeridianList
 };

package/dist/components/TimePicker/components/MeridianList/MeridianList.types.d.ts

@@ -1,4 +1,4 @@
-import { TimePickerProps } from '../../TimePicker.types';
+import { Props as TimePickerProps } from '../../TimePicker.types';
 export type MeridianListProps = {
     listClassName?: TimePickerProps['listClassName'];
     listItemClassName?: TimePickerProps['listItemClassName'];

package/dist/components/TimePicker/components/MinutesList/MinutesList.js

@@ -1,102 +1,79 @@
-import { jsx as s } from "react/jsx-runtime";
-import { useRef as m, useEffect as p, useCallback as b } from "react";
-import { cn as c } from "../../../../utils/index.js";
-import { buttonVariants as h, liVariants as M, ulVariants as S } from "../../TimePicker.variants.js";
-import { useTimePickerContext as D } from "../../contexts/time-picker.hook.js";
-const $ = ({
-  minutes: o,
-  scrollBehavior: u,
-  onClose: l
-}) => {
-  const a = m(null), y = m(o), { isTyping: f, onSelectMinute: n } = D();
-  p(() => {
-    const t = a.current;
-    if (t) {
-      const e = `0${y.current}`.slice(-2);
-      t.querySelector(
-        `[data-value="${e}"]`
-      )?.scrollIntoView({
-        behavior: u,
+import { jsx as S } from "react/jsx-runtime";
+import { c as T } from "../../../../compiler-runtime-DA41awpA.js";
+import { useRef as D, useEffect as q } from "react";
+import { cn as $ } from "../../../../utils/index.js";
+import { ulVariants as V, buttonVariants as K, liVariants as L } from "../../TimePicker.variants.js";
+import { useTimePickerContext as N } from "../../contexts/time-picker.hook.js";
+const R = (v) => {
+  const t = T.c(17), {
+    minutes: i,
+    scrollBehavior: s,
+    onClose: a
+  } = v, c = D(null), A = D(i), {
+    isTyping: u,
+    onSelectMinute: n
+  } = N();
+  let f, m;
+  t[0] !== s ? (f = () => {
+    const e = c.current;
+    if (e) {
+      const r = `0${A.current}`.slice(-2);
+      e.querySelector(`[data-value="${r}"]`)?.scrollIntoView({
+        behavior: s,
         block: "center"
       });
     }
-  }, [u]), p(() => {
-    if (!f) return;
-    const t = a.current;
-    if (t) {
-      const e = `0${o}`.slice(-2);
-      t.querySelector(
-        `[data-value="${e}"]`
-      )?.scrollIntoView({
+  }, m = [s], t[0] = s, t[1] = f, t[2] = m) : (f = t[1], m = t[2]), q(f, m);
+  let p, y;
+  t[3] !== u || t[4] !== i ? (p = () => {
+    if (!u)
+      return;
+    const e = c.current;
+    if (e) {
+      const r = `0${i}`.slice(-2);
+      e.querySelector(`[data-value="${r}"]`)?.scrollIntoView({
         behavior: "instant",
         block: "center"
       });
     }
-  }, [o, f]);
-  const d = b(
-    (t, e) => {
-      n(t), e.currentTarget?.blur();
-    },
-    [n]
-  ), k = b(
-    (t, e) => {
-      const i = a.current?.querySelectorAll("button");
-      if (!i) return;
-      let r = e;
-      if (t.key === "ArrowDown" || t.key === "Tab" && !t.shiftKey)
-        t.preventDefault(), r = (e + 1) % 60;
-      else if (t.key === "ArrowUp" || t.key === "Tab" && t.shiftKey)
-        t.preventDefault(), r = (e - 1 + 60) % 60;
-      else if (t.key === "Enter") {
-        if (t.preventDefault(), n(e), l) {
-          l();
-          return;
-        }
-        document.querySelector('[aria-label="meridian"]')?.querySelector(
-          'li[data-active="true"] button'
-        )?.focus();
+  }, y = [i, u], t[3] = u, t[4] = i, t[5] = p, t[6] = y) : (p = t[5], y = t[6]), q(p, y);
+  let b;
+  t[7] !== n ? (b = (e, r) => {
+    n(e), r.currentTarget?.blur();
+  }, t[7] = n, t[8] = b) : b = t[8];
+  const k = b;
+  let d;
+  t[9] !== a || t[10] !== n ? (d = (e, r) => {
+    const l = c.current?.querySelectorAll("button");
+    if (!l)
+      return;
+    let o = r;
+    if (e.key === "ArrowDown" || e.key === "Tab" && !e.shiftKey)
+      e.preventDefault(), o = (r + 1) % 60;
+    else if (e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey)
+      e.preventDefault(), o = (r - 1 + 60) % 60;
+    else if (e.key === "Enter") {
+      if (e.preventDefault(), n(r), a) {
+        a();
         return;
       }
-      r !== e && i[r]?.focus();
-    },
-    [n, l]
-  );
-  return /* @__PURE__ */ s(
-    "ul",
-    {
-      ref: a,
-      className: c(S()),
-      "aria-label": "minutes",
-      role: "listbox",
-      children: Array.from({ length: 60 }, (t, e) => {
-        const i = o === e;
-        return /* @__PURE__ */ s(
-          "li",
-          {
-            className: c(M()),
-            "data-value": `0${e}`.slice(-2),
-            "data-active": i,
-            role: "presentation",
-            children: /* @__PURE__ */ s(
-              "button",
-              {
-                type: "button",
-                role: "option",
-                tabIndex: i ? 0 : -1,
-                className: c(h()),
-                onClick: (r) => d(e, r),
-                onKeyDown: (r) => k(r, e),
-                children: `0${e}`.slice(-2)
-              }
-            )
-          },
-          e
-        );
-      })
+      document.querySelector('[aria-label="meridian"]')?.querySelector('li[data-active="true"] button')?.focus();
+      return;
     }
-  );
+    o !== r && l[o]?.focus();
+  }, t[9] = a, t[10] = n, t[11] = d) : d = t[11];
+  const M = d;
+  let h;
+  t[12] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (h = $(V()), t[12] = h) : h = t[12];
+  let w;
+  return t[13] !== M || t[14] !== k || t[15] !== i ? (w = /* @__PURE__ */ S("ul", { ref: c, className: h, "aria-label": "minutes", role: "listbox", children: Array.from({
+    length: 60
+  }, (e, r) => {
+    const l = i === r;
+    return /* @__PURE__ */ S("li", { className: $(L()), "data-value": `0${r}`.slice(-2), "data-active": l, role: "presentation", children: /* @__PURE__ */ S("button", { type: "button", role: "option", tabIndex: l ? 0 : -1, className: $(K()), onClick: (o) => k(r, o), onKeyDown: (o) => M(o, r), children: `0${r}`.slice(-2) }) }, r);
+  }) }), t[13] = M, t[14] = k, t[15] = i, t[16] = w) : w = t[16], w;
 };
-$.displayName = "MinutesList";
+R.displayName = "MinutesList";
 export {
-  $ as MinutesList
+  R as MinutesList
 };

package/dist/components/TimePicker/components/MinutesList/MinutesList.types.d.ts

@@ -1,4 +1,4 @@
-import { TimePickerProps } from '../../TimePicker.types';
+import { Props as TimePickerProps } from '../../TimePicker.types';
 export type MinutesLitProps = {
     minutes: number;
     scrollBehavior?: TimePickerProps['scrollBehavior'];