@caspeco/casper-ui-library 10.3.0 → 10.3.1

package/dist/components/combobox/combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../../lib/components/combobox/combobox.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAIX,aAAa,EAGb,MAAM,SAAS,CAAC;AA0GjB;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,EACxB,EAAE,EACF,KAAU,EACV,cAAsB,EACtB,aAAkB,EAClB,MAAgB,EAChB,IAAW,EACX,OAAmB,EACnB,WAAmB,EACnB,QAAQ,EACR,KAAK,EACL,eAAe,EACf,QAAQ,EACR,MAAM,EACN,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,aAAa,EACb,YAAY,EACZ,gBAAgB,EAChB,SAAiB,EACjB,WAAuB,EACvB,qBAAiD,EACjD,qBAAqB,EACrB,GAAG,KAAK,EACR,EAAE,aAAa,+BA2Uf"}
+{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../../lib/components/combobox/combobox.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAIX,aAAa,EAGb,MAAM,SAAS,CAAC;AA0GjB;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,EACxB,EAAE,EACF,KAAU,EACV,cAAsB,EACtB,aAAkB,EAClB,MAAgB,EAChB,IAAW,EACX,OAAmB,EACnB,WAAmB,EACnB,QAAQ,EACR,KAAK,EACL,eAAe,EACf,QAAQ,EACR,MAAM,EACN,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,aAAa,EACb,YAAY,EACZ,gBAAgB,EAChB,SAAiB,EACjB,WAAuB,EACvB,qBAAiD,EACjD,qBAAqB,EACrB,GAAG,KAAK,EACR,EAAE,aAAa,+BA8Vf"}

package/dist/components/combobox/combobox.js

@@ -1,263 +1,275 @@
 import { jsx as U, jsxs as Se } from "react/jsx-runtime";
 import { c as V } from "../../_virtual/compiler-runtime.js";
 import { useFieldContext as Ce, Box as Oe } from "@chakra-ui/react";
-import { useState as y, useRef as Z } from "react";
-import { ComboboxButton as ke } from "./combobox-button.js";
-import { ComboboxMenu as we } from "./combobox-menu.js";
-import { translations as xe } from "./translations.js";
-const Pe = (o, a) => {
-  const e = V.c(15), [n, f] = y(0);
-  let h;
-  e[0] !== a ? (h = (g) => {
+import { useState as y, useRef as Y, useEffect as ke } from "react";
+import { ComboboxButton as we } from "./combobox-button.js";
+import { ComboboxMenu as xe } from "./combobox-menu.js";
+import { translations as Ee } from "./translations.js";
+const ye = (l, a) => {
+  const e = V.c(15), [n, u] = y(0);
+  let p;
+  e[0] !== a ? (p = (b) => {
     if (!a.current)
       return;
     const v = [...a.current.querySelectorAll("li")];
-    v[g] && (v[g]?.scrollIntoView({
+    v[b] && (v[b]?.scrollIntoView({
       behavior: "smooth",
       block: "nearest"
-    }), f(g));
-  }, e[0] = a, e[1] = h) : h = e[1];
-  const t = h;
+    }), u(b));
+  }, e[0] = a, e[1] = p) : p = e[1];
+  const t = p;
   let i;
-  e[2] !== n || e[3] !== o || e[4] !== t ? (i = () => t((n + 1) % o.length), e[2] = n, e[3] = o, e[4] = t, e[5] = i) : i = e[5];
-  const p = i;
-  let l;
-  e[6] !== n || e[7] !== o || e[8] !== t ? (l = () => t((n - 1 + o.length) % o.length), e[6] = n, e[7] = o, e[8] = t, e[9] = l) : l = e[9];
-  const c = l;
+  e[2] !== n || e[3] !== l || e[4] !== t ? (i = () => t((n + 1) % l.length), e[2] = n, e[3] = l, e[4] = t, e[5] = i) : i = e[5];
+  const g = i;
+  let s;
+  e[6] !== n || e[7] !== l || e[8] !== t ? (s = () => t((n - 1 + l.length) % l.length), e[6] = n, e[7] = l, e[8] = t, e[9] = s) : s = e[9];
+  const c = s;
   let d;
-  return e[10] !== n || e[11] !== t || e[12] !== p || e[13] !== c ? (d = {
+  return e[10] !== n || e[11] !== t || e[12] !== g || e[13] !== c ? (d = {
     index: n,
     set: t,
-    next: p,
+    next: g,
     previous: c
-  }, e[10] = n, e[11] = t, e[12] = p, e[13] = c, e[14] = d) : d = e[14], d;
-}, ye = (o, a, e, n, f, h) => {
-  const t = V.c(13), [i, p] = y(!1), l = i && !n;
+  }, e[10] = n, e[11] = t, e[12] = g, e[13] = c, e[14] = d) : d = e[14], d;
+}, Pe = (l, a, e, n, u, p) => {
+  const t = V.c(13), [i, g] = y(!1), s = i && !n;
   let c;
-  t[0] !== a || t[1] !== f || t[2] !== e ? (c = () => {
-    a || (e(""), f?.("")), p(!1);
-  }, t[0] = a, t[1] = f, t[2] = e, t[3] = c) : c = t[3];
+  t[0] !== a || t[1] !== u || t[2] !== e ? (c = () => {
+    a || (e(""), u?.("")), g(!1);
+  }, t[0] = a, t[1] = u, t[2] = e, t[3] = c) : c = t[3];
   const d = c;
-  let g;
-  t[4] !== o || t[5] !== n || t[6] !== l || t[7] !== h ? (g = () => {
-    l || n || (p(!0), o.set(0), h?.());
-  }, t[4] = o, t[5] = n, t[6] = l, t[7] = h, t[8] = g) : g = t[8];
-  const v = g;
-  let O;
-  return t[9] !== d || t[10] !== l || t[11] !== v ? (O = {
-    isOpen: l,
+  let b;
+  t[4] !== l || t[5] !== n || t[6] !== s || t[7] !== p ? (b = () => {
+    s || n || (g(!0), l.set(0), p?.());
+  }, t[4] = l, t[5] = n, t[6] = s, t[7] = p, t[8] = b) : b = t[8];
+  const v = b;
+  let k;
+  return t[9] !== d || t[10] !== s || t[11] !== v ? (k = {
+    isOpen: s,
     close: d,
     open: v
-  }, t[9] = d, t[10] = l, t[11] = v, t[12] = O) : O = t[12], O;
-}, m = (o, a) => {
-  for (const e of o) {
+  }, t[9] = d, t[10] = s, t[11] = v, t[12] = k) : k = t[12], k;
+}, Z = (l, a) => {
+  for (const e of l) {
     if (e.id === a) return [];
     if (e.children) {
-      const n = m(e.children, a);
+      const n = Z(e.children, a);
       if (n !== void 0) return [e, ...n];
     }
   }
-}, He = (o, a) => {
+}, qe = (l, a) => {
   const e = V.c(14);
   let n;
   e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (n = [], e[0] = n) : n = e[0];
-  const [f, h] = y(n);
+  const [u, p] = y(n);
   let t;
-  if (!f.length)
-    t = o;
+  if (!u.length)
+    t = l;
   else {
-    const c = f[f.length - 1];
+    const c = u[u.length - 1];
     let d;
     e[1] !== a.back ? (d = {
       id: "_back",
       label: a.back
     }, e[1] = a.back, e[2] = d) : d = e[2];
-    const g = d;
+    const b = d;
     let v;
     e[3] !== c?.children ? (v = c?.children || [], e[3] = c?.children, e[4] = v) : v = e[4];
-    const O = v;
-    let H;
-    e[5] !== g || e[6] !== O || e[7] !== c ? (H = c?.isSelectableParent ? [g, c, ...O] : [g, ...O], e[5] = g, e[6] = O, e[7] = c, e[8] = H) : H = e[8], t = H;
+    const k = v;
+    let P;
+    e[5] !== b || e[6] !== k || e[7] !== c ? (P = c?.isSelectableParent ? [b, c, ...k] : [b, ...k], e[5] = b, e[6] = k, e[7] = c, e[8] = P) : P = e[8], t = P;
   }
-  let i, p;
+  let i, g;
   e[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (i = (c) => {
-    h((d) => [...d, c]);
-  }, p = () => {
-    h(Ee);
-  }, e[9] = i, e[10] = p) : (i = e[9], p = e[10]);
-  let l;
-  return e[11] !== t || e[12] !== f ? (l = {
+    p((d) => [...d, c]);
+  }, g = () => {
+    p(Ie);
+  }, e[9] = i, e[10] = g) : (i = e[9], g = e[10]);
+  let s;
+  return e[11] !== t || e[12] !== u ? (s = {
     open: i,
-    back: p,
-    setPath: h,
-    opened: f,
+    back: g,
+    setPath: p,
+    opened: u,
     current: t
-  }, e[11] = t, e[12] = f, e[13] = l) : l = e[13], l;
-}, qe = (o) => {
+  }, e[11] = t, e[12] = u, e[13] = s) : s = e[13], s;
+}, He = (l) => {
   const a = {};
-  function e(n, f) {
-    a[n.id] = [...f], n.children && n.children.forEach((h) => e(h, [...f, n.label]));
+  function e(n, u) {
+    a[n.id] = [...u], n.children && n.children.forEach((p) => e(p, [...u, n.label]));
   }
-  return o.forEach((n) => e(n, [])), a;
+  return l.forEach((n) => e(n, [])), a;
 };
 function Ne({
-  id: o,
+  id: l,
   label: a = "",
   isSingleSelect: e = !1,
   selectedItems: n = [],
-  locale: f = "en-US",
-  size: h = "md",
+  locale: u = "en-US",
+  size: p = "md",
   variant: t = "outline",
   asPlainText: i = !1,
-  onSearch: p,
-  items: l,
+  onSearch: g,
+  items: s,
   maxVisibleItems: c,
   onChange: d,
-  onBlur: g,
+  onBlur: b,
   isDisabled: v,
-  isReadOnly: O,
-  isRequired: H,
+  isReadOnly: k,
+  isRequired: P,
   placeholder: T,
   footerContent: _,
   popoverWidth: ee,
   popoverPlacement: ne,
   collapsed: te = !1,
-  folderStyle: E = "grouped",
-  keepSearchAfterSelect: re = E === "stacked",
+  folderStyle: H = "grouped",
+  keepSearchAfterSelect: re = H === "stacked",
   parentSelectsChildren: W,
   ...oe
 }) {
-  const [I, q] = y(i ? n[0]?.label ?? "" : ""), [le, z] = y(!1), R = xe[f], F = Z(null), N = Z(null), x = He(l, R), se = I.toLowerCase() === n[0]?.label.toLowerCase(), A = I.length > 0 && !(i && se), B = Ce(), J = B?.invalid ?? !1, L = v ?? B?.disabled ?? !1, M = O ?? B?.readOnly ?? !1, ie = H ?? B?.required ?? !1;
+  const [I, q] = y(i ? n[0]?.label ?? "" : ""), [le, m] = y(!1), R = Ee[u], D = Y(null), A = Y(null), x = qe(s, R), se = I.toLowerCase() === n[0]?.label.toLowerCase(), B = I.length > 0 && !(i && se), F = Ce(), z = F?.invalid ?? !1, L = v ?? F?.disabled ?? !1, M = k ?? F?.readOnly ?? !1, ie = P ?? F?.required ?? !1;
   let w = x.current;
-  if (A) {
-    const r = [], s = I.toLowerCase();
-    if (E === "stacked") {
-      const b = (S) => S.map((C) => {
-        const G = C.label.toLowerCase().includes(s), u = C.children && C.children.length > 0;
+  if (B) {
+    const r = [], o = I.toLowerCase();
+    if (H === "stacked") {
+      const f = (C) => C.map((O) => {
+        const G = O.label.toLowerCase().includes(o), h = O.children && O.children.length > 0;
         if (G)
-          return C;
-        if (u) {
-          const P = b(C.children);
-          if (P.length > 0) {
-            const Y = {
-              ...C
+          return O;
+        if (h) {
+          const E = f(O.children);
+          if (E.length > 0) {
+            const X = {
+              ...O
             };
-            return Y.children = P, Y;
+            return X.children = E, X;
           }
         }
       }).filter(Boolean);
-      w = b(l);
+      w = f(s);
     } else {
-      const b = (S) => {
-        r.push(S), S.children && S.children.forEach(b);
+      const f = (C) => {
+        r.push(C), C.children && C.children.forEach(f);
       };
-      l.forEach(b), w = r.filter((S) => {
-        const C = S.label.toLowerCase().includes(I.toLowerCase());
-        return (!(S.children && S.children.length > 0) || S.isSelectableParent) && C;
+      s.forEach(f), w = r.filter((C) => {
+        const O = C.label.toLowerCase().includes(I.toLowerCase());
+        return (!(C.children && C.children.length > 0) || C.isSelectableParent) && O;
       });
     }
   }
-  const $ = Pe(w, N), [j, ce] = y([]), k = ye($, i, q, L, p, () => {
-    if (E !== "stacked") {
+  const N = ye(w, A), [$, ce] = y([]), S = Pe(N, i, q, L, g, () => {
+    if (H !== "stacked") {
       if (e) {
-        const r = n[0]?.id, s = r ? m(l, r) ?? [] : [];
-        x.setPath(s);
+        const r = n[0]?.id, o = r ? Z(s, r) ?? [] : [];
+        x.setPath(o);
         return;
       }
       ce(n);
     }
-  }), [D, ae] = y({
-    isOpen: k.isOpen,
+  }), [j, ae] = y({
+    isOpen: S.isOpen,
     selectedItems: n,
     asPlainText: i
   });
-  (D.isOpen !== k.isOpen || D.selectedItems !== n || D.asPlainText !== i) && (ae({
-    isOpen: k.isOpen,
+  (j.isOpen !== S.isOpen || j.selectedItems !== n || j.asPlainText !== i) && (ae({
+    isOpen: S.isOpen,
     selectedItems: n,
     asPlainText: i
-  }), i && !k.isOpen && q(n[0]?.label ?? "")), A || (w = [...j, ...w.filter((r) => !j.find((s) => s.label === r.label))]);
-  let K = !1;
-  M ? w = n : (K = w.length > (c ?? 1 / 0), w = w.slice(0, c));
-  const de = qe(l), fe = (r) => {
-    const s = x.opened.length > 0 && x.opened[x.opened.length - 1]?.id === r.id, b = r.children && r.children.length > 0;
-    if (!A && !s && b) {
-      x.open(r), requestAnimationFrame(() => $.set(1));
+  }), i && !S.isOpen && q(n[0]?.label ?? "")), B || (w = [...$, ...w.filter((r) => !$.find((o) => o.label === r.label))]);
+  let J = !1;
+  M ? w = n : (J = w.length > (c ?? 1 / 0), w = w.slice(0, c));
+  const de = He(s), fe = (r) => {
+    const o = x.opened.length > 0 && x.opened[x.opened.length - 1]?.id === r.id, f = r.children && r.children.length > 0;
+    if (!B && !o && f) {
+      x.open(r), requestAnimationFrame(() => N.set(1));
       return;
     }
-    return e ? [r] : Q(r);
+    return e ? [r] : K(r);
   }, ue = (r) => {
-    const s = r.children && r.children.length > 0;
-    if (!(s && !r.isSelectableParent && (e || !W)))
-      return e ? [r] : s ? he(r) : Q(r);
-  }, Q = (r) => n.some((b) => b.id === r.id) ? n.filter((b) => b.id !== r.id) : [...n, r];
+    const o = r.children && r.children.length > 0;
+    if (!(o && !r.isSelectableParent && (e || !W)))
+      return e ? [r] : o ? he(r) : K(r);
+  }, K = (r) => n.some((f) => f.id === r.id) ? n.filter((f) => f.id !== r.id) : [...n, r];
   function he(r) {
-    let s;
-    const b = [], S = (u) => {
-      u.children && u.children.length > 0 ? (u.isSelectableParent && b.push(u), u.children.forEach(S)) : b.push(u);
+    let o;
+    const f = [], C = (h) => {
+      h.children && h.children.length > 0 ? (h.isSelectableParent && f.push(h), h.children.forEach(C)) : f.push(h);
     };
-    S(r);
-    const C = n.filter((u) => b.some((P) => P.id === u.id));
-    return C.length > 0 && (!r.isSelectableParent || C.some((u) => u.id === r.id)) ? s = n.filter((u) => !C.some((P) => P.id === u.id)) : s = [...n, ...b.filter((u) => !n.some((P) => P.id === u.id))], s;
+    C(r);
+    const O = n.filter((h) => f.some((E) => E.id === h.id));
+    return O.length > 0 && (!r.isSelectableParent || O.some((h) => h.id === r.id)) ? o = n.filter((h) => !O.some((E) => E.id === h.id)) : o = [...n, ...f.filter((h) => !n.some((E) => E.id === h.id))], o;
   }
   const pe = (r) => {
     if (!r || M || L)
       return;
-    if (N.current?.parentNode?.querySelector("input")?.focus(), r.id === "_back") {
+    if (A.current?.parentNode?.querySelector("input")?.focus(), r.id === "_back") {
       x.back();
       return;
     }
-    let s;
-    E === "grouped" ? s = fe(r) : s = ue(r), s && (i ? q(s[0]?.label ?? "") : re || (q(""), p?.("")), e && (s.length === 0 ? k.open() : k.close()), d && d(s));
+    let o;
+    H === "grouped" ? o = fe(r) : o = ue(r), o && (i ? q(o[0]?.label ?? "") : re || (q(""), g?.("")), e && (o.length === 0 ? S.open() : S.close()), d && d(o));
   }, ge = () => {
-    M || L || n.length === 0 || (q(""), p?.(""), d?.([]));
-  }, be = n.length === 0 ? T ?? R.search : void 0, ve = (r) => {
-    F.current?.contains(r.relatedTarget) || (k.close(), z(!1), g && g(n));
-  }, X = {
-    id: o,
+    M || L || n.length === 0 || (q(""), g?.(""), d?.([]));
+  }, be = n.length === 0 ? T ?? R.search : void 0;
+  ke(() => {
+    const r = A.current?.querySelector("[role='listbox']");
+    if (!r || !S.isOpen)
+      return;
+    const o = (f) => {
+      f.target === r && f.preventDefault();
+    };
+    return r.addEventListener("mousedown", o, !0), () => {
+      r.removeEventListener("mousedown", o, !0);
+    };
+  }, [S.isOpen]);
+  const ve = (r) => {
+    D.current?.contains(r.relatedTarget) || (S.close(), m(!1), b && b(n));
+  }, Q = {
+    id: l,
     asPlainText: i,
     inputValue: I,
     selectedItems: n,
     displayItems: w,
     toggleItem: pe,
     clearSelection: ge,
-    highlightState: $,
-    openState: k,
+    highlightState: N,
+    openState: S,
     parentStrings: de,
     // Button
-    size: h,
+    size: p,
     variant: t,
     label: a,
     placeHolderText: be,
     isDisabled: L,
     isReadOnly: M,
-    isInvalid: J,
+    isInvalid: z,
     collapsed: te,
     hasPendingDelete: le,
-    setHasPendingDelete: z,
+    setHasPendingDelete: m,
     setInputValue: q,
-    onSearch: p,
+    onSearch: g,
     // Menu
     isSingleSelect: e,
-    isSearching: A,
-    isHidingItems: K,
+    isSearching: B,
+    isHidingItems: J,
     popoverWidth: ee,
     popoverPlacement: ne,
-    previousSelectedItems: j,
-    parentRef: F,
-    popupRef: N,
+    previousSelectedItems: $,
+    parentRef: D,
+    popupRef: A,
     footerContent: _,
     subMenuState: x,
     translation: R,
-    folderStyle: E,
+    folderStyle: H,
     parentSelectsChildren: W
   };
-  return /* @__PURE__ */ U(Oe, { role: "combobox", asChild: !0, className: "combobox", ref: F, onClick: k.open, onBlur: ve, overflow: "visible", width: "100%", "aria-expanded": k.isOpen, "aria-required": ie, "aria-disabled": L, "aria-readonly": M, "aria-invalid": J, ...oe, children: /* @__PURE__ */ Se("label", { htmlFor: o, children: [
-    /* @__PURE__ */ U(ke, { ...X }),
-    k.isOpen && /* @__PURE__ */ U(we, { ...X })
+  return /* @__PURE__ */ U(Oe, { role: "combobox", asChild: !0, className: "combobox", ref: D, onClick: S.open, onBlur: ve, overflow: "visible", width: "100%", "aria-expanded": S.isOpen, "aria-required": ie, "aria-disabled": L, "aria-readonly": M, "aria-invalid": z, ...oe, children: /* @__PURE__ */ Se("label", { htmlFor: l, children: [
+    /* @__PURE__ */ U(we, { ...Q }),
+    S.isOpen && /* @__PURE__ */ U(xe, { ...Q })
   ] }) });
 }
-function Ee(o) {
-  return o.slice(0, -1);
+function Ie(l) {
+  return l.slice(0, -1);
 }
 export {
   Ne as Combobox

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@caspeco/casper-ui-library",
-	"version": "10.3.0",
+	"version": "10.3.1",
 	"prettier": "@caspeco/prettier-config",
 	"type": "module",
 	"sideEffects": false,