@konstructio/ui 0.1.2-alpha.4 → 0.1.2-alpha.6

package/dist/components/Dropdown/components/List/List.js

@@ -1,76 +1,79 @@
 import { jsx as l, jsxs as x, Fragment as N } from "react/jsx-runtime";
 import { forwardRef as k, useRef as C, useImperativeHandle as y } from "react";
-import { cn as o } from "../../../../utils/index.js";
-import { useNavigationUlList as R } from "../../hooks/useNavigationList.js";
-import { ListItem as a } from "../ListItem/ListItem.js";
-import { listVariants as j } from "./List.variants.js";
-import { S as I } from "../../../../index-DQH6odE9.js";
-import { useDropdownContext as O } from "../../contexts/dropdown.hook.js";
-const z = k(
+import { cn as t } from "../../../../utils/index.js";
+import { useNavigationUlList as j } from "../../hooks/useNavigationList.js";
+import { ListItem as n } from "../ListItem/ListItem.js";
+import { listVariants as I } from "./List.variants.js";
+import { S as O } from "../../../../index-DQH6odE9.js";
+import { useDropdownContext as S } from "../../contexts/dropdown.hook.js";
+const A = k(
   ({
-    additionalOptions: m,
-    className: f,
-    inputRef: p,
+    additionalOptions: f,
+    className: p,
+    inputRef: o,
     isLoading: u,
-    itemClassName: s,
+    itemClassName: r,
     name: d,
-    options: n,
-    searchable: i = !1,
+    options: i,
+    searchable: c = !1,
     wrapperInputRef: g,
     wrapperRef: b
   }, h) => {
-    const t = C(null), { isOpen: v, searchTerm: L } = O();
-    y(h, () => t.current, [t]), R({
-      ulRef: t,
+    const s = C(null), { isOpen: v, searchTerm: L } = S();
+    y(h, () => s.current, [s]), j({
+      ulRef: s,
       wrapperRef: b,
       wrapperInputRef: g,
-      inputRef: p,
-      searchable: i
+      inputRef: o,
+      searchable: c
     });
-    const c = i ? n.filter((e) => {
-      const r = L.toLowerCase();
-      return (typeof e.label == "string" ? e.label.toLowerCase() : "").includes(r);
-    }) : n, w = c.length === 0;
+    const m = c ? i.filter((e) => {
+      const a = L.toLowerCase();
+      return (typeof e.label == "string" ? e.label.toLowerCase() : "").includes(a);
+    }) : i, w = m.length === 0;
     return /* @__PURE__ */ l(
       "ul",
       {
-        ref: t,
+        ref: s,
         title: d,
         role: "listbox",
-        className: o(j({ className: f })),
+        className: t(I({ className: p })),
         "data-state": v ? "open" : "closed",
         children: u ? /* @__PURE__ */ l(
-          a,
+          n,
           {
-            className: o("select-none", s),
+            className: t("select-none", r),
             isClickable: !1,
+            inputRef: o,
             value: "Loading...",
             label: "Loading..."
           }
         ) : w ? /* @__PURE__ */ l(
-          a,
+          n,
           {
-            className: o("select-none", s),
+            className: t("select-none", r),
             isClickable: !1,
+            inputRef: o,
             value: "No options",
             label: "No options"
           }
         ) : /* @__PURE__ */ x(N, { children: [
-          c.map((e) => /* @__PURE__ */ l(
-            a,
+          m.map((e) => /* @__PURE__ */ l(
+            n,
             {
-              className: o("select-none", s),
+              className: t("select-none", r),
               isClickable: !0,
+              inputRef: o,
               ...e
             },
             e.value
           )),
-          m?.map((e, r) => /* @__PURE__ */ l("li", { role: "option", "data-action": "true", children: /* @__PURE__ */ l(I, { className: "flex p-2 w-full h-full gap-1 items-center text-sm [&>svg]:w-3.5 [&>svg]:h-3.5 [&>svg]:shrink-0 cursor-pointer select-none hover:bg-gray-50 hover:dark:bg-slate-700 focus:outline-0", children: e }) }, r))
+          f?.map((e, a) => /* @__PURE__ */ l("li", { role: "option", "data-action": "true", children: /* @__PURE__ */ l(O, { className: "flex p-2 w-full h-full gap-1 items-center text-sm [&>svg]:w-3.5 [&>svg]:h-3.5 [&>svg]:shrink-0 cursor-pointer select-none hover:bg-gray-50 hover:dark:bg-slate-700 focus:outline-0", children: e }) }, a))
         ] })
       }
     );
   }
 );
 export {
-  z as List
+  A as List
 };

package/dist/components/Dropdown/components/ListItem/ListItem.js

@@ -1,25 +1,26 @@
-import { jsx as o, jsxs as x } from "react/jsx-runtime";
-import { useRef as u, useCallback as l } from "react";
-import { Typography as b } from "../../../Typography/Typography.js";
-import { cn as w } from "../../../../utils/index.js";
-import { listItemVariants as y } from "./ListItem.variants.js";
-import { useDropdownContext as k } from "../../contexts/dropdown.hook.js";
-const D = ({
+import { jsx as o, jsxs as u } from "react/jsx-runtime";
+import { useRef as b, useCallback as l } from "react";
+import { Typography as w } from "../../../Typography/Typography.js";
+import { cn as y } from "../../../../utils/index.js";
+import { listItemVariants as k } from "./ListItem.variants.js";
+import { useDropdownContext as C } from "../../contexts/dropdown.hook.js";
+const E = ({
   isClickable: f,
   className: p,
+  inputRef: d,
   ...t
 }) => {
-  const { searchTerm: r, highlightSearchEnabled: i, setValue: c, toggleOpen: m } = k(), d = u(null), a = l(
+  const { searchTerm: r, highlightSearchEnabled: i, setValue: c, toggleOpen: m } = C(), h = b(null), a = l(
     (e) => {
-      c(e.value), m(!1);
+      c(e.value, d), m(!1);
     },
     [c, m]
-  ), h = l(
+  ), g = l(
     (e, s) => {
       e.key === "Enter" && (e.stopPropagation(), a(s));
     },
     [a]
-  ), g = l(
+  ), x = l(
     (e) => {
       if (typeof e != "string")
         return e;
@@ -32,7 +33,7 @@ const D = ({
         n
       ) : n) : [e];
       return /* @__PURE__ */ o(
-        b,
+        w,
         {
           variant: "body2",
           className: "text-zinc-700 dark:text-slate-50",
@@ -42,25 +43,25 @@ const D = ({
     },
     [i, r]
   );
-  return /* @__PURE__ */ x(
+  return /* @__PURE__ */ u(
     "li",
     {
-      ref: d,
+      ref: h,
       role: "option",
       "data-action": "false",
-      className: w(y({ className: p })),
+      className: y(k({ className: p })),
       tabIndex: 0,
       onClick: (e) => {
         f && (a(t), e.stopPropagation());
       },
-      onKeyDown: (e) => h(e, t),
+      onKeyDown: (e) => g(e, t),
       children: [
         t.leftIcon ? /* @__PURE__ */ o("span", { className: "w-4 h-4 flex justify-center items-center", children: t.leftIcon }) : null,
-        g(t.label)
+        x(t.label)
       ]
     }
   );
 };
 export {
-  D as ListItem
+  E as ListItem
 };

package/dist/components/Dropdown/components/Wrapper.js

@@ -6,17 +6,17 @@ import { cn as s } from "../../../utils/index.js";
 import { labelVariants as B, inputVariants as ee, dropdownVariants as te } from "../Dropdown.variants.js";
 import { useDropdown as ae } from "../hooks/useDropdown.js";
 import { List as re } from "./List/List.js";
-import { c as T } from "../../../createLucideIcon-DbC6TvM5.js";
+import { c as T } from "../../../createLucideIcon-D2CN7Ma9.js";
 import { useDropdownContext as ne } from "../contexts/dropdown.hook.js";
 /**
-* @license lucide-react v0.544.0 - ISC
+* @license lucide-react v0.545.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
 const le = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]], oe = T("chevron-up", le);
 /**
-* @license lucide-react v0.544.0 - ISC
+* @license lucide-react v0.545.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.

package/dist/components/Dropdown/contexts/dropdown.provider.js

@@ -1,30 +1,30 @@
-import { jsx as p } from "react/jsx-runtime";
-import { useRef as u, useState as d, useCallback as f } from "react";
-import { DropdownContext as v } from "./dropdown.context.js";
-import { useToggle as S } from "../../../hooks/useToggle.js";
-const C = ({ children: o, value: a, name: e, highlightSearch: s = !1, onChange: r, onBlur: t }) => {
-  const l = u(s), [n, c] = S(!1), [h, i] = d(""), m = f(
-    (g) => {
-      r?.({ target: { value: g, name: e ?? "" } }), t?.();
+import { jsx as f } from "react/jsx-runtime";
+import { useRef as p, useState as d, useCallback as v } from "react";
+import { DropdownContext as S } from "./dropdown.context.js";
+import { useToggle as b } from "../../../hooks/useToggle.js";
+const D = ({ children: s, value: n, name: e, highlightSearch: c = !1, onChange: r, onBlur: t }) => {
+  const l = p(c), [h, i] = b(!1), [m, g] = d(""), u = v(
+    (o, a) => {
+      a?.current && (a.current.value = o), r?.({ target: { value: o, name: e ?? "" } }), t?.();
     },
     [r, e, t]
   );
-  return /* @__PURE__ */ p(
-    v.Provider,
+  return /* @__PURE__ */ f(
+    S.Provider,
     {
       value: {
         highlightSearchEnabled: l.current,
-        isOpen: n,
-        searchTerm: h,
-        value: a,
-        setSearchTerm: i,
-        setValue: m,
-        toggleOpen: c
+        isOpen: h,
+        searchTerm: m,
+        value: n,
+        setSearchTerm: g,
+        setValue: u,
+        toggleOpen: i
       },
-      children: o
+      children: s
     }
   );
 };
 export {
-  C as DropdownProvider
+  D as DropdownProvider
 };

package/dist/components/Dropdown/hooks/useNavigationList.js

@@ -1,61 +1,61 @@
-import { useRef as g, useEffect as l } from "react";
+import { useRef as g, useEffect as i } from "react";
 import { useDropdownContext as d } from "../contexts/dropdown.hook.js";
 const w = ({
   inputRef: s,
-  searchable: i,
-  ulRef: e,
+  searchable: l,
+  ulRef: t,
   wrapperInputRef: u,
   wrapperRef: a
 }) => {
-  const r = g(0), { isOpen: b } = d();
-  l(() => {
-    const o = e.current?.querySelectorAll("li") ?? [], t = Array.from(o).filter(
+  const r = g(0), { isOpen: f } = d();
+  i(() => {
+    const c = t.current?.querySelectorAll("li") ?? [], e = Array.from(c).filter(
       (n) => n.getAttribute("data-action") !== "true"
-    ), c = new AbortController(), f = () => {
-      r.current < t.length - 1 ? (r.current = r.current + 1, t[r.current].focus()) : (r.current = 0, t[0].focus());
-    }, m = () => {
-      r.current > 0 ? (r.current = r.current - 1, t[r.current].focus()) : (r.current = 0, s?.current && i ? s.current.focus() : u.current?.focus());
+    ), o = new AbortController(), m = () => {
+      r.current < e.length - 1 ? (r.current = r.current + 1, e[r.current].focus()) : (r.current = 0, e[0].focus());
+    }, b = () => {
+      r.current > 0 ? (r.current = r.current - 1, e[r.current].focus()) : (r.current = 0, s?.current && l ? s.current.focus() : u.current?.focus());
     };
-    return e.current?.addEventListener(
+    return t.current?.addEventListener(
       "keydown",
       (n) => {
         switch (n.preventDefault(), n.key) {
           case "ArrowDown": {
-            f();
+            m();
             break;
           }
           case "Tab": {
-            n.shiftKey ? m() : f();
+            n.shiftKey ? b() : m();
             break;
           }
           case "ArrowUp": {
-            r.current === 0 ? u.current?.focus() : m();
+            r.current === 0 ? u.current?.focus() : b();
             break;
           }
           case "Enter": {
-            t[r.current].querySelector("button")?.click();
+            e[r.current]?.click();
             break;
           }
         }
       },
-      { signal: c.signal }
+      { signal: o.signal }
     ), () => {
-      c.abort();
+      o.abort();
     };
-  }, [e, r, u, s, i]), l(() => {
-    const o = new AbortController();
+  }, [t, r, u, s, l]), i(() => {
+    const c = new AbortController();
     return a.current?.addEventListener(
       "mouseenter",
       () => {
-        (e.current?.querySelectorAll("li") ?? []).forEach((c) => c.blur());
+        (t.current?.querySelectorAll("li") ?? []).forEach((o) => o.blur());
       },
-      { signal: o.signal }
+      { signal: c.signal }
     ), () => {
-      o.abort();
+      c.abort();
     };
-  }, [e, a]), l(() => {
-    b || (r.current = 0);
-  }, [b]);
+  }, [t, a]), i(() => {
+    f || (r.current = 0);
+  }, [f]);
 };
 export {
   w as useNavigationUlList

package/dist/components/DropdownButton/DropdownButton.js

@@ -2,7 +2,7 @@ import { jsxs as h, jsx as p } from "react/jsx-runtime";
 import v, { forwardRef as x, useState as C, useRef as w, useCallback as b, useEffect as E } from "react";
 import { cn as l } from "../../utils/index.js";
 import { Button as P } from "../Button/Button.js";
-import { P as c } from "../../index-h-Ul0anl.js";
+import { P as c } from "../../index-N2OStZoU.js";
 function m() {
   return m = Object.assign || function(e) {
     for (var i = 1; i < arguments.length; i++) {

package/dist/components/Filter/components/BadgeDropdown/BadgeMultiSelect.js

@@ -5,7 +5,7 @@ import { Checkbox as C } from "../../../Checkbox/Checkbox.js";
 import { cn as n } from "../../../../utils/index.js";
 import { filterButtonIconVariants as y, filterButtonVariants as N } from "../../Filter.variants.js";
 import { useBadgeMultiSelect as B } from "./BadgeMultiSelect.hook.js";
-import { C as O } from "../../../../chevron-down-BLZPftpV.js";
+import { C as O } from "../../../../chevron-down-MZvQoT2F.js";
 const $ = ({
   options: i,
   label: p,

package/dist/components/Filter/components/DateFilterDropdown/DateFilterDropdown.js

@@ -5,7 +5,7 @@ import { DatePicker as w } from "../../../Datepicker/DatePicker.js";
 import { cn as o } from "../../../../utils/index.js";
 import { filterButtonIconVariants as x, filterButtonVariants as y } from "../../Filter.variants.js";
 import { useDateFilterDropdown as D } from "./DateFilterDropdown.hook.js";
-import { C as N } from "../../../../chevron-down-BLZPftpV.js";
+import { C as N } from "../../../../chevron-down-MZvQoT2F.js";
 const R = ({
   label: s,
   position: l = "left",

package/dist/components/Input/Input.js

@@ -4,7 +4,7 @@ import { cn as u } from "../../utils/index.js";
 import { inputVariants as $ } from "./Input.variants.js";
 import { SearchIcon as L } from "../../assets/icons/components/Search.js";
 import { Warning as T } from "../../assets/icons/components/Warning.js";
-import { P as i } from "../../index-h-Ul0anl.js";
+import { P as i } from "../../index-N2OStZoU.js";
 function h() {
   return h = Object.assign || function(t) {
     for (var n = 1; n < arguments.length; n++) {

package/dist/components/Loading/Loading.js

@@ -1,9 +1,9 @@
 import { jsx as e } from "react/jsx-runtime";
 import { cn as c } from "../../utils/index.js";
 import { loadingVariants as i } from "./Loading.variants.js";
-import { c as t } from "../../createLucideIcon-DbC6TvM5.js";
+import { c as t } from "../../createLucideIcon-D2CN7Ma9.js";
 /**
-* @license lucide-react v0.544.0 - ISC
+* @license lucide-react v0.545.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.

package/dist/components/Modal/Modal.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "react";
-import "../../index-C9T9HQaa.js";
-import { M as d } from "../../Modal-V67Uz78z.js";
+import "../../index-BITvcJAz.js";
+import { M as d } from "../../Modal-D-NOEWMX.js";
 import "./components/Header/Header.js";
 import "./components/Body/Body.js";
 import "./components/Footer/Footer.js";

package/dist/components/Modal/components/Wrapper/Wrapper.js

@@ -1,11 +1,11 @@
 import "react/jsx-runtime";
-import "../../../../index-iXyXtdgP.js";
+import "../../../../index-DBbEcSUG.js";
 import "react";
 import "../../../../Combination-VYaRRJBZ.js";
-import { W as f } from "../../../../Modal-V67Uz78z.js";
+import { W as f } from "../../../../Modal-D-NOEWMX.js";
 import "../../../../utils/index.js";
 import "./Wrapper.variants.js";
-import "../../../../x-BPcqkRZd.js";
+import "../../../../x-4F_5p77m.js";
 export {
   f as Wrapper
 };

package/dist/components/Modal/components/index.js

@@ -1,7 +1,7 @@
 import { Body as e } from "./Body/Body.js";
 import { Footer as t } from "./Footer/Footer.js";
 import { Header as m } from "./Header/Header.js";
-import { W as a } from "../../../Modal-V67Uz78z.js";
+import { W as a } from "../../../Modal-D-NOEWMX.js";
 export {
   e as Body,
   t as Footer,

package/dist/components/NumberInput/NumberInput.js

@@ -1,9 +1,9 @@
 import { jsxs as m, jsx as c } from "react/jsx-runtime";
-import { R as O } from "../../index-iXyXtdgP.js";
+import { R as O } from "../../index-DBbEcSUG.js";
 import f, { forwardRef as b, useId as N, useCallback as w } from "react";
 import { cn as y } from "../../utils/index.js";
 import { labelVariants as z, buttonVariants as j, numberInputVariants as _ } from "./NumberInput.variants.js";
-import { P as l } from "../../index-h-Ul0anl.js";
+import { P as l } from "../../index-N2OStZoU.js";
 function h() {
   return h = Object.assign || function(e) {
     for (var o = 1; o < arguments.length; o++) {