jcicl 1.0.76 → 1.0.78

package/LabeledDropdown/LabeledDropdown.js

@@ -1,39 +1,39 @@
-import { jsx as T, jsxs as De } from "react/jsx-runtime";
-import { n as Yo } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as No } from "../.chunks/emotion-react.browser.esm.js";
-import Jo from "../theme.js";
-import { useThemeColors as Xo } from "../ThemeContext.js";
-import * as b from "react";
-import { g as po, a as co, s as F, b as d, u as uo, c as J, P as o, d as fo, e as V } from "../.chunks/DefaultPropsProvider.js";
-import { i as Io, a as be, b as Eo, f as Ae, A as Qo, T as zo } from "../.chunks/TextField.js";
-import { c as Ho } from "../.chunks/createSvgIcon.js";
-import { m as ee } from "../.chunks/memoTheme.js";
-import { u as Oo } from "../.chunks/useSlot.js";
-import { c as Me } from "../.chunks/createSimplePaletteValueFilter.js";
-import { B as So } from "../.chunks/ButtonBase.js";
-import { c as wo } from "../.chunks/chainPropTypes.js";
+import { jsx as S, jsxs as Be } from "react/jsx-runtime";
+import { cn as Ho } from "../cn.js";
+import io from "../theme.js";
+import { useThemeColors as Jo } from "../ThemeContext.js";
+import * as m from "react";
+import { g as co, a as uo, s as V, c as d, u as fo, P as o, b as go, d as z } from "../.chunks/DefaultPropsProvider.js";
+import { c as Q } from "../.chunks/clsx.js";
+import { i as Oo, a as me, b as Do, f as Ae, A as Xo, T as No } from "../.chunks/TextField.js";
+import { c as Uo } from "../.chunks/createSvgIcon.js";
+import { m as oe } from "../.chunks/memoTheme.js";
+import { u as wo } from "../.chunks/useSlot.js";
+import { c as _e } from "../.chunks/createSimplePaletteValueFilter.js";
+import { B as Po } from "../.chunks/ButtonBase.js";
+import { c as To } from "../.chunks/chainPropTypes.js";
 import { P as Wo } from "../.chunks/Popper.js";
 import { P as Ko } from "../.chunks/Paper.js";
-import { a as Zo } from "../.chunks/Portal.js";
-import { u as Po } from "../.chunks/useControlled.js";
-import { b as io, s as et, u as ot } from "../.chunks/TransitionGroupContext.js";
-import { i as tt } from "../.chunks/integerPropType.js";
-function nt(e, n, a, i, g) {
+import { a as Qo } from "../.chunks/Portal.js";
+import { u as So } from "../.chunks/useControlled.js";
+import { b as so, s as Zo, u as et } from "../.chunks/TransitionGroupContext.js";
+import { i as ot } from "../.chunks/integerPropType.js";
+function tt(e, n, a, i, g) {
   if (process.env.NODE_ENV === "production")
     return null;
   const h = g || n;
   return typeof e[n] < "u" ? new Error(`The prop \`${h}\` is not supported. Please remove it.`) : null;
 }
-const rt = (e) => {
-  const n = b.useRef({});
-  return b.useEffect(() => {
+const nt = (e) => {
+  const n = m.useRef({});
+  return m.useEffect(() => {
     n.current = e;
   }), n.current;
 };
-function Vo(e) {
+function Eo(e) {
   return e.normalize("NFD").replace(/[\u0300-\u036f]/g, "");
 }
-function at(e = {}) {
+function rt(e = {}) {
   const {
     ignoreAccents: n = !0,
     ignoreCase: a = !0,
@@ -43,26 +43,26 @@ function at(e = {}) {
     trim: x = !1
   } = e;
   return (y, {
-    inputValue: P,
-    getOptionLabel: C
+    inputValue: w,
+    getOptionLabel: b
   }) => {
-    let m = x ? P.trim() : P;
-    a && (m = m.toLowerCase()), n && (m = Vo(m));
-    const w = m ? y.filter((X) => {
-      let A = (h || C)(X);
-      return a && (A = A.toLowerCase()), n && (A = Vo(A)), g === "start" ? A.startsWith(m) : A.includes(m);
+    let P = x ? w.trim() : w;
+    a && (P = P.toLowerCase()), n && (P = Eo(P));
+    const R = P ? y.filter((U) => {
+      let L = (h || b)(U);
+      return a && (L = L.toLowerCase()), n && (L = Eo(L)), g === "start" ? L.startsWith(P) : L.includes(P);
     }) : y;
-    return typeof i == "number" ? w.slice(0, i) : w;
+    return typeof i == "number" ? R.slice(0, i) : R;
   };
 }
-const lt = at(), Fo = 5, it = (e) => {
+const at = rt(), zo = 5, lt = (e) => {
   var n;
   return e.current !== null && ((n = e.current.parentElement) == null ? void 0 : n.contains(document.activeElement));
-}, st = [];
-function pt(e) {
+}, it = [];
+function st(e) {
   const {
     // eslint-disable-next-line @typescript-eslint/naming-convention
-    unstable_isActiveElementInListbox: n = it,
+    unstable_isActiveElementInListbox: n = lt,
     // eslint-disable-next-line @typescript-eslint/naming-convention
     unstable_classNamePrefix: a = "Mui",
     autoComplete: i = !1,
@@ -70,211 +70,211 @@ function pt(e) {
     autoSelect: h = !1,
     blurOnSelect: x = !1,
     clearOnBlur: y = !e.freeSolo,
-    clearOnEscape: P = !1,
-    componentName: C = "useAutocomplete",
-    defaultValue: m = e.multiple ? st : null,
-    disableClearable: w = !1,
-    disableCloseOnSelect: X = !1,
-    disabled: A,
-    disabledItemsFocusable: E = !1,
-    disableListWrap: ue = !1,
-    filterOptions: Ne = lt,
-    filterSelectedOptions: me = !1,
-    freeSolo: le = !1,
-    getOptionDisabled: H,
-    getOptionKey: he,
-    getOptionLabel: Ee = (r) => r.label ?? r,
-    groupBy: oe,
-    handleHomeEndKeys: ze = !e.freeSolo,
-    id: Ve,
-    includeInputInList: de = !1,
-    inputValue: ye,
-    isOptionEqualToValue: W = (r, t) => r === t,
-    multiple: $ = !1,
-    onChange: fe,
-    onClose: _,
-    onHighlightChange: ve,
-    onInputChange: q,
-    onOpen: ie,
-    open: xe,
-    openOnFocus: M = !1,
+    clearOnEscape: w = !1,
+    componentName: b = "useAutocomplete",
+    defaultValue: P = e.multiple ? it : null,
+    disableClearable: R = !1,
+    disableCloseOnSelect: U = !1,
+    disabled: L,
+    disabledItemsFocusable: T = !1,
+    disableListWrap: N = !1,
+    filterOptions: te = at,
+    filterSelectedOptions: he = !1,
+    freeSolo: se = !1,
+    getOptionDisabled: W,
+    getOptionKey: ye,
+    getOptionLabel: De = (r) => r.label ?? r,
+    groupBy: ne,
+    handleHomeEndKeys: Ne = !e.freeSolo,
+    id: Ee,
+    includeInputInList: fe = !1,
+    inputValue: ve,
+    isOptionEqualToValue: K = (r, t) => r === t,
+    multiple: I = !1,
+    onChange: ge,
+    onClose: Y,
+    onHighlightChange: xe,
+    onInputChange: J,
+    onOpen: pe,
+    open: Ie,
+    openOnFocus: _ = !1,
     options: Ro,
     readOnly: Ce = !1,
-    selectOnFocus: Fe = !e.freeSolo,
-    value: go
-  } = e, U = Zo(Ve);
-  let D = Ee;
-  D = (r) => {
-    const t = Ee(r);
+    selectOnFocus: ze = !e.freeSolo,
+    value: bo
+  } = e, H = Qo(Ee);
+  let B = De;
+  B = (r) => {
+    const t = De(r);
     if (typeof t != "string") {
       if (process.env.NODE_ENV !== "production") {
         const l = t === void 0 ? "undefined" : `${typeof t} (${t})`;
-        console.error(`MUI: The \`getOptionLabel\` method of ${C} returned ${l} instead of a string for ${JSON.stringify(r)}.`);
+        console.error(`MUI: The \`getOptionLabel\` method of ${b} returned ${l} instead of a string for ${JSON.stringify(r)}.`);
       }
       return String(t);
     }
     return t;
   };
-  const je = b.useRef(!1), Be = b.useRef(!0), R = b.useRef(null), K = b.useRef(null), [Ue, Lo] = b.useState(null), [G, Xe] = b.useState(-1), bo = g ? 0 : -1, z = b.useRef(bo), [s, Ao] = Po({
-    controlled: go,
-    default: m,
-    name: C
-  }), [S, $e] = Po({
-    controlled: ye,
+  const Ve = m.useRef(!1), Fe = m.useRef(!0), M = m.useRef(null), q = m.useRef(null), [je, Lo] = m.useState(null), [G, Xe] = m.useState(-1), mo = g ? 0 : -1, E = m.useRef(mo), [s, Ao] = So({
+    controlled: bo,
+    default: P,
+    name: b
+  }), [O, $e] = So({
+    controlled: ve,
     default: "",
-    name: C,
+    name: b,
     state: "inputValue"
-  }), [Ie, He] = b.useState(!1), Oe = b.useCallback((r, t, l) => {
-    if (!($ ? s.length < t.length : t !== null) && !y)
+  }), [Oe, He] = m.useState(!1), we = m.useCallback((r, t, l) => {
+    if (!(I ? s.length < t.length : t !== null) && !y)
       return;
     let c;
-    if ($)
+    if (I)
       c = "";
     else if (t == null)
       c = "";
     else {
-      const O = D(t);
-      c = typeof O == "string" ? O : "";
+      const $ = B(t);
+      c = typeof $ == "string" ? $ : "";
     }
-    S !== c && ($e(c), q && q(r, c, l));
-  }, [D, S, $, q, $e, y, s]), [se, Qe] = Po({
-    controlled: xe,
+    O !== c && ($e(c), J && J(r, c, l));
+  }, [B, O, I, J, $e, y, s]), [ce, Qe] = So({
+    controlled: Ie,
     default: !1,
-    name: C,
+    name: b,
     state: "open"
-  }), [Ze, mo] = b.useState(!0), Pe = !$ && s != null && S === D(s), j = se && !Ce, k = j ? Ne(
-    Ro.filter((r) => !(me && ($ ? s : [s]).some((t) => t !== null && W(r, t)))),
+  }), [Ze, ho] = m.useState(!0), Se = !I && s != null && O === B(s), F = ce && !Ce, k = F ? te(
+    Ro.filter((r) => !(he && (I ? s : [s]).some((t) => t !== null && K(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 ? "" : S,
-      getOptionLabel: D
+      inputValue: Se && Ze ? "" : O,
+      getOptionLabel: B
     }
-  ) : [], Q = rt({
+  ) : [], Z = nt({
     filteredOptions: k,
     value: s,
-    inputValue: S
+    inputValue: O
   });
-  b.useEffect(() => {
-    const r = s !== Q.value;
-    Ie && !r || le && !r || Oe(null, s, "reset");
-  }, [s, Oe, Ie, Q.value, le]);
-  const We = se && k.length > 0 && !Ce, Se = io((r) => {
-    r === -1 ? R.current.focus() : Ue.querySelector(`[data-tag-index="${r}"]`).focus();
+  m.useEffect(() => {
+    const r = s !== Z.value;
+    Oe && !r || se && !r || we(null, s, "reset");
+  }, [s, we, Oe, Z.value, se]);
+  const Ue = ce && k.length > 0 && !Ce, Pe = so((r) => {
+    r === -1 ? M.current.focus() : je.querySelector(`[data-tag-index="${r}"]`).focus();
   });
-  b.useEffect(() => {
-    $ && G > s.length - 1 && (Xe(-1), Se(-1));
-  }, [s, $, G, Se]);
+  m.useEffect(() => {
+    I && G > s.length - 1 && (Xe(-1), Pe(-1));
+  }, [s, I, G, Pe]);
   function eo(r, t) {
-    if (!K.current || r < 0 || r >= k.length)
+    if (!q.current || r < 0 || r >= k.length)
       return -1;
     let l = r;
     for (; ; ) {
-      const p = K.current.querySelector(`[data-option-index="${l}"]`), c = E ? !1 : !p || p.disabled || p.getAttribute("aria-disabled") === "true";
+      const p = q.current.querySelector(`[data-option-index="${l}"]`), c = T ? !1 : !p || p.disabled || p.getAttribute("aria-disabled") === "true";
       if (p && p.hasAttribute("tabindex") && !c)
         return l;
       if (t === "next" ? l = (l + 1) % k.length : l = (l - 1 + k.length) % k.length, l === r)
         return -1;
     }
   }
-  const te = io(({
+  const re = so(({
     event: r,
     index: t,
     reason: l = "auto"
   }) => {
-    if (z.current = t, t === -1 ? R.current.removeAttribute("aria-activedescendant") : R.current.setAttribute("aria-activedescendant", `${U}-option-${t}`), ve && ve(r, t === -1 ? null : k[t], l), !K.current)
+    if (E.current = t, t === -1 ? M.current.removeAttribute("aria-activedescendant") : M.current.setAttribute("aria-activedescendant", `${H}-option-${t}`), xe && xe(r, t === -1 ? null : k[t], l), !q.current)
       return;
-    const p = K.current.querySelector(`[role="option"].${a}-focused`);
+    const p = q.current.querySelector(`[role="option"].${a}-focused`);
     p && (p.classList.remove(`${a}-focused`), p.classList.remove(`${a}-focusVisible`));
-    let c = K.current;
-    if (K.current.getAttribute("role") !== "listbox" && (c = K.current.parentElement.querySelector('[role="listbox"]')), !c)
+    let c = q.current;
+    if (q.current.getAttribute("role") !== "listbox" && (c = q.current.parentElement.querySelector('[role="listbox"]')), !c)
       return;
     if (t === -1) {
       c.scrollTop = 0;
       return;
     }
-    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 I = O, B = c.clientHeight + c.scrollTop, Le = I.offsetTop + I.offsetHeight;
-      Le > B ? c.scrollTop = Le - c.clientHeight : I.offsetTop - I.offsetHeight * (oe ? 1.3 : 0) < c.scrollTop && (c.scrollTop = I.offsetTop - I.offsetHeight * (oe ? 1.3 : 0));
+    const $ = q.current.querySelector(`[data-option-index="${t}"]`);
+    if ($ && ($.classList.add(`${a}-focused`), l === "keyboard" && $.classList.add(`${a}-focusVisible`), c.scrollHeight > c.clientHeight && l !== "mouse" && l !== "touch")) {
+      const C = $, j = c.clientHeight + c.scrollTop, Le = C.offsetTop + C.offsetHeight;
+      Le > j ? c.scrollTop = Le - c.clientHeight : C.offsetTop - C.offsetHeight * (ne ? 1.3 : 0) < c.scrollTop && (c.scrollTop = C.offsetTop - C.offsetHeight * (ne ? 1.3 : 0));
     }
-  }), Y = io(({
+  }), X = so(({
     event: r,
     diff: t,
     direction: l = "next",
     reason: p = "auto"
   }) => {
-    if (!j)
+    if (!F)
       return;
-    const O = eo((() => {
-      const I = k.length - 1;
+    const $ = eo((() => {
+      const C = k.length - 1;
       if (t === "reset")
-        return bo;
+        return mo;
       if (t === "start")
         return 0;
       if (t === "end")
-        return I;
-      const B = z.current + t;
-      return B < 0 ? B === -1 && de ? -1 : ue && z.current !== -1 || Math.abs(t) > 1 ? 0 : I : B > I ? B === I + 1 && de ? -1 : ue || Math.abs(t) > 1 ? I : 0 : B;
+        return C;
+      const j = E.current + t;
+      return j < 0 ? j === -1 && fe ? -1 : N && E.current !== -1 || Math.abs(t) > 1 ? 0 : C : j > C ? j === C + 1 && fe ? -1 : N || Math.abs(t) > 1 ? C : 0 : j;
     })(), l);
-    if (te({
-      index: O,
+    if (re({
+      index: $,
       reason: p,
       event: r
     }), i && t !== "reset")
-      if (O === -1)
-        R.current.value = S;
+      if ($ === -1)
+        M.current.value = O;
       else {
-        const I = D(k[O]);
-        R.current.value = I, I.toLowerCase().indexOf(S.toLowerCase()) === 0 && S.length > 0 && R.current.setSelectionRange(S.length, I.length);
+        const C = B(k[$]);
+        M.current.value = C, C.toLowerCase().indexOf(O.toLowerCase()) === 0 && O.length > 0 && M.current.setSelectionRange(O.length, C.length);
       }
-  }), ho = () => {
+  }), yo = () => {
     const r = (t, l) => {
-      const p = t ? D(t) : "", c = l ? D(l) : "";
+      const p = t ? B(t) : "", c = l ? B(l) : "";
       return p === c;
     };
-    if (z.current !== -1 && Q.filteredOptions && Q.filteredOptions.length !== k.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 (E.current !== -1 && Z.filteredOptions && Z.filteredOptions.length !== k.length && Z.inputValue === O && (I ? s.length === Z.value.length && Z.value.every((t, l) => B(s[l]) === B(t)) : r(Z.value, s))) {
+      const t = Z.filteredOptions[E.current];
       if (t)
-        return k.findIndex((l) => D(l) === D(t));
+        return k.findIndex((l) => B(l) === B(t));
     }
     return -1;
-  }, Ke = b.useCallback(() => {
-    if (!j)
+  }, We = m.useCallback(() => {
+    if (!F)
       return;
-    const r = ho();
+    const r = yo();
     if (r !== -1) {
-      z.current = r;
+      E.current = r;
       return;
     }
-    const t = $ ? s[0] : s;
+    const t = I ? s[0] : s;
     if (k.length === 0 || t == null) {
-      Y({
+      X({
         diff: "reset"
       });
       return;
     }
-    if (K.current) {
+    if (q.current) {
       if (t != null) {
-        const l = k[z.current];
-        if ($ && l && s.findIndex((c) => W(l, c)) !== -1)
+        const l = k[E.current];
+        if (I && l && s.findIndex((c) => K(l, c)) !== -1)
           return;
-        const p = k.findIndex((c) => W(c, t));
-        p === -1 ? Y({
+        const p = k.findIndex((c) => K(c, t));
+        p === -1 ? X({
           diff: "reset"
-        }) : te({
+        }) : re({
           index: p
         });
         return;
       }
-      if (z.current >= k.length - 1) {
-        te({
+      if (E.current >= k.length - 1) {
+        re({
           index: k.length - 1
         });
         return;
       }
-      te({
-        index: z.current
+      re({
+        index: E.current
       });
     }
   }, [
@@ -282,76 +282,76 @@ function pt(e) {
     k.length,
     // Don't sync the highlighted index with the value when multiple
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    $ ? !1 : s,
-    me,
-    Y,
-    te,
-    j,
-    S,
-    $
-  ]), yo = io((r) => {
-    et(K, r), r && Ke();
+    I ? !1 : s,
+    he,
+    X,
+    re,
+    F,
+    O,
+    I
+  ]), vo = so((r) => {
+    Zo(q, r), r && We();
   });
-  process.env.NODE_ENV !== "production" && b.useEffect(() => {
-    (!R.current || R.current.nodeName !== "INPUT") && (R.current && R.current.nodeName === "TEXTAREA" ? console.warn([`A textarea element was provided to ${C} where input was expected.`, "This is not a supported scenario but it may work under certain conditions.", "A textarea keyboard navigation may conflict with Autocomplete controls (for example enter and arrow keys).", "Make sure to test keyboard navigation and add custom event handlers if necessary."].join(`
-`)) : console.error([`MUI: Unable to find the input element. It was resolved to ${R.current} while an HTMLInputElement was expected.`, `Instead, ${C} expects an input element.`, "", C === "useAutocomplete" ? "Make sure you have bound getInputProps correctly and that the normal ref/effect resolutions order is guaranteed." : "Make sure you have customized the input component correctly."].join(`
+  process.env.NODE_ENV !== "production" && m.useEffect(() => {
+    (!M.current || M.current.nodeName !== "INPUT") && (M.current && M.current.nodeName === "TEXTAREA" ? console.warn([`A textarea element was provided to ${b} where input was expected.`, "This is not a supported scenario but it may work under certain conditions.", "A textarea keyboard navigation may conflict with Autocomplete controls (for example enter and arrow keys).", "Make sure to test keyboard navigation and add custom event handlers if necessary."].join(`
+`)) : console.error([`MUI: Unable to find the input element. It was resolved to ${M.current} while an HTMLInputElement was expected.`, `Instead, ${b} expects an input element.`, "", b === "useAutocomplete" ? "Make sure you have bound getInputProps correctly and that the normal ref/effect resolutions order is guaranteed." : "Make sure you have customized the input component correctly."].join(`
 `)));
-  }, [C]), b.useEffect(() => {
-    Ke();
-  }, [Ke]);
-  const ne = (r) => {
-    se || (Qe(!0), mo(!0), ie && ie(r));
-  }, re = (r, t) => {
-    se && (Qe(!1), _ && _(r, t));
-  }, pe = (r, t, l, p) => {
-    if ($) {
-      if (s.length === t.length && s.every((c, O) => c === t[O]))
+  }, [b]), m.useEffect(() => {
+    We();
+  }, [We]);
+  const ae = (r) => {
+    ce || (Qe(!0), ho(!0), pe && pe(r));
+  }, le = (r, t) => {
+    ce && (Qe(!1), Y && Y(r, t));
+  }, ue = (r, t, l, p) => {
+    if (I) {
+      if (s.length === t.length && s.every((c, $) => c === t[$]))
         return;
     } else if (s === t)
       return;
-    fe && fe(r, t, l, p), Ao(t);
-  }, we = b.useRef(!1), ge = (r, t, l = "selectOption", p = "options") => {
-    let c = l, O = t;
-    if ($) {
-      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 ${C} does not handle the arguments correctly.`, `The component expects a single value to match a given option but found ${B.length} matches.`].join(`
+    ge && ge(r, t, l, p), Ao(t);
+  }, Te = m.useRef(!1), be = (r, t, l = "selectOption", p = "options") => {
+    let c = l, $ = t;
+    if (I) {
+      if ($ = Array.isArray(s) ? s.slice() : [], process.env.NODE_ENV !== "production") {
+        const j = $.filter((Le) => K(t, Le));
+        j.length > 1 && console.error([`MUI: The \`isOptionEqualToValue\` method of ${b} does not handle the arguments correctly.`, `The component expects a single value to match a given option but found ${j.length} matches.`].join(`
 `));
       }
-      const I = O.findIndex((B) => W(t, B));
-      I === -1 ? O.push(t) : p !== "freeSolo" && (O.splice(I, 1), c = "removeOption");
+      const C = $.findIndex((j) => K(t, j));
+      C === -1 ? $.push(t) : p !== "freeSolo" && ($.splice(C, 1), c = "removeOption");
     }
-    Oe(r, O, c), pe(r, O, c, {
+    we(r, $, c), ue(r, $, c, {
       option: t
-    }), !X && (!r || !r.ctrlKey && !r.metaKey) && re(r, c), (x === !0 || x === "touch" && we.current || x === "mouse" && !we.current) && R.current.blur();
+    }), !U && (!r || !r.ctrlKey && !r.metaKey) && le(r, c), (x === !0 || x === "touch" && Te.current || x === "mouse" && !Te.current) && M.current.blur();
   };
-  function Te(r, t) {
+  function ke(r, t) {
     if (r === -1)
       return -1;
     let l = r;
     for (; ; ) {
       if (t === "next" && l === s.length || t === "previous" && l === -1)
         return -1;
-      const p = Ue.querySelector(`[data-tag-index="${l}"]`);
+      const p = je.querySelector(`[data-tag-index="${l}"]`);
       if (!p || !p.hasAttribute("tabindex") || p.disabled || p.getAttribute("aria-disabled") === "true")
         l += t === "next" ? 1 : -1;
       else
         return l;
     }
   }
-  const Ge = (r, t) => {
-    if (!$)
+  const Ke = (r, t) => {
+    if (!I)
       return;
-    S === "" && re(r, "toggleInput");
+    O === "" && le(r, "toggleInput");
     let l = G;
-    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);
+    G === -1 ? O === "" && t === "previous" && (l = s.length - 1) : (l += t === "next" ? 1 : -1, l < 0 && (l = 0), l === s.length && (l = -1)), l = ke(l, t), Xe(l), Pe(l);
   }, oo = (r) => {
-    je.current = !0, $e(""), q && q(r, "", "clear"), pe(r, $ ? [] : null, "clear");
-  }, ke = (r) => (t) => {
-    if (r.onKeyDown && r.onKeyDown(t), !t.defaultMuiPrevented && (G !== -1 && !["ArrowLeft", "ArrowRight"].includes(t.key) && (Xe(-1), Se(-1)), t.which !== 229))
+    Ve.current = !0, $e(""), J && J(r, "", "clear"), ue(r, I ? [] : null, "clear");
+  }, Me = (r) => (t) => {
+    if (r.onKeyDown && r.onKeyDown(t), !t.defaultMuiPrevented && (G !== -1 && !["ArrowLeft", "ArrowRight"].includes(t.key) && (Xe(-1), Pe(-1)), t.which !== 229))
       switch (t.key) {
         case "Home":
-          j && ze && (t.preventDefault(), Y({
+          F && Ne && (t.preventDefault(), X({
             diff: "start",
             direction: "next",
             reason: "keyboard",
@@ -359,7 +359,7 @@ function pt(e) {
           }));
           break;
         case "End":
-          j && ze && (t.preventDefault(), Y({
+          F && Ne && (t.preventDefault(), X({
             diff: "end",
             direction: "previous",
             reason: "keyboard",
@@ -367,161 +367,161 @@ function pt(e) {
           }));
           break;
         case "PageUp":
-          t.preventDefault(), Y({
-            diff: -Fo,
+          t.preventDefault(), X({
+            diff: -zo,
             direction: "previous",
             reason: "keyboard",
             event: t
-          }), ne(t);
+          }), ae(t);
           break;
         case "PageDown":
-          t.preventDefault(), Y({
-            diff: Fo,
+          t.preventDefault(), X({
+            diff: zo,
             direction: "next",
             reason: "keyboard",
             event: t
-          }), ne(t);
+          }), ae(t);
           break;
         case "ArrowDown":
-          t.preventDefault(), Y({
+          t.preventDefault(), X({
             diff: 1,
             direction: "next",
             reason: "keyboard",
             event: t
-          }), ne(t);
+          }), ae(t);
           break;
         case "ArrowUp":
-          t.preventDefault(), Y({
+          t.preventDefault(), X({
             diff: -1,
             direction: "previous",
             reason: "keyboard",
             event: t
-          }), ne(t);
+          }), ae(t);
           break;
         case "ArrowLeft":
-          Ge(t, "previous");
+          Ke(t, "previous");
           break;
         case "ArrowRight":
-          Ge(t, "next");
+          Ke(t, "next");
           break;
         case "Enter":
-          if (z.current !== -1 && j) {
-            const l = k[z.current], p = H ? H(l) : !1;
+          if (E.current !== -1 && F) {
+            const l = k[E.current], p = W ? W(l) : !1;
             if (t.preventDefault(), p)
               return;
-            ge(t, l, "selectOption"), i && R.current.setSelectionRange(R.current.value.length, R.current.value.length);
-          } else le && S !== "" && Pe === !1 && ($ && t.preventDefault(), ge(t, S, "createOption", "freeSolo"));
+            be(t, l, "selectOption"), i && M.current.setSelectionRange(M.current.value.length, M.current.value.length);
+          } else se && O !== "" && Se === !1 && (I && t.preventDefault(), be(t, O, "createOption", "freeSolo"));
           break;
         case "Escape":
-          j ? (t.preventDefault(), t.stopPropagation(), re(t, "escape")) : P && (S !== "" || $ && s.length > 0) && (t.preventDefault(), t.stopPropagation(), oo(t));
+          F ? (t.preventDefault(), t.stopPropagation(), le(t, "escape")) : w && (O !== "" || I && s.length > 0) && (t.preventDefault(), t.stopPropagation(), oo(t));
           break;
         case "Backspace":
-          if ($ && !Ce && S === "" && s.length > 0) {
+          if (I && !Ce && O === "" && s.length > 0) {
             const l = G === -1 ? s.length - 1 : G, p = s.slice();
-            p.splice(l, 1), pe(t, p, "removeOption", {
+            p.splice(l, 1), ue(t, p, "removeOption", {
               option: s[l]
             });
           }
           break;
         case "Delete":
-          if ($ && !Ce && S === "" && s.length > 0 && G !== -1) {
+          if (I && !Ce && O === "" && s.length > 0 && G !== -1) {
             const l = G, p = s.slice();
-            p.splice(l, 1), pe(t, p, "removeOption", {
+            p.splice(l, 1), ue(t, p, "removeOption", {
               option: s[l]
             });
           }
           break;
       }
-  }, vo = (r) => {
-    He(!0), M && !je.current && ne(r);
+  }, xo = (r) => {
+    He(!0), _ && !Ve.current && ae(r);
   }, to = (r) => {
-    if (n(K)) {
-      R.current.focus();
+    if (n(q)) {
+      M.current.focus();
       return;
     }
-    He(!1), Be.current = !0, je.current = !1, h && z.current !== -1 && j ? ge(r, k[z.current], "blur") : h && le && S !== "" ? ge(r, S, "blur", "freeSolo") : y && Oe(r, s, "blur"), re(r, "blur");
+    He(!1), Fe.current = !0, Ve.current = !1, h && E.current !== -1 && F ? be(r, k[E.current], "blur") : h && se && O !== "" ? be(r, O, "blur", "freeSolo") : y && we(r, s, "blur"), le(r, "blur");
   }, Re = (r) => {
     const t = r.target.value;
-    S !== t && ($e(t), mo(!1), q && q(r, t, "input")), t === "" ? !w && !$ && pe(r, null, "clear") : ne(r);
-  }, _e = (r) => {
+    O !== t && ($e(t), ho(!1), J && J(r, t, "input")), t === "" ? !R && !I && ue(r, null, "clear") : ae(r);
+  }, qe = (r) => {
     const t = Number(r.currentTarget.getAttribute("data-option-index"));
-    z.current !== t && te({
+    E.current !== t && re({
       event: r,
       index: t,
       reason: "mouse"
     });
-  }, qe = (r) => {
-    te({
+  }, Ge = (r) => {
+    re({
       event: r,
       index: Number(r.currentTarget.getAttribute("data-option-index")),
       reason: "touch"
-    }), we.current = !0;
-  }, xo = (r) => {
+    }), Te.current = !0;
+  }, Io = (r) => {
     const t = Number(r.currentTarget.getAttribute("data-option-index"));
-    ge(r, k[t], "selectOption"), we.current = !1;
+    be(r, k[t], "selectOption"), Te.current = !1;
   }, Co = (r) => (t) => {
     const l = s.slice();
-    l.splice(r, 1), pe(t, l, "removeOption", {
+    l.splice(r, 1), ue(t, l, "removeOption", {
       option: s[r]
     });
   }, no = (r) => {
-    se ? re(r, "toggleInput") : ne(r);
-  }, Mo = (r) => {
-    r.currentTarget.contains(r.target) && r.target.getAttribute("id") !== U && r.preventDefault();
+    ce ? le(r, "toggleInput") : ae(r);
+  }, _o = (r) => {
+    r.currentTarget.contains(r.target) && r.target.getAttribute("id") !== H && r.preventDefault();
   }, Ye = (r) => {
-    r.currentTarget.contains(r.target) && (R.current.focus(), Fe && Be.current && R.current.selectionEnd - R.current.selectionStart === 0 && R.current.select(), Be.current = !1);
-  }, N = (r) => {
-    !A && (S === "" || !se) && (no(r), r.stopPropagation());
+    r.currentTarget.contains(r.target) && (M.current.focus(), ze && Fe.current && M.current.selectionEnd - M.current.selectionStart === 0 && M.current.select(), Fe.current = !1);
+  }, D = (r) => {
+    !L && (O === "" || !ce) && (no(r), r.stopPropagation());
   };
-  let L = le && S.length > 0;
-  L = L || ($ ? s.length > 0 : s !== null);
-  let ae = k;
-  if (oe) {
+  let A = se && O.length > 0;
+  A = A || (I ? s.length > 0 : s !== null);
+  let ie = k;
+  if (ne) {
     const r = /* @__PURE__ */ new Map();
     let t = !1;
-    ae = k.reduce((l, p, c) => {
-      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 ${C} 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({
+    ie = k.reduce((l, p, c) => {
+      const $ = ne(p);
+      return l.length > 0 && l[l.length - 1].group === $ ? l[l.length - 1].options.push(p) : (process.env.NODE_ENV !== "production" && (r.get($) && !t && (console.warn(`MUI: The options provided combined with the \`groupBy\` method of ${b} returns duplicated headers.`, "You can solve the issue by sorting the options with the output of `groupBy`."), t = !0), r.set($, !0)), l.push({
         key: c,
         index: c,
-        group: O,
+        group: $,
         options: [p]
       })), l;
     }, []);
   }
-  return A && Ie && to(), {
+  return L && Oe && to(), {
     getRootProps: (r = {}) => ({
-      "aria-owns": We ? `${U}-listbox` : null,
+      "aria-owns": Ue ? `${H}-listbox` : null,
       ...r,
-      onKeyDown: ke(r),
-      onMouseDown: Mo,
+      onKeyDown: Me(r),
+      onMouseDown: _o,
       onClick: Ye
     }),
     getInputLabelProps: () => ({
-      id: `${U}-label`,
-      htmlFor: U
+      id: `${H}-label`,
+      htmlFor: H
     }),
     getInputProps: () => ({
-      id: U,
-      value: S,
+      id: H,
+      value: O,
       onBlur: to,
-      onFocus: vo,
+      onFocus: xo,
       onChange: Re,
-      onMouseDown: N,
+      onMouseDown: D,
       // if open then this is handled imperatively so don't let react override
       // only have an opinion about this when closed
-      "aria-activedescendant": j ? "" : null,
+      "aria-activedescendant": F ? "" : null,
       "aria-autocomplete": i ? "both" : "list",
-      "aria-controls": We ? `${U}-listbox` : void 0,
-      "aria-expanded": We,
+      "aria-controls": Ue ? `${H}-listbox` : void 0,
+      "aria-expanded": Ue,
       // Disable browser's suggestion that might overlap with the popup.
       // Handle autocomplete but not autofill.
       autoComplete: "off",
-      ref: R,
+      ref: M,
       autoCapitalize: "none",
       spellCheck: "false",
       role: "combobox",
-      disabled: A
+      disabled: L
     }),
     getClearProps: () => ({
       tabIndex: -1,
@@ -546,9 +546,9 @@ function pt(e) {
     }),
     getListboxProps: () => ({
       role: "listbox",
-      id: `${U}-listbox`,
-      "aria-labelledby": `${U}-label`,
-      ref: yo,
+      id: `${H}-listbox`,
+      "aria-labelledby": `${H}-label`,
+      ref: vo,
       onMouseDown: (r) => {
         r.preventDefault();
       }
@@ -557,38 +557,38 @@ function pt(e) {
       index: r,
       option: t
     }) => {
-      const l = ($ ? s : [s]).some((c) => c != null && W(t, c)), p = H ? H(t) : !1;
+      const l = (I ? s : [s]).some((c) => c != null && K(t, c)), p = W ? W(t) : !1;
       return {
-        key: (he == null ? void 0 : he(t)) ?? D(t),
+        key: (ye == null ? void 0 : ye(t)) ?? B(t),
         tabIndex: -1,
         role: "option",
-        id: `${U}-option-${r}`,
-        onMouseMove: _e,
-        onClick: xo,
-        onTouchStart: qe,
+        id: `${H}-option-${r}`,
+        onMouseMove: qe,
+        onClick: Io,
+        onTouchStart: Ge,
         "data-option-index": r,
         "aria-disabled": p,
         "aria-selected": l
       };
     },
-    id: U,
-    inputValue: S,
+    id: H,
+    inputValue: O,
     value: s,
-    dirty: L,
-    expanded: j && Ue,
-    popupOpen: j,
-    focused: Ie || G !== -1,
-    anchorEl: Ue,
+    dirty: A,
+    expanded: F && je,
+    popupOpen: F,
+    focused: Oe || G !== -1,
+    anchorEl: je,
     setAnchorEl: Lo,
     focusedTag: G,
-    groupedOptions: ae
+    groupedOptions: ie
   };
 }
-function ct(e) {
-  return po("MuiListSubheader", e);
+function pt(e) {
+  return co("MuiListSubheader", e);
 }
-co("MuiListSubheader", ["root", "colorPrimary", "colorInherit", "gutters", "inset", "sticky"]);
-const ut = (e) => {
+uo("MuiListSubheader", ["root", "colorPrimary", "colorInherit", "gutters", "inset", "sticky"]);
+const ct = (e) => {
   const {
     classes: n,
     color: a,
@@ -598,8 +598,8 @@ const ut = (e) => {
   } = e, x = {
     root: ["root", a !== "default" && `color${d(a)}`, !i && "gutters", g && "inset", !h && "sticky"]
   };
-  return fo(x, ct, n);
-}, dt = F("li", {
+  return go(x, pt, n);
+}, ut = V("li", {
   name: "MuiListSubheader",
   slot: "Root",
   overridesResolver: (e, n) => {
@@ -608,7 +608,7 @@ const ut = (e) => {
     } = e;
     return [n.root, a.color !== "default" && n[`color${d(a.color)}`], !a.disableGutters && n.gutters, a.inset && n.inset, !a.disableSticky && n.sticky];
   }
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   boxSizing: "border-box",
@@ -658,8 +658,8 @@ const ut = (e) => {
       backgroundColor: (e.vars || e).palette.background.paper
     }
   }]
-}))), so = /* @__PURE__ */ b.forwardRef(function(n, a) {
-  const i = uo({
+}))), po = /* @__PURE__ */ m.forwardRef(function(n, a) {
+  const i = fo({
     props: n,
     name: "MuiListSubheader"
   }), {
@@ -667,27 +667,27 @@ const ut = (e) => {
     color: h = "default",
     component: x = "li",
     disableGutters: y = !1,
-    disableSticky: P = !1,
-    inset: C = !1,
-    ...m
-  } = i, w = {
+    disableSticky: w = !1,
+    inset: b = !1,
+    ...P
+  } = i, R = {
     ...i,
     color: h,
     component: x,
     disableGutters: y,
-    disableSticky: P,
-    inset: C
-  }, X = ut(w);
-  return /* @__PURE__ */ T(dt, {
+    disableSticky: w,
+    inset: b
+  }, U = ct(R);
+  return /* @__PURE__ */ S(ut, {
     as: x,
-    className: J(X.root, g),
+    className: Q(U.root, g),
     ref: a,
-    ownerState: w,
-    ...m
+    ownerState: R,
+    ...P
   });
 });
-so && (so.muiSkipListHighlight = !0);
-process.env.NODE_ENV !== "production" && (so.propTypes = {
+po && (po.muiSkipListHighlight = !0);
+process.env.NODE_ENV !== "production" && (po.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -734,10 +734,10 @@ process.env.NODE_ENV !== "production" && (so.propTypes = {
    */
   sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
 });
-function ft(e) {
-  return po("MuiIconButton", e);
+function dt(e) {
+  return co("MuiIconButton", e);
 }
-const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorError", "colorInfo", "colorSuccess", "colorWarning", "edgeStart", "edgeEnd", "sizeSmall", "sizeMedium", "sizeLarge"]), bt = (e) => {
+const ft = uo("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorError", "colorInfo", "colorSuccess", "colorWarning", "edgeStart", "edgeEnd", "sizeSmall", "sizeMedium", "sizeLarge"]), gt = (e) => {
   const {
     classes: n,
     disabled: a,
@@ -747,8 +747,8 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
   } = e, x = {
     root: ["root", a && "disabled", i !== "default" && `color${d(i)}`, g && `edge${d(g)}`, `size${d(h)}`]
   };
-  return fo(x, ft, n);
-}, mt = F(So, {
+  return go(x, dt, n);
+}, bt = V(Po, {
   name: "MuiIconButton",
   slot: "Root",
   overridesResolver: (e, n) => {
@@ -757,7 +757,7 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
     } = e;
     return [n.root, a.color !== "default" && n[`color${d(a.color)}`], a.edge && n[`edge${d(a.edge)}`], n[`size${d(a.size)}`]];
   }
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   textAlign: "center",
@@ -775,7 +775,7 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
     },
     style: {
       "&:hover": {
-        backgroundColor: e.vars ? `rgba(${e.vars.palette.action.activeChannel} / ${e.vars.palette.action.hoverOpacity})` : V(e.palette.action.active, e.palette.action.hoverOpacity),
+        backgroundColor: e.vars ? `rgba(${e.vars.palette.action.activeChannel} / ${e.vars.palette.action.hoverOpacity})` : z(e.palette.action.active, e.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         "@media (hover: none)": {
           backgroundColor: "transparent"
@@ -813,7 +813,7 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
       marginRight: -3
     }
   }]
-})), ee(({
+})), oe(({
   theme: e
 }) => ({
   variants: [{
@@ -823,21 +823,21 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
     style: {
       color: "inherit"
     }
-  }, ...Object.entries(e.palette).filter(Me()).map(([n]) => ({
+  }, ...Object.entries(e.palette).filter(_e()).map(([n]) => ({
     props: {
       color: n
     },
     style: {
       color: (e.vars || e).palette[n].main
     }
-  })), ...Object.entries(e.palette).filter(Me()).map(([n]) => ({
+  })), ...Object.entries(e.palette).filter(_e()).map(([n]) => ({
     props: {
       color: n,
       disableRipple: !1
     },
     style: {
       "&:hover": {
-        backgroundColor: e.vars ? `rgba(${(e.vars || e).palette[n].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : V((e.vars || e).palette[n].main, e.palette.action.hoverOpacity),
+        backgroundColor: e.vars ? `rgba(${(e.vars || e).palette[n].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : z((e.vars || e).palette[n].main, e.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         "@media (hover: none)": {
           backgroundColor: "transparent"
@@ -861,12 +861,12 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
       fontSize: e.typography.pxToRem(28)
     }
   }],
-  [`&.${gt.disabled}`]: {
+  [`&.${ft.disabled}`]: {
     backgroundColor: "transparent",
     color: (e.vars || e).palette.action.disabled
   }
-}))), ko = /* @__PURE__ */ b.forwardRef(function(n, a) {
-  const i = uo({
+}))), Mo = /* @__PURE__ */ m.forwardRef(function(n, a) {
+  const i = fo({
     props: n,
     name: "MuiIconButton"
   }), {
@@ -874,33 +874,33 @@ const gt = co("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimar
     children: h,
     className: x,
     color: y = "default",
-    disabled: P = !1,
-    disableFocusRipple: C = !1,
-    disableRipple: m = !1,
-    size: w = "medium",
-    ...X
-  } = i, A = {
+    disabled: w = !1,
+    disableFocusRipple: b = !1,
+    disableRipple: P = !1,
+    size: R = "medium",
+    ...U
+  } = i, L = {
     ...i,
     edge: g,
     color: y,
-    disabled: P,
-    disableFocusRipple: C,
-    disableRipple: m,
-    size: w
-  }, E = bt(A);
-  return /* @__PURE__ */ T(mt, {
-    className: J(E.root, x),
+    disabled: w,
+    disableFocusRipple: b,
+    disableRipple: P,
+    size: R
+  }, T = gt(L);
+  return /* @__PURE__ */ S(bt, {
+    className: Q(T.root, x),
     centerRipple: !0,
-    focusRipple: !C,
-    disabled: P,
-    disableRipple: m,
+    focusRipple: !b,
+    disabled: w,
+    disableRipple: P,
     ref: a,
-    ...X,
-    ownerState: A,
+    ...U,
+    ownerState: L,
     children: h
   });
 });
-process.env.NODE_ENV !== "production" && (ko.propTypes = {
+process.env.NODE_ENV !== "production" && (Mo.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -908,7 +908,7 @@ process.env.NODE_ENV !== "production" && (ko.propTypes = {
   /**
    * The icon to display.
    */
-  children: wo(o.node, (e) => b.Children.toArray(e.children).some((a) => /* @__PURE__ */ b.isValidElement(a) && a.props.onClick) ? new Error(["MUI: You are providing an onClick event listener to a child of a button element.", "Prefer applying it to the IconButton directly.", "This guarantees that the whole <button> will be responsive to click events."].join(`
+  children: To(o.node, (e) => m.Children.toArray(e.children).some((a) => /* @__PURE__ */ m.isValidElement(a) && a.props.onClick) ? new Error(["MUI: You are providing an onClick event listener to a child of a button element.", "Prefer applying it to the IconButton directly.", "This guarantees that the whole <button> will be responsive to click events."].join(`
 `)) : null),
   /**
    * Override or extend the styles applied to the component.
@@ -962,13 +962,13 @@ process.env.NODE_ENV !== "production" && (ko.propTypes = {
    */
   sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
 });
-const ht = Ho(/* @__PURE__ */ T("path", {
+const mt = Uo(/* @__PURE__ */ S("path", {
   d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
 }), "Cancel");
-function yt(e) {
-  return po("MuiChip", e);
+function ht(e) {
+  return co("MuiChip", e);
 }
-const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colorError", "colorInfo", "colorPrimary", "colorSecondary", "colorSuccess", "colorWarning", "disabled", "clickable", "clickableColorPrimary", "clickableColorSecondary", "deletable", "deletableColorPrimary", "deletableColorSecondary", "outlined", "filled", "outlinedPrimary", "outlinedSecondary", "filledPrimary", "filledSecondary", "avatar", "avatarSmall", "avatarMedium", "avatarColorPrimary", "avatarColorSecondary", "icon", "iconSmall", "iconMedium", "iconColorPrimary", "iconColorSecondary", "label", "labelSmall", "labelMedium", "deleteIcon", "deleteIconSmall", "deleteIconMedium", "deleteIconColorPrimary", "deleteIconColorSecondary", "deleteIconOutlinedColorPrimary", "deleteIconOutlinedColorSecondary", "deleteIconFilledColorPrimary", "deleteIconFilledColorSecondary", "focusVisible"]), vt = (e) => {
+const f = uo("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "colorError", "colorInfo", "colorPrimary", "colorSecondary", "colorSuccess", "colorWarning", "disabled", "clickable", "clickableColorPrimary", "clickableColorSecondary", "deletable", "deletableColorPrimary", "deletableColorSecondary", "outlined", "filled", "outlinedPrimary", "outlinedSecondary", "filledPrimary", "filledSecondary", "avatar", "avatarSmall", "avatarMedium", "avatarColorPrimary", "avatarColorSecondary", "icon", "iconSmall", "iconMedium", "iconColorPrimary", "iconColorSecondary", "label", "labelSmall", "labelMedium", "deleteIcon", "deleteIconSmall", "deleteIconMedium", "deleteIconColorPrimary", "deleteIconColorSecondary", "deleteIconOutlinedColorPrimary", "deleteIconOutlinedColorSecondary", "deleteIconFilledColorPrimary", "deleteIconFilledColorSecondary", "focusVisible"]), yt = (e) => {
   const {
     classes: n,
     disabled: a,
@@ -977,16 +977,16 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
     iconColor: h,
     onDelete: x,
     clickable: y,
-    variant: P
-  } = e, C = {
-    root: ["root", P, a && "disabled", `size${d(i)}`, `color${d(g)}`, y && "clickable", y && `clickableColor${d(g)}`, x && "deletable", x && `deletableColor${d(g)}`, `${P}${d(g)}`],
+    variant: w
+  } = e, b = {
+    root: ["root", w, a && "disabled", `size${d(i)}`, `color${d(g)}`, y && "clickable", y && `clickableColor${d(g)}`, x && "deletable", x && `deletableColor${d(g)}`, `${w}${d(g)}`],
     label: ["label", `label${d(i)}`],
     avatar: ["avatar", `avatar${d(i)}`, `avatarColor${d(g)}`],
     icon: ["icon", `icon${d(i)}`, `iconColor${d(h)}`],
-    deleteIcon: ["deleteIcon", `deleteIcon${d(i)}`, `deleteIconColor${d(g)}`, `deleteIcon${d(P)}Color${d(g)}`]
+    deleteIcon: ["deleteIcon", `deleteIcon${d(i)}`, `deleteIconColor${d(g)}`, `deleteIcon${d(w)}Color${d(g)}`]
   };
-  return fo(C, yt, n);
-}, xt = F("div", {
+  return go(b, ht, n);
+}, vt = V("div", {
   name: "MuiChip",
   slot: "Root",
   overridesResolver: (e, n) => {
@@ -998,7 +998,7 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
       clickable: h,
       onDelete: x,
       size: y,
-      variant: P
+      variant: w
     } = a;
     return [{
       [`& .${f.avatar}`]: n.avatar
@@ -1019,10 +1019,10 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
     }, {
       [`& .${f.deleteIcon}`]: n[`deleteIconColor${d(i)}`]
     }, {
-      [`& .${f.deleteIcon}`]: n[`deleteIcon${d(P)}Color${d(i)}`]
-    }, n.root, n[`size${d(y)}`], n[`color${d(i)}`], h && n.clickable, h && i !== "default" && n[`clickableColor${d(i)})`], x && n.deletable, x && i !== "default" && n[`deletableColor${d(i)}`], n[P], n[`${P}${d(i)}`]];
+      [`& .${f.deleteIcon}`]: n[`deleteIcon${d(w)}Color${d(i)}`]
+    }, n.root, n[`size${d(y)}`], n[`color${d(i)}`], h && n.clickable, h && i !== "default" && n[`clickableColor${d(i)})`], x && n.deletable, x && i !== "default" && n[`deletableColor${d(i)}`], n[w], n[`${w}${d(i)}`]];
   }
-})(ee(({
+})(oe(({
   theme: e
 }) => {
   const n = e.palette.mode === "light" ? e.palette.grey[700] : e.palette.grey[300];
@@ -1083,12 +1083,12 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
     },
     [`& .${f.deleteIcon}`]: {
       WebkitTapHighlightColor: "transparent",
-      color: e.vars ? `rgba(${e.vars.palette.text.primaryChannel} / 0.26)` : V(e.palette.text.primary, 0.26),
+      color: e.vars ? `rgba(${e.vars.palette.text.primaryChannel} / 0.26)` : z(e.palette.text.primary, 0.26),
       fontSize: 22,
       cursor: "pointer",
       margin: "0 5px 0 -6px",
       "&:hover": {
-        color: e.vars ? `rgba(${e.vars.palette.text.primaryChannel} / 0.4)` : V(e.palette.text.primary, 0.4)
+        color: e.vars ? `rgba(${e.vars.palette.text.primaryChannel} / 0.4)` : z(e.palette.text.primary, 0.4)
       }
     },
     variants: [{
@@ -1108,7 +1108,7 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
           marginLeft: -4
         }
       }
-    }, ...Object.entries(e.palette).filter(Me(["contrastText"])).map(([a]) => ({
+    }, ...Object.entries(e.palette).filter(_e(["contrastText"])).map(([a]) => ({
       props: {
         color: a
       },
@@ -1116,7 +1116,7 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
         backgroundColor: (e.vars || e).palette[a].main,
         color: (e.vars || e).palette[a].contrastText,
         [`& .${f.deleteIcon}`]: {
-          color: e.vars ? `rgba(${e.vars.palette[a].contrastTextChannel} / 0.7)` : V(e.palette[a].contrastText, 0.7),
+          color: e.vars ? `rgba(${e.vars.palette[a].contrastTextChannel} / 0.7)` : z(e.palette[a].contrastText, 0.7),
           "&:hover, &:active": {
             color: (e.vars || e).palette[a].contrastText
           }
@@ -1142,10 +1142,10 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
       },
       style: {
         [`&.${f.focusVisible}`]: {
-          backgroundColor: e.vars ? `rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : V(e.palette.action.selected, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
+          backgroundColor: e.vars ? `rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : z(e.palette.action.selected, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
         }
       }
-    }, ...Object.entries(e.palette).filter(Me(["dark"])).map(([a]) => ({
+    }, ...Object.entries(e.palette).filter(_e(["dark"])).map(([a]) => ({
       props: {
         color: a,
         onDelete: !0
@@ -1164,16 +1164,16 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
         WebkitTapHighlightColor: "transparent",
         cursor: "pointer",
         "&:hover": {
-          backgroundColor: e.vars ? `rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))` : V(e.palette.action.selected, e.palette.action.selectedOpacity + e.palette.action.hoverOpacity)
+          backgroundColor: e.vars ? `rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))` : z(e.palette.action.selected, e.palette.action.selectedOpacity + e.palette.action.hoverOpacity)
         },
         [`&.${f.focusVisible}`]: {
-          backgroundColor: e.vars ? `rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : V(e.palette.action.selected, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
+          backgroundColor: e.vars ? `rgba(${e.vars.palette.action.selectedChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : z(e.palette.action.selected, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
         },
         "&:active": {
           boxShadow: (e.vars || e).shadows[1]
         }
       }
-    }, ...Object.entries(e.palette).filter(Me(["dark"])).map(([a]) => ({
+    }, ...Object.entries(e.palette).filter(_e(["dark"])).map(([a]) => ({
       props: {
         color: a,
         clickable: !0
@@ -1215,22 +1215,22 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
           marginRight: 3
         }
       }
-    }, ...Object.entries(e.palette).filter(Me()).map(([a]) => ({
+    }, ...Object.entries(e.palette).filter(_e()).map(([a]) => ({
       props: {
         variant: "outlined",
         color: a
       },
       style: {
         color: (e.vars || e).palette[a].main,
-        border: `1px solid ${e.vars ? `rgba(${e.vars.palette[a].mainChannel} / 0.7)` : V(e.palette[a].main, 0.7)}`,
+        border: `1px solid ${e.vars ? `rgba(${e.vars.palette[a].mainChannel} / 0.7)` : z(e.palette[a].main, 0.7)}`,
         [`&.${f.clickable}:hover`]: {
-          backgroundColor: e.vars ? `rgba(${e.vars.palette[a].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : V(e.palette[a].main, e.palette.action.hoverOpacity)
+          backgroundColor: e.vars ? `rgba(${e.vars.palette[a].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : z(e.palette[a].main, e.palette.action.hoverOpacity)
         },
         [`&.${f.focusVisible}`]: {
-          backgroundColor: e.vars ? `rgba(${e.vars.palette[a].mainChannel} / ${e.vars.palette.action.focusOpacity})` : V(e.palette[a].main, e.palette.action.focusOpacity)
+          backgroundColor: e.vars ? `rgba(${e.vars.palette[a].mainChannel} / ${e.vars.palette.action.focusOpacity})` : z(e.palette[a].main, e.palette.action.focusOpacity)
         },
         [`& .${f.deleteIcon}`]: {
-          color: e.vars ? `rgba(${e.vars.palette[a].mainChannel} / 0.7)` : V(e.palette[a].main, 0.7),
+          color: e.vars ? `rgba(${e.vars.palette[a].mainChannel} / 0.7)` : z(e.palette[a].main, 0.7),
           "&:hover, &:active": {
             color: (e.vars || e).palette[a].main
           }
@@ -1238,7 +1238,7 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
       }
     }))]
   };
-})), Ct = F("span", {
+})), xt = V("span", {
   name: "MuiChip",
   slot: "Label",
   overridesResolver: (e, n) => {
@@ -1282,11 +1282,11 @@ const f = co("MuiChip", ["root", "sizeSmall", "sizeMedium", "colorDefault", "col
     }
   }]
 });
-function jo(e) {
+function Vo(e) {
   return e.key === "Backspace" || e.key === "Delete";
 }
-const Go = /* @__PURE__ */ b.forwardRef(function(n, a) {
-  const i = uo({
+const qo = /* @__PURE__ */ m.forwardRef(function(n, a) {
+  const i = fo({
     props: n,
     name: "MuiChip"
   }), {
@@ -1294,79 +1294,79 @@ const Go = /* @__PURE__ */ b.forwardRef(function(n, a) {
     className: h,
     clickable: x,
     color: y = "default",
-    component: P,
-    deleteIcon: C,
-    disabled: m = !1,
-    icon: w,
-    label: X,
-    onClick: A,
-    onDelete: E,
-    onKeyDown: ue,
-    onKeyUp: Ne,
-    size: me = "medium",
-    variant: le = "filled",
-    tabIndex: H,
-    skipFocusWhenDisabled: he = !1,
+    component: w,
+    deleteIcon: b,
+    disabled: P = !1,
+    icon: R,
+    label: U,
+    onClick: L,
+    onDelete: T,
+    onKeyDown: N,
+    onKeyUp: te,
+    size: he = "medium",
+    variant: se = "filled",
+    tabIndex: W,
+    skipFocusWhenDisabled: ye = !1,
     // TODO v6: Rename to `focusableWhenDisabled`.
-    ...Ee
-  } = i, oe = b.useRef(null), ze = ot(oe, a), Ve = (M) => {
-    M.stopPropagation(), E && E(M);
-  }, de = (M) => {
-    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 : P || "div", fe = {
+    ...De
+  } = i, ne = m.useRef(null), Ne = et(ne, a), Ee = (_) => {
+    _.stopPropagation(), T && T(_);
+  }, fe = (_) => {
+    _.currentTarget === _.target && Vo(_) && _.preventDefault(), N && N(_);
+  }, ve = (_) => {
+    _.currentTarget === _.target && T && Vo(_) && T(_), te && te(_);
+  }, K = x !== !1 && L ? !0 : x, I = K || T ? Po : w || "div", ge = {
     ...i,
-    component: $,
-    disabled: m,
-    size: me,
+    component: I,
+    disabled: P,
+    size: he,
     color: y,
-    iconColor: /* @__PURE__ */ b.isValidElement(w) && w.props.color || y,
-    onDelete: !!E,
-    clickable: W,
-    variant: le
-  }, _ = vt(fe), ve = $ === So ? {
-    component: P || "div",
-    focusVisibleClassName: _.focusVisible,
-    ...E && {
+    iconColor: /* @__PURE__ */ m.isValidElement(R) && R.props.color || y,
+    onDelete: !!T,
+    clickable: K,
+    variant: se
+  }, Y = yt(ge), xe = I === Po ? {
+    component: w || "div",
+    focusVisibleClassName: Y.focusVisible,
+    ...T && {
       disableRipple: !0
     }
   } : {};
-  let q = null;
-  E && (q = C && /* @__PURE__ */ b.isValidElement(C) ? /* @__PURE__ */ b.cloneElement(C, {
-    className: J(C.props.className, _.deleteIcon),
-    onClick: Ve
-  }) : /* @__PURE__ */ T(ht, {
-    className: J(_.deleteIcon),
-    onClick: Ve
+  let J = null;
+  T && (J = b && /* @__PURE__ */ m.isValidElement(b) ? /* @__PURE__ */ m.cloneElement(b, {
+    className: Q(b.props.className, Y.deleteIcon),
+    onClick: Ee
+  }) : /* @__PURE__ */ S(mt, {
+    className: Q(Y.deleteIcon),
+    onClick: Ee
   }));
-  let ie = null;
-  g && /* @__PURE__ */ b.isValidElement(g) && (ie = /* @__PURE__ */ b.cloneElement(g, {
-    className: J(_.avatar, g.props.className)
+  let pe = null;
+  g && /* @__PURE__ */ m.isValidElement(g) && (pe = /* @__PURE__ */ m.cloneElement(g, {
+    className: Q(Y.avatar, g.props.className)
   }));
-  let xe = null;
-  return w && /* @__PURE__ */ b.isValidElement(w) && (xe = /* @__PURE__ */ b.cloneElement(w, {
-    className: J(_.icon, w.props.className)
-  })), 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(xt, {
-    as: $,
-    className: J(_.root, h),
-    disabled: W && m ? !0 : void 0,
-    onClick: A,
-    onKeyDown: de,
-    onKeyUp: ye,
-    ref: ze,
-    tabIndex: he && m ? -1 : H,
-    ownerState: fe,
-    ...ve,
-    ...Ee,
-    children: [ie || xe, /* @__PURE__ */ T(Ct, {
-      className: J(_.label),
-      ownerState: fe,
-      children: X
-    }), q]
+  let Ie = null;
+  return R && /* @__PURE__ */ m.isValidElement(R) && (Ie = /* @__PURE__ */ m.cloneElement(R, {
+    className: Q(Y.icon, R.props.className)
+  })), process.env.NODE_ENV !== "production" && pe && Ie && console.error("MUI: The Chip component can not handle the avatar and the icon prop at the same time. Pick one."), /* @__PURE__ */ Be(vt, {
+    as: I,
+    className: Q(Y.root, h),
+    disabled: K && P ? !0 : void 0,
+    onClick: L,
+    onKeyDown: fe,
+    onKeyUp: ve,
+    ref: Ne,
+    tabIndex: ye && P ? -1 : W,
+    ownerState: ge,
+    ...xe,
+    ...De,
+    children: [pe || Ie, /* @__PURE__ */ S(xt, {
+      className: Q(Y.label),
+      ownerState: ge,
+      children: U
+    }), J]
   });
 });
-process.env.NODE_ENV !== "production" && (Go.propTypes = {
+process.env.NODE_ENV !== "production" && (qo.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -1379,7 +1379,7 @@ process.env.NODE_ENV !== "production" && (Go.propTypes = {
    * This prop isn't supported.
    * Use the `component` prop if you need to change the children structure.
    */
-  children: nt,
+  children: tt,
   /**
    * Override or extend the styles applied to the component.
    */
@@ -1468,15 +1468,15 @@ process.env.NODE_ENV !== "production" && (Go.propTypes = {
    */
   variant: o.oneOfType([o.oneOf(["filled", "outlined"]), o.string])
 });
-const $t = Ho(/* @__PURE__ */ T("path", {
+const It = Uo(/* @__PURE__ */ S("path", {
   d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
 }), "Close");
-function It(e) {
-  return po("MuiAutocomplete", e);
+function Ct(e) {
+  return co("MuiAutocomplete", e);
 }
-const u = co("MuiAutocomplete", ["root", "expanded", "fullWidth", "focused", "focusVisible", "tag", "tagSizeSmall", "tagSizeMedium", "hasPopupIcon", "hasClearIcon", "inputRoot", "input", "inputFocused", "endAdornment", "clearIndicator", "popupIndicator", "popupIndicatorOpen", "popper", "popperDisablePortal", "paper", "listbox", "loading", "noOptions", "option", "groupLabel", "groupUl"]);
-var Bo, Uo;
-const Ot = (e) => {
+const u = uo("MuiAutocomplete", ["root", "expanded", "fullWidth", "focused", "focusVisible", "tag", "tagSizeSmall", "tagSizeMedium", "hasPopupIcon", "hasClearIcon", "inputRoot", "input", "inputFocused", "endAdornment", "clearIndicator", "popupIndicator", "popupIndicatorOpen", "popper", "popperDisablePortal", "paper", "listbox", "loading", "noOptions", "option", "groupLabel", "groupUl"]);
+var Fo, jo;
+const $t = (e) => {
   const {
     classes: n,
     disablePortal: a,
@@ -1485,17 +1485,17 @@ const Ot = (e) => {
     fullWidth: h,
     hasClearIcon: x,
     hasPopupIcon: y,
-    inputFocused: P,
-    popupOpen: C,
-    size: m
-  } = e, w = {
+    inputFocused: w,
+    popupOpen: b,
+    size: P
+  } = e, R = {
     root: ["root", i && "expanded", g && "focused", h && "fullWidth", x && "hasClearIcon", y && "hasPopupIcon"],
     inputRoot: ["inputRoot"],
-    input: ["input", P && "inputFocused"],
-    tag: ["tag", `tagSize${d(m)}`],
+    input: ["input", w && "inputFocused"],
+    tag: ["tag", `tagSize${d(P)}`],
     endAdornment: ["endAdornment"],
     clearIndicator: ["clearIndicator"],
-    popupIndicator: ["popupIndicator", C && "popupIndicatorOpen"],
+    popupIndicator: ["popupIndicator", b && "popupIndicatorOpen"],
     popper: ["popper", a && "popperDisablePortal"],
     paper: ["paper"],
     listbox: ["listbox"],
@@ -1505,8 +1505,8 @@ const Ot = (e) => {
     groupLabel: ["groupLabel"],
     groupUl: ["groupUl"]
   };
-  return fo(w, It, n);
-}, Pt = F("div", {
+  return go(R, Ct, n);
+}, Ot = V("div", {
   name: "MuiAutocomplete",
   slot: "Root",
   overridesResolver: (e, n) => {
@@ -1557,18 +1557,18 @@ const Ot = (e) => {
       minWidth: 30
     }
   },
-  [`& .${Io.root}`]: {
+  [`& .${Oo.root}`]: {
     paddingBottom: 1,
     "& .MuiInput-input": {
       padding: "4px 4px 4px 0px"
     }
   },
-  [`& .${Io.root}.${be.sizeSmall}`]: {
-    [`& .${Io.input}`]: {
+  [`& .${Oo.root}.${me.sizeSmall}`]: {
+    [`& .${Oo.input}`]: {
       padding: "2px 4px 3px 0"
     }
   },
-  [`& .${Eo.root}`]: {
+  [`& .${Do.root}`]: {
     padding: 9,
     [`.${u.hasPopupIcon}&, .${u.hasClearIcon}&`]: {
       paddingRight: 39
@@ -1583,7 +1583,7 @@ const Ot = (e) => {
       right: 9
     }
   },
-  [`& .${Eo.root}.${be.sizeSmall}`]: {
+  [`& .${Do.root}.${me.sizeSmall}`]: {
     // Don't specify paddingRight, as it overrides the default value set when there is only
     // one of the popup or clear icon as the specificity is equal so the latter one wins
     paddingTop: 6,
@@ -1609,16 +1609,16 @@ const Ot = (e) => {
       right: 9
     }
   },
-  [`& .${Ae.root}.${be.sizeSmall}`]: {
+  [`& .${Ae.root}.${me.sizeSmall}`]: {
     paddingBottom: 1,
     [`& .${Ae.input}`]: {
       padding: "2.5px 4px"
     }
   },
-  [`& .${be.hiddenLabel}`]: {
+  [`& .${me.hiddenLabel}`]: {
     paddingTop: 8
   },
-  [`& .${Ae.root}.${be.hiddenLabel}`]: {
+  [`& .${Ae.root}.${me.hiddenLabel}`]: {
     paddingTop: 0,
     paddingBottom: 0,
     [`& .${u.input}`]: {
@@ -1626,7 +1626,7 @@ const Ot = (e) => {
       paddingBottom: 17
     }
   },
-  [`& .${Ae.root}.${be.hiddenLabel}.${be.sizeSmall}`]: {
+  [`& .${Ae.root}.${me.hiddenLabel}.${me.sizeSmall}`]: {
     [`& .${u.input}`]: {
       paddingTop: 8,
       paddingBottom: 9
@@ -1673,7 +1673,7 @@ const Ot = (e) => {
       }
     }
   }]
-}), St = F("div", {
+}), wt = V("div", {
   name: "MuiAutocomplete",
   slot: "EndAdornment",
   overridesResolver: (e, n) => n.endAdornment
@@ -1683,7 +1683,7 @@ const Ot = (e) => {
   right: 0,
   top: "50%",
   transform: "translate(0, -50%)"
-}), wt = F(ko, {
+}), St = V(Mo, {
   name: "MuiAutocomplete",
   slot: "ClearIndicator",
   overridesResolver: (e, n) => n.clearIndicator
@@ -1691,7 +1691,7 @@ const Ot = (e) => {
   marginRight: -2,
   padding: 4,
   visibility: "hidden"
-}), Tt = F(ko, {
+}), Pt = V(Mo, {
   name: "MuiAutocomplete",
   slot: "PopupIndicator",
   overridesResolver: ({
@@ -1711,7 +1711,7 @@ const Ot = (e) => {
       transform: "rotate(180deg)"
     }
   }]
-}), kt = F(Wo, {
+}), Tt = V(Wo, {
   name: "MuiAutocomplete",
   slot: "Popper",
   overridesResolver: (e, n) => {
@@ -1722,7 +1722,7 @@ const Ot = (e) => {
       [`& .${u.option}`]: n.option
     }, n.popper, a.disablePortal && n.popperDisablePortal];
   }
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   zIndex: (e.vars || e).zIndex.modal,
@@ -1734,38 +1734,38 @@ const Ot = (e) => {
       position: "absolute"
     }
   }]
-}))), Rt = F(Ko, {
+}))), kt = V(Ko, {
   name: "MuiAutocomplete",
   slot: "Paper",
   overridesResolver: (e, n) => n.paper
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   ...e.typography.body1,
   overflow: "auto"
-}))), Lt = F("div", {
+}))), Mt = V("div", {
   name: "MuiAutocomplete",
   slot: "Loading",
   overridesResolver: (e, n) => n.loading
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   color: (e.vars || e).palette.text.secondary,
   padding: "14px 16px"
-}))), At = F("div", {
+}))), Rt = V("div", {
   name: "MuiAutocomplete",
   slot: "NoOptions",
   overridesResolver: (e, n) => n.noOptions
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   color: (e.vars || e).palette.text.secondary,
   padding: "14px 16px"
-}))), Mt = F("div", {
+}))), Lt = V("div", {
   name: "MuiAutocomplete",
   slot: "Listbox",
   overridesResolver: (e, n) => n.listbox
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   listStyle: "none",
@@ -1806,29 +1806,29 @@ const Ot = (e) => {
       backgroundColor: (e.vars || e).palette.action.focus
     },
     '&[aria-selected="true"]': {
-      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})` : V(e.palette.primary.main, e.palette.action.selectedOpacity),
+      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})` : z(e.palette.primary.main, e.palette.action.selectedOpacity),
       [`&.${u.focused}`]: {
-        backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))` : V(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.hoverOpacity),
+        backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))` : z(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.hoverOpacity),
         // Reset on touch devices, it doesn't add specificity
         "@media (hover: none)": {
           backgroundColor: (e.vars || e).palette.action.selected
         }
       },
       [`&.${u.focusVisible}`]: {
-        backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : V(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
+        backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : z(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
       }
     }
   }
-}))), Dt = F(so, {
+}))), At = V(po, {
   name: "MuiAutocomplete",
   slot: "GroupLabel",
   overridesResolver: (e, n) => n.groupLabel
-})(ee(({
+})(oe(({
   theme: e
 }) => ({
   backgroundColor: (e.vars || e).palette.background.paper,
   top: -8
-}))), Nt = F("ul", {
+}))), _t = V("ul", {
   name: "MuiAutocomplete",
   slot: "GroupUl",
   overridesResolver: (e, n) => n.groupUl
@@ -1837,8 +1837,8 @@ const Ot = (e) => {
   [`& .${u.option}`]: {
     paddingLeft: 24
   }
-}), To = /* @__PURE__ */ b.forwardRef(function(n, a) {
-  const i = uo({
+}), ko = /* @__PURE__ */ m.forwardRef(function(n, a) {
+  const i = fo({
     props: n,
     name: "MuiAutocomplete"
   }), {
@@ -1846,293 +1846,293 @@ const Ot = (e) => {
     autoHighlight: h = !1,
     autoSelect: x = !1,
     blurOnSelect: y = !1,
-    ChipProps: P,
-    className: C,
-    clearIcon: m = Bo || (Bo = /* @__PURE__ */ T($t, {
+    ChipProps: w,
+    className: b,
+    clearIcon: P = Fo || (Fo = /* @__PURE__ */ S(It, {
       fontSize: "small"
     })),
-    clearOnBlur: w = !i.freeSolo,
-    clearOnEscape: X = !1,
-    clearText: A = "Clear",
-    closeText: E = "Close",
-    componentsProps: ue,
-    defaultValue: Ne = i.multiple ? [] : null,
-    disableClearable: me = !1,
-    disableCloseOnSelect: le = !1,
-    disabled: H = !1,
-    disabledItemsFocusable: he = !1,
-    disableListWrap: Ee = !1,
-    disablePortal: oe = !1,
-    filterOptions: ze,
-    filterSelectedOptions: Ve = !1,
-    forcePopupIcon: de = "auto",
-    freeSolo: ye = !1,
-    fullWidth: W = !1,
-    getLimitTagsText: $ = (v) => `+${v}`,
-    getOptionDisabled: fe,
-    getOptionKey: _,
-    getOptionLabel: ve,
-    isOptionEqualToValue: q,
-    groupBy: ie,
-    handleHomeEndKeys: xe = !i.freeSolo,
-    id: M,
+    clearOnBlur: R = !i.freeSolo,
+    clearOnEscape: U = !1,
+    clearText: L = "Clear",
+    closeText: T = "Close",
+    componentsProps: N,
+    defaultValue: te = i.multiple ? [] : null,
+    disableClearable: he = !1,
+    disableCloseOnSelect: se = !1,
+    disabled: W = !1,
+    disabledItemsFocusable: ye = !1,
+    disableListWrap: De = !1,
+    disablePortal: ne = !1,
+    filterOptions: Ne,
+    filterSelectedOptions: Ee = !1,
+    forcePopupIcon: fe = "auto",
+    freeSolo: ve = !1,
+    fullWidth: K = !1,
+    getLimitTagsText: I = (v) => `+${v}`,
+    getOptionDisabled: ge,
+    getOptionKey: Y,
+    getOptionLabel: xe,
+    isOptionEqualToValue: J,
+    groupBy: pe,
+    handleHomeEndKeys: Ie = !i.freeSolo,
+    id: _,
     includeInputInList: Ro = !1,
     inputValue: Ce,
-    limitTags: Fe = -1,
-    ListboxComponent: go,
-    ListboxProps: U,
-    loading: D = !1,
-    loadingText: je = "Loading…",
-    multiple: Be = !1,
-    noOptionsText: R = "No options",
-    onChange: K,
-    onClose: Ue,
+    limitTags: ze = -1,
+    ListboxComponent: bo,
+    ListboxProps: H,
+    loading: B = !1,
+    loadingText: Ve = "Loading…",
+    multiple: Fe = !1,
+    noOptionsText: M = "No options",
+    onChange: q,
+    onClose: je,
     onHighlightChange: Lo,
     onInputChange: G,
     onOpen: Xe,
-    open: bo,
-    openOnFocus: z = !1,
+    open: mo,
+    openOnFocus: E = !1,
     openText: s = "Open",
     options: Ao,
-    PaperComponent: S,
+    PaperComponent: O,
     PopperComponent: $e,
-    popupIcon: Ie = Uo || (Uo = /* @__PURE__ */ T(Qo, {})),
+    popupIcon: Oe = jo || (jo = /* @__PURE__ */ S(Xo, {})),
     readOnly: He = !1,
-    renderGroup: Oe,
-    renderInput: se,
+    renderGroup: we,
+    renderInput: ce,
     renderOption: Qe,
     renderTags: Ze,
-    selectOnFocus: mo = !i.freeSolo,
-    size: Pe = "medium",
-    slots: j = {},
+    selectOnFocus: ho = !i.freeSolo,
+    size: Se = "medium",
+    slots: F = {},
     slotProps: k = {},
-    value: Q,
-    ...We
+    value: Z,
+    ...Ue
   } = i, {
-    getRootProps: Se,
+    getRootProps: Pe,
     getInputProps: eo,
-    getInputLabelProps: te,
-    getPopupIndicatorProps: Y,
-    getClearProps: ho,
-    getTagProps: Ke,
-    getListboxProps: yo,
-    getOptionProps: ne,
-    value: re,
-    dirty: pe,
-    expanded: we,
-    id: ge,
-    popupOpen: Te,
-    focused: Ge,
+    getInputLabelProps: re,
+    getPopupIndicatorProps: X,
+    getClearProps: yo,
+    getTagProps: We,
+    getListboxProps: vo,
+    getOptionProps: ae,
+    value: le,
+    dirty: ue,
+    expanded: Te,
+    id: be,
+    popupOpen: ke,
+    focused: Ke,
     focusedTag: oo,
-    anchorEl: ke,
-    setAnchorEl: vo,
+    anchorEl: Me,
+    setAnchorEl: xo,
     inputValue: to,
     groupedOptions: Re
-  } = pt({
+  } = st({
     ...i,
     componentName: "Autocomplete"
-  }), _e = !me && !H && pe && !He, qe = (!ye || de === !0) && de !== !1, {
-    onMouseDown: xo
+  }), qe = !he && !W && ue && !He, Ge = (!ve || fe === !0) && fe !== !1, {
+    onMouseDown: Io
   } = eo(), {
     ref: Co,
     ...no
-  } = yo(), Ye = ve || ((v) => v.label ?? v), N = {
+  } = vo(), Ye = xe || ((v) => v.label ?? v), D = {
     ...i,
-    disablePortal: oe,
-    expanded: we,
-    focused: Ge,
-    fullWidth: W,
+    disablePortal: ne,
+    expanded: Te,
+    focused: Ke,
+    fullWidth: K,
     getOptionLabel: Ye,
-    hasClearIcon: _e,
-    hasPopupIcon: qe,
+    hasClearIcon: qe,
+    hasPopupIcon: Ge,
     inputFocused: oo === -1,
-    popupOpen: Te,
-    size: Pe
-  }, L = Ot(N), ae = {
+    popupOpen: ke,
+    size: Se
+  }, A = $t(D), ie = {
     slots: {
-      listbox: go,
-      paper: S,
+      listbox: bo,
+      paper: O,
       popper: $e,
-      ...j
+      ...F
     },
     slotProps: {
-      chip: P,
-      listbox: U,
-      ...ue,
+      chip: w,
+      listbox: H,
+      ...N,
       ...k
     }
-  }, [r, t] = Oo("listbox", {
+  }, [r, t] = wo("listbox", {
     elementType: "ul",
-    externalForwardedProps: ae,
-    ownerState: N,
-    className: L.listbox,
+    externalForwardedProps: ie,
+    ownerState: D,
+    className: A.listbox,
     additionalProps: no,
     ref: Co
-  }), [l, p] = Oo("paper", {
+  }), [l, p] = wo("paper", {
     elementType: Ko,
-    externalForwardedProps: ae,
-    ownerState: N,
-    className: L.paper
-  }), [c, O] = Oo("popper", {
+    externalForwardedProps: ie,
+    ownerState: D,
+    className: A.paper
+  }), [c, $] = wo("popper", {
     elementType: Wo,
-    externalForwardedProps: ae,
-    ownerState: N,
-    className: L.popper,
+    externalForwardedProps: ie,
+    ownerState: D,
+    className: A.popper,
     additionalProps: {
-      disablePortal: oe,
+      disablePortal: ne,
       style: {
-        width: ke ? ke.clientWidth : null
+        width: Me ? Me.clientWidth : null
       },
       role: "presentation",
-      anchorEl: ke,
-      open: Te
+      anchorEl: Me,
+      open: ke
     }
   });
-  let I;
-  if (Be && re.length > 0) {
-    const v = (Z) => ({
-      className: L.tag,
-      disabled: H,
-      ...Ke(Z)
+  let C;
+  if (Fe && le.length > 0) {
+    const v = (ee) => ({
+      className: A.tag,
+      disabled: W,
+      ...We(ee)
     });
-    Ze ? I = Ze(re, v, N) : I = re.map((Z, ce) => {
+    Ze ? C = Ze(le, v, D) : C = le.map((ee, de) => {
       const {
         key: Je,
-        ...qo
+        ...Yo
       } = v({
-        index: ce
+        index: de
       });
-      return /* @__PURE__ */ T(Go, {
-        label: Ye(Z),
-        size: Pe,
-        ...qo,
-        ...ae.slotProps.chip
+      return /* @__PURE__ */ S(qo, {
+        label: Ye(ee),
+        size: Se,
+        ...Yo,
+        ...ie.slotProps.chip
       }, Je);
     });
   }
-  if (Fe > -1 && Array.isArray(I)) {
-    const v = I.length - Fe;
-    !Ge && v > 0 && (I = I.splice(0, Fe), I.push(/* @__PURE__ */ T("span", {
-      className: L.tag,
-      children: $(v)
-    }, I.length)));
+  if (ze > -1 && Array.isArray(C)) {
+    const v = C.length - ze;
+    !Ke && v > 0 && (C = C.splice(0, ze), C.push(/* @__PURE__ */ S("span", {
+      className: A.tag,
+      children: I(v)
+    }, C.length)));
   }
-  const Le = Oe || ((v) => /* @__PURE__ */ De("li", {
-    children: [/* @__PURE__ */ T(Dt, {
-      className: L.groupLabel,
-      ownerState: N,
+  const Le = we || ((v) => /* @__PURE__ */ Be("li", {
+    children: [/* @__PURE__ */ S(At, {
+      className: A.groupLabel,
+      ownerState: D,
       component: "div",
       children: v.group
-    }), /* @__PURE__ */ T(Nt, {
-      className: L.groupUl,
-      ownerState: N,
+    }), /* @__PURE__ */ S(_t, {
+      className: A.groupUl,
+      ownerState: D,
       children: v.children
     })]
-  }, v.key)), _o = Qe || ((v, Z) => {
+  }, v.key)), Go = Qe || ((v, ee) => {
     const {
-      key: ce,
+      key: de,
       ...Je
     } = v;
-    return /* @__PURE__ */ T("li", {
+    return /* @__PURE__ */ S("li", {
       ...Je,
-      children: Ye(Z)
-    }, ce);
-  }), Do = (v, Z) => {
-    const ce = ne({
+      children: Ye(ee)
+    }, de);
+  }), Bo = (v, ee) => {
+    const de = ae({
       option: v,
-      index: Z
+      index: ee
     });
-    return _o({
-      ...ce,
-      className: L.option
+    return Go({
+      ...de,
+      className: A.option
     }, v, {
-      selected: ce["aria-selected"],
-      index: Z,
+      selected: de["aria-selected"],
+      index: ee,
       inputValue: to
-    }, N);
-  }, ro = ae.slotProps.clearIndicator, ao = ae.slotProps.popupIndicator, $o = (v) => /* @__PURE__ */ T(kt, {
+    }, D);
+  }, ro = ie.slotProps.clearIndicator, ao = ie.slotProps.popupIndicator, $o = (v) => /* @__PURE__ */ S(Tt, {
     as: c,
-    ...O,
-    children: /* @__PURE__ */ T(Rt, {
+    ...$,
+    children: /* @__PURE__ */ S(kt, {
       as: l,
       ...p,
       children: v
     })
   });
   let lo = null;
-  return Re.length > 0 ? lo = $o(/* @__PURE__ */ T(Mt, {
+  return Re.length > 0 ? lo = $o(/* @__PURE__ */ S(Lt, {
     as: r,
     ...t,
-    children: Re.map((v, Z) => ie ? Le({
+    children: Re.map((v, ee) => pe ? Le({
       key: v.key,
       group: v.group,
-      children: v.options.map((ce, Je) => Do(ce, v.index + Je))
-    }) : Do(v, Z))
-  })) : D && Re.length === 0 ? lo = $o(/* @__PURE__ */ T(Lt, {
-    className: L.loading,
-    ownerState: N,
-    children: je
-  })) : Re.length === 0 && !ye && !D && (lo = $o(/* @__PURE__ */ T(At, {
-    className: L.noOptions,
-    ownerState: N,
+      children: v.options.map((de, Je) => Bo(de, v.index + Je))
+    }) : Bo(v, ee))
+  })) : B && Re.length === 0 ? lo = $o(/* @__PURE__ */ S(Mt, {
+    className: A.loading,
+    ownerState: D,
+    children: Ve
+  })) : Re.length === 0 && !ve && !B && (lo = $o(/* @__PURE__ */ S(Rt, {
+    className: A.noOptions,
+    ownerState: D,
     role: "presentation",
     onMouseDown: (v) => {
       v.preventDefault();
     },
-    children: R
-  }))), /* @__PURE__ */ De(b.Fragment, {
-    children: [/* @__PURE__ */ T(Pt, {
+    children: M
+  }))), /* @__PURE__ */ Be(m.Fragment, {
+    children: [/* @__PURE__ */ S(Ot, {
       ref: a,
-      className: J(L.root, C),
-      ownerState: N,
-      ...Se(We),
-      children: se({
-        id: ge,
-        disabled: H,
+      className: Q(A.root, b),
+      ownerState: D,
+      ...Pe(Ue),
+      children: ce({
+        id: be,
+        disabled: W,
         fullWidth: !0,
-        size: Pe === "small" ? "small" : void 0,
-        InputLabelProps: te(),
+        size: Se === "small" ? "small" : void 0,
+        InputLabelProps: re(),
         InputProps: {
-          ref: vo,
-          className: L.inputRoot,
-          startAdornment: I,
-          onMouseDown: (v) => xo(v),
-          ...(_e || qe) && {
-            endAdornment: /* @__PURE__ */ De(St, {
-              className: L.endAdornment,
-              ownerState: N,
-              children: [_e ? /* @__PURE__ */ T(wt, {
-                ...ho(),
-                "aria-label": A,
-                title: A,
-                ownerState: N,
+          ref: xo,
+          className: A.inputRoot,
+          startAdornment: C,
+          onMouseDown: (v) => Io(v),
+          ...(qe || Ge) && {
+            endAdornment: /* @__PURE__ */ Be(wt, {
+              className: A.endAdornment,
+              ownerState: D,
+              children: [qe ? /* @__PURE__ */ S(St, {
+                ...yo(),
+                "aria-label": L,
+                title: L,
+                ownerState: D,
                 ...ro,
-                className: J(L.clearIndicator, ro == null ? void 0 : ro.className),
-                children: m
-              }) : null, qe ? /* @__PURE__ */ T(Tt, {
-                ...Y(),
-                disabled: H,
-                "aria-label": Te ? E : s,
-                title: Te ? E : s,
-                ownerState: N,
+                className: Q(A.clearIndicator, ro == null ? void 0 : ro.className),
+                children: P
+              }) : null, Ge ? /* @__PURE__ */ S(Pt, {
+                ...X(),
+                disabled: W,
+                "aria-label": ke ? T : s,
+                title: ke ? T : s,
+                ownerState: D,
                 ...ao,
-                className: J(L.popupIndicator, ao == null ? void 0 : ao.className),
-                children: Ie
+                className: Q(A.popupIndicator, ao == null ? void 0 : ao.className),
+                children: Oe
               }) : null]
             })
           }
         },
         inputProps: {
-          className: L.input,
-          disabled: H,
+          className: A.input,
+          disabled: W,
           readOnly: He,
           ...eo()
         }
       })
-    }), ke ? lo : null]
+    }), Me ? lo : null]
   });
 });
-process.env.NODE_ENV !== "production" && (To.propTypes = {
+process.env.NODE_ENV !== "production" && (ko.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -2227,7 +2227,7 @@ process.env.NODE_ENV !== "production" && (To.propTypes = {
    * The default value. Use when the component is not controlled.
    * @default props.multiple ? [] : null
    */
-  defaultValue: wo(o.any, (e) => e.multiple && e.defaultValue !== void 0 && !Array.isArray(e.defaultValue) ? new Error(["MUI: The Autocomplete expects the `defaultValue` prop to be an array when `multiple={true}` or undefined.", `However, ${e.defaultValue} was provided.`].join(`
+  defaultValue: To(o.any, (e) => e.multiple && e.defaultValue !== void 0 && !Array.isArray(e.defaultValue) ? new Error(["MUI: The Autocomplete expects the `defaultValue` prop to be an array when `multiple={true}` or undefined.", `However, ${e.defaultValue} was provided.`].join(`
 `)) : null),
   /**
    * If `true`, the input can't be cleared.
@@ -2365,7 +2365,7 @@ process.env.NODE_ENV !== "production" && (To.propTypes = {
    * Set `-1` to disable the limit.
    * @default -1
    */
-  limitTags: tt,
+  limitTags: ot,
   /**
    * The component used to render the listbox.
    * @default 'ul'
@@ -2559,111 +2559,22 @@ process.env.NODE_ENV !== "production" && (To.propTypes = {
    * The value must have reference equality with the option in order to be selected.
    * You can customize the equality behavior with the `isOptionEqualToValue` prop.
    */
-  value: wo(o.any, (e) => e.multiple && e.value !== void 0 && !Array.isArray(e.value) ? new Error(["MUI: The Autocomplete expects the `value` prop to be an array when `multiple={true}` or undefined.", `However, ${e.value} was provided.`].join(`
+  value: To(o.any, (e) => e.multiple && e.value !== void 0 && !Array.isArray(e.value) ? new Error(["MUI: The Autocomplete expects the `value` prop to be an array when `multiple={true}` or undefined.", `However, ${e.value} was provided.`].join(`
 `)) : null)
 });
-const Et = ["colon", "borderFocusColor", "minWidth", "noLabel"], zt = Yo("div", { shouldForwardProp: (e) => !Et.includes(e) })(({ borderFocusColor: e, minWidth: n = "180px", multiple: a }) => ({
-  ...No`
-    display: flex;
-    flex-wrap: nowrap;
-    align-items: center;
-    gap: 9px;
-    font-family: 'Roboto', sans-serif;
-    min-width: ${n};
-
-    fieldset {
-      border: none !important;
-    }
-
-    .jcDropdownLabel {
-      white-space: nowrap;
-      font-weight: bold;
-    }
-
-    .MuiAutocomplete-root {
-      width: 100%;
-      flex-grow: 1;
-    }
-
-    .MuiInputBase-input {
-      padding: 0;
-      padding-right: 0px !important;
-      min-height: 0;
-    }
-
-    .MuiInputBase-root {
-      padding: 0 !important;
-
-      ${a && No`
-        display: flex;
-        align-items: start;
-      `};
-
-      input {
-        height: 15px;
-        padding: 2px 0px 2px 0px !important;
-        width: 100%;
-      }
-
-      transition: 313ms all ease-out;
-      border-radius: 0;
-      border-bottom: 1px solid ${Jo.colors.gray};
-      width: 100%;
-
-      .Mui-select {
-        border: none !important;
-      }
-
-      :hover,
-      :focus-visible,
-      &.Mui-focused {
-        box-shadow: 0 -5px 4px -4px ${e} inset;
-      }
-
-      .MuiButtonBase-root {
-        max-height: 20px;
-        padding: 1px 2px;
-        margin: 1px 2px 2px 2px;
-      }
-
-      .MuiChip-label {
-        font-size: 13px;
-        padding: 0 6px;
-      }
-
-      .MuiSvgIcon-root {
-        margin: 0;
-        font-size: 13px;
-        height: 13px;
-        width: 13px;
-      }
-    }
-
-    .MuiAutocomplete-endAdornment {
-      right: -7px !important;
-    }
-
-    .MuiAutocomplete-clearIndicator {
-      font-size: 13px;
-      height: 19px;
-      width: 19px;
-
-      svg {
-        height: 15px;
-        width: 15px;
-      }
-    }
-
-    .MuiButtonBase-root {
-      padding: 2px;
-    }
-
-    svg {
-      height: 19px;
-      width: 19px;
-    }
-  `
-})), rn = ({
+const Bt = "flex flex-nowrap items-center gap-[9px] font-['Roboto',sans-serif] min-w-[var(--dropdown-min-width)] [&_fieldset]:!border-none [&_.Mui-select]:!border-none [&_svg]:h-[19px] [&_svg]:w-[19px]", Dt = "[&_.jcDropdownLabel]:whitespace-nowrap [&_.jcDropdownLabel]:font-bold [&_.jcDropdownLabel]:self-start", Nt = "[&_.required]:mx-[2px] [&_.required]:text-[var(--dropdown-required-color)]", Et = "[&_.MuiAutocomplete-root]:w-full [&_.MuiAutocomplete-root]:grow [&_.MuiAutocomplete-root]:self-start [&_.MuiAutocomplete-endAdornment]:!-right-[7px] [&_.MuiAutocomplete-clearIndicator]:text-[13px] [&_.MuiAutocomplete-clearIndicator]:h-[19px] [&_.MuiAutocomplete-clearIndicator]:w-[19px] [&_.MuiAutocomplete-clearIndicator_svg]:h-[15px] [&_.MuiAutocomplete-clearIndicator_svg]:w-[15px]", zt = "[&_.MuiInputBase-input]:!p-0 [&_.MuiInputBase-input]:!pr-0 [&_.MuiInputBase-input]:min-h-0", Vt = "[&_.MuiInputBase-root]:!p-0 [&_.MuiInputBase-root]:transition-all [&_.MuiInputBase-root]:duration-[313ms] [&_.MuiInputBase-root]:ease-out [&_.MuiInputBase-root]:!rounded-none [&_.MuiInputBase-root]:border-b [&_.MuiInputBase-root]:border-b-[var(--dropdown-border-color)] [&_.MuiInputBase-root]:w-full [&_.MuiInputBase-root]:!shadow-[var(--dropdown-default-shadow)] [&_.MuiInputBase-root:hover]:!shadow-[var(--dropdown-active-shadow)] [&_.MuiInputBase-root:focus-visible]:!shadow-[var(--dropdown-active-shadow)] [&_.MuiInputBase-root.Mui-focused]:!shadow-[var(--dropdown-active-shadow)]", Ft = "[&_.MuiInputBase-root_input]:h-[15px] [&_.MuiInputBase-root_input]:w-full [&_.MuiInputBase-root_input]:!py-[2px] [&_.MuiInputBase-root_input]:!px-0", jt = "[&_.MuiInputBase-root_.MuiChip-label]:text-[13px] [&_.MuiInputBase-root_.MuiChip-label]:px-[6px]", Ht = "[&_.MuiInputBase-root_.MuiSvgIcon-root]:m-0 [&_.MuiInputBase-root_.MuiSvgIcon-root]:text-[13px] [&_.MuiInputBase-root_.MuiSvgIcon-root]:h-[13px] [&_.MuiInputBase-root_.MuiSvgIcon-root]:w-[13px]", Ut = "[&_.MuiButtonBase-root]:p-[2px] [&_.MuiButtonBase-root]:max-h-5 [&_.MuiButtonBase-root]:px-[2px] [&_.MuiButtonBase-root]:py-px [&_.MuiButtonBase-root]:mx-[2px] [&_.MuiButtonBase-root]:mt-px [&_.MuiButtonBase-root]:mb-[2px]", Wt = "[&_.MuiFormHelperText-root]:!mt-px [&_.MuiFormHelperText-root]:!mr-0 [&_.MuiFormHelperText-root]:text-right", Kt = Ho(
+  Bt,
+  Dt,
+  Nt,
+  Et,
+  zt,
+  Vt,
+  Ft,
+  jt,
+  Ht,
+  Ut,
+  Wt
+), qt = "[&_.MuiInputBase-root]:!flex [&_.MuiInputBase-root]:!items-start", bn = ({
   label: e,
   colon: n = !0,
   options: a = [],
@@ -2673,47 +2584,61 @@ const Et = ["colon", "borderFocusColor", "minWidth", "noLabel"], zt = Yo("div",
   onChange: h,
   minWidth: x,
   multiple: y,
-  ...P
+  required: w,
+  error: b,
+  helperText: P,
+  ...R
 }) => {
-  const C = Xo();
-  return /* @__PURE__ */ De(
-    zt,
+  const U = Jo(), L = {
+    "--dropdown-min-width": x ?? "180px",
+    "--dropdown-required-color": io.colors.gray,
+    "--dropdown-border-color": io.colors.gray,
+    "--dropdown-default-shadow": b ? `inset 0 -5px 4px -4px ${io.colors.error}` : "none",
+    "--dropdown-active-shadow": `inset 0 -5px 4px -4px ${b ? io.colors.error : g || U.themeColor}`
+  };
+  return /* @__PURE__ */ Be(
+    "div",
     {
-      className: "jcLabeledDropdown",
-      borderFocusColor: g || C.themeColor,
-      minWidth: x,
-      multiple: y,
+      className: Ho("jcLabeledDropdown", Kt, y && qt),
+      style: L,
       children: [
-        !i && /* @__PURE__ */ De("span", { className: "jcDropdownLabel", children: [
+        !i && /* @__PURE__ */ Be("span", { className: "jcDropdownLabel", children: [
           e,
+          w && /* @__PURE__ */ S("span", { className: "required", children: "*" }),
           n && ":"
         ] }),
-        !y && // @ts-ignore
-        /* @__PURE__ */ T(
-          To,
+        !y && /* @__PURE__ */ S(
+          ko,
           {
+            ...R,
             options: a,
-            onChange: (m, w) => (
-              // @ts-ignore - Fix: Use nullish coalescing to avoid "undefined" string
-              h && h({ ...m, target: { ...m.target, value: (w == null ? void 0 : w.value) ?? "" } })
-            ),
-            ...P,
-            renderInput: (m) => /* @__PURE__ */ T(zo, { ...m })
+            onChange: (T, N) => {
+              if (!h || Array.isArray(N)) return;
+              const te = {
+                ...T,
+                target: { ...T.target, value: (N == null ? void 0 : N.value) ?? "" }
+              };
+              h(te);
+            },
+            renderInput: (T) => /* @__PURE__ */ S(No, { ...T, error: b, helperText: P })
           }
         ),
-        y && // @ts-ignore
-        /* @__PURE__ */ T(
-          To,
+        y && /* @__PURE__ */ S(
+          ko,
           {
+            ...R,
             multiple: !0,
             disableCloseOnSelect: !0,
             options: a,
-            onChange: (m, w) => (
-              // @ts-ignore
-              h && h({ ...m, target: { ...m.target, value: w } })
-            ),
-            ...P,
-            renderInput: (m) => /* @__PURE__ */ T(zo, { ...m })
+            onChange: (T, N) => {
+              if (!h || !Array.isArray(N)) return;
+              const te = {
+                ...T,
+                target: { ...T.target, value: N }
+              };
+              h(te);
+            },
+            renderInput: (T) => /* @__PURE__ */ S(No, { ...T, error: b, helperText: P })
           }
         )
       ]
@@ -2721,6 +2646,6 @@ const Et = ["colon", "borderFocusColor", "minWidth", "noLabel"], zt = Yo("div",
   );
 };
 export {
-  rn as LabeledDropdown,
-  rn as default
+  bn as LabeledDropdown,
+  bn as default
 };