@canonical/maas-react-components 1.16.0 → 1.17.1

package/dist/@canonical/maas-react-components.es.js

@@ -1,4 +1,4 @@
-import { jsxs as ae, jsx as l, Fragment as Me } from "react/jsx-runtime";
+import { jsxs as ae, jsx as u, Fragment as Me } from "react/jsx-runtime";
 import * as Q from "react";
 import pn, { useRef as Ce, useState as be, useEffect as xe, useCallback as X, cloneElement as dn, createContext as mn, useId as rr, useContext as Mr, useMemo as ge, useReducer as vn, forwardRef as yn, useImperativeHandle as gn, Fragment as bn } from "react";
 import { useListener as hn, Link as _n, Tooltip as En, Button as _e, Icon as je, Row as wn, Col as Tn, Input as Lr, CheckboxInput as On, useClickOutside as Cn, useOnEscapePressed as xn } from "@canonical/react-components";
@@ -31,8 +31,8 @@ var Br = { exports: {} };
               t.push(o.toString());
               continue;
             }
-            for (var m in o)
-              r.call(o, m) && o[m] && t.push(m);
+            for (var d in o)
+              r.call(o, d) && o[d] && t.push(d);
           }
         }
       }
@@ -77,13 +77,13 @@ const me = {
   size: o = "regular",
   ...s
 }) => {
-  const a = Ce(null), m = n == null ? void 0 : n.reduce((R, D) => R + D.value, 0), u = t || m, y = n.map((R) => R.value / u * 100), [g, E] = be(0);
+  const a = Ce(null), d = n == null ? void 0 : n.reduce((R, D) => R + D.value, 0), l = t || d, y = n.map((R) => R.value / l * 100), [g, E] = be(0);
   xe(() => {
-    E(i === "segmented" ? yr(a, u) : 0);
-  }, [u, i]);
+    E(i === "segmented" ? yr(a, l) : 0);
+  }, [l, i]);
   const P = X(() => {
-    E(yr(a, u));
-  }, [a, u, E]);
+    E(yr(a, l));
+  }, [a, l, E]);
   return hn(window, P, "resize", !0, i === "segmented"), /* @__PURE__ */ ae(
     "div",
     {
@@ -94,12 +94,12 @@ const me = {
       "data-testid": he.container,
       ref: a,
       children: [
-        /* @__PURE__ */ l(Pn, { children: /* @__PURE__ */ l(
+        /* @__PURE__ */ u(Pn, { children: /* @__PURE__ */ u(
           Rn,
           {
             data: n,
             datumWidths: y,
-            maximum: u,
+            maximum: l,
             overColor: Wr,
             segmentWidth: g,
             separatorColor: nr
@@ -109,7 +109,7 @@ const me = {
       ]
     }
   );
-}, Pn = ({ children: e }) => /* @__PURE__ */ l(
+}, Pn = ({ children: e }) => /* @__PURE__ */ u(
   "div",
   {
     className: "p-meter__bar",
@@ -123,13 +123,13 @@ const me = {
   maximum: n,
   segmentWidth: t
 }) => {
-  const i = () => (e == null ? void 0 : e.reduce((a, m) => a + m.value, 0)) > n, o = (a, m) => ({
+  const i = () => (e == null ? void 0 : e.reduce((a, d) => a + d.value, 0)) > n, o = (a, d) => ({
     backgroundColor: a.color,
     left: `${r == null ? void 0 : r.reduce(
-      (u, y, g) => m > g ? u + y : u,
+      (l, y, g) => d > g ? l + y : l,
       0
     )}%`,
-    width: `${r[m]}%`
+    width: `${r[d]}%`
   }), s = () => ({
     background: `repeating-linear-gradient(
       to right,
@@ -140,23 +140,23 @@ const me = {
     )`
   });
   return /* @__PURE__ */ ae(Me, { children: [
-    i() ? /* @__PURE__ */ l(
+    i() ? /* @__PURE__ */ u(
       "div",
       {
         className: "p-meter__filled",
         "data-testid": he.meteroverflow,
         style: { backgroundColor: Wr, width: "100%" }
       }
-    ) : e == null ? void 0 : e.map((a, m) => /* @__PURE__ */ l(
+    ) : e == null ? void 0 : e.map((a, d) => /* @__PURE__ */ u(
       "div",
       {
         className: "p-meter__filled",
         "data-testid": he.filled,
-        style: o(a, m)
+        style: o(a, d)
       },
-      `meter-${m}`
+      `meter-${d}`
     )),
-    t > 0 && /* @__PURE__ */ l(
+    t > 0 && /* @__PURE__ */ u(
       "div",
       {
         className: "p-meter__separators",
@@ -168,7 +168,7 @@ const me = {
 }, Fn = ({
   className: e,
   children: r
-}) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(
   "div",
   {
     className: z("p-meter__label", e),
@@ -177,23 +177,23 @@ const me = {
   }
 );
 An.Label = Fn;
-const _o = ({ children: e, to: r, ...n }) => /* @__PURE__ */ l(_n, { ...n, href: r, rel: "noreferrer noopener", target: "_blank", children: e }), In = ({ children: e }) => /* @__PURE__ */ l(Me, { children: e }), jn = ({
+const _o = ({ children: e, to: r, ...n }) => /* @__PURE__ */ u(_n, { ...n, href: r, rel: "noreferrer noopener", target: "_blank", children: e }), In = ({ children: e }) => /* @__PURE__ */ u(Me, { children: e }), jn = ({
   isCollapsed: e,
   setIsCollapsed: r,
   className: n
-}) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(
   En,
   {
     className: "p-side-navigation__tooltip-wrapper",
     message: /* @__PURE__ */ ae(Me, { children: [
       e ? "expand" : "collapse",
       "( ",
-      /* @__PURE__ */ l("code", { children: "[" }),
+      /* @__PURE__ */ u("code", { children: "[" }),
       " )"
     ] }),
     position: "right",
     tooltipClassName: "p-side-navigation__tooltip",
-    children: /* @__PURE__ */ l(
+    children: /* @__PURE__ */ u(
       _e,
       {
         appearance: "base",
@@ -205,25 +205,25 @@ const _o = ({ children: e, to: r, ...n }) => /* @__PURE__ */ l(_n, { ...n, href:
         onClick: (t) => {
           r(!e), t.stopPropagation(), t.currentTarget.blur();
         },
-        children: /* @__PURE__ */ l(je, { light: !0, name: "sidebar-toggle" })
+        children: /* @__PURE__ */ u(je, { light: !0, name: "sidebar-toggle" })
       }
     )
   }
-), kn = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__content", children: /* @__PURE__ */ l("nav", { className: "p-side-navigation--icons is-dark", children: e }) }), Nn = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__controls u-no-margin--top", children: e }), $n = ({ children: e }) => /* @__PURE__ */ l("div", { className: "l-navigation__drawer", children: /* @__PURE__ */ l("div", { className: "p-panel is-dark", children: e }) }), Mn = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__footer", children: e }), Ln = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__header", children: e }), zn = ({ light: e = !0, name: r }) => /* @__PURE__ */ l(je, { className: "p-side-navigation__icon", light: e, name: r }), Bn = ({ children: e, className: r, hasActiveChild: n }) => /* @__PURE__ */ l("li", { className: z("p-side-navigation__item", r, { "has-active-child": n }), children: e }), Wn = ({ children: e, id: r, variant: n = "base" }) => /* @__PURE__ */ l("span", { className: z("p-side-navigation__label", { "p-side-navigation__label--group": n === "group" }), id: r, children: e }), Yn = ({
+), kn = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-panel__content", children: /* @__PURE__ */ u("nav", { className: "p-side-navigation--icons is-dark", children: e }) }), Nn = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-panel__controls u-no-margin--top", children: e }), $n = ({ children: e }) => /* @__PURE__ */ u("div", { className: "l-navigation__drawer", children: /* @__PURE__ */ u("div", { className: "p-panel is-dark", children: e }) }), Mn = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-panel__footer", children: e }), Ln = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-panel__header", children: e }), zn = ({ light: e = !0, name: r }) => /* @__PURE__ */ u(je, { className: "p-side-navigation__icon", light: e, name: r }), Bn = ({ children: e, className: r, hasActiveChild: n }) => /* @__PURE__ */ u("li", { className: z("p-side-navigation__item", r, { "has-active-child": n }), children: e }), Wn = ({ children: e, id: r, variant: n = "base" }) => /* @__PURE__ */ u("span", { className: z("p-side-navigation__label", { "p-side-navigation__label--group": n === "group" }), id: r, children: e }), Yn = ({
   as: e,
   ...r
-}) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(
   e || "a",
   {
     className: z("p-side-navigation__link", r.className),
     ...r
   }
-), qn = ({ children: e, className: r }) => /* @__PURE__ */ l("ul", { className: z("p-side-navigation__list", r), children: e }), Hn = ({
+), qn = ({ children: e, className: r }) => /* @__PURE__ */ u("ul", { className: z("p-side-navigation__list", r), children: e }), Hn = ({
   as: e,
   children: r,
   className: n,
   ...t
-}) => /* @__PURE__ */ l(e || "a", { className: z("p-panel__logo", n), ...t, children: /* @__PURE__ */ l("div", { className: "p-navigation__tagged-logo", children: r }) }), Kn = ({ children: e }) => dn(e, { className: "p-panel__logo-icon p-navigation__logo-icon" }), Un = ({ children: e, variant: r = "base" }) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(e || "a", { className: z("p-panel__logo", n), ...t, children: /* @__PURE__ */ u("div", { className: "p-navigation__tagged-logo", children: r }) }), Kn = ({ children: e }) => dn(e, { className: "p-panel__logo-icon p-navigation__logo-icon" }), Un = ({ children: e, variant: r = "base" }) => /* @__PURE__ */ u(
   "div",
   {
     className: z("p-panel__logo-name is-fading-when-collapsed", {
@@ -231,11 +231,11 @@ const _o = ({ children: e, to: r, ...n }) => /* @__PURE__ */ l(_n, { ...n, href:
     }),
     children: e
   }
-), Gn = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-navigation__logo-tag", children: e }), Vn = ({ children: e }) => /* @__PURE__ */ l("span", { className: "p-panel__logo-text", children: e }), Jn = ({
+), Gn = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-navigation__logo-tag", children: e }), Vn = ({ children: e }) => /* @__PURE__ */ u("span", { className: "p-panel__logo-text", children: e }), Jn = ({
   children: e,
   className: r,
   onClick: n
-}) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(
   _e,
   {
     appearance: "base",
@@ -248,8 +248,8 @@ const _o = ({ children: e, to: r, ...n }) => /* @__PURE__ */ l(_n, { ...n, href:
     },
     children: e
   }
-), Xn = ({ children: e }) => /* @__PURE__ */ l("span", { className: "p-side-navigation__text", children: e });
-const Y = ({ children: e, className: r, isCollapsed: n }) => /* @__PURE__ */ l("header", { "aria-label": "main navigation", className: z("l-navigation is-maas", r, { "is-collapsed": n, "is-pinned": !n }), children: e }), Zn = ({ children: e, className: r }) => /* @__PURE__ */ l("header", { "aria-label": "navigation", className: "l-navigation-bar", children: /* @__PURE__ */ l("div", { className: z("p-panel is-dark", r), children: e }) });
+), Xn = ({ children: e }) => /* @__PURE__ */ u("span", { className: "p-side-navigation__text", children: e });
+const Y = ({ children: e, className: r, isCollapsed: n }) => /* @__PURE__ */ u("header", { "aria-label": "main navigation", className: z("l-navigation is-maas", r, { "is-collapsed": n, "is-pinned": !n }), children: e }), Zn = ({ children: e, className: r }) => /* @__PURE__ */ u("header", { "aria-label": "navigation", className: "l-navigation-bar", children: /* @__PURE__ */ u("div", { className: z("p-panel is-dark", r), children: e }) });
 Y.Header = Ln;
 Y.Banner = In;
 Y.Drawer = $n;
@@ -271,7 +271,7 @@ Y.LogoText = Vn;
 Zn.MenuButton = Jn;
 const lr = mn(null), Yr = ({ children: e }) => {
   const r = rr();
-  return /* @__PURE__ */ l(lr.Provider, { value: r, children: /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(lr.Provider, { value: r, children: /* @__PURE__ */ u(
     "div",
     {
       role: "group",
@@ -283,14 +283,14 @@ const lr = mn(null), Yr = ({ children: e }) => {
   ) });
 }, Qn = ({ children: e }) => {
   const r = Mr(lr);
-  return /* @__PURE__ */ l("label", { id: `${r}_label`, children: e });
+  return /* @__PURE__ */ u("label", { id: `${r}_label`, children: e });
 }, et = ({ children: e }) => {
   const r = Mr(lr);
-  return /* @__PURE__ */ l("p", { className: "p-form-help-text", id: `${r}_description`, children: e });
+  return /* @__PURE__ */ u("p", { className: "p-form-help-text", id: `${r}_description`, children: e });
 };
 Yr.Label = Qn;
 Yr.Description = et;
-const ur = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-form-section", children: e }), rt = ({ children: e }) => /* @__PURE__ */ l("h5", { className: "p-form-section__title u-no-padding--top", children: e }), nt = ({ children: e }) => /* @__PURE__ */ l("p", { className: "p-form-help-text", children: e }), tt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-form-section__content", children: e });
+const ur = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-form-section", children: e }), rt = ({ children: e }) => /* @__PURE__ */ u("h5", { className: "p-form-section__title u-no-padding--top", children: e }), nt = ({ children: e }) => /* @__PURE__ */ u("p", { className: "p-form-help-text", children: e }), tt = ({ children: e }) => /* @__PURE__ */ u("div", { className: "p-form-section__content", children: e });
 ur.Title = rt;
 ur.Description = nt;
 ur.Content = tt;
@@ -313,14 +313,14 @@ function ot(e) {
 const qr = Q.createContext(null), Hr = Q.createContext([!1, () => {
 }]), Kr = ({ children: e }) => {
   const r = Q.useRef(null), n = ot(r), [t, i] = Q.useState(!1);
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(
     "header",
     {
       className: z("main-toolbar", {
         "main-toolbar--stacked": t
       }),
       ref: r,
-      children: /* @__PURE__ */ l(qr.Provider, { value: n, children: /* @__PURE__ */ l(Hr.Provider, { value: [t, i], children: e }) })
+      children: /* @__PURE__ */ u(qr.Provider, { value: n, children: /* @__PURE__ */ u(Hr.Provider, { value: [t, i], children: e }) })
     }
   );
 }, it = ({
@@ -328,7 +328,7 @@ const qr = Q.createContext(null), Hr = Q.createContext([!1, () => {
   children: r,
   className: n,
   ...t
-}) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(
   e || "h1",
   {
     className: z("main-toolbar__title p-heading--4", n),
@@ -341,7 +341,7 @@ const qr = Q.createContext(null), Hr = Q.createContext([!1, () => {
   return Q.useEffect(() => {
     !i.current || !r || t(i.current.getBoundingClientRect().width > r.width);
   }, [t, r, i]), /* @__PURE__ */ ae(Me, { children: [
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ u(
       "div",
       {
         "aria-hidden": "true",
@@ -351,7 +351,7 @@ const qr = Q.createContext(null), Hr = Q.createContext([!1, () => {
         children: e
       }
     ),
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ u(
       "div",
       {
         className: z("main-toolbar__controls", {
@@ -372,15 +372,15 @@ const Le = ({
   ...i
 }) => {
   const o = n || "section", s = z("content-section", r);
-  return /* @__PURE__ */ l(o, { ...i, className: s, children: /* @__PURE__ */ l(wn, { children: /* @__PURE__ */ l(Tn, { size: t === "narrow" ? 6 : 12, children: e }) }) });
-}, st = ({ children: e, className: r, as: n, ...t }) => /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(o, { ...i, className: s, children: /* @__PURE__ */ u(wn, { children: /* @__PURE__ */ u(Tn, { size: t === "narrow" ? 6 : 12, children: e }) }) });
+}, st = ({ children: e, className: r, as: n, ...t }) => /* @__PURE__ */ u(
   n || "h1",
   {
     ...t,
     className: z("content-section__title p-heading--4", r),
     children: e
   }
-), ct = ({ children: e, className: r }) => /* @__PURE__ */ l("header", { className: z("content-section__header", r), children: e }), lt = ({ children: e, className: r }) => /* @__PURE__ */ l("div", { className: z("content-section__body", r), children: e }), ut = ({ children: e, className: r }) => /* @__PURE__ */ l("footer", { className: z("content-section__footer", r), children: e });
+), ct = ({ children: e, className: r }) => /* @__PURE__ */ u("header", { className: z("content-section__header", r), children: e }), lt = ({ children: e, className: r }) => /* @__PURE__ */ u("div", { className: z("content-section__body", r), children: e }), ut = ({ children: e, className: r }) => /* @__PURE__ */ u("footer", { className: z("content-section__footer", r), children: e });
 Le.Title = st;
 Le.Header = ct;
 Le.Content = lt;
@@ -389,7 +389,7 @@ const Ur = ({
   children: e,
   className: r,
   isVisible: n
-}) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(
   "div",
   {
     className: z("fade-in--down", r),
@@ -400,7 +400,7 @@ const Ur = ({
 ), Eo = ({
   children: e,
   ...r
-}) => /* @__PURE__ */ l(Ur, { isVisible: !r["aria-hidden"], children: /* @__PURE__ */ l("div", { className: "p-form__nested-group", ...r, children: e }) });
+}) => /* @__PURE__ */ u(Ur, { isVisible: !r["aria-hidden"], children: /* @__PURE__ */ u("div", { className: "p-form__nested-group", ...r, children: e }) });
 const ft = ({
   currentPage: e,
   error: r,
@@ -410,8 +410,8 @@ const ft = ({
   onNextClick: o,
   onPreviousClick: s,
   totalPages: a
-}) => /* @__PURE__ */ l("nav", { "aria-label": "pagination", className: "p-pagination", children: /* @__PURE__ */ ae("span", { className: "p-pagination--items", children: [
-  /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u("nav", { "aria-label": "pagination", className: "p-pagination", children: /* @__PURE__ */ ae("span", { className: "p-pagination--items", children: [
+  /* @__PURE__ */ u(
     _e,
     {
       "aria-label": "Previous page",
@@ -419,12 +419,12 @@ const ft = ({
       disabled: e === 1 || n,
       onClick: s,
       type: "button",
-      children: /* @__PURE__ */ l(je, { name: "chevron-down" })
+      children: /* @__PURE__ */ u(je, { name: "chevron-down" })
     }
   ),
-  /* @__PURE__ */ l("strong", { children: "Page " }),
+  /* @__PURE__ */ u("strong", { children: "Page " }),
   " ",
-  /* @__PURE__ */ l(
+  /* @__PURE__ */ u(
     Lr,
     {
       "aria-label": "page number",
@@ -444,7 +444,7 @@ const ft = ({
     " of ",
     a
   ] }),
-  /* @__PURE__ */ l(
+  /* @__PURE__ */ u(
     _e,
     {
       "aria-label": "Next page",
@@ -452,7 +452,7 @@ const ft = ({
       disabled: e === a || n,
       onClick: o,
       type: "button",
-      children: /* @__PURE__ */ l(je, { name: "chevron-up" })
+      children: /* @__PURE__ */ u(je, { name: "chevron-up" })
     }
   )
 ] }) }), wo = ({
@@ -462,7 +462,7 @@ const ft = ({
   totalPages: t
 }) => {
   const [i, o] = be(e), [s, a] = be("");
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ u(
     ft,
     {
       currentPage: i,
@@ -485,9 +485,9 @@ const ft = ({
     }
   );
 };
-const To = ({ activeStep: e, items: r }) => /* @__PURE__ */ l("ol", { className: "stepper", children: r.map((n, t) => {
+const To = ({ activeStep: e, items: r }) => /* @__PURE__ */ u("ol", { className: "stepper", children: r.map((n, t) => {
   const i = t === e, o = t < e;
-  return /* @__PURE__ */ l("li", { "aria-label": n, className: "stepper__item", children: /* @__PURE__ */ l(
+  return /* @__PURE__ */ u("li", { "aria-label": n, className: "stepper__item", children: /* @__PURE__ */ u(
     "p",
     {
       "aria-label": o ? `${n} (completed)` : n,
@@ -513,15 +513,15 @@ function pt() {
   if (gr)
     return F;
   gr = 1;
-  var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, t = e ? Symbol.for("react.fragment") : 60107, i = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, a = e ? Symbol.for("react.context") : 60110, m = e ? Symbol.for("react.async_mode") : 60111, u = e ? Symbol.for("react.concurrent_mode") : 60111, y = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, E = e ? Symbol.for("react.suspense_list") : 60120, P = e ? Symbol.for("react.memo") : 60115, R = e ? Symbol.for("react.lazy") : 60116, D = e ? Symbol.for("react.block") : 60121, k = e ? Symbol.for("react.fundamental") : 60117, q = e ? Symbol.for("react.responder") : 60118, re = e ? Symbol.for("react.scope") : 60119;
+  var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, t = e ? Symbol.for("react.fragment") : 60107, i = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, a = e ? Symbol.for("react.context") : 60110, d = e ? Symbol.for("react.async_mode") : 60111, l = e ? Symbol.for("react.concurrent_mode") : 60111, y = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, E = e ? Symbol.for("react.suspense_list") : 60120, P = e ? Symbol.for("react.memo") : 60115, R = e ? Symbol.for("react.lazy") : 60116, D = e ? Symbol.for("react.block") : 60121, k = e ? Symbol.for("react.fundamental") : 60117, q = e ? Symbol.for("react.responder") : 60118, re = e ? Symbol.for("react.scope") : 60119;
   function N(f) {
     if (typeof f == "object" && f !== null) {
       var G = f.$$typeof;
       switch (G) {
         case r:
           switch (f = f.type, f) {
-            case m:
-            case u:
+            case d:
+            case l:
             case t:
             case o:
             case i:
@@ -545,10 +545,10 @@ function pt() {
     }
   }
   function $(f) {
-    return N(f) === u;
+    return N(f) === l;
   }
-  return F.AsyncMode = m, F.ConcurrentMode = u, F.ContextConsumer = a, F.ContextProvider = s, F.Element = r, F.ForwardRef = y, F.Fragment = t, F.Lazy = R, F.Memo = P, F.Portal = n, F.Profiler = o, F.StrictMode = i, F.Suspense = g, F.isAsyncMode = function(f) {
-    return $(f) || N(f) === m;
+  return F.AsyncMode = d, F.ConcurrentMode = l, F.ContextConsumer = a, F.ContextProvider = s, F.Element = r, F.ForwardRef = y, F.Fragment = t, F.Lazy = R, F.Memo = P, F.Portal = n, F.Profiler = o, F.StrictMode = i, F.Suspense = g, F.isAsyncMode = function(f) {
+    return $(f) || N(f) === d;
   }, F.isConcurrentMode = $, F.isContextConsumer = function(f) {
     return N(f) === a;
   }, F.isContextProvider = function(f) {
@@ -572,7 +572,7 @@ function pt() {
   }, F.isSuspense = function(f) {
     return N(f) === g;
   }, F.isValidElementType = function(f) {
-    return typeof f == "string" || typeof f == "function" || f === t || f === u || f === o || f === i || f === g || f === E || typeof f == "object" && f !== null && (f.$$typeof === R || f.$$typeof === P || f.$$typeof === s || f.$$typeof === a || f.$$typeof === y || f.$$typeof === k || f.$$typeof === q || f.$$typeof === re || f.$$typeof === D);
+    return typeof f == "string" || typeof f == "function" || f === t || f === l || f === o || f === i || f === g || f === E || typeof f == "object" && f !== null && (f.$$typeof === R || f.$$typeof === P || f.$$typeof === s || f.$$typeof === a || f.$$typeof === y || f.$$typeof === k || f.$$typeof === q || f.$$typeof === re || f.$$typeof === D);
   }, F.typeOf = N, F;
 }
 var I = {};
@@ -587,10 +587,10 @@ var I = {};
 var br;
 function dt() {
   return br || (br = 1, process.env.NODE_ENV !== "production" && function() {
-    var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, t = e ? Symbol.for("react.fragment") : 60107, i = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, a = e ? Symbol.for("react.context") : 60110, m = e ? Symbol.for("react.async_mode") : 60111, u = e ? Symbol.for("react.concurrent_mode") : 60111, y = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, E = e ? Symbol.for("react.suspense_list") : 60120, P = e ? Symbol.for("react.memo") : 60115, R = e ? Symbol.for("react.lazy") : 60116, D = e ? Symbol.for("react.block") : 60121, k = e ? Symbol.for("react.fundamental") : 60117, q = e ? Symbol.for("react.responder") : 60118, re = e ? Symbol.for("react.scope") : 60119;
+    var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, n = e ? Symbol.for("react.portal") : 60106, t = e ? Symbol.for("react.fragment") : 60107, i = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, a = e ? Symbol.for("react.context") : 60110, d = e ? Symbol.for("react.async_mode") : 60111, l = e ? Symbol.for("react.concurrent_mode") : 60111, y = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, E = e ? Symbol.for("react.suspense_list") : 60120, P = e ? Symbol.for("react.memo") : 60115, R = e ? Symbol.for("react.lazy") : 60116, D = e ? Symbol.for("react.block") : 60121, k = e ? Symbol.for("react.fundamental") : 60117, q = e ? Symbol.for("react.responder") : 60118, re = e ? Symbol.for("react.scope") : 60119;
     function N(p) {
       return typeof p == "string" || typeof p == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
-      p === t || p === u || p === o || p === i || p === g || p === E || typeof p == "object" && p !== null && (p.$$typeof === R || p.$$typeof === P || p.$$typeof === s || p.$$typeof === a || p.$$typeof === y || p.$$typeof === k || p.$$typeof === q || p.$$typeof === re || p.$$typeof === D);
+      p === t || p === l || p === o || p === i || p === g || p === E || typeof p == "object" && p !== null && (p.$$typeof === R || p.$$typeof === P || p.$$typeof === s || p.$$typeof === a || p.$$typeof === y || p.$$typeof === k || p.$$typeof === q || p.$$typeof === re || p.$$typeof === D);
     }
     function $(p) {
       if (typeof p == "object" && p !== null) {
@@ -599,8 +599,8 @@ function dt() {
           case r:
             var pe = p.type;
             switch (pe) {
-              case m:
-              case u:
+              case d:
+              case l:
               case t:
               case o:
               case i:
@@ -624,12 +624,12 @@ function dt() {
         }
       }
     }
-    var f = m, G = u, ee = a, le = s, oe = r, ie = y, ue = t, fe = R, se = P, L = n, U = o, Z = i, ne = g, ce = !1;
+    var f = d, G = l, ee = a, le = s, oe = r, ie = y, ue = t, fe = R, se = P, L = n, U = o, Z = i, ne = g, ce = !1;
     function H(p) {
-      return ce || (ce = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), c(p) || $(p) === m;
+      return ce || (ce = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), c(p) || $(p) === d;
     }
     function c(p) {
-      return $(p) === u;
+      return $(p) === l;
     }
     function v(p) {
       return $(p) === a;
@@ -696,31 +696,31 @@ function mt() {
         return !1;
       for (var s = {}, a = 0; a < 10; a++)
         s["_" + String.fromCharCode(a)] = a;
-      var m = Object.getOwnPropertyNames(s).map(function(y) {
+      var d = Object.getOwnPropertyNames(s).map(function(y) {
         return s[y];
       });
-      if (m.join("") !== "0123456789")
+      if (d.join("") !== "0123456789")
         return !1;
-      var u = {};
+      var l = {};
       return "abcdefghijklmnopqrst".split("").forEach(function(y) {
-        u[y] = y;
-      }), Object.keys(Object.assign({}, u)).join("") === "abcdefghijklmnopqrst";
+        l[y] = y;
+      }), Object.keys(Object.assign({}, l)).join("") === "abcdefghijklmnopqrst";
     } catch {
       return !1;
     }
   }
   return Ge = i() ? Object.assign : function(o, s) {
-    for (var a, m = t(o), u, y = 1; y < arguments.length; y++) {
+    for (var a, d = t(o), l, y = 1; y < arguments.length; y++) {
       a = Object(arguments[y]);
       for (var g in a)
-        r.call(a, g) && (m[g] = a[g]);
+        r.call(a, g) && (d[g] = a[g]);
       if (e) {
-        u = e(a);
-        for (var E = 0; E < u.length; E++)
-          n.call(a, u[E]) && (m[u[E]] = a[u[E]]);
+        l = e(a);
+        for (var E = 0; E < l.length; E++)
+          n.call(a, l[E]) && (d[l[E]] = a[l[E]]);
       }
     }
-    return m;
+    return d;
   }, Ge;
 }
 var Ve, Er;
@@ -753,7 +753,7 @@ function vt() {
       }
     };
   }
-  function i(o, s, a, m, u) {
+  function i(o, s, a, d, l) {
     if (process.env.NODE_ENV !== "production") {
       for (var y in o)
         if (t(o, y)) {
@@ -761,19 +761,19 @@ function vt() {
           try {
             if (typeof o[y] != "function") {
               var E = Error(
-                (m || "React class") + ": " + a + " type `" + y + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof o[y] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
+                (d || "React class") + ": " + a + " type `" + y + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof o[y] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`."
               );
               throw E.name = "Invariant Violation", E;
             }
-            g = o[y](s, y, m, a, null, r);
+            g = o[y](s, y, d, a, null, r);
           } catch (R) {
             g = R;
           }
           if (g && !(g instanceof Error) && e(
-            (m || "React class") + ": type specification of " + a + " `" + y + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof g + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
+            (d || "React class") + ": type specification of " + a + " `" + y + "` is invalid; the type checker function must return `null` or an `Error` but returned a " + typeof g + ". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."
           ), g instanceof Error && !(g.message in n)) {
             n[g.message] = !0;
-            var P = u ? u() : "";
+            var P = l ? l() : "";
             e(
               "Failed " + a + " type: " + g.message + (P ?? "")
             );
@@ -793,20 +793,20 @@ function yt() {
   var e = Gr(), r = mt(), n = fr(), t = Vr(), i = vt(), o = function() {
   };
   process.env.NODE_ENV !== "production" && (o = function(a) {
-    var m = "Warning: " + a;
-    typeof console < "u" && console.error(m);
+    var d = "Warning: " + a;
+    typeof console < "u" && console.error(d);
     try {
-      throw new Error(m);
+      throw new Error(d);
     } catch {
     }
   });
   function s() {
     return null;
   }
-  return Ze = function(a, m) {
-    var u = typeof Symbol == "function" && Symbol.iterator, y = "@@iterator";
+  return Ze = function(a, d) {
+    var l = typeof Symbol == "function" && Symbol.iterator, y = "@@iterator";
     function g(c) {
-      var v = c && (u && c[u] || c[y]);
+      var v = c && (l && c[l] || c[y]);
       if (typeof v == "function")
         return v;
     }
@@ -843,7 +843,7 @@ function yt() {
         var v = {}, w = 0;
       function T(x, _, O, S, A, C, W) {
         if (S = S || E, C = C || O, W !== n) {
-          if (m) {
+          if (d) {
             var p = new Error(
               "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
             );
@@ -1118,7 +1118,7 @@ function gt() {
   function n() {
   }
   return n.resetWarningCache = r, Qe = function() {
-    function t(s, a, m, u, y, g) {
+    function t(s, a, d, l, y, g) {
       if (g !== e) {
         var E = new Error(
           "Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types"
@@ -1172,22 +1172,22 @@ function Ee(e, r, n, t) {
   return new (n || (n = Promise))(function(o, s) {
     function a(y) {
       try {
-        u(t.next(y));
+        l(t.next(y));
       } catch (g) {
         s(g);
       }
     }
-    function m(y) {
+    function d(y) {
       try {
-        u(t.throw(y));
+        l(t.throw(y));
       } catch (g) {
         s(g);
       }
     }
-    function u(y) {
-      y.done ? o(y.value) : i(y.value).then(a, m);
+    function l(y) {
+      y.done ? o(y.value) : i(y.value).then(a, d);
     }
-    u((t = t.apply(e, r || [])).next());
+    l((t = t.apply(e, r || [])).next());
   });
 }
 function we(e, r) {
@@ -1199,60 +1199,60 @@ function we(e, r) {
   return s = { next: a(0), throw: a(1), return: a(2) }, typeof Symbol == "function" && (s[Symbol.iterator] = function() {
     return this;
   }), s;
-  function a(u) {
+  function a(l) {
     return function(y) {
-      return m([u, y]);
+      return d([l, y]);
     };
   }
-  function m(u) {
+  function d(l) {
     if (t)
       throw new TypeError("Generator is already executing.");
-    for (; s && (s = 0, u[0] && (n = 0)), n; )
+    for (; s && (s = 0, l[0] && (n = 0)), n; )
       try {
-        if (t = 1, i && (o = u[0] & 2 ? i.return : u[0] ? i.throw || ((o = i.return) && o.call(i), 0) : i.next) && !(o = o.call(i, u[1])).done)
+        if (t = 1, i && (o = l[0] & 2 ? i.return : l[0] ? i.throw || ((o = i.return) && o.call(i), 0) : i.next) && !(o = o.call(i, l[1])).done)
           return o;
-        switch (i = 0, o && (u = [u[0] & 2, o.value]), u[0]) {
+        switch (i = 0, o && (l = [l[0] & 2, o.value]), l[0]) {
           case 0:
           case 1:
-            o = u;
+            o = l;
             break;
           case 4:
-            return n.label++, { value: u[1], done: !1 };
+            return n.label++, { value: l[1], done: !1 };
           case 5:
-            n.label++, i = u[1], u = [0];
+            n.label++, i = l[1], l = [0];
             continue;
           case 7:
-            u = n.ops.pop(), n.trys.pop();
+            l = n.ops.pop(), n.trys.pop();
             continue;
           default:
-            if (o = n.trys, !(o = o.length > 0 && o[o.length - 1]) && (u[0] === 6 || u[0] === 2)) {
+            if (o = n.trys, !(o = o.length > 0 && o[o.length - 1]) && (l[0] === 6 || l[0] === 2)) {
               n = 0;
               continue;
             }
-            if (u[0] === 3 && (!o || u[1] > o[0] && u[1] < o[3])) {
-              n.label = u[1];
+            if (l[0] === 3 && (!o || l[1] > o[0] && l[1] < o[3])) {
+              n.label = l[1];
               break;
             }
-            if (u[0] === 6 && n.label < o[1]) {
-              n.label = o[1], o = u;
+            if (l[0] === 6 && n.label < o[1]) {
+              n.label = o[1], o = l;
               break;
             }
             if (o && n.label < o[2]) {
-              n.label = o[2], n.ops.push(u);
+              n.label = o[2], n.ops.push(l);
               break;
             }
             o[2] && n.ops.pop(), n.trys.pop();
             continue;
         }
-        u = r.call(e, n);
+        l = r.call(e, n);
       } catch (y) {
-        u = [6, y], i = 0;
+        l = [6, y], i = 0;
       } finally {
         t = o = 0;
       }
-    if (u[0] & 5)
-      throw u[1];
-    return { value: u[0] ? u[1] : void 0, done: !0 };
+    if (l[0] & 5)
+      throw l[1];
+    return { value: l[0] ? l[1] : void 0, done: !0 };
   }
 }
 function xr(e, r) {
@@ -1503,7 +1503,7 @@ function Xr(e) {
       var s = this;
       r.readEntries(function(a) {
         return Ee(s, void 0, void 0, function() {
-          var m, u, y;
+          var d, l, y;
           return we(this, function(g) {
             switch (g.label) {
               case 0:
@@ -1513,9 +1513,9 @@ function Xr(e) {
               case 1:
                 return g.trys.push([1, 3, , 4]), [4, Promise.all(i)];
               case 2:
-                return m = g.sent(), n(m), [3, 4];
+                return d = g.sent(), n(d), [3, 4];
               case 3:
-                return u = g.sent(), t(u), [3, 4];
+                return l = g.sent(), t(l), [3, 4];
               case 4:
                 return [3, 6];
               case 5:
@@ -1629,8 +1629,8 @@ function Mt(e, r) {
     try {
       for (n = n.call(e); !(i = (s = n.next()).done) && (t.push(s.value), !(r && t.length === r)); i = !0)
         ;
-    } catch (m) {
-      o = !0, a = m;
+    } catch (d) {
+      o = !0, a = d;
     } finally {
       try {
         !i && n.return != null && n.return();
@@ -1691,8 +1691,8 @@ function de(e) {
 }
 function Kt(e) {
   var r = e.files, n = e.accept, t = e.minSize, i = e.maxSize, o = e.multiple, s = e.maxFiles, a = e.validator;
-  return !o && r.length > 1 || o && s >= 1 && r.length > s ? !1 : r.every(function(m) {
-    var u = en(m, n), y = Se(u, 1), g = y[0], E = rn(m, t, i), P = Se(E, 1), R = P[0], D = a ? a(m) : null;
+  return !o && r.length > 1 || o && s >= 1 && r.length > s ? !1 : r.every(function(d) {
+    var l = en(d, n), y = Se(l, 1), g = y[0], E = rn(d, t, i), P = Se(E, 1), R = P[0], D = a ? a(d) : null;
     return g && R && !D;
   });
 }
@@ -1816,8 +1816,8 @@ function uo(e, r) {
     try {
       for (n = n.call(e); !(i = (s = n.next()).done) && (t.push(s.value), !(r && t.length === r)); i = !0)
         ;
-    } catch (m) {
-      o = !0, a = m;
+    } catch (d) {
+      o = !0, a = d;
     } finally {
       try {
         !i && n.return != null && n.return();
@@ -2082,7 +2082,7 @@ var cr = {
   fileRejections: []
 };
 function sn() {
-  var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, r = M(M({}, an), e), n = r.accept, t = r.disabled, i = r.getFilesFromEvent, o = r.maxSize, s = r.minSize, a = r.multiple, m = r.maxFiles, u = r.onDragEnter, y = r.onDragLeave, g = r.onDragOver, E = r.onDrop, P = r.onDropAccepted, R = r.onDropRejected, D = r.onFileDialogCancel, k = r.onFileDialogOpen, q = r.useFsAccessApi, re = r.autoFocus, N = r.preventDropOnDocument, $ = r.noClick, f = r.noKeyboard, G = r.noDrag, ee = r.noDragEventsBubbling, le = r.onError, oe = r.validator, ie = ge(function() {
+  var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, r = M(M({}, an), e), n = r.accept, t = r.disabled, i = r.getFilesFromEvent, o = r.maxSize, s = r.minSize, a = r.multiple, d = r.maxFiles, l = r.onDragEnter, y = r.onDragLeave, g = r.onDragOver, E = r.onDrop, P = r.onDropAccepted, R = r.onDropRejected, D = r.onFileDialogCancel, k = r.onFileDialogOpen, q = r.useFsAccessApi, re = r.autoFocus, N = r.preventDropOnDocument, $ = r.noClick, f = r.noKeyboard, G = r.noDrag, ee = r.noDragEventsBubbling, le = r.onError, oe = r.validator, ie = ge(function() {
     return Zt(n);
   }, [n]), ue = ge(function() {
     return Xt(n);
@@ -2116,18 +2116,18 @@ function sn() {
     return !t && re && L.current && L.current.focus(), function() {
     };
   }, [L, re, t]);
-  var _ = X(function(d) {
-    le ? le(d) : console.error(d);
-  }, [le]), O = X(function(d) {
-    d.preventDefault(), d.persist(), Pe(d), h.current = [].concat(io(h.current), [d.target]), Ie(d) && Promise.resolve(i(d)).then(function(b) {
-      if (!(Ne(d) && !ee)) {
+  var _ = X(function(m) {
+    le ? le(m) : console.error(m);
+  }, [le]), O = X(function(m) {
+    m.preventDefault(), m.persist(), Pe(m), h.current = [].concat(io(h.current), [m.target]), Ie(m) && Promise.resolve(i(m)).then(function(b) {
+      if (!(Ne(m) && !ee)) {
         var B = b.length, K = B > 0 && Kt({
           files: b,
           accept: ie,
           minSize: s,
           maxSize: o,
           multiple: a,
-          maxFiles: m,
+          maxFiles: d,
           validator: oe
         }), J = B > 0 && !K;
         H({
@@ -2135,34 +2135,34 @@ function sn() {
           isDragReject: J,
           isDragActive: !0,
           type: "setDraggedFiles"
-        }), u && u(d);
+        }), l && l(m);
       }
     }).catch(function(b) {
       return _(b);
     });
-  }, [i, u, _, ee, ie, s, o, a, m, oe]), S = X(function(d) {
-    d.preventDefault(), d.persist(), Pe(d);
-    var b = Ie(d);
-    if (b && d.dataTransfer)
+  }, [i, l, _, ee, ie, s, o, a, d, oe]), S = X(function(m) {
+    m.preventDefault(), m.persist(), Pe(m);
+    var b = Ie(m);
+    if (b && m.dataTransfer)
       try {
-        d.dataTransfer.dropEffect = "copy";
+        m.dataTransfer.dropEffect = "copy";
       } catch {
       }
-    return b && g && g(d), !1;
-  }, [g, ee]), A = X(function(d) {
-    d.preventDefault(), d.persist(), Pe(d);
+    return b && g && g(m), !1;
+  }, [g, ee]), A = X(function(m) {
+    m.preventDefault(), m.persist(), Pe(m);
     var b = h.current.filter(function(K) {
       return L.current && L.current.contains(K);
-    }), B = b.indexOf(d.target);
+    }), B = b.indexOf(m.target);
     B !== -1 && b.splice(B, 1), h.current = b, !(b.length > 0) && (H({
       type: "setDraggedFiles",
       isDragActive: !1,
       isDragAccept: !1,
       isDragReject: !1
-    }), Ie(d) && y && y(d));
-  }, [L, y, ee]), C = X(function(d, b) {
+    }), Ie(m) && y && y(m));
+  }, [L, y, ee]), C = X(function(m, b) {
     var B = [], K = [];
-    d.forEach(function(J) {
+    m.forEach(function(J) {
       var Oe = en(J, ie), ye = er(Oe, 2), Be = ye[0], We = ye[1], Ye = rn(J, s, o), Re = er(Ye, 2), qe = Re[0], He = Re[1], Ke = oe ? oe(J) : null;
       if (Be && qe && !Ke)
         B.push(J);
@@ -2175,7 +2175,7 @@ function sn() {
           })
         });
       }
-    }), (!a && B.length > 1 || a && m >= 1 && B.length > m) && (B.forEach(function(J) {
+    }), (!a && B.length > 1 || a && d >= 1 && B.length > d) && (B.forEach(function(J) {
       K.push({
         file: J,
         errors: [Ht]
@@ -2185,9 +2185,9 @@ function sn() {
       fileRejections: K,
       type: "setFiles"
     }), E && E(B, K, b), K.length > 0 && R && R(K, b), B.length > 0 && P && P(B, b);
-  }, [H, a, ie, s, o, m, E, P, R, oe]), W = X(function(d) {
-    d.preventDefault(), d.persist(), Pe(d), h.current = [], Ie(d) && Promise.resolve(i(d)).then(function(b) {
-      Ne(d) && !ee || C(b, d);
+  }, [H, a, ie, s, o, d, E, P, R, oe]), W = X(function(m) {
+    m.preventDefault(), m.persist(), Pe(m), h.current = [], Ie(m) && Promise.resolve(i(m)).then(function(b) {
+      Ne(m) && !ee || C(b, m);
     }).catch(function(b) {
       return _(b);
     }), H({
@@ -2198,11 +2198,11 @@ function sn() {
       H({
         type: "openDialog"
       }), fe();
-      var d = {
+      var m = {
         multiple: a,
         types: ue
       };
-      window.showOpenFilePicker(d).then(function(b) {
+      window.showOpenFilePicker(m).then(function(b) {
         return i(b);
       }).then(function(b) {
         C(b, null), H({
@@ -2218,8 +2218,8 @@ function sn() {
     U.current && (H({
       type: "openDialog"
     }), fe(), U.current.value = null, U.current.click());
-  }, [H, fe, se, q, C, _, ue, a]), V = X(function(d) {
-    !L.current || !L.current.isEqualNode(d.target) || (d.key === " " || d.key === "Enter" || d.keyCode === 32 || d.keyCode === 13) && (d.preventDefault(), p());
+  }, [H, fe, se, q, C, _, ue, a]), V = X(function(m) {
+    !L.current || !L.current.isEqualNode(m.target) || (m.key === " " || m.key === "Enter" || m.keyCode === 32 || m.keyCode === 13) && (m.preventDefault(), p());
   }, [L, p]), pe = X(function() {
     H({
       type: "focus"
@@ -2240,7 +2240,7 @@ function sn() {
     ee && b.stopPropagation();
   }, cn = ge(function() {
     return function() {
-      var d = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, b = d.refKey, B = b === void 0 ? "ref" : b, K = d.role, J = d.onKeyDown, Oe = d.onFocus, ye = d.onBlur, Be = d.onClick, We = d.onDragEnter, Ye = d.onDragOver, Re = d.onDragLeave, qe = d.onDrop, He = $e(d, to);
+      var m = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, b = m.refKey, B = b === void 0 ? "ref" : b, K = m.role, J = m.onKeyDown, Oe = m.onFocus, ye = m.onBlur, Be = m.onClick, We = m.onDragEnter, Ye = m.onDragOver, Re = m.onDragLeave, qe = m.onDrop, He = $e(m, to);
       return M(M(sr({
         onKeyDown: ze(te(J, V)),
         onFocus: ze(te(Oe, pe)),
@@ -2255,11 +2255,11 @@ function sn() {
         tabIndex: 0
       } : {}), He);
     };
-  }, [L, V, pe, Te, dr, O, S, A, W, f, G, t]), ln = X(function(d) {
-    d.stopPropagation();
+  }, [L, V, pe, Te, dr, O, S, A, W, f, G, t]), ln = X(function(m) {
+    m.stopPropagation();
   }, []), un = ge(function() {
     return function() {
-      var d = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, b = d.refKey, B = b === void 0 ? "ref" : b, K = d.onChange, J = d.onClick, Oe = $e(d, oo), ye = sr({
+      var m = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, b = m.refKey, B = b === void 0 ? "ref" : b, K = m.onChange, J = m.onClick, Oe = $e(m, oo), ye = sr({
         accept: ie,
         multiple: a,
         type: "file",
@@ -2325,7 +2325,7 @@ const Oo = ({
   const { getRootProps: r } = sn({
     onDrop: e
   });
-  return /* @__PURE__ */ l("div", { ...r(), className: "file-upload", "data-testid": "file-upload", children: /* @__PURE__ */ l("button", { className: "file-upload__button", children: "Drag and drop files here or click to upload" }) });
+  return /* @__PURE__ */ u("div", { ...r(), className: "file-upload", "data-testid": "file-upload", children: /* @__PURE__ */ u("button", { className: "file-upload__button", children: "Drag and drop files here or click to upload" }) });
 };
 const vo = ({
   items: e,
@@ -2335,27 +2335,27 @@ const vo = ({
   updateItems: i,
   isOpen: o,
   ...s
-}) => /* @__PURE__ */ l(Ur, { isVisible: o, children: /* @__PURE__ */ ae("div", { className: "multi-select__dropdown", role: "listbox", ...s, children: [
-  t && /* @__PURE__ */ l("h5", { className: "multi-select__dropdown-header", children: t }),
-  /* @__PURE__ */ l("ul", { className: "multi-select__dropdown-list", children: e.map((a) => /* @__PURE__ */ l("li", { className: "multi-select__dropdown-item", children: /* @__PURE__ */ l(
+}) => /* @__PURE__ */ u(Ur, { isVisible: o, children: /* @__PURE__ */ ae("div", { className: "multi-select__dropdown", role: "listbox", ...s, children: [
+  t && /* @__PURE__ */ u("h5", { className: "multi-select__dropdown-header", children: t }),
+  /* @__PURE__ */ u("ul", { className: "multi-select__dropdown-list", children: e.map((a) => /* @__PURE__ */ u("li", { className: "multi-select__dropdown-item", children: /* @__PURE__ */ u(
     On,
     {
-      disabled: n.includes(a),
-      label: a,
-      checked: r.includes(a),
+      disabled: n.some((d) => d.value === a.value),
+      label: a.label,
+      checked: r.some((d) => d.value === a.value),
       onChange: () => i(
-        r.includes(a) ? r.filter((m) => m !== a) : [...r, a]
+        r.some((d) => d.value === a.value) ? r.filter((d) => d.value !== a.value) : [...r, a]
       )
     }
-  ) }, a)) }),
+  ) }, a.value)) }),
   /* @__PURE__ */ ae("div", { className: "multi-select__buttons", children: [
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ u(
       _e,
       {
         appearance: "link",
         onClick: () => {
           const a = e.filter(
-            (m) => !n.includes(m)
+            (d) => !n.some((l) => l.value === d.value)
           );
           i([...r, ...a]);
         },
@@ -2363,13 +2363,13 @@ const vo = ({
         children: "Select all"
       }
     ),
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ u(
       _e,
       {
         appearance: "link",
         onClick: () => {
           const a = r.filter(
-            (m) => n.includes(m)
+            (d) => n.some((l) => l.value === d.value)
           );
           i(a);
         },
@@ -2387,9 +2387,9 @@ const vo = ({
   required: o = !1,
   items: s = [],
   disabledItems: a = [],
-  header: m
+  header: d
 }) => {
-  const u = Cn(() => {
+  const l = Cn(() => {
     g(!1);
   });
   xn(() => g(!1));
@@ -2402,10 +2402,10 @@ const vo = ({
   ), k = r || R, q = (f) => {
     const G = Array.from(new Set(f));
     D(G), t && t(G);
-  }, re = k.map((f) => /* @__PURE__ */ l("li", { className: "multi-select__selected-item", "aria-label": f, children: f }, f)), N = rr(), $ = rr();
-  return /* @__PURE__ */ l("div", { ref: u, children: /* @__PURE__ */ ae("div", { className: "multi-select", children: [
-    k.length > 0 && /* @__PURE__ */ l("ul", { className: "multi-select__selected-list", "aria-label": "selected", children: re }),
-    /* @__PURE__ */ l(
+  }, re = k.filter((f) => s.some((G) => G.value === f.value)).map((f) => /* @__PURE__ */ u("li", { className: "multi-select__selected-item", "aria-label": f.label, children: f.label }, f.value)), N = rr(), $ = rr();
+  return /* @__PURE__ */ u("div", { ref: l, children: /* @__PURE__ */ ae("div", { className: "multi-select", children: [
+    k.length > 0 && /* @__PURE__ */ u("ul", { className: "multi-select__selected-list", "aria-label": "selected", children: re }),
+    /* @__PURE__ */ u(
       Lr,
       {
         "aria-controls": N,
@@ -2424,15 +2424,15 @@ const vo = ({
         className: "multi-select__input"
       }
     ),
-    /* @__PURE__ */ l(
+    /* @__PURE__ */ u(
       vo,
       {
         id: N,
         isOpen: y,
-        items: E.length > 0 ? s.filter((f) => f.includes(E)) : s,
+        items: E.length > 0 ? s.filter((f) => f.label.includes(E)) : s,
         selectedItems: k,
         disabledItems: a,
-        header: m,
+        header: d,
         updateItems: q
       }
     )