@konstructio/ui 0.1.2-alpha.101 → 0.1.2-alpha.104

package/dist/components/Sidebar/components/index.js

@@ -1,22 +1,24 @@
-import { t as r } from "../../../HamburgerTrigger-7a4POUaM.js";
-import { Footer as m } from "./Footer/Footer.js";
-import { Label as a } from "./Label/Label.js";
-import { Logo as f } from "./Logo/Logo.js";
-import { NavigationTitle as e } from "./NavigationTitle/NavigationTitle.js";
-import { NavigationGroup as v } from "./NavigationGroup/NavigationGroup.js";
+import { t as r } from "../../../HamburgerTrigger-DRylBL2d.js";
+import { CollapseTrigger as m } from "./CollapseTrigger/CollapseTrigger.js";
+import { Footer as p } from "./Footer/Footer.js";
+import { Label as f } from "./Label/Label.js";
+import { Logo as e } from "./Logo/Logo.js";
+import { NavigationTitle as v } from "./NavigationTitle/NavigationTitle.js";
+import { NavigationGroup as l } from "./NavigationGroup/NavigationGroup.js";
 import { NavigationOption as b } from "./NavigationOption/NavigationOption.js";
 import { NavigationSeparator as u } from "./NavigationSeparator/NavigationSeparator.js";
-import { Navigation as T } from "./Navigation/Navigation.js";
-import { Wrapper as x } from "./Wrapper/Wrapper.js";
+import { Navigation as x } from "./Navigation/Navigation.js";
+import { Wrapper as F } from "./Wrapper/Wrapper.js";
 export {
-  m as Footer,
+  m as CollapseTrigger,
+  p as Footer,
   r as HamburgerTrigger,
-  a as Label,
-  f as Logo,
-  T as Navigation,
-  v as NavigationGroup,
+  f as Label,
+  e as Logo,
+  x as Navigation,
+  l as NavigationGroup,
   b as NavigationOption,
   u as NavigationSeparator,
-  e as NavigationTitle,
-  x as Wrapper
+  v as NavigationTitle,
+  F as Wrapper
 };

package/dist/components/Sidebar/contexts/SidebarContext.js

@@ -1,13 +1,16 @@
-import { createContext as e, useContext as r } from "react";
-var t = e({
+import { createContext as e, useContext as a } from "react";
+var o = e({
   mode: "expanded",
   isCollapsed: !1,
   expandOnHover: !1,
   animateOnHover: !0,
   closeDrawer: () => {
+  },
+  canToggle: !1,
+  toggleMode: () => {
   }
-}), o = () => r(t);
+}), t = () => a(o);
 export {
-  t as SidebarContext,
-  o as useSidebarContext
+  o as SidebarContext,
+  t as useSidebarContext
 };

package/dist/components/Slider/Slider.js

@@ -1,41 +1,43 @@
 import { t } from "../../utils-Cx-WzRZF.js";
-import { i as v, r as N, t as S } from "../../dist-BkYHh2kH.js";
-import { sliderVariants as V, thumbVariants as b, trackVariants as g } from "./Slider.variants.js";
-import { forwardRef as j, useCallback as k, useEffect as w, useImperativeHandle as y, useRef as C, useState as R } from "react";
-import { jsx as a, jsxs as l } from "react/jsx-runtime";
-var q = j(({ label: s, labelWrapperClassName: i, defaultValue: c = [0], name: u, theme: m, size: n, showValue: d, ...f }, o) => {
-  const e = C(null), [r, h] = R(c);
+import { i as v, r as N, t as S } from "../../dist-DDck_2lb.js";
+import { sliderVariants as V, thumbVariants as g, trackVariants as j } from "./Slider.variants.js";
+import { forwardRef as b, useEffect as w, useImperativeHandle as y, useRef as R, useState as k } from "react";
+import { jsx as r, jsxs as l } from "react/jsx-runtime";
+var $ = b(({ label: s, labelWrapperClassName: i, defaultValue: c = [0], name: u, theme: m, size: n, showValue: d, ...f }, o) => {
+  const e = R(null), [a, h] = k(c);
   y(o, () => e.current, [e]), w(() => {
-    e.current && (e.current.value = r.toString());
-  }, [r]);
-  const p = k((x) => h(x), []);
+    e.current && (e.current.value = a.toString());
+  }, [a]);
+  const p = (x) => {
+    h(x);
+  };
   return /* @__PURE__ */ l("div", {
     className: "w-full relative flex flex-col gap-3",
     "data-theme": m,
     children: [
       /* @__PURE__ */ l("div", {
         className: t("flex items-center", s ? "justify-between" : "justify-end", i),
-        children: [s ? /* @__PURE__ */ a("label", { children: s }) : null, d ? /* @__PURE__ */ a("span", {
+        children: [s ? /* @__PURE__ */ r("label", { children: s }) : null, d ? /* @__PURE__ */ r("span", {
           className: "text-xs",
-          children: r
+          children: a
         }) : null]
       }),
-      /* @__PURE__ */ a("input", {
+      /* @__PURE__ */ r("input", {
         ref: e,
         name: u,
         className: "hidden",
         type: "number"
       }),
       /* @__PURE__ */ l(S, {
-        value: r,
+        value: a,
         className: t(V()),
         onValueChange: p,
         ...f,
-        children: [/* @__PURE__ */ a(v, { className: t(g({ size: n })) }), /* @__PURE__ */ a(N, { className: t(b({ size: n })) })]
+        children: [/* @__PURE__ */ r(v, { className: t(j({ size: n })) }), /* @__PURE__ */ r(N, { className: t(g({ size: n })) })]
       })
     ]
   });
 });
 export {
-  q as Slider
+  $ as Slider
 };

package/dist/components/Spinner/Spinner.js

@@ -1,4 +1,4 @@
-import { t as o } from "../../Spinner-BegZ5yd7.js";
+import { t as o } from "../../Spinner-CUwE2bLm.js";
 export {
   o as Spinner
 };

package/dist/components/Stepper/Stepper.variants.js

@@ -117,8 +117,8 @@ var e = t(["flex"], {
         "font-semibold"
       ],
       lg: [
-        "w-[54px]",
-        "h-[54px]",
+        "w-13.5",
+        "h-13.5",
         "text-lg",
         "font-semibold"
       ]
@@ -252,7 +252,7 @@ var e = t(["flex"], {
       size: "lg",
       class: [
         "h-6",
-        "ml-[26px]",
+        "ml-6.5",
         "my-1"
       ]
     },
@@ -293,20 +293,20 @@ var e = t(["flex"], {
     size: "sm",
     variant: "inline"
   }
-}), x = t([
+}), m = t([
   "flex",
   "items-center",
   "flex-1"
 ], {
   variants: { variant: {
     inline: ["mt-2.5"],
-    stacked: ["mt-[26px]"],
+    stacked: ["mt-6.5"],
     horizontal: ["mt-0"]
   } },
   defaultVariants: { variant: "inline" }
 });
 export {
-  x as horizontalConnectorWrapperVariants,
+  m as horizontalConnectorWrapperVariants,
   c as stepConnectorVariants,
   l as stepContentVariants,
   d as stepDescriptionVariants,

package/dist/components/Stepper/hooks/useStepItemLogic.js

@@ -1,24 +1,19 @@
-import { t as u } from "../../../dist-DqKFpce5.js";
-import { useCallback as s } from "react";
-function d({ clickable: c, onClick: e, step: n }) {
-  const i = n.status ?? "pending", l = n.disabled || i === "active", r = !!(n.onClick || e), t = c && !l && r, f = typeof n.label == "string" ? "span" : u, o = s(() => {
+import { t as f } from "../../../dist-xCbHbMLA.js";
+function b({ clickable: s, onClick: e, step: n }) {
+  const a = n.status ?? "pending", i = n.disabled || a === "active", c = !!(n.onClick || e), t = s && !i && c, r = typeof n.label == "string" ? "span" : f, l = () => {
     t && (n.onClick ? n.onClick() : e && e());
-  }, [
-    t,
-    n.onClick,
-    e
-  ]);
+  };
   return {
     isClickable: t,
-    isDisabled: l,
-    LabelComponent: f,
-    status: i,
-    handleClick: o,
-    handleKeyDown: s((a) => {
-      t && (a.key === "Enter" || a.key === " ") && (a.preventDefault(), o());
-    }, [t, o])
+    isDisabled: i,
+    LabelComponent: r,
+    status: a,
+    handleClick: l,
+    handleKeyDown: (o) => {
+      t && (o.key === "Enter" || o.key === " ") && (o.preventDefault(), l());
+    }
   };
 }
 export {
-  d as useStepItemLogic
+  b as useStepItemLogic
 };

package/dist/components/Switch/Switch.js

@@ -1,4 +1,4 @@
-import { t as o } from "../../Switch-1RGhhTtg.js";
+import { t as o } from "../../Switch-aPhL5rNG.js";
 export {
   o as Switch
 };

package/dist/components/Table/components/Filter.js

@@ -1,4 +1,4 @@
-import { t as a } from "../../../Input-DG3snJf_.js";
+import { t as a } from "../../../Input-Cf44DzfE.js";
 import { jsx as s, jsxs as t } from "react/jsx-runtime";
 var m = ({ children: e, ...r }) => /* @__PURE__ */ t("div", {
   className: "flex px-4 py-6 rounded-t",

package/dist/components/Tabs/Tabs.js

@@ -1,5 +1,5 @@
 import { t as s } from "../../utils-Cx-WzRZF.js";
-import { r as e } from "../../dist-CktbIsHq.js";
+import { r as e } from "../../dist-BlPTJNIm.js";
 import { rootVariants as p } from "./Tabs.variants.js";
 import { Content as n } from "./components/Content.js";
 import { List as f } from "./components/List.js";

package/dist/components/Tabs/Tabs.variants.js

@@ -12,7 +12,7 @@ var r = a([""], {
   variants: { variant: {
     default: "flex gap-6",
     horizontal: "",
-    vertical: "flex-col min-w-[132px] h-full items-center"
+    vertical: "flex-col min-w-33 h-full items-center"
   } },
   defaultVariants: { variant: "default" }
 }), n = a([

package/dist/components/Tabs/components/Content.js

@@ -1,5 +1,5 @@
 import { t as r } from "../../../utils-Cx-WzRZF.js";
-import { t as n } from "../../../dist-CktbIsHq.js";
+import { t as n } from "../../../dist-BlPTJNIm.js";
 import { contentVariants as m } from "../Tabs.variants.js";
 import { jsx as s } from "react/jsx-runtime";
 var e = ({ children: t, className: o, ...a }) => /* @__PURE__ */ s(n, {

package/dist/components/Tabs/components/List.js

@@ -1,5 +1,5 @@
 import { t as a } from "../../../utils-Cx-WzRZF.js";
-import { n } from "../../../dist-CktbIsHq.js";
+import { n } from "../../../dist-BlPTJNIm.js";
 import { listVariants as t } from "../Tabs.variants.js";
 import { jsx as r } from "react/jsx-runtime";
 var e = ({ children: s, className: i, orientation: m, ...o }) => /* @__PURE__ */ r("div", {

package/dist/components/Tabs/components/Trigger.js

@@ -1,6 +1,6 @@
 import { t as e } from "../../../utils-Cx-WzRZF.js";
 import { Typography as m } from "../../Typography/Typography.js";
-import { i as n } from "../../../dist-CktbIsHq.js";
+import { i as n } from "../../../dist-BlPTJNIm.js";
 import { triggerVariants as p } from "../Tabs.variants.js";
 import { jsx as r } from "react/jsx-runtime";
 var s = ({ tab: a, label: i, isActive: o, className: t }) => /* @__PURE__ */ r(n, {

package/dist/components/Tag/Tag.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../dist-DqKFpce5.js";
+import { t as e } from "../../dist-xCbHbMLA.js";
 import { t as n } from "../../utils-Cx-WzRZF.js";
 import { tagVariants as o } from "./Tag.variants.js";
 import { jsx as a, jsxs as c } from "react/jsx-runtime";

package/dist/components/Tag/Tag.variants.js

@@ -1,5 +1,5 @@
 import { t as e } from "../../dist-B9GE4SXf.js";
-var f = e([
+var a = e([
   "px-2",
   "py-1",
   "rounded-md",
@@ -11,25 +11,25 @@ var f = e([
   "gap-1"
 ], {
   variants: { color: {
-    gray: ["bg-[#f4f4f5]", "text-[#71717a]"],
+    gray: ["bg-zinc-100", "text-zinc-500"],
     "gray-800": ["bg-gray-100", "text-gray-800"],
-    cyan: ["bg-[#ecfeff]", "text-[#0e7490]"],
-    gold: ["bg-[#fef9c3]", "text-[#a16207]"],
-    green: ["bg-[#dcfce7]", "text-[#15803d]"],
-    "light blue": ["bg-[#e0f2fe]", "text-[#0369a1]"],
-    lime: ["bg-[#ecfccb]", "text-[#4d7c0f]"],
-    pink: ["bg-[#fce7f3]", "text-[#be185d]"],
-    purple: ["bg-[#ede9fe]", "text-[#6d28d9]"],
-    emerald: ["bg-[#ecfdf5]", "text-[#047857]"],
-    fuscia: ["bg-[#fdf4ff]", "text-[#a21caf]"],
-    indigo: ["bg-[#e0e7ff]", "text-[#4338ca]"],
-    "light-orange": ["bg-[#fef3c7]", "text-[#d97706]"],
-    "dark-sky-blue": ["bg-[#dbeafe]", "text-[#1d4ed8]"],
-    mistery: ["bg-[#1e2235]", "text-[#81e2b4]"],
-    default: ["bg-transparent", "text-[#71717A]"]
+    cyan: ["bg-cyan-50", "text-cyan-700"],
+    gold: ["bg-yellow-100", "text-yellow-700"],
+    green: ["bg-green-100", "text-green-700"],
+    "light blue": ["bg-sky-100", "text-sky-700"],
+    lime: ["bg-lime-100", "text-lime-700"],
+    pink: ["bg-pink-100", "text-pink-700"],
+    purple: ["bg-violet-100", "text-violet-700"],
+    emerald: ["bg-emerald-50", "text-emerald-700"],
+    fuscia: ["bg-fuchsia-50", "text-fuchsia-700"],
+    indigo: ["bg-indigo-100", "text-indigo-700"],
+    "light-orange": ["bg-amber-100", "text-amber-600"],
+    "dark-sky-blue": ["bg-blue-100", "text-blue-700"],
+    mistery: ["bg-kubefirst-dark-blue-900", "text-mistery"],
+    default: ["bg-transparent", "text-zinc-500"]
   } },
   defaultVariants: { color: "default" }
 });
 export {
-  f as tagVariants
+  a as tagVariants
 };

package/dist/components/TagSelect/TagSelect.js

@@ -1,5 +1,5 @@
 "use client";
-import { t as m } from "../../Wrapper-DwxJAkNQ.js";
+import { t as m } from "../../Wrapper-CVJSuYWx.js";
 import { TagSelectProvider as p } from "./contexts/TagSelect.provider.js";
 import { forwardRef as a } from "react";
 import { jsx as r } from "react/jsx-runtime";

package/dist/components/TagSelect/components/Wrapper/Wrapper.js

@@ -1,4 +1,4 @@
-import { t as p } from "../../../../Wrapper-DwxJAkNQ.js";
+import { t as p } from "../../../../Wrapper-CVJSuYWx.js";
 export {
   p as Wrapper
 };

package/dist/components/TagSelect/components/index.js

@@ -1,4 +1,4 @@
-import { t as m } from "../../../Wrapper-DwxJAkNQ.js";
+import { t as m } from "../../../Wrapper-CVJSuYWx.js";
 import { Item as t } from "./Item/Item.js";
 import { List as i } from "./List/List.js";
 export {

package/dist/components/TagSelect/hooks/useTagSelect.js

@@ -1,23 +1,24 @@
-import { useTagSelect as o } from "../contexts/TagSelect.hook.js";
+import { useClickOutside as o } from "../../../hooks/useClickOutside.js";
+import { useTagSelect as s } from "../contexts/TagSelect.hook.js";
 import { useCallback as l, useEffect as c, useRef as u } from "react";
-var f = () => {
-  const n = u(null), { onOpen: e } = o();
-  return c(() => {
+var m = () => {
+  const n = u(null), { onOpen: e } = s();
+  return o(n, l(() => {
+    e(!1);
+  }, [e])), c(() => {
     const t = new AbortController(), r = (a) => {
       a.key === "Escape" && e(!1);
-    }, s = (a) => {
-      n.current?.contains(a.target) || e(!1);
     };
-    return document.addEventListener("keydown", r, { signal: t.signal }), document.addEventListener("mousedown", s, { signal: t.signal }), () => {
+    return document.addEventListener("keydown", r, { signal: t.signal }), () => {
       t.abort();
     };
-  }, [e, n]), {
+  }, [e]), {
     wrapperRef: n,
-    handleOpen: l((t) => {
+    handleOpen: (t) => {
       t.target?.closest("[data-value]") || e(!0);
-    }, [e])
+    }
   };
 };
 export {
-  f as useTagSelect
+  m as useTagSelect
 };

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

@@ -1,40 +1,36 @@
 import { t as s } from "../../../../utils-Cx-WzRZF.js";
-import { useTimePickerContext as h } from "../../contexts/time-picker.hook.js";
-import { buttonVariants as k, liVariants as d, ulVariants as H } from "../../TimePicker.variants.js";
-import { useCallback as A, useEffect as D, useRef as N } from "react";
-import { jsx as c } from "react/jsx-runtime";
-var v = ({ hours: a, scrollBehavior: m }) => {
-  const i = N(null), S = N(a), { format: l, isTyping: p, onSelectHour: u } = h(), b = l === "12" && a >= 12 ? a - 12 : a, f = l === "12" ? 12 : 24, y = A((e, t) => {
-    e.currentTarget?.blur(), u(t);
-  }, [u]), w = A((e, t) => {
-    const r = i.current?.querySelectorAll("button");
+import { useTimePickerContext as S } from "../../contexts/time-picker.hook.js";
+import { buttonVariants as d, liVariants as k, ulVariants as H } from "../../TimePicker.variants.js";
+import { useEffect as A, useRef as D } from "react";
+import { jsx as i } from "react/jsx-runtime";
+var h = ({ hours: a, scrollBehavior: f }) => {
+  const c = D(null), N = D(a), { format: l, isTyping: m, onSelectHour: p } = S(), b = l === "12" && a >= 12 ? a - 12 : a, u = l === "12" ? 12 : 24, y = (e, t) => {
+    e.currentTarget?.blur(), p(t);
+  }, w = (e, t) => {
+    const r = c.current?.querySelectorAll("button");
     if (!r) return;
     let o = t;
     if (e.key === "ArrowDown" || e.key === "Tab" && !e.shiftKey)
-      e.preventDefault(), o = (t + 1) % f;
+      e.preventDefault(), o = (t + 1) % u;
     else if (e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey)
-      e.preventDefault(), o = (t - 1 + f) % f;
+      e.preventDefault(), o = (t - 1 + u) % u;
     else if (e.key === "Enter") {
       e.preventDefault();
       const n = l === "12" ? t + 1 : t;
-      u(n), document.querySelector('[aria-label="minutes"]')?.querySelector('li[data-active="true"] button')?.focus();
+      p(n), document.querySelector('[aria-label="minutes"]')?.querySelector('li[data-active="true"] button')?.focus();
       return;
     }
     o !== t && r[o]?.focus();
-  }, [
-    l,
-    f,
-    u
-  ]);
-  if (D(() => {
-    const e = i.current, t = S.current, r = l === "12" && t >= 12 ? t - 12 : t, o = r === 0 && l === "12" ? 12 : r;
+  };
+  if (A(() => {
+    const e = c.current, t = N.current, r = l === "12" && t >= 12 ? t - 12 : t, o = r === 0 && l === "12" ? 12 : r;
     e && e.querySelector(`[data-value="${`0${o}`.slice(-2)}"]`)?.scrollIntoView({
-      behavior: m,
+      behavior: f,
       block: "center"
     });
-  }, [l, m]), D(() => {
-    if (!p) return;
-    const e = i.current, t = l === "12" && a >= 12 ? a - 12 : a, r = t === 0 && l === "12" ? 12 : t;
+  }, [l, f]), A(() => {
+    if (!m) return;
+    const e = c.current, t = l === "12" && a >= 12 ? a - 12 : a, r = t === 0 && l === "12" ? 12 : t;
     e && e.querySelector(`[data-value="${`0${r}`.slice(-2)}"]`)?.scrollIntoView({
       behavior: "instant",
       block: "center"
@@ -42,26 +38,26 @@ var v = ({ hours: a, scrollBehavior: m }) => {
   }, [
     a,
     l,
-    p
+    m
   ]), l === "12") {
     const e = b === 0 ? 12 : b;
-    return /* @__PURE__ */ c("ul", {
-      ref: i,
+    return /* @__PURE__ */ i("ul", {
+      ref: c,
       className: s(H()),
       "aria-label": "hours",
       role: "listbox",
       children: Array.from({ length: 12 }, (t, r) => {
         const o = e - 1 === r;
-        return /* @__PURE__ */ c("li", {
-          className: s(d()),
+        return /* @__PURE__ */ i("li", {
+          className: s(k()),
           "data-value": `0${r + 1}`.slice(-2),
           "data-active": o,
           role: "presentation",
-          children: /* @__PURE__ */ c("button", {
+          children: /* @__PURE__ */ i("button", {
             type: "button",
             role: "option",
             tabIndex: o ? 0 : -1,
-            className: s(k()),
+            className: s(d()),
             onClick: (n) => y(n, r + 1),
             onKeyDown: (n) => w(n, r),
             children: r + 1
@@ -70,23 +66,23 @@ var v = ({ hours: a, scrollBehavior: m }) => {
       })
     });
   }
-  return /* @__PURE__ */ c("ul", {
-    ref: i,
+  return /* @__PURE__ */ i("ul", {
+    ref: c,
     className: s(H()),
     "aria-label": "hours",
     role: "listbox",
     children: Array.from({ length: 24 }, (e, t) => {
       const r = a === t;
-      return /* @__PURE__ */ c("li", {
-        className: s(d()),
+      return /* @__PURE__ */ i("li", {
+        className: s(k()),
         "data-value": `0${t}`.slice(-2),
         "data-active": r,
         role: "presentation",
-        children: /* @__PURE__ */ c("button", {
+        children: /* @__PURE__ */ i("button", {
           type: "button",
           role: "option",
           tabIndex: r ? 0 : -1,
-          className: s(k()),
+          className: s(d()),
           onClick: (o) => y(o, t),
           onKeyDown: (o) => w(o, t),
           children: t
@@ -95,7 +91,7 @@ var v = ({ hours: a, scrollBehavior: m }) => {
     })
   });
 };
-v.displayName = "HoursList";
+h.displayName = "HoursList";
 export {
-  v as HoursList
+  h as HoursList
 };

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

@@ -1,56 +1,52 @@
 import { t } from "../../../../utils-Cx-WzRZF.js";
-import { useTimePickerContext as N } from "../../contexts/time-picker.hook.js";
-import { buttonVariants as p, liVariants as b } from "../../TimePicker.variants.js";
-import { useCallback as y, useRef as D } from "react";
-import { jsx as o, jsxs as M } from "react/jsx-runtime";
-var T = ({ listClassName: k, listItemClassName: n, listItemButtonClassName: c, onClose: f }) => {
-  const u = D(null), { format: x, isAM: r, onSelectAM: l, onSelectPM: s } = N(), m = y((e, a) => {
+import { useTimePickerContext as w } from "../../contexts/time-picker.hook.js";
+import { buttonVariants as d, liVariants as p } from "../../TimePicker.variants.js";
+import { useRef as N } from "react";
+import { jsx as o, jsxs as D } from "react/jsx-runtime";
+var M = ({ listClassName: b, listItemClassName: n, listItemButtonClassName: s, onClose: y }) => {
+  const i = N(null), { format: k, isAM: r, onSelectAM: c, onSelectPM: f } = w(), u = (e, a) => {
     e.currentTarget?.blur(), a();
-  }, []), d = y((e, a) => {
-    const i = u.current?.querySelectorAll("button");
-    if (!i) return;
-    const h = e.key === "Tab" && !e.shiftKey, w = e.key === "Tab" && e.shiftKey;
-    e.key === "ArrowDown" || e.key === "ArrowUp" || h || w ? (e.preventDefault(), a ? i[1]?.focus() : i[0]?.focus()) : e.key === "Enter" && (e.preventDefault(), a ? l() : s(), f?.());
-  }, [
-    l,
-    s,
-    f
-  ]);
-  return x === "24" ? null : /* @__PURE__ */ M("ul", {
-    ref: u,
-    className: t("flex items-center justify-center flex-col", k),
+  }, m = (e, a) => {
+    const l = i.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 ? c() : f(), y?.());
+  };
+  return k === "24" ? null : /* @__PURE__ */ D("ul", {
+    ref: i,
+    className: t("flex items-center justify-center flex-col", b),
     "aria-label": "meridian",
     role: "listbox",
     children: [/* @__PURE__ */ o("li", {
-      className: t(b({ className: n })),
+      className: t(p({ className: n })),
       "data-active": r,
       role: "presentation",
       children: /* @__PURE__ */ o("button", {
         type: "button",
         role: "option",
         tabIndex: r ? 0 : -1,
-        className: t(p({ className: c }), { "dark:text-slate-50": !r }),
-        onClick: (e) => m(e, l),
-        onKeyDown: (e) => d(e, !0),
+        className: t(d({ className: s }), { "dark:text-slate-50": !r }),
+        onClick: (e) => u(e, c),
+        onKeyDown: (e) => m(e, !0),
         children: "AM"
       })
     }), /* @__PURE__ */ o("li", {
-      className: t(b({ className: n })),
+      className: t(p({ className: n })),
       "data-active": !r,
       role: "presentation",
       children: /* @__PURE__ */ o("button", {
         type: "button",
         role: "option",
         tabIndex: r ? -1 : 0,
-        className: t(p({ className: c }), { "dark:text-slate-50": r }),
-        onClick: (e) => m(e, s),
-        onKeyDown: (e) => d(e, !1),
+        className: t(d({ className: s }), { "dark:text-slate-50": r }),
+        onClick: (e) => u(e, f),
+        onKeyDown: (e) => m(e, !1),
         children: "PM"
       })
     })]
   });
 };
-T.displayName = "MeridianList";
+M.displayName = "MeridianList";
 export {
-  T as MeridianList
+  M as MeridianList
 };