jcicl 0.0.325 → 0.0.329

package/LabeledDropdown/LabeledDropdown.js

@@ -42,14 +42,14 @@ function rt(e = {}) {
     trim: x = !1
   } = e;
   return (y, {
-    inputValue: O,
+    inputValue: P,
     getOptionLabel: d
   }) => {
-    let S = x ? O.trim() : O;
-    a && (S = S.toLowerCase()), n && (S = Vo(S));
-    const L = S ? y.filter((X) => {
+    let I = x ? P.trim() : P;
+    a && (I = I.toLowerCase()), n && (I = Vo(I));
+    const L = I ? y.filter((X) => {
       let A = (h || d)(X);
-      return a && (A = A.toLowerCase()), n && (A = Vo(A)), b === "start" ? A.startsWith(S) : A.includes(S);
+      return a && (A = A.toLowerCase()), n && (A = Vo(A)), b === "start" ? A.startsWith(I) : A.includes(I);
     }) : y;
     return typeof i == "number" ? L.slice(0, i) : L;
   };
@@ -69,9 +69,9 @@ function st(e) {
     autoSelect: h = !1,
     blurOnSelect: x = !1,
     clearOnBlur: y = !e.freeSolo,
-    clearOnEscape: O = !1,
+    clearOnEscape: P = !1,
     componentName: d = "useAutocomplete",
-    defaultValue: S = e.multiple ? it : null,
+    defaultValue: I = e.multiple ? it : null,
     disableClearable: L = !1,
     disableCloseOnSelect: X = !1,
     disabled: A,
@@ -116,9 +116,9 @@ function st(e) {
   };
   const je = m.useRef(!1), Be = m.useRef(!0), k = m.useRef(null), K = m.useRef(null), [Ue, Lo] = m.useState(null), [G, Xe] = m.useState(-1), bo = b ? 0 : -1, z = m.useRef(bo), [s, Ao] = Po({
     controlled: go,
-    default: S,
+    default: I,
     name: d
-  }), [P, Ce] = Po({
+  }), [S, Ce] = Po({
     controlled: ye,
     default: "",
     name: d,
@@ -132,27 +132,27 @@ function st(e) {
     else if (t == null)
       c = "";
     else {
-      const I = D(t);
-      c = typeof I == "string" ? I : "";
+      const O = D(t);
+      c = typeof O == "string" ? O : "";
     }
-    P !== c && (Ce(c), q && q(r, c, l));
-  }, [D, P, $, q, Ce, y, s]), [se, Qe] = Po({
+    S !== c && (Ce(c), q && q(r, c, l));
+  }, [D, S, $, q, Ce, y, s]), [se, Qe] = Po({
     controlled: xe,
     default: !1,
     name: d,
     state: "open"
-  }), [Ze, mo] = m.useState(!0), Pe = !$ && s != null && P === D(s), j = se && !$e, T = j ? Ne(
+  }), [Ze, mo] = m.useState(!0), Pe = !$ && s != null && S === D(s), j = se && !$e, T = j ? Ne(
     Ro.filter((r) => !(me && ($ ? s : [s]).some((t) => t !== null && W(r, t)))),
     // we use the empty string to manipulate `filterOptions` to not filter any options
     // i.e. the filter predicate always returns true
     {
-      inputValue: Pe && Ze ? "" : P,
+      inputValue: Pe && Ze ? "" : S,
       getOptionLabel: D
     }
   ) : [], Q = nt({
     filteredOptions: T,
     value: s,
-    inputValue: P
+    inputValue: S
   });
   m.useEffect(() => {
     const r = s !== Q.value;
@@ -192,9 +192,9 @@ function st(e) {
       c.scrollTop = 0;
       return;
     }
-    const I = K.current.querySelector(`[data-option-index="${t}"]`);
-    if (I && (I.classList.add(`${a}-focused`), l === "keyboard" && I.classList.add(`${a}-focusVisible`), c.scrollHeight > c.clientHeight && l !== "mouse" && l !== "touch")) {
-      const C = I, B = c.clientHeight + c.scrollTop, Le = C.offsetTop + C.offsetHeight;
+    const O = K.current.querySelector(`[data-option-index="${t}"]`);
+    if (O && (O.classList.add(`${a}-focused`), l === "keyboard" && O.classList.add(`${a}-focusVisible`), c.scrollHeight > c.clientHeight && l !== "mouse" && l !== "touch")) {
+      const C = O, B = c.clientHeight + c.scrollTop, Le = C.offsetTop + C.offsetHeight;
       Le > B ? c.scrollTop = Le - c.clientHeight : C.offsetTop - C.offsetHeight * (oe ? 1.3 : 0) < c.scrollTop && (c.scrollTop = C.offsetTop - C.offsetHeight * (oe ? 1.3 : 0));
     }
   }), Y = io(({
@@ -205,7 +205,7 @@ function st(e) {
   }) => {
     if (!j)
       return;
-    const I = eo((() => {
+    const O = eo((() => {
       const C = T.length - 1;
       if (t === "reset")
         return bo;
@@ -217,22 +217,22 @@ function st(e) {
       return B < 0 ? B === -1 && de ? -1 : ue && z.current !== -1 || Math.abs(t) > 1 ? 0 : C : B > C ? B === C + 1 && de ? -1 : ue || Math.abs(t) > 1 ? C : 0 : B;
     })(), l);
     if (te({
-      index: I,
+      index: O,
       reason: p,
       event: r
     }), i && t !== "reset")
-      if (I === -1)
-        k.current.value = P;
+      if (O === -1)
+        k.current.value = S;
       else {
-        const C = D(T[I]);
-        k.current.value = C, C.toLowerCase().indexOf(P.toLowerCase()) === 0 && P.length > 0 && k.current.setSelectionRange(P.length, C.length);
+        const C = D(T[O]);
+        k.current.value = C, C.toLowerCase().indexOf(S.toLowerCase()) === 0 && S.length > 0 && k.current.setSelectionRange(S.length, C.length);
       }
   }), ho = () => {
     const r = (t, l) => {
       const p = t ? D(t) : "", c = l ? D(l) : "";
       return p === c;
     };
-    if (z.current !== -1 && Q.filteredOptions && Q.filteredOptions.length !== T.length && Q.inputValue === P && ($ ? s.length === Q.value.length && Q.value.every((t, l) => D(s[l]) === D(t)) : r(Q.value, s))) {
+    if (z.current !== -1 && Q.filteredOptions && Q.filteredOptions.length !== T.length && Q.inputValue === S && ($ ? s.length === Q.value.length && Q.value.every((t, l) => D(s[l]) === D(t)) : r(Q.value, s))) {
       const t = Q.filteredOptions[z.current];
       if (t)
         return T.findIndex((l) => D(l) === D(t));
@@ -286,7 +286,7 @@ function st(e) {
     Y,
     te,
     j,
-    P,
+    S,
     $
   ]), yo = io((r) => {
     Zo(K, r), r && Ke();
@@ -304,23 +304,23 @@ function st(e) {
     se && (Qe(!1), _ && _(r, t));
   }, pe = (r, t, l, p) => {
     if ($) {
-      if (s.length === t.length && s.every((c, I) => c === t[I]))
+      if (s.length === t.length && s.every((c, O) => c === t[O]))
         return;
     } else if (s === t)
       return;
     fe && fe(r, t, l, p), Ao(t);
   }, we = m.useRef(!1), ge = (r, t, l = "selectOption", p = "options") => {
-    let c = l, I = t;
+    let c = l, O = t;
     if ($) {
-      if (I = Array.isArray(s) ? s.slice() : [], process.env.NODE_ENV !== "production") {
-        const B = I.filter((Le) => W(t, Le));
+      if (O = Array.isArray(s) ? s.slice() : [], process.env.NODE_ENV !== "production") {
+        const B = O.filter((Le) => W(t, Le));
         B.length > 1 && console.error([`MUI: The \`isOptionEqualToValue\` method of ${d} does not handle the arguments correctly.`, `The component expects a single value to match a given option but found ${B.length} matches.`].join(`
 `));
       }
-      const C = I.findIndex((B) => W(t, B));
-      C === -1 ? I.push(t) : p !== "freeSolo" && (I.splice(C, 1), c = "removeOption");
+      const C = O.findIndex((B) => W(t, B));
+      C === -1 ? O.push(t) : p !== "freeSolo" && (O.splice(C, 1), c = "removeOption");
     }
-    Oe(r, I, c), pe(r, I, c, {
+    Oe(r, O, c), pe(r, O, c, {
       option: t
     }), !X && (!r || !r.ctrlKey && !r.metaKey) && re(r, c), (x === !0 || x === "touch" && we.current || x === "mouse" && !we.current) && k.current.blur();
   };
@@ -341,9 +341,9 @@ function st(e) {
   const Ge = (r, t) => {
     if (!$)
       return;
-    P === "" && re(r, "toggleInput");
+    S === "" && re(r, "toggleInput");
     let l = G;
-    G === -1 ? P === "" && t === "previous" && (l = s.length - 1) : (l += t === "next" ? 1 : -1, l < 0 && (l = 0), l === s.length && (l = -1)), l = Te(l, t), Xe(l), Se(l);
+    G === -1 ? S === "" && t === "previous" && (l = s.length - 1) : (l += t === "next" ? 1 : -1, l < 0 && (l = 0), l === s.length && (l = -1)), l = Te(l, t), Xe(l), Se(l);
   }, oo = (r) => {
     je.current = !0, Ce(""), q && q(r, "", "clear"), pe(r, $ ? [] : null, "clear");
   }, ke = (r) => (t) => {
@@ -409,13 +409,13 @@ function st(e) {
             if (t.preventDefault(), p)
               return;
             ge(t, l, "selectOption"), i && k.current.setSelectionRange(k.current.value.length, k.current.value.length);
-          } else le && P !== "" && Pe === !1 && ($ && t.preventDefault(), ge(t, P, "createOption", "freeSolo"));
+          } else le && S !== "" && Pe === !1 && ($ && t.preventDefault(), ge(t, S, "createOption", "freeSolo"));
           break;
         case "Escape":
-          j ? (t.preventDefault(), t.stopPropagation(), re(t, "escape")) : O && (P !== "" || $ && s.length > 0) && (t.preventDefault(), t.stopPropagation(), oo(t));
+          j ? (t.preventDefault(), t.stopPropagation(), re(t, "escape")) : P && (S !== "" || $ && s.length > 0) && (t.preventDefault(), t.stopPropagation(), oo(t));
           break;
         case "Backspace":
-          if ($ && !$e && P === "" && s.length > 0) {
+          if ($ && !$e && S === "" && s.length > 0) {
             const l = G === -1 ? s.length - 1 : G, p = s.slice();
             p.splice(l, 1), pe(t, p, "removeOption", {
               option: s[l]
@@ -423,7 +423,7 @@ function st(e) {
           }
           break;
         case "Delete":
-          if ($ && !$e && P === "" && s.length > 0 && G !== -1) {
+          if ($ && !$e && S === "" && s.length > 0 && G !== -1) {
             const l = G, p = s.slice();
             p.splice(l, 1), pe(t, p, "removeOption", {
               option: s[l]
@@ -438,10 +438,10 @@ function st(e) {
       k.current.focus();
       return;
     }
-    He(!1), Be.current = !0, je.current = !1, h && z.current !== -1 && j ? ge(r, T[z.current], "blur") : h && le && P !== "" ? ge(r, P, "blur", "freeSolo") : y && Oe(r, s, "blur"), re(r, "blur");
+    He(!1), Be.current = !0, je.current = !1, h && z.current !== -1 && j ? ge(r, T[z.current], "blur") : h && le && S !== "" ? ge(r, S, "blur", "freeSolo") : y && Oe(r, s, "blur"), re(r, "blur");
   }, Re = (r) => {
     const t = r.target.value;
-    P !== t && (Ce(t), mo(!1), q && q(r, t, "input")), t === "" ? !L && !$ && pe(r, null, "clear") : ne(r);
+    S !== t && (Ce(t), mo(!1), q && q(r, t, "input")), t === "" ? !L && !$ && pe(r, null, "clear") : ne(r);
   }, _e = (r) => {
     const t = Number(r.currentTarget.getAttribute("data-option-index"));
     z.current !== t && te({
@@ -470,20 +470,20 @@ function st(e) {
   }, Ye = (r) => {
     r.currentTarget.contains(r.target) && (k.current.focus(), Fe && Be.current && k.current.selectionEnd - k.current.selectionStart === 0 && k.current.select(), Be.current = !1);
   }, N = (r) => {
-    !A && (P === "" || !se) && (no(r), r.stopPropagation());
+    !A && (S === "" || !se) && (no(r), r.stopPropagation());
   };
-  let R = le && P.length > 0;
+  let R = le && S.length > 0;
   R = R || ($ ? s.length > 0 : s !== null);
   let ae = T;
   if (oe) {
     const r = /* @__PURE__ */ new Map();
     let t = !1;
     ae = T.reduce((l, p, c) => {
-      const I = oe(p);
-      return l.length > 0 && l[l.length - 1].group === I ? l[l.length - 1].options.push(p) : (process.env.NODE_ENV !== "production" && (r.get(I) && !t && (console.warn(`MUI: The options provided combined with the \`groupBy\` method of ${d} returns duplicated headers.`, "You can solve the issue by sorting the options with the output of `groupBy`."), t = !0), r.set(I, !0)), l.push({
+      const O = oe(p);
+      return l.length > 0 && l[l.length - 1].group === O ? l[l.length - 1].options.push(p) : (process.env.NODE_ENV !== "production" && (r.get(O) && !t && (console.warn(`MUI: The options provided combined with the \`groupBy\` method of ${d} returns duplicated headers.`, "You can solve the issue by sorting the options with the output of `groupBy`."), t = !0), r.set(O, !0)), l.push({
         key: c,
         index: c,
-        group: I,
+        group: O,
         options: [p]
       })), l;
     }, []);
@@ -502,7 +502,7 @@ function st(e) {
     }),
     getInputProps: () => ({
       id: U,
-      value: P,
+      value: S,
       onBlur: to,
       onFocus: vo,
       onChange: Re,
@@ -571,7 +571,7 @@ function st(e) {
       };
     },
     id: U,
-    inputValue: P,
+    inputValue: S,
     value: s,
     dirty: R,
     expanded: j && Ue,
@@ -666,15 +666,15 @@ const ct = (e) => {
     color: h = "default",
     component: x = "li",
     disableGutters: y = !1,
-    disableSticky: O = !1,
+    disableSticky: P = !1,
     inset: d = !1,
-    ...S
+    ...I
   } = i, L = {
     ...i,
     color: h,
     component: x,
     disableGutters: y,
-    disableSticky: O,
+    disableSticky: P,
     inset: d
   }, X = ct(L);
   return /* @__PURE__ */ w(ut, {
@@ -682,7 +682,7 @@ const ct = (e) => {
     className: J(X.root, b),
     ref: a,
     ownerState: L,
-    ...S
+    ...I
   });
 });
 so && (so.muiSkipListHighlight = !0);
@@ -873,26 +873,26 @@ const ft = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
     children: h,
     className: x,
     color: y = "default",
-    disabled: O = !1,
+    disabled: P = !1,
     disableFocusRipple: d = !1,
-    disableRipple: S = !1,
+    disableRipple: I = !1,
     size: L = "medium",
     ...X
   } = i, A = {
     ...i,
     edge: b,
     color: y,
-    disabled: O,
+    disabled: P,
     disableFocusRipple: d,
-    disableRipple: S,
+    disableRipple: I,
     size: L
   }, E = gt(A);
   return /* @__PURE__ */ w(bt, {
     className: J(E.root, x),
     centerRipple: !0,
     focusRipple: !d,
-    disabled: O,
-    disableRipple: S,
+    disabled: P,
+    disableRipple: I,
     ref: a,
     ...X,
     ownerState: A,
@@ -976,13 +976,13 @@ const g = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
     iconColor: h,
     onDelete: x,
     clickable: y,
-    variant: O
+    variant: P
   } = e, d = {
-    root: ["root", O, a && "disabled", `size${f(i)}`, `color${f(b)}`, y && "clickable", y && `clickableColor${f(b)}`, x && "deletable", x && `deletableColor${f(b)}`, `${O}${f(b)}`],
+    root: ["root", P, a && "disabled", `size${f(i)}`, `color${f(b)}`, y && "clickable", y && `clickableColor${f(b)}`, x && "deletable", x && `deletableColor${f(b)}`, `${P}${f(b)}`],
     label: ["label", `label${f(i)}`],
     avatar: ["avatar", `avatar${f(i)}`, `avatarColor${f(b)}`],
     icon: ["icon", `icon${f(i)}`, `iconColor${f(h)}`],
-    deleteIcon: ["deleteIcon", `deleteIcon${f(i)}`, `deleteIconColor${f(b)}`, `deleteIcon${f(O)}Color${f(b)}`]
+    deleteIcon: ["deleteIcon", `deleteIcon${f(i)}`, `deleteIconColor${f(b)}`, `deleteIcon${f(P)}Color${f(b)}`]
   };
   return fo(d, ht, n);
 }, vt = F("div", {
@@ -997,7 +997,7 @@ const g = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
       clickable: h,
       onDelete: x,
       size: y,
-      variant: O
+      variant: P
     } = a;
     return [{
       [`& .${g.avatar}`]: n.avatar
@@ -1018,8 +1018,8 @@ const g = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
     }, {
       [`& .${g.deleteIcon}`]: n[`deleteIconColor${f(i)}`]
     }, {
-      [`& .${g.deleteIcon}`]: n[`deleteIcon${f(O)}Color${f(i)}`]
-    }, n.root, n[`size${f(y)}`], n[`color${f(i)}`], h && n.clickable, h && i !== "default" && n[`clickableColor${f(i)})`], x && n.deletable, x && i !== "default" && n[`deletableColor${f(i)}`], n[O], n[`${O}${f(i)}`]];
+      [`& .${g.deleteIcon}`]: n[`deleteIcon${f(P)}Color${f(i)}`]
+    }, n.root, n[`size${f(y)}`], n[`color${f(i)}`], h && n.clickable, h && i !== "default" && n[`clickableColor${f(i)})`], x && n.deletable, x && i !== "default" && n[`deletableColor${f(i)}`], n[P], n[`${P}${f(i)}`]];
   }
 })(ee(({
   theme: e
@@ -1293,9 +1293,9 @@ const _o = /* @__PURE__ */ m.forwardRef(function(n, a) {
     className: h,
     clickable: x,
     color: y = "default",
-    component: O,
+    component: P,
     deleteIcon: d,
-    disabled: S = !1,
+    disabled: I = !1,
     icon: L,
     label: X,
     onClick: A,
@@ -1314,10 +1314,10 @@ const _o = /* @__PURE__ */ m.forwardRef(function(n, a) {
     M.currentTarget === M.target && jo(M) && M.preventDefault(), ue && ue(M);
   }, ye = (M) => {
     M.currentTarget === M.target && E && jo(M) && E(M), Ne && Ne(M);
-  }, W = x !== !1 && A ? !0 : x, $ = W || E ? So : O || "div", fe = {
+  }, W = x !== !1 && A ? !0 : x, $ = W || E ? So : P || "div", fe = {
     ...i,
     component: $,
-    disabled: S,
+    disabled: I,
     size: me,
     color: y,
     iconColor: /* @__PURE__ */ m.isValidElement(L) && L.props.color || y,
@@ -1325,7 +1325,7 @@ const _o = /* @__PURE__ */ m.forwardRef(function(n, a) {
     clickable: W,
     variant: le
   }, _ = yt(fe), ve = $ === So ? {
-    component: O || "div",
+    component: P || "div",
     focusVisibleClassName: _.focusVisible,
     ...E && {
       disableRipple: !0
@@ -1349,12 +1349,12 @@ const _o = /* @__PURE__ */ m.forwardRef(function(n, a) {
   })), process.env.NODE_ENV !== "production" && ie && xe && console.error("MUI: The Chip component can not handle the avatar and the icon prop at the same time. Pick one."), /* @__PURE__ */ De(vt, {
     as: $,
     className: J(_.root, h),
-    disabled: W && S ? !0 : void 0,
+    disabled: W && I ? !0 : void 0,
     onClick: A,
     onKeyDown: de,
     onKeyUp: ye,
     ref: ze,
-    tabIndex: he && S ? -1 : H,
+    tabIndex: he && I ? -1 : H,
     ownerState: fe,
     ...ve,
     ...Ee,
@@ -1484,14 +1484,14 @@ const It = (e) => {
     fullWidth: h,
     hasClearIcon: x,
     hasPopupIcon: y,
-    inputFocused: O,
+    inputFocused: P,
     popupOpen: d,
-    size: S
+    size: I
   } = e, L = {
     root: ["root", i && "expanded", b && "focused", h && "fullWidth", x && "hasClearIcon", y && "hasPopupIcon"],
     inputRoot: ["inputRoot"],
-    input: ["input", O && "inputFocused"],
-    tag: ["tag", `tagSize${f(S)}`],
+    input: ["input", P && "inputFocused"],
+    tag: ["tag", `tagSize${f(I)}`],
     endAdornment: ["endAdornment"],
     clearIndicator: ["clearIndicator"],
     popupIndicator: ["popupIndicator", d && "popupIndicatorOpen"],
@@ -1845,9 +1845,9 @@ const It = (e) => {
     autoHighlight: h = !1,
     autoSelect: x = !1,
     blurOnSelect: y = !1,
-    ChipProps: O,
+    ChipProps: P,
     className: d,
-    clearIcon: S = Bo || (Bo = /* @__PURE__ */ w($t, {
+    clearIcon: I = Bo || (Bo = /* @__PURE__ */ w($t, {
       fontSize: "small"
     })),
     clearOnBlur: L = !i.freeSolo,
@@ -1893,7 +1893,7 @@ const It = (e) => {
     openOnFocus: z = !1,
     openText: s = "Open",
     options: Ao,
-    PaperComponent: P,
+    PaperComponent: S,
     PopperComponent: Ce,
     popupIcon: Ie = Uo || (Uo = /* @__PURE__ */ w(Xo, {})),
     readOnly: He = !1,
@@ -1950,12 +1950,12 @@ const It = (e) => {
   }, R = It(N), ae = {
     slots: {
       listbox: go,
-      paper: P,
+      paper: S,
       popper: Ce,
       ...j
     },
     slotProps: {
-      chip: O,
+      chip: P,
       listbox: U,
       ...ue,
       ...T
@@ -1972,7 +1972,7 @@ const It = (e) => {
     externalForwardedProps: ae,
     ownerState: N,
     className: R.paper
-  }), [c, I] = Oo("popper", {
+  }), [c, O] = Oo("popper", {
     elementType: Ko,
     externalForwardedProps: ae,
     ownerState: N,
@@ -2051,7 +2051,7 @@ const It = (e) => {
     }, N);
   }, ro = ae.slotProps.clearIndicator, ao = ae.slotProps.popupIndicator, Co = (v) => /* @__PURE__ */ w(Tt, {
     as: c,
-    ...I,
+    ...O,
     children: /* @__PURE__ */ w(kt, {
       as: l,
       ...p,
@@ -2107,7 +2107,7 @@ const It = (e) => {
                 ownerState: N,
                 ...ro,
                 className: J(R.clearIndicator, ro == null ? void 0 : ro.className),
-                children: S
+                children: I
               }) : null, qe ? /* @__PURE__ */ w(wt, {
                 ...Y(),
                 disabled: H,
@@ -2672,7 +2672,7 @@ const Nt = ["colon"], Et = Jo("div", { shouldForwardProp: (e) => !Nt.includes(e)
   onChange: h,
   minWidth: x,
   multiple: y,
-  ...O
+  ...P
 }) => /* @__PURE__ */ De(
   Et,
   {
@@ -2690,11 +2690,11 @@ const Nt = ["colon"], Et = Jo("div", { shouldForwardProp: (e) => !Nt.includes(e)
         To,
         {
           options: a,
-          onChange: (d, S) => (
+          onChange: (d, I) => (
             // @ts-ignore
-            h && h({ ...d, target: { ...d.target, value: `${S == null ? void 0 : S.value}` || "" } })
+            h && h({ ...d, target: { ...d.target, value: `${I == null ? void 0 : I.value}` || "" } })
           ),
-          ...O,
+          ...P,
           renderInput: (d) => /* @__PURE__ */ w(zo, { ...d })
         }
       ),
@@ -2705,11 +2705,11 @@ const Nt = ["colon"], Et = Jo("div", { shouldForwardProp: (e) => !Nt.includes(e)
           multiple: !0,
           disableCloseOnSelect: !0,
           options: a,
-          onChange: (d) => (
+          onChange: (d, I) => (
             // @ts-ignore
-            h && h({ ...d, target: { ...d.target, value: d.target.innerText || "" } })
+            h && h({ ...d, target: { ...d.target, value: I } })
           ),
-          ...O,
+          ...P,
           renderInput: (d) => /* @__PURE__ */ w(zo, { ...d })
         }
       )

package/Table/Table.js

@@ -1,22 +1,22 @@
-import { jsxs as a, jsx as o } from "react/jsx-runtime";
-import ze, { forwardRef as X, createElement as F, useState as y, useMemo as T } from "react";
-import I from "../theme.js";
+import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import je, { forwardRef as X, createElement as F, useState as y, useMemo as I } from "react";
+import N from "../theme.js";
 import { n as i } from "../.chunks/emotion-styled.browser.esm.js";
-import { Button as Ae } from "../Button/Button.js";
-import { Flex as je } from "../Flex/Flex.js";
+import { Button as ze } from "../Button/Button.js";
+import { Flex as Ae } from "../Flex/Flex.js";
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Be = (n) => n.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), Ie = (n) => n.replace(
+const Te = (n) => n.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), Ne = (n) => n.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
   (r, l, u) => u ? u.toUpperCase() : l.toLowerCase()
 ), G = (n) => {
-  const r = Ie(n);
+  const r = Ne(n);
   return r.charAt(0).toUpperCase() + r.slice(1);
-}, P = (...n) => n.filter((r, l, u) => !!r && r.trim() !== "" && u.indexOf(r) === l).join(" ").trim(), _e = (n) => {
+}, P = (...n) => n.filter((r, l, u) => !!r && r.trim() !== "" && u.indexOf(r) === l).join(" ").trim(), Be = (n) => {
   for (const r in n)
     if (r.startsWith("aria-") || r === "role" || r === "title")
       return !0;
@@ -44,31 +44,31 @@ var De = {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Te = X(
+const Ie = X(
   ({
     color: n = "currentColor",
     size: r = 24,
     strokeWidth: l = 2,
     absoluteStrokeWidth: u,
-    className: C = "",
+    className: m = "",
     children: g,
-    iconNode: M,
-    ...A
-  }, s) => F(
+    iconNode: _,
+    ...z
+  }, a) => F(
     "svg",
     {
-      ref: s,
+      ref: a,
       ...De,
       width: r,
       height: r,
       stroke: n,
       strokeWidth: u ? Number(l) * 24 / Number(r) : l,
-      className: P("lucide", C),
-      ...!g && !_e(A) && { "aria-hidden": "true" },
-      ...A
+      className: P("lucide", m),
+      ...!g && !Be(z) && { "aria-hidden": "true" },
+      ...z
     },
     [
-      ...M.map(([b, L]) => F(b, L)),
+      ..._.map(([b, M]) => F(b, M)),
       ...Array.isArray(g) ? g : [g]
     ]
   )
@@ -79,17 +79,17 @@ const Te = X(
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const z = (n, r) => {
+const j = (n, r) => {
   const l = X(
-    ({ className: u, ...C }, g) => F(Te, {
+    ({ className: u, ...m }, g) => F(Ie, {
       ref: g,
       iconNode: r,
       className: P(
-        `lucide-${Be(G(n))}`,
+        `lucide-${Te(G(n))}`,
         `lucide-${n}`,
         u
       ),
-      ...C
+      ...m
     })
   );
   return l.displayName = G(n), l;
@@ -100,21 +100,21 @@ const z = (n, r) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Me = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], N = z("chevron-down", Me);
+const _e = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], $ = j("chevron-down", _e);
 /**
  * @license lucide-react v0.525.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" }]], J = z("chevron-up", Le);
+const Me = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]], J = j("chevron-up", Me);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Re = [
+const Le = [
   [
     "path",
     {
@@ -131,7 +131,7 @@ const Re = [
     }
   ],
   ["path", { d: "m2 2 20 20", key: "1ooewy" }]
-], We = z("eye-off", Re);
+], Re = j("eye-off", Le);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
@@ -147,17 +147,17 @@ const Ee = [
     }
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-], $e = z("eye", Ee);
+], We = j("eye", Ee);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Ne = [
+const $e = [
   ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
-], Q = z("search", Ne);
+], Q = j("search", $e);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
@@ -173,56 +173,56 @@ const Fe = [
     }
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-], Ve = z("settings", Fe);
+], Ve = j("settings", Fe);
 let v = "";
 const Ze = ({
   data: n = [],
   columnTitles: r = {},
   rowsPerPage: l = 19,
   title: u = "Data Table",
-  onRowClick: C,
+  onRowClick: m,
   hiddenColumns: g = [],
-  defaultSort: M = { key: "", direction: "asc" },
-  extraActions: A
+  defaultSort: _ = { key: "", direction: "asc" },
+  extraActions: z
 }) => {
-  const [s, b] = y(1), [, L] = y(""), [h, ee] = y(M), [w, _] = y(/* @__PURE__ */ new Set()), [R, V] = y(/* @__PURE__ */ new Set()), [U, oe] = y(!1), [O, te] = y(!1), d = T(() => n.length === 0 ? [] : Object.keys(n[0]).filter((e) => !g.includes(e)), [n]);
-  ze.useEffect(() => {
-    d.length > 0 && (V(new Set(d)), _(new Set(d)));
+  const [a, b] = y(1), [, M] = y(""), [h, ee] = y(_), [w, B] = y(/* @__PURE__ */ new Set()), [L, V] = y(/* @__PURE__ */ new Set()), [U, oe] = y(!1), [H, te] = y(!1), d = I(() => n.length === 0 ? [] : Object.keys(n[0]).filter((e) => !g.includes(e)), [n]);
+  je.useEffect(() => {
+    d.length > 0 && (V(new Set(d)), B(new Set(d)));
   }, [d]);
-  const W = T(() => {
+  const R = I(() => {
     if (!v) return n;
     const e = w.size > 0 ? w : new Set(d);
     return n.filter((t) => Array.from(e).some((c) => {
       const f = t[c];
       return f && f.toString().toLowerCase().includes(v.toLowerCase());
     }));
-  }, [n, v, w, d]), x = T(() => h.key ? [...W].sort((e, t) => e[h.key] < t[h.key] ? h.direction === "asc" ? -1 : 1 : e[h.key] > t[h.key] ? h.direction === "asc" ? 1 : -1 : 0) : W, [W, h]), D = d.filter((e) => R.has(e)), ne = () => {
+  }, [n, v, w, d]), x = I(() => h.key ? [...R].sort((e, t) => e[h.key] < t[h.key] ? h.direction === "asc" ? -1 : 1 : e[h.key] > t[h.key] ? h.direction === "asc" ? 1 : -1 : 0) : R, [R, h]), D = d.filter((e) => L.has(e)), ne = () => {
     if (!Array.isArray(x) || x.length === 0) return;
-    const e = D.map((S) => r[S] || S), t = (S) => {
-      const B = String(S ?? "");
-      return /[",\n]/.test(B) ? `"${B.replace(/"/g, '""')}"` : B;
+    const e = D.map((k) => r[k] || k), t = (k) => {
+      const T = String(k ?? "");
+      return /[",\n]/.test(T) ? `"${T.replace(/"/g, '""')}"` : T;
     }, f = [
       e.join(","),
       // header row
-      ...x.map((S) => D.map((B) => t(S[B])).join(","))
+      ...x.map((k) => D.map((T) => t(k[T])).join(","))
     ].join(`
-`), ve = new Blob([f], { type: "text/csv;charset=utf-8;" }), j = document.createElement("a");
-    j.href = URL.createObjectURL(ve), j.download = "data.csv", document.body.appendChild(j), j.click(), document.body.removeChild(j);
-  }, re = T(() => {
-    const e = (s - 1) * l;
+`), ve = new Blob([f], { type: "text/csv;charset=utf-8;" }), A = document.createElement("a");
+    A.href = URL.createObjectURL(ve), A.download = "data.csv", document.body.appendChild(A), A.click(), document.body.removeChild(A);
+  }, re = I(() => {
+    const e = (a - 1) * l;
     return x.slice(e, e + l);
-  }, [x, s, l]), p = Math.ceil(x.length / l), ie = (e) => {
+  }, [x, a, l]), p = Math.ceil(x.length / l), ie = (e) => {
     ee((t) => ({
       key: e,
       direction: t.key === e && t.direction === "asc" ? "desc" : "asc"
     }));
-  }, se = (e) => {
-    _((t) => {
+  }, ae = (e) => {
+    B((t) => {
       const c = new Set(t);
       return c.has(e) ? c.delete(e) : c.add(e), c;
     });
-  }, ae = () => {
-    w.size === d.length ? _(/* @__PURE__ */ new Set()) : _(new Set(d));
+  }, se = () => {
+    w.size === d.length ? B(/* @__PURE__ */ new Set()) : B(new Set(d));
   }, ce = (e) => {
     V((t) => {
       const c = new Set(t);
@@ -230,17 +230,17 @@ const Ze = ({
     });
   }, le = (e) => {
     v = e;
-  }, H = () => {
-    L(v);
-  }, m = {
+  }, O = () => {
+    M(v);
+  }, C = {
     thActive: {
-      backgroundColor: I.colors.green,
-      color: I.colors.white
+      backgroundColor: N.colors.green,
+      color: N.colors.white
     },
     paginationButtonActive: {
-      backgroundColor: I.colors.green,
-      color: I.colors.white,
-      borderColor: I.colors.green
+      backgroundColor: N.colors.green,
+      color: N.colors.white,
+      borderColor: N.colors.green
     },
     paginationButtonDisabled: {
       opacity: 0.5,
@@ -258,7 +258,7 @@ const Ze = ({
     boxShadow: "0 2px 10px rgba(0, 0, 0, 0.1)",
     padding: "20px",
     fontFamily: "Arial, sans-serif",
-    maxWidth: "100%",
+    width: "100%",
     overflow: "auto"
   }), pe = i("div")({
     display: "flex",
@@ -362,18 +362,18 @@ const Ze = ({
       backgroundColor: "#f0f8f0",
       color: "#005c00"
     }
-  }), $ = i("input")({
+  }), W = i("input")({
     width: "16px",
     height: "16px",
     accentColor: "#009200"
-  }), Ce = i("table")({
+  }), me = i("table")({
     width: "100%",
     borderCollapse: "collapse",
     backgroundColor: "#ffffff",
     borderRadius: "8px",
     overflow: "hidden",
     boxShadow: "0 1px 3px rgba(0, 0, 0, 0.1)"
-  }), me = i("th")({
+  }), Ce = i("th")({
     backgroundColor: "#f8f9fa",
     color: "#333333",
     padding: "16px 12px",
@@ -407,13 +407,13 @@ const Ze = ({
         cursor: "pointer"
       }
     }
-  })), ke = i("div")({
+  })), Se = i("div")({
     display: "flex",
     justifyContent: "center",
     alignItems: "center",
     marginTop: "20px",
     gap: "10px"
-  }), k = i("button")({
+  }), S = i("button")({
     padding: "8px 12px",
     border: "1px solid #e0e0e0",
     borderRadius: "4px",
@@ -432,7 +432,7 @@ const Ze = ({
       opacity: 0.5,
       cursor: "not-allowed"
     }
-  }), Se = i("div")({
+  }), ke = i("div")({
     fontSize: "14px",
     color: "#666666",
     textAlign: "center",
@@ -442,18 +442,18 @@ const Ze = ({
     color: "#666666",
     fontSize: "14px"
   });
-  return /* @__PURE__ */ a(de, { children: [
-    /* @__PURE__ */ a(pe, { children: [
-      /* @__PURE__ */ a(he, { children: [
+  return /* @__PURE__ */ s(de, { className: "jcTableContainer", children: [
+    /* @__PURE__ */ s(pe, { className: "jcTableHeader", children: [
+      /* @__PURE__ */ s(he, { className: "jcTableTitleAndActions", children: [
         /* @__PURE__ */ o(fe, { children: u }),
-        /* @__PURE__ */ a(je, { className: "jcTableExtraComponentsBox", gap: "9px", children: [
-          A && A,
-          /* @__PURE__ */ o(Ae, { onClick: ne, children: "Export to CSV" })
+        /* @__PURE__ */ s(Ae, { className: "jcTableExtraComponentsBox", gap: "9px", children: [
+          z && z,
+          /* @__PURE__ */ o(ze, { onClick: ne, children: "Export to CSV" })
         ] })
       ] }),
-      /* @__PURE__ */ a(ue, { children: [
-        /* @__PURE__ */ a(xe, { children: [
-          /* @__PURE__ */ o(ge, { onClick: H }),
+      /* @__PURE__ */ s(ue, { className: "jcTableControls", children: [
+        /* @__PURE__ */ s(xe, { className: "jcTableSearchContainer", children: [
+          /* @__PURE__ */ o(ge, { onClick: O }),
           /* @__PURE__ */ o(
             be,
             {
@@ -462,21 +462,28 @@ const Ze = ({
               defaultValue: v,
               onChange: (e) => le(e.target.value),
               onKeyDown: (e) => {
-                e.key === "Enter" && H();
+                e.key === "Enter" && O();
               }
             }
           )
         ] }),
-        /* @__PURE__ */ a("div", { style: { position: "relative" }, children: [
-          /* @__PURE__ */ a(q, { onClick: () => te(!O), children: [
-            /* @__PURE__ */ o(Q, { size: 16 }),
-            "Fields",
-            /* @__PURE__ */ o(N, { size: 16 })
-          ] }),
-          O && /* @__PURE__ */ a(K, { children: [
-            /* @__PURE__ */ a(E, { onClick: ae, children: [
+        /* @__PURE__ */ s("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ s(
+            q,
+            {
+              className: "jcTableSearchFields",
+              onClick: () => te(!H),
+              children: [
+                /* @__PURE__ */ o(Q, { size: 16 }),
+                "Fields",
+                /* @__PURE__ */ o($, { size: 16 })
+              ]
+            }
+          ),
+          H && /* @__PURE__ */ s(K, { className: "jcTableSearchFieldsDropdown", children: [
+            /* @__PURE__ */ s(E, { onClick: se, children: [
               /* @__PURE__ */ o(
-                $,
+                W,
                 {
                   type: "checkbox",
                   checked: w.size === d.length,
@@ -487,50 +494,57 @@ const Ze = ({
               /* @__PURE__ */ o("span", { style: { fontWeight: "bold" }, children: "All" })
             ] }),
             /* @__PURE__ */ o("div", { style: { height: "1px", backgroundColor: "#e0e0e0", margin: "4px 0" } }),
-            d.map((e) => /* @__PURE__ */ a(E, { onClick: () => se(e), children: [
-              /* @__PURE__ */ o($, { type: "checkbox", checked: w.has(e), onChange: () => {
+            d.map((e) => /* @__PURE__ */ s(E, { onClick: () => ae(e), children: [
+              /* @__PURE__ */ o(W, { type: "checkbox", checked: w.has(e), onChange: () => {
               } }),
               /* @__PURE__ */ o("span", { children: r[e] || e })
             ] }, e))
           ] })
         ] }),
-        /* @__PURE__ */ a("div", { style: { position: "relative" }, children: [
-          /* @__PURE__ */ a(q, { onClick: () => oe(!U), children: [
-            /* @__PURE__ */ o(Ve, { size: 16 }),
-            "Columns",
-            /* @__PURE__ */ o(N, { size: 16 })
-          ] }),
-          U && /* @__PURE__ */ o(K, { children: d.map((e) => /* @__PURE__ */ a(E, { onClick: () => ce(e), children: [
-            /* @__PURE__ */ o($, { type: "checkbox", checked: R.has(e), onChange: () => {
+        /* @__PURE__ */ s("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ s(
+            q,
+            {
+              className: "jcTableColumnSettings",
+              onClick: () => oe(!U),
+              children: [
+                /* @__PURE__ */ o(Ve, { size: 16 }),
+                "Columns",
+                /* @__PURE__ */ o($, { size: 16 })
+              ]
+            }
+          ),
+          U && /* @__PURE__ */ o(K, { className: "jcTableColumnSettingsDropdown", children: d.map((e) => /* @__PURE__ */ s(E, { onClick: () => ce(e), children: [
+            /* @__PURE__ */ o(W, { type: "checkbox", checked: L.has(e), onChange: () => {
             } }),
-            R.has(e) ? /* @__PURE__ */ o($e, { size: 16 }) : /* @__PURE__ */ o(We, { size: 16 }),
+            L.has(e) ? /* @__PURE__ */ o(We, { size: 16 }) : /* @__PURE__ */ o(Re, { size: 16 }),
             /* @__PURE__ */ o("span", { children: r[e] || e })
           ] }, e)) })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ a(Ce, { children: [
-      /* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o(Y, { interactableRow: !1, children: D.map((e) => /* @__PURE__ */ a(
-        me,
+    /* @__PURE__ */ s(me, { className: "jcTableContent", children: [
+      /* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o(Y, { interactableRow: !1, children: D.map((e) => /* @__PURE__ */ s(
+        Ce,
         {
-          style: h.key === e ? m.thActive : {},
+          style: h.key === e ? C.thActive : {},
           onClick: () => ie(e),
           children: [
             r[e] || e,
-            /* @__PURE__ */ o(we, { children: h.key === e ? h.direction === "asc" ? /* @__PURE__ */ o(J, { size: 16 }) : /* @__PURE__ */ o(N, { size: 16 }) : /* @__PURE__ */ o(J, { size: 16, style: { opacity: 0.313 } }) })
+            /* @__PURE__ */ o(we, { children: h.key === e ? h.direction === "asc" ? /* @__PURE__ */ o(J, { size: 16 }) : /* @__PURE__ */ o($, { size: 16 }) : /* @__PURE__ */ o(J, { size: 16, style: { opacity: 0.313 } }) })
           ]
         },
         e
       )) }) }),
-      /* @__PURE__ */ o("tbody", { children: re.map((e, t) => /* @__PURE__ */ o(Y, { onClick: () => C && C(e), interactableRow: !!C, children: D.map((c) => /* @__PURE__ */ o(ye, { children: e[c] }, c)) }, t)) })
+      /* @__PURE__ */ o("tbody", { children: re.map((e, t) => /* @__PURE__ */ o(Y, { onClick: () => m && m(e), interactableRow: !!m, children: D.map((c) => /* @__PURE__ */ o(ye, { children: e[c] }, c)) }, t)) })
     ] }),
-    /* @__PURE__ */ a(ke, { children: [
+    /* @__PURE__ */ s(Se, { children: [
       /* @__PURE__ */ o(
-        k,
+        S,
         {
-          style: s === 1 ? m.paginationButtonDisabled : {},
-          onClick: () => b(Math.max(1, s - 1)),
-          disabled: s === 1,
+          style: a === 1 ? C.paginationButtonDisabled : {},
+          onClick: () => b(Math.max(1, a - 1)),
+          disabled: a === 1,
           children: "Previous"
         }
       ),
@@ -540,9 +554,9 @@ const Ze = ({
           for (let t = 1; t <= p; t++)
             e.push(
               /* @__PURE__ */ o(
-                k,
+                S,
                 {
-                  style: s === t ? m.paginationButtonActive : {},
+                  style: a === t ? C.paginationButtonActive : {},
                   onClick: () => b(t),
                   children: t
                 },
@@ -552,33 +566,33 @@ const Ze = ({
         else {
           e.push(
             /* @__PURE__ */ o(
-              k,
+              S,
               {
-                style: s === 1 ? m.paginationButtonActive : {},
+                style: a === 1 ? C.paginationButtonActive : {},
                 onClick: () => b(1),
                 children: "1"
               },
               1
             )
-          ), s > 3 && e.push(/* @__PURE__ */ o(Z, { children: "..." }, "ellipsis1"));
-          const t = Math.max(2, s - 1), c = Math.min(p - 1, s + 1);
+          ), a > 3 && e.push(/* @__PURE__ */ o(Z, { children: "..." }, "ellipsis1"));
+          const t = Math.max(2, a - 1), c = Math.min(p - 1, a + 1);
           for (let f = t; f <= c; f++)
             e.push(
               /* @__PURE__ */ o(
-                k,
+                S,
                 {
-                  style: s === f ? m.paginationButtonActive : {},
+                  style: a === f ? C.paginationButtonActive : {},
                   onClick: () => b(f),
                   children: f
                 },
                 f
               )
             );
-          s < p - 2 && e.push(/* @__PURE__ */ o(Z, { children: "..." }, "ellipsis2")), p > 1 && e.push(
+          a < p - 2 && e.push(/* @__PURE__ */ o(Z, { children: "..." }, "ellipsis2")), p > 1 && e.push(
             /* @__PURE__ */ o(
-              k,
+              S,
               {
-                style: s === p ? m.paginationButtonActive : {},
+                style: a === p ? C.paginationButtonActive : {},
                 onClick: () => b(p),
                 children: p
               },
@@ -589,21 +603,21 @@ const Ze = ({
         return e;
       })(),
       /* @__PURE__ */ o(
-        k,
+        S,
         {
-          style: s === p ? m.paginationButtonDisabled : {},
-          onClick: () => b(Math.min(p, s + 1)),
-          disabled: s === p,
+          style: a === p ? C.paginationButtonDisabled : {},
+          onClick: () => b(Math.min(p, a + 1)),
+          disabled: a === p,
           children: "Next"
         }
       )
     ] }),
-    /* @__PURE__ */ a(Se, { children: [
+    /* @__PURE__ */ s(ke, { children: [
       "Showing ",
-      Math.min((s - 1) * l + 1, x.length),
+      Math.min((a - 1) * l + 1, x.length),
       " to",
       " ",
-      Math.min(s * l, x.length),
+      Math.min(a * l, x.length),
       " of ",
       x.length,
       " entries"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.325",
+  "version": "0.0.329",
   "description": "Component library for the websites of Johnson County Iowa",
   "license": "MIT",
   "homepage": "https://devops.jc.net/JCIT/Business%20Solutions%20Delivery/_git/JCComponentLibrary?path=%2FREADME.md&version=GBmaster",