jcicl 1.0.63 → 1.0.64

package/AppContainer/AppContainer.js

@@ -1,144 +1,144 @@
-import { jsx as i, jsxs as y, Fragment as ke } from "react/jsx-runtime";
+import { jsx as i, jsxs as C, Fragment as ye } from "react/jsx-runtime";
 import * as D from "react";
-import { useState as K } from "react";
-import { c as de } from "../.chunks/createSvgIcon.js";
+import { useState as ee } from "react";
+import { c as pe } from "../.chunks/createSvgIcon.js";
 import { n as m, i as _ } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as P } from "../.chunks/emotion-react.browser.esm.js";
-import { P as Ve, A as Ge } from "../.chunks/AppHeader.js";
-import { Nav as L } from "../Nav/Nav.js";
-import Z from "../ScrollContainer/ScrollContainer.js";
-import { Button as re } from "../Button/Button.js";
-import r from "../theme.js";
-import { l as Xe } from "../.chunks/jocologo.js";
-import { X as Ye } from "../.chunks/Close.js";
-import { P as t, g as _e, a as qe, s as pe, r as Qe, c as te, u as Je, b as ee, d as Ke } from "../.chunks/DefaultPropsProvider.js";
-import { u as Ze } from "../.chunks/index.js";
-import { e as eo, H as oo, u as He, g as ro, T as to, r as no, b as ye } from "../.chunks/Portal.js";
-import { m as Ee } from "../.chunks/memoTheme.js";
-import { o as Se, d as io, M as ao } from "../.chunks/TextField.js";
-import { P as so } from "../.chunks/Paper.js";
-import { i as lo } from "../.chunks/integerPropType.js";
-import { c as co } from "../.chunks/chainPropTypes.js";
-import { u as po } from "../.chunks/TransitionGroupContext.js";
-import { u as Ce } from "../.chunks/useMediaQuery.js";
-function ho(e, o, a) {
-  const n = o.getBoundingClientRect(), l = a && a.getBoundingClientRect(), T = Se(o);
-  let x;
+import { c as T } from "../.chunks/emotion-react.browser.esm.js";
+import { P as Ge, A as Xe } from "../.chunks/AppHeader.js";
+import { Nav as j } from "../Nav/Nav.js";
+import oe from "../ScrollContainer/ScrollContainer.js";
+import { Button as ne } from "../Button/Button.js";
+import a from "../theme.js";
+import { l as Ye } from "../.chunks/jocologo.js";
+import { X as Qe } from "../.chunks/Close.js";
+import { P as r, g as _e, a as qe, s as he, r as Je, c as ie, u as Ke, b as re, d as Ze } from "../.chunks/DefaultPropsProvider.js";
+import { u as eo } from "../.chunks/index.js";
+import { e as oo, H as ro, u as ze, g as to, T as no, r as io, b as Ce } from "../.chunks/Portal.js";
+import { m as De } from "../.chunks/memoTheme.js";
+import { o as Se, d as ao, M as so } from "../.chunks/TextField.js";
+import { P as lo } from "../.chunks/Paper.js";
+import { i as co } from "../.chunks/integerPropType.js";
+import { c as po } from "../.chunks/chainPropTypes.js";
+import { u as ho } from "../.chunks/TransitionGroupContext.js";
+import { u as Pe } from "../.chunks/useMediaQuery.js";
+function uo(e, o, t) {
+  const n = o.getBoundingClientRect(), l = t && t.getBoundingClientRect(), R = Se(o);
+  let b;
   if (o.fakeTransform)
-    x = o.fakeTransform;
+    b = o.fakeTransform;
   else {
-    const u = T.getComputedStyle(o);
-    x = u.getPropertyValue("-webkit-transform") || u.getPropertyValue("transform");
+    const p = R.getComputedStyle(o);
+    b = p.getPropertyValue("-webkit-transform") || p.getPropertyValue("transform");
   }
-  let d = 0, g = 0;
-  if (x && x !== "none" && typeof x == "string") {
-    const u = x.split("(")[1].split(")")[0].split(",");
-    d = parseInt(u[4], 10), g = parseInt(u[5], 10);
+  let d = 0, f = 0;
+  if (b && b !== "none" && typeof b == "string") {
+    const p = b.split("(")[1].split(")")[0].split(",");
+    d = parseInt(p[4], 10), f = parseInt(p[5], 10);
   }
-  return e === "left" ? l ? `translateX(${l.right + d - n.left}px)` : `translateX(${T.innerWidth + d - n.left}px)` : e === "right" ? l ? `translateX(-${n.right - l.left - d}px)` : `translateX(-${n.left + n.width - d}px)` : e === "up" ? l ? `translateY(${l.bottom + g - n.top}px)` : `translateY(${T.innerHeight + g - n.top}px)` : l ? `translateY(-${n.top - l.top + n.height - g}px)` : `translateY(-${n.top + n.height - g}px)`;
+  return e === "left" ? l ? `translateX(${l.right + d - n.left}px)` : `translateX(${R.innerWidth + d - n.left}px)` : e === "right" ? l ? `translateX(-${n.right - l.left - d}px)` : `translateX(-${n.left + n.width - d}px)` : e === "up" ? l ? `translateY(${l.bottom + f - n.top}px)` : `translateY(${R.innerHeight + f - n.top}px)` : l ? `translateY(-${n.top - l.top + n.height - f}px)` : `translateY(-${n.top + n.height - f}px)`;
 }
-function ze(e) {
+function Ie(e) {
   return typeof e == "function" ? e() : e;
 }
-function oe(e, o, a) {
-  const n = ze(a), l = ho(e, o, n);
+function te(e, o, t) {
+  const n = Ie(t), l = uo(e, o, n);
   l && (o.style.webkitTransform = l, o.style.transform = l);
 }
-const De = /* @__PURE__ */ D.forwardRef(function(o, a) {
-  const n = He(), l = {
+const Ne = /* @__PURE__ */ D.forwardRef(function(o, t) {
+  const n = ze(), l = {
     enter: n.transitions.easing.easeOut,
     exit: n.transitions.easing.sharp
-  }, T = {
+  }, R = {
     enter: n.transitions.duration.enteringScreen,
     exit: n.transitions.duration.leavingScreen
   }, {
-    addEndListener: x,
+    addEndListener: b,
     appear: d = !0,
-    children: g,
-    container: u,
-    direction: b = "down",
-    easing: O = l,
-    in: C,
-    onEnter: F,
-    onEntered: W,
-    onEntering: j,
-    onExit: I,
-    onExited: $,
-    onExiting: V,
-    style: R,
-    timeout: M = T,
+    children: f,
+    container: p,
+    direction: g = "down",
+    easing: N = l,
+    in: P,
+    onEnter: U,
+    onEntered: X,
+    onEntering: O,
+    onExit: k,
+    onExited: B,
+    onExiting: S,
+    style: H,
+    timeout: $ = R,
     // eslint-disable-next-line react/prop-types
-    TransitionComponent: v = to,
-    ...H
-  } = o, h = D.useRef(null), G = po(ro(g), h, a), E = (s) => (f) => {
-    s && (f === void 0 ? s(h.current) : s(h.current, f));
-  }, c = E((s, f) => {
-    oe(b, s, u), no(s), F && F(s, f);
-  }), p = E((s, f) => {
-    const z = ye({
-      timeout: M,
-      style: R,
-      easing: O
+    TransitionComponent: M = no,
+    ...x
+  } = o, h = D.useRef(null), A = ho(to(f), h, t), E = (s) => (u) => {
+    s && (u === void 0 ? s(h.current) : s(h.current, u));
+  }, z = E((s, u) => {
+    te(g, s, p), io(s), U && U(s, u);
+  }), c = E((s, u) => {
+    const J = Ce({
+      timeout: $,
+      style: H,
+      easing: N
     }, {
       mode: "enter"
     });
     s.style.webkitTransition = n.transitions.create("-webkit-transform", {
-      ...z
+      ...J
     }), s.style.transition = n.transitions.create("transform", {
-      ...z
-    }), s.style.webkitTransform = "none", s.style.transform = "none", j && j(s, f);
-  }), N = E(W), S = E(V), k = E((s) => {
-    const f = ye({
-      timeout: M,
-      style: R,
-      easing: O
+      ...J
+    }), s.style.webkitTransform = "none", s.style.transform = "none", O && O(s, u);
+  }), v = E(X), I = E(S), W = E((s) => {
+    const u = Ce({
+      timeout: $,
+      style: H,
+      easing: N
     }, {
       mode: "exit"
     });
-    s.style.webkitTransition = n.transitions.create("-webkit-transform", f), s.style.transition = n.transitions.create("transform", f), oe(b, s, u), I && I(s);
-  }), B = E((s) => {
-    s.style.webkitTransition = "", s.style.transition = "", $ && $(s);
-  }), ne = (s) => {
-    x && x(h.current, s);
+    s.style.webkitTransition = n.transitions.create("-webkit-transform", u), s.style.transition = n.transitions.create("transform", u), te(g, s, p), k && k(s);
+  }), y = E((s) => {
+    s.style.webkitTransition = "", s.style.transition = "", B && B(s);
+  }), L = (s) => {
+    b && b(h.current, s);
   }, q = D.useCallback(() => {
-    h.current && oe(b, h.current, u);
-  }, [b, u]);
+    h.current && te(g, h.current, p);
+  }, [g, p]);
   return D.useEffect(() => {
-    if (C || b === "down" || b === "right")
+    if (P || g === "down" || g === "right")
       return;
-    const s = io(() => {
-      h.current && oe(b, h.current, u);
-    }), f = Se(h.current);
-    return f.addEventListener("resize", s), () => {
-      s.clear(), f.removeEventListener("resize", s);
+    const s = ao(() => {
+      h.current && te(g, h.current, p);
+    }), u = Se(h.current);
+    return u.addEventListener("resize", s), () => {
+      s.clear(), u.removeEventListener("resize", s);
     };
-  }, [b, C, u]), D.useEffect(() => {
-    C || q();
-  }, [C, q]), /* @__PURE__ */ i(v, {
+  }, [g, P, p]), D.useEffect(() => {
+    P || q();
+  }, [P, q]), /* @__PURE__ */ i(M, {
     nodeRef: h,
-    onEnter: c,
-    onEntered: N,
-    onEntering: p,
-    onExit: k,
-    onExited: B,
-    onExiting: S,
-    addEndListener: ne,
+    onEnter: z,
+    onEntered: v,
+    onEntering: c,
+    onExit: W,
+    onExited: y,
+    onExiting: I,
+    addEndListener: L,
     appear: d,
-    in: C,
-    timeout: M,
-    ...H,
-    children: (s, f) => /* @__PURE__ */ D.cloneElement(g, {
-      ref: G,
+    in: P,
+    timeout: $,
+    ...x,
+    children: (s, u) => /* @__PURE__ */ D.cloneElement(f, {
+      ref: A,
       style: {
-        visibility: s === "exited" && !C ? "hidden" : void 0,
-        ...R,
-        ...g.props.style
+        visibility: s === "exited" && !P ? "hidden" : void 0,
+        ...H,
+        ...f.props.style
       },
-      ...f
+      ...u
     })
   });
 });
-process.env.NODE_ENV !== "production" && (De.propTypes = {
+process.env.NODE_ENV !== "production" && (Ne.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -148,27 +148,27 @@ process.env.NODE_ENV !== "production" && (De.propTypes = {
    * node and a done callback. Allows for more fine grained transition end
    * logic. Note: Timeouts are still used as a fallback if provided.
    */
-  addEndListener: t.func,
+  addEndListener: r.func,
   /**
    * Perform the enter transition when it first mounts if `in` is also `true`.
    * Set this to `false` to disable this behavior.
    * @default true
    */
-  appear: t.bool,
+  appear: r.bool,
   /**
    * A single child content element.
    */
-  children: eo.isRequired,
+  children: oo.isRequired,
   /**
    * An HTML element, or a function that returns one.
    * It's used to set the container the Slide is transitioning from.
    */
-  container: co(t.oneOfType([oo, t.func]), (e) => {
+  container: po(r.oneOfType([ro, r.func]), (e) => {
     if (e.open) {
-      const o = ze(e.container);
+      const o = Ie(e.container);
       if (o && o.nodeType === 1) {
-        const a = o.getBoundingClientRect();
-        if (process.env.NODE_ENV !== "test" && a.top === 0 && a.left === 0 && a.right === 0 && a.bottom === 0)
+        const t = o.getBoundingClientRect();
+        if (process.env.NODE_ENV !== "test" && t.top === 0 && t.left === 0 && t.right === 0 && t.bottom === 0)
           return new Error(["MUI: The `container` prop provided to the component is invalid.", "The anchor element should be part of the document layout.", "Make sure the element is present in the document or that it's not display none."].join(`
 `));
       } else if (!o || typeof o.getBoundingClientRect != "function" || o.contextElement != null && o.contextElement.nodeType !== 1)
@@ -181,7 +181,7 @@ process.env.NODE_ENV !== "production" && (De.propTypes = {
    * Direction the child node will enter from.
    * @default 'down'
    */
-  direction: t.oneOf(["down", "left", "right", "up"]),
+  direction: r.oneOf(["down", "left", "right", "up"]),
   /**
    * The transition timing function.
    * You may specify a single easing or a object containing enter and exit values.
@@ -190,42 +190,42 @@ process.env.NODE_ENV !== "production" && (De.propTypes = {
    *   exit: theme.transitions.easing.sharp,
    * }
    */
-  easing: t.oneOfType([t.shape({
-    enter: t.string,
-    exit: t.string
-  }), t.string]),
+  easing: r.oneOfType([r.shape({
+    enter: r.string,
+    exit: r.string
+  }), r.string]),
   /**
    * If `true`, the component will transition in.
    */
-  in: t.bool,
+  in: r.bool,
   /**
    * @ignore
    */
-  onEnter: t.func,
+  onEnter: r.func,
   /**
    * @ignore
    */
-  onEntered: t.func,
+  onEntered: r.func,
   /**
    * @ignore
    */
-  onEntering: t.func,
+  onEntering: r.func,
   /**
    * @ignore
    */
-  onExit: t.func,
+  onExit: r.func,
   /**
    * @ignore
    */
-  onExited: t.func,
+  onExited: r.func,
   /**
    * @ignore
    */
-  onExiting: t.func,
+  onExiting: r.func,
   /**
    * @ignore
    */
-  style: t.object,
+  style: r.object,
   /**
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
@@ -234,59 +234,59 @@ process.env.NODE_ENV !== "production" && (De.propTypes = {
    *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
-  timeout: t.oneOfType([t.number, t.shape({
-    appear: t.number,
-    enter: t.number,
-    exit: t.number
+  timeout: r.oneOfType([r.number, r.shape({
+    appear: r.number,
+    enter: r.number,
+    exit: r.number
   })])
 });
-function uo(e) {
+function fo(e) {
   return _e("MuiDrawer", e);
 }
 qe("MuiDrawer", ["root", "docked", "paper", "paperAnchorLeft", "paperAnchorRight", "paperAnchorTop", "paperAnchorBottom", "paperAnchorDockedLeft", "paperAnchorDockedRight", "paperAnchorDockedTop", "paperAnchorDockedBottom", "modal"]);
-const Ie = (e, o) => {
+const Oe = (e, o) => {
   const {
-    ownerState: a
+    ownerState: t
   } = e;
-  return [o.root, (a.variant === "permanent" || a.variant === "persistent") && o.docked, o.modal];
-}, fo = (e) => {
+  return [o.root, (t.variant === "permanent" || t.variant === "persistent") && o.docked, o.modal];
+}, mo = (e) => {
   const {
     classes: o,
-    anchor: a,
+    anchor: t,
     variant: n
   } = e, l = {
     root: ["root"],
     docked: [(n === "permanent" || n === "persistent") && "docked"],
     modal: ["modal"],
-    paper: ["paper", `paperAnchor${te(a)}`, n !== "temporary" && `paperAnchorDocked${te(a)}`]
+    paper: ["paper", `paperAnchor${ie(t)}`, n !== "temporary" && `paperAnchorDocked${ie(t)}`]
   };
-  return Ke(l, uo, o);
-}, go = pe(ao, {
+  return Ze(l, fo, o);
+}, go = he(so, {
   name: "MuiDrawer",
   slot: "Root",
-  overridesResolver: Ie
-})(Ee(({
+  overridesResolver: Oe
+})(De(({
   theme: e
 }) => ({
   zIndex: (e.vars || e).zIndex.drawer
-}))), $e = pe("div", {
-  shouldForwardProp: Qe,
+}))), $e = he("div", {
+  shouldForwardProp: Je,
   name: "MuiDrawer",
   slot: "Docked",
   skipVariantsResolver: !1,
-  overridesResolver: Ie
+  overridesResolver: Oe
 })({
   flex: "0 0 auto"
-}), mo = pe(so, {
+}), bo = he(lo, {
   name: "MuiDrawer",
   slot: "Paper",
   overridesResolver: (e, o) => {
     const {
-      ownerState: a
+      ownerState: t
     } = e;
-    return [o.paper, o[`paperAnchor${te(a.anchor)}`], a.variant !== "temporary" && o[`paperAnchorDocked${te(a.anchor)}`]];
+    return [o.paper, o[`paperAnchor${ie(t.anchor)}`], t.variant !== "temporary" && o[`paperAnchorDocked${ie(t.anchor)}`]];
   }
-})(Ee(({
+})(De(({
   theme: e
 }) => ({
   overflowY: "auto",
@@ -370,108 +370,108 @@ const Ie = (e, o) => {
       borderTop: `1px solid ${(e.vars || e).palette.divider}`
     }
   }]
-}))), Ne = {
+}))), Be = {
   left: "right",
   right: "left",
   top: "down",
   bottom: "up"
 };
-function bo(e) {
+function xo(e) {
   return ["left", "right"].includes(e);
 }
-function xo({
+function vo({
   direction: e
 }, o) {
-  return e === "rtl" && bo(o) ? Ne[o] : o;
+  return e === "rtl" && xo(o) ? Be[o] : o;
 }
-const U = /* @__PURE__ */ D.forwardRef(function(o, a) {
-  const n = Je({
+const G = /* @__PURE__ */ D.forwardRef(function(o, t) {
+  const n = Ke({
     props: o,
     name: "MuiDrawer"
-  }), l = He(), T = Ze(), x = {
+  }), l = ze(), R = eo(), b = {
     enter: l.transitions.duration.enteringScreen,
     exit: l.transitions.duration.leavingScreen
   }, {
     anchor: d = "left",
-    BackdropProps: g,
-    children: u,
-    className: b,
-    elevation: O = 16,
-    hideBackdrop: C = !1,
+    BackdropProps: f,
+    children: p,
+    className: g,
+    elevation: N = 16,
+    hideBackdrop: P = !1,
     ModalProps: {
-      BackdropProps: F,
-      ...W
+      BackdropProps: U,
+      ...X
     } = {},
-    onClose: j,
-    open: I = !1,
-    PaperProps: $ = {},
-    SlideProps: V,
+    onClose: O,
+    open: k = !1,
+    PaperProps: B = {},
+    SlideProps: S,
     // eslint-disable-next-line react/prop-types
-    TransitionComponent: R = De,
-    transitionDuration: M = x,
-    variant: v = "temporary",
-    ...H
+    TransitionComponent: H = Ne,
+    transitionDuration: $ = b,
+    variant: M = "temporary",
+    ...x
   } = n, h = D.useRef(!1);
   D.useEffect(() => {
     h.current = !0;
   }, []);
-  const G = xo({
-    direction: T ? "rtl" : "ltr"
-  }, d), c = {
+  const A = vo({
+    direction: R ? "rtl" : "ltr"
+  }, d), z = {
     ...n,
     anchor: d,
-    elevation: O,
-    open: I,
-    variant: v,
-    ...H
-  }, p = fo(c), N = /* @__PURE__ */ i(mo, {
-    elevation: v === "temporary" ? O : 0,
+    elevation: N,
+    open: k,
+    variant: M,
+    ...x
+  }, c = mo(z), v = /* @__PURE__ */ i(bo, {
+    elevation: M === "temporary" ? N : 0,
     square: !0,
-    ...$,
-    className: ee(p.paper, $.className),
-    ownerState: c,
-    children: u
+    ...B,
+    className: re(c.paper, B.className),
+    ownerState: z,
+    children: p
   });
-  if (v === "permanent")
+  if (M === "permanent")
     return /* @__PURE__ */ i($e, {
-      className: ee(p.root, p.docked, b),
-      ownerState: c,
-      ref: a,
-      ...H,
-      children: N
+      className: re(c.root, c.docked, g),
+      ownerState: z,
+      ref: t,
+      ...x,
+      children: v
     });
-  const S = /* @__PURE__ */ i(R, {
-    in: I,
-    direction: Ne[G],
-    timeout: M,
+  const I = /* @__PURE__ */ i(H, {
+    in: k,
+    direction: Be[A],
+    timeout: $,
     appear: h.current,
-    ...V,
-    children: N
+    ...S,
+    children: v
   });
-  return v === "persistent" ? /* @__PURE__ */ i($e, {
-    className: ee(p.root, p.docked, b),
-    ownerState: c,
-    ref: a,
-    ...H,
-    children: S
+  return M === "persistent" ? /* @__PURE__ */ i($e, {
+    className: re(c.root, c.docked, g),
+    ownerState: z,
+    ref: t,
+    ...x,
+    children: I
   }) : /* @__PURE__ */ i(go, {
     BackdropProps: {
-      ...g,
-      ...F,
-      transitionDuration: M
+      ...f,
+      ...U,
+      transitionDuration: $
     },
-    className: ee(p.root, p.modal, b),
-    open: I,
-    ownerState: c,
-    onClose: j,
-    hideBackdrop: C,
-    ref: a,
-    ...H,
-    ...W,
-    children: S
+    className: re(c.root, c.modal, g),
+    open: k,
+    ownerState: z,
+    onClose: O,
+    hideBackdrop: P,
+    ref: t,
+    ...x,
+    ...X,
+    children: I
   });
 });
-process.env.NODE_ENV !== "production" && (U.propTypes = {
+process.env.NODE_ENV !== "production" && (G.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -480,38 +480,38 @@ process.env.NODE_ENV !== "production" && (U.propTypes = {
    * Side from which the drawer will appear.
    * @default 'left'
    */
-  anchor: t.oneOf(["bottom", "left", "right", "top"]),
+  anchor: r.oneOf(["bottom", "left", "right", "top"]),
   /**
    * @ignore
    */
-  BackdropProps: t.object,
+  BackdropProps: r.object,
   /**
    * The content of the component.
    */
-  children: t.node,
+  children: r.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: t.object,
+  classes: r.object,
   /**
    * @ignore
    */
-  className: t.string,
+  className: r.string,
   /**
    * The elevation of the drawer.
    * @default 16
    */
-  elevation: lo,
+  elevation: co,
   /**
    * If `true`, the backdrop is not rendered.
    * @default false
    */
-  hideBackdrop: t.bool,
+  hideBackdrop: r.bool,
   /**
    * Props applied to the [`Modal`](https://mui.com/material-ui/api/modal/) element.
    * @default {}
    */
-  ModalProps: t.object,
+  ModalProps: r.object,
   /**
    * Callback fired when the component requests to be closed.
    * The `reason` parameter can optionally be used to control the response to `onClose`.
@@ -519,25 +519,25 @@ process.env.NODE_ENV !== "production" && (U.propTypes = {
    * @param {object} event The event source of the callback.
    * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
    */
-  onClose: t.func,
+  onClose: r.func,
   /**
    * If `true`, the component is shown.
    * @default false
    */
-  open: t.bool,
+  open: r.bool,
   /**
    * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element.
    * @default {}
    */
-  PaperProps: t.object,
+  PaperProps: r.object,
   /**
    * Props applied to the [`Slide`](https://mui.com/material-ui/api/slide/) element.
    */
-  SlideProps: t.object,
+  SlideProps: r.object,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
+  sx: r.oneOfType([r.arrayOf(r.oneOfType([r.func, r.object, r.bool])), r.func, r.object]),
   /**
    * The duration for the transition, in milliseconds.
    * You may specify a single timeout for all transitions, or individually with an object.
@@ -546,24 +546,24 @@ process.env.NODE_ENV !== "production" && (U.propTypes = {
    *   exit: theme.transitions.duration.leavingScreen,
    * }
    */
-  transitionDuration: t.oneOfType([t.number, t.shape({
-    appear: t.number,
-    enter: t.number,
-    exit: t.number
+  transitionDuration: r.oneOfType([r.number, r.shape({
+    appear: r.number,
+    enter: r.number,
+    exit: r.number
   })]),
   /**
    * The variant to use.
    * @default 'temporary'
    */
-  variant: t.oneOf(["permanent", "persistent", "temporary"])
+  variant: r.oneOf(["permanent", "persistent", "temporary"])
 });
-const Pe = de(/* @__PURE__ */ i("path", {
+const Te = pe(/* @__PURE__ */ i("path", {
   d: "m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"
-}), "ArrowForward"), Te = de(/* @__PURE__ */ i("path", {
+}), "ArrowForward"), Re = pe(/* @__PURE__ */ i("path", {
   d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2m5 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 12z"
-}), "Cancel"), vo = de(/* @__PURE__ */ i("path", {
+}), "Cancel"), wo = pe(/* @__PURE__ */ i("path", {
   d: "M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"
-}), "MoreHoriz"), wo = m("div", {
+}), "MoreHoriz"), ko = m("div", {
   shouldForwardProp: (e) => _(e) && e !== "hasSiteBanner"
 })(({ backgroundColor: e, hasSiteBanner: o }) => ({
   display: "flex",
@@ -571,10 +571,10 @@ const Pe = de(/* @__PURE__ */ i("path", {
   width: "100%",
   position: "relative",
   backgroundColor: e,
-  height: o ? `calc(100vh - ${r.constants.siteBannerHeight}px)` : "100vh",
+  height: o ? `calc(100vh - ${a.constants.siteBannerHeight}px)` : "100vh",
   fontFamily: "Roboto, sans-serif",
   overflow: "hidden"
-})), ko = m("div")(
+})), yo = m("div")(
   ({ tabletPadding: e, mobile: o }) => ({
     display: "flex",
     flexDirection: o ? "column-reverse" : "row",
@@ -584,16 +584,16 @@ const Pe = de(/* @__PURE__ */ i("path", {
     padding: o ? 0 : "0 2px 4px",
     paddingLeft: e ? "2px" : 0,
     boxSizing: "border-box",
-    height: `calc(100% - ${r.constants.appHeaderHeight}px)`
+    height: `calc(100% - ${a.constants.appHeaderHeight}px)`
   })
-), yo = m("div", {
+), Co = m("div", {
   shouldForwardProp: (e) => _(e)
-})(({ withActionsPanel: e, tablet: o, borderColor: a, backgroundColor: n }) => ({
+})(({ withActionsPanel: e, tablet: o, borderColor: t, backgroundColor: n }) => ({
   zIndex: 108,
   display: "flex",
   flexDirection: "column",
   opacity: e ? 1 : 0,
-  border: `1px solid ${a}`,
+  border: `1px solid ${t}`,
   borderRight: 0,
   borderRadius: "4px",
   borderTopRightRadius: 0,
@@ -608,9 +608,9 @@ const Pe = de(/* @__PURE__ */ i("path", {
   ...!e && {
     border: "none"
   }
-})), Co = m("div", {
+})), Po = m("div", {
   shouldForwardProp: (e) => _(e)
-})(({ show: e, width: o = r.constants.navDefaultWidth, borderColor: a, backgroundColor: n }) => ({
+})(({ show: e, width: o = a.constants.navDefaultWidth, borderColor: t, backgroundColor: n }) => ({
   zIndex: 108,
   display: "flex",
   flexDirection: "column",
@@ -618,7 +618,7 @@ const Pe = de(/* @__PURE__ */ i("path", {
   overflow: "hidden",
   flexShrink: 0,
   opacity: e ? 1 : 0,
-  border: `1px solid ${a}`,
+  border: `1px solid ${t}`,
   borderRight: 0,
   borderRadius: "4px",
   borderTopRightRadius: 0,
@@ -631,18 +631,20 @@ const Pe = de(/* @__PURE__ */ i("path", {
   ...!e && {
     border: "none"
   }
-})), $o = m(U)(
-  ({ shadowColor: e, backgroundColor: o }) => ({
-    ...P`
-      top: ${r.constants.appHeaderHeight}px;
+})), $o = m(G, {
+  shouldForwardProp: (e) => !["$topOffset"].includes(e)
+})(
+  ({ shadowColor: e, backgroundColor: o, $topOffset: t }) => ({
+    ...T`
+      top: ${t}px;
       font-family: 'Roboto';
 
       .MuiDrawer-paper {
         width: 360px;
         max-width: 100vw;
         box-sizing: border-box;
-        top: ${r.constants.appHeaderHeight}px;
-        height: calc(100vh - ${r.constants.appHeaderHeight}px);
+        top: ${t}px;
+        height: calc(100vh - ${t}px);
         background-color: ${o};
         box-shadow: 0 3px 6px 3px ${e};
         padding: 13px;
@@ -650,13 +652,13 @@ const Pe = de(/* @__PURE__ */ i("path", {
       }
 
       .MuiBackdrop-root {
-        top: ${r.constants.appHeaderHeight}px;
+        top: ${t}px;
         background-color: transparent;
       }
     `
   })
-), Re = m(re)(({ iconColor: e, highlight1: o, highlight2: a, rightDrawer: n = !1 }) => ({
-  ...P`
+), Me = m(ne)(({ iconColor: e, highlight1: o, highlight2: t, rightDrawer: n = !1 }) => ({
+  ...T`
     position: absolute;
     top: -0.5rem;
     ${!n && { right: "-0.5rem" }};
@@ -674,17 +676,17 @@ const Pe = de(/* @__PURE__ */ i("path", {
     :focus-visible {
       svg {
         filter: unset;
-        background-color: ${a};
+        background-color: ${t};
         fill: ${e};
       }
     }
   `
-})), Po = m("div", {
+})), To = m("div", {
   shouldForwardProp: (e) => _(e)
-})(({ withActionsPanel: e, borderColor: o, backgroundColor: a, mobileScreen: n }) => ({
+})(({ withActionsPanel: e, borderColor: o, backgroundColor: t, mobileScreen: n }) => ({
   display: "flex",
   overflow: "hidden",
-  backgroundColor: a,
+  backgroundColor: t,
   width: "100%",
   boxSizing: "border-box",
   padding: "0 9px",
@@ -703,10 +705,10 @@ const Pe = de(/* @__PURE__ */ i("path", {
     borderBottomLeftRadius: e ? 0 : "4px",
     borderTopLeftRadius: e ? 0 : "4px"
   }
-})), To = m(U, {
+})), Ro = m(G, {
   shouldForwardProp: (e) => !["backgroundColor", "shadowColor"].includes(e)
 })(({ backgroundColor: e, shadowColor: o }) => ({
-  ...P`
+  ...T`
     z-index: 1327;
 
     .MuiDrawer-paper {
@@ -721,408 +723,424 @@ const Pe = de(/* @__PURE__ */ i("path", {
       background-color: transparent;
     }
   `
-})), Ro = m(U, {
-  shouldForwardProp: (e) => e != "backgroundColor"
-})(({ backgroundColor: e }) => ({
-  ...P`
+})), Mo = m(G, {
+  shouldForwardProp: (e) => !["backgroundColor", "$topOffset"].includes(e)
+})(({ backgroundColor: e, $topOffset: o }) => ({
+  ...T`
     z-index: 1300;
 
     .MuiDrawer-paper {
       z-index: 1300;
       width: 100vw;
-      top: ${r.constants.appHeaderHeight}px;
-      height: calc(100vh - ${r.constants.appHeaderHeight}px - 72px);
+      top: ${o}px;
+      height: calc(100vh - ${o}px - 72px);
       background-color: ${e};
       box-shadow: none;
     }
 
     .MuiBackdrop-root {
       z-index: 1300;
-      top: ${r.constants.appHeaderHeight}px;
-      height: calc(100vh - ${r.constants.appHeaderHeight}px);
+      top: ${o}px;
+      height: calc(100vh - ${o}px);
       background-color: transparent;
     }
   `
-})), Mo = m("div", {
-  shouldForwardProp: (e) => _(e)
-})(({ backgroundColor: e, open: o }) => ({
-  ...P`
+})), Eo = m("div", {
+  shouldForwardProp: (e) => _(e) && e !== "$topOffset"
+})(({ backgroundColor: e, open: o, $topOffset: t }) => ({
+  ...T`
     position: fixed;
     transition: height 201ms cubic-bezier(0, 0, 0.2, 1);
     z-index: 1300;
     bottom: 72px;
     width: 100vw;
-    height: ${o ? `calc(100vh - ${r.constants.appHeaderHeight}px - 72px)` : 0};
+    height: ${o ? `calc(100vh - ${t}px - 72px)` : 0};
     overflow: hidden;
     background-color: ${e};
     box-sizing: border-box;
     padding: ${o ? "16px" : 0};
   `
-})), Ho = m("h1")(({ color: e }) => ({
-  ...P`
+})), zo = m("h1")(({ color: e }) => ({
+  ...T`
     margin: 0;
     font-size: 2.1rem;
     font-family: 'Roboto';
     color: ${e};
   `
-})), Eo = m(U)(({ backgroundQuaternary: e }) => ({
-  ...P`
-    top: ${r.constants.appHeaderHeight}px;
+})), Do = m(G, {
+  shouldForwardProp: (e) => !["backgroundQuaternary", "$topOffset"].includes(e)
+})(({ backgroundQuaternary: e, $topOffset: o }) => ({
+  ...T`
+    top: ${o}px;
     font-family: 'Roboto';
     z-index: 1336;
 
     .MuiDrawer-paper {
       width: 100vw;
       box-sizing: border-box;
-      top: ${r.constants.appHeaderHeight}px;
-      height: calc(100vh - ${r.constants.appHeaderHeight}px);
-      background-image: linear-gradient(to bottom right, ${r.colors.oldPaper}, ${e});
+      top: ${o}px;
+      height: calc(100vh - ${o}px);
+      background-image: linear-gradient(to bottom right, ${a.colors.oldPaper}, ${e});
       padding: 0;
     }
 
     .MuiBackdrop-root {
-      top: ${r.constants.appHeaderHeight}px;
+      top: ${o}px;
       background-color: transparent;
     }
   `
 })), So = m("img")(({ width: e, height: o }) => ({
-  ...P`
+  ...T`
     width: ${e}px;
     height: ${o}px;
   `
-})), Me = m("div")(({ justifyStart: e }) => ({
-  ...P`
+})), Ee = m("div")(({ justifyStart: e }) => ({
+  ...T`
     display: flex;
     flex-direction: row;
     align-items: flex-start;
     justify-content: ${e ? "start" : "space-between"};
     padding: 8px 16px 8px 24px;
   `
-})), zo = m(U)(() => ({
-  ...P`
-    top: ${r.constants.appHeaderHeight}px;
+})), Io = m(G, {
+  shouldForwardProp: (e) => e !== "$topOffset"
+})(({ $topOffset: e }) => ({
+  ...T`
+    top: ${e}px;
     font-family: 'Roboto';
 
     .MuiDrawer-paper {
       width: 360px;
       max-width: 100vw;
       box-sizing: border-box;
-      top: ${r.constants.appHeaderHeight}px;
-      height: calc(100vh - ${r.constants.appHeaderHeight}px);
-      background-color: ${r.colors.white};
-      box-shadow: 0 3px 6px 3px ${r.colors.gray};
+      top: ${e}px;
+      height: calc(100vh - ${e}px);
+      background-color: ${a.colors.white};
+      box-shadow: 0 3px 6px 3px ${a.colors.gray};
       padding: 0;
       overflow: visible;
     }
 
     .MuiBackdrop-root {
-      top: ${r.constants.appHeaderHeight}px;
+      top: ${e}px;
       background-color: transparent;
     }
 
     .MuiDrawer-root {
-      z-index: 13000;
+      z-index: 9200;
     }
   `
-})), rr = ({
+})), tr = ({
   navProps: e,
   subnavItems: o,
-  activeSubnavRoute: a,
+  activeSubnavRoute: t,
   appHeaderProps: n = {},
   userInfo: l,
-  userSettingsEnabled: T = !0,
-  userProfileMenuItems: x = [],
+  userSettingsEnabled: R = !0,
+  userProfileMenuItems: b = [],
   actionsPanelContent: d,
-  navWidth: g = r.constants.navDefaultWidth,
-  breakpoints: u = { mobile: r.screenSizes.mobile, tablet: r.screenSizes.tablet },
-  children: b,
-  themeColors: O = {},
-  logoProps: C = {},
-  loggedIn: F,
-  mobileActionsPanelOpen: W,
-  hasSiteBanner: j = !1
+  navWidth: f = a.constants.navDefaultWidth,
+  breakpoints: p = { mobile: a.screenSizes.mobile, tablet: a.screenSizes.tablet },
+  children: g,
+  themeColors: N = {},
+  logoProps: P = {},
+  loggedIn: U,
+  mobileActionsPanelOpen: X,
+  hasSiteBanner: O = !1
 }) => {
-  var we;
-  const [I, $] = K(!1), [V, R] = K(!1), [M, v] = K(!1), [H, h] = K(!1), { mobile: G = r.screenSizes.mobile, tablet: E = r.screenSizes.tablet } = u, c = Ce(`(max-width: ${G})`), p = Ce(`(max-width: ${E})`) && !c, N = !c && !p, {
-    backgroundPrimary: S = r.colors.whiteGreen,
-    backgroundSecondary: k = r.colors.whiteGreenA,
-    backgroundTertiary: B = r.colors.sage,
-    highlightPrimary: ne = r.colors.sunlight,
-    backgroundQuaternary: q = r.colors.moss,
-    highlightSecondary: s = r.colors.dandelion,
-    highlightTertiary: f = `${r.colors.dandelion}99`,
-    iconPrimary: z = r.colors.darkGreen,
-    shadowPrimary: ie = r.colors.darkGreenO99,
-    shadowSecondary: Q = r.boxShadows.darkGreen,
-    shadowTertiary: he = r.boxShadows.darkGreenThick,
-    borderPrimary: X = r.colors.green,
-    scrollColor: A = r.colors.darkGreenO99,
-    loadingColor: Oe = r.colors.green,
-    iconColors: ue = {
-      icon: /* @__PURE__ */ i(Ve, {}),
-      iconColor: r.colors.darkGreen,
-      backgroundColor: r.colors.mint
+  var ke;
+  const k = O ? a.constants.appHeaderHeight + a.constants.siteBannerHeight : a.constants.appHeaderHeight, [B, S] = ee(!1), [H, $] = ee(!1), [M, x] = ee(!1), [h, A] = ee(!1), { mobile: E = a.screenSizes.mobile, tablet: z = a.screenSizes.tablet } = p, c = Pe(`(max-width: ${E})`), v = Pe(`(max-width: ${z})`) && !c, I = !c && !v, {
+    backgroundPrimary: W = a.colors.whiteGreen,
+    backgroundSecondary: y = a.colors.whiteGreenA,
+    backgroundTertiary: L = a.colors.sage,
+    highlightPrimary: q = a.colors.sunlight,
+    backgroundQuaternary: s = a.colors.moss,
+    highlightSecondary: u = a.colors.dandelion,
+    highlightTertiary: J = `${a.colors.dandelion}99`,
+    iconPrimary: V = a.colors.darkGreen,
+    shadowPrimary: ae = a.colors.darkGreenO99,
+    shadowSecondary: K = a.boxShadows.darkGreen,
+    shadowTertiary: ue = a.boxShadows.darkGreenThick,
+    borderPrimary: Y = a.colors.green,
+    scrollColor: F = a.colors.darkGreenO99,
+    loadingColor: He = a.colors.green,
+    iconColors: fe = {
+      icon: /* @__PURE__ */ i(Ge, {}),
+      iconColor: a.colors.darkGreen,
+      backgroundColor: a.colors.mint
     }
-  } = O, { logoSrc: fe = Xe, logoWidth: ge = 36, logoHeight: me = 50 } = C, be = {
-    backgroundPrimary: S,
-    backgroundSecondary: k,
-    backgroundTertiary: B,
-    highlightPrimary: ne,
-    highlightSecondary: s,
-    highlightTertiary: f,
-    borderPrimary: X,
-    iconPrimary: z,
-    shadowPrimary: ie,
-    shadowSecondary: Q,
-    shadowTertiary: he,
-    scrollColor: A,
-    loadingColor: Oe,
-    iconColors: ue
-  }, Be = { logoSrc: fe, logoWidth: ge, logoHeight: me }, ae = d != null, Ae = { ...n, navWidth: g, loggedIn: F }, Y = { ...e, themeColors: be }, Le = {
-    ...Y,
-    navWidth: `${g}px`,
+  } = N, { logoSrc: me = Ye, logoWidth: ge = 36, logoHeight: be = 50 } = P, xe = {
+    backgroundPrimary: W,
+    backgroundSecondary: y,
+    backgroundTertiary: L,
+    highlightPrimary: q,
+    highlightSecondary: u,
+    highlightTertiary: J,
+    borderPrimary: Y,
+    iconPrimary: V,
+    shadowPrimary: ae,
+    shadowSecondary: K,
+    shadowTertiary: ue,
+    scrollColor: F,
+    loadingColor: He,
+    iconColors: fe
+  }, Ae = { logoSrc: me, logoWidth: ge, logoHeight: be }, se = d != null, Le = { ...n, navWidth: f, loggedIn: U }, Q = { ...e, themeColors: xe }, Fe = {
+    ...Q,
+    navWidth: `${f}px`,
     isMobile: c
-  }, { navItems: J } = e, se = o || ((we = J.find((w) => w.label === (e == null ? void 0 : e.activeRoute))) == null ? void 0 : we.subnavItems) || [], Fe = {
-    themeColors: be,
-    activeRoute: a,
-    navItems: se
-  }, xe = [
+  }, { navItems: Z } = e, le = o || ((ke = Z.find((w) => w.label === (e == null ? void 0 : e.activeRoute))) == null ? void 0 : ke.subnavItems) || [], je = {
+    themeColors: xe,
+    activeRoute: t,
+    navItems: le
+  }, ve = [
     // { label: 'Log Out', icon: <LogoutIcon />, onClick: onLogout },
-    ...x
+    ...b
   ].map((w) => ({
     ...w,
     onClick: () => {
-      w.onClick && w.onClick(), v(!1);
+      w.onClick && w.onClick(), x(!1);
     }
-  })), je = J.map((w) => ({
+  })), Ue = Z.map((w) => ({
     ...w,
     onClick: () => {
-      w.onClick && w.onClick(), $(!1);
+      w.onClick && w.onClick(), S(!1);
     }
-  })), le = {
-    ...Y,
+  })), ce = {
+    ...Q,
     navWidth: "100%",
     isTablet: !0,
-    navItems: je
+    navItems: Ue
   };
-  let ce = J.map((w) => ({
+  let de = Z.map((w) => ({
     ...w,
     onClick: () => {
-      w.onClick && w.onClick(), h(!1);
+      w.onClick && w.onClick(), A(!1);
     }
-  })), ve = [];
-  J.length > 4 && c && (ve = ce.splice(3), ce.push({
+  })), we = [];
+  Z.length > 4 && c && (we = de.splice(3), de.push({
     label: "More",
-    icon: /* @__PURE__ */ i(vo, {}),
-    onClick: () => h(!0)
+    icon: /* @__PURE__ */ i(wo, {}),
+    onClick: () => A(!0)
   }));
-  const Ue = {
-    ...Y,
+  const We = {
+    ...Q,
     navWidth: "100%",
-    navItems: ce,
+    navItems: de,
     isMobile: !0,
-    activeRoute: H ? "More" : Y.activeRoute
-  }, We = {
-    ...Y,
+    activeRoute: h ? "More" : Q.activeRoute
+  }, Ve = {
+    ...Q,
     navWidth: "100%",
-    navItems: ve,
+    navItems: we,
     isTablet: !0
   };
-  return /* @__PURE__ */ y(wo, { backgroundColor: k, hasSiteBanner: j, children: [
+  return /* @__PURE__ */ C(ko, { backgroundColor: y, hasSiteBanner: O, children: [
     /* @__PURE__ */ i(
-      Ge,
+      Xe,
       {
-        ...Ae,
-        hamburgerMenu: p,
-        onHamburgerMenuClick: () => $(!0),
-        onUserMenuClick: () => v(!0),
-        logoProps: Be,
-        iconColor: z,
+        ...Le,
+        hamburgerMenu: v,
+        onHamburgerMenuClick: () => S(!0),
+        onUserMenuClick: () => x(!0),
+        logoProps: Ae,
+        iconColor: V,
         isMobile: c,
-        themeProps: { shadowSecondary: Q, shadowTertiary: he, iconPrimary: z, borderPrimary: X },
-        iconColors: ue,
+        themeProps: { shadowSecondary: K, shadowTertiary: ue, iconPrimary: V, borderPrimary: Y },
+        iconColors: fe,
         userName: l == null ? void 0 : l.name,
-        userSettingsEnabled: T
+        userSettingsEnabled: R
       }
     ),
-    /* @__PURE__ */ y(ko, { tabletPadding: p, mobile: c, children: [
-      N && /* @__PURE__ */ i(L, { ...Le }),
-      c && /* @__PURE__ */ y(ke, { children: [
-        /* @__PURE__ */ i(L, { ...Ue }),
+    /* @__PURE__ */ C(yo, { tabletPadding: v, mobile: c, children: [
+      I && /* @__PURE__ */ i(j, { ...Fe }),
+      c && /* @__PURE__ */ C(ye, { children: [
+        /* @__PURE__ */ i(j, { ...We }),
         /* @__PURE__ */ i(
-          Ro,
+          Mo,
           {
-            open: H,
-            onClose: () => h(!1),
-            backgroundColor: k,
+            open: h,
+            onClose: () => A(!1),
+            backgroundColor: y,
+            $topOffset: k,
             anchor: "right",
-            children: /* @__PURE__ */ i(L, { ...We })
+            children: /* @__PURE__ */ i(j, { ...Ve })
           }
         )
       ] }),
-      p && /* @__PURE__ */ y(
-        To,
+      v && /* @__PURE__ */ C(
+        Ro,
         {
-          open: I,
-          onClose: () => $(!1),
-          backgroundColor: k,
-          shadowColor: ie,
+          open: B,
+          onClose: () => S(!1),
+          backgroundColor: y,
+          shadowColor: ae,
           children: [
-            /* @__PURE__ */ y(Me, { children: [
-              /* @__PURE__ */ i(So, { src: fe, alt: "logo", width: ge, height: me }),
-              /* @__PURE__ */ i(re, { variant: "icon", size: 36, onClick: () => $(!1), color: z, children: /* @__PURE__ */ i(Ye, {}) })
+            /* @__PURE__ */ C(Ee, { children: [
+              /* @__PURE__ */ i(So, { src: me, alt: "logo", width: ge, height: be }),
+              /* @__PURE__ */ i(ne, { variant: "icon", size: 36, onClick: () => S(!1), color: V, children: /* @__PURE__ */ i(Qe, {}) })
             ] }),
-            /* @__PURE__ */ i(L, { ...le })
+            /* @__PURE__ */ i(j, { ...ce })
           ]
         }
       ),
-      p && /* @__PURE__ */ y(
+      v && /* @__PURE__ */ C(
         $o,
         {
-          open: V && ae,
-          onClose: () => R(!1),
-          shadowColor: ie,
-          backgroundColor: B,
+          open: H && se,
+          onClose: () => $(!1),
+          shadowColor: ae,
+          $topOffset: k,
+          backgroundColor: L,
           children: [
             /* @__PURE__ */ i(
-              Re,
+              Me,
               {
                 variant: "icon",
                 size: 24,
-                onClick: () => R(!1),
-                iconColor: z,
-                highlight1: k,
-                highlight2: k,
-                children: /* @__PURE__ */ i(Te, {})
+                onClick: () => $(!1),
+                iconColor: V,
+                highlight1: y,
+                highlight2: y,
+                children: /* @__PURE__ */ i(Re, {})
               }
             ),
-            /* @__PURE__ */ i(Z, { scrollColor: A, direction: "vertical", children: d && d })
+            /* @__PURE__ */ i(oe, { scrollColor: F, direction: "vertical", children: d && d })
           ]
         }
       ),
-      (p || N) && /* @__PURE__ */ y(
-        zo,
+      (v || I) && /* @__PURE__ */ C(
+        Io,
         {
           anchor: "right",
           open: M,
-          onClose: () => v(!1),
+          onClose: () => x(!1),
+          $topOffset: k,
           children: [
             /* @__PURE__ */ i(
-              Re,
+              Me,
               {
                 variant: "icon",
                 size: 24,
-                onClick: () => v(!1),
-                iconColor: r.colors.midnight,
-                highlight1: r.colors.white,
-                highlight2: k,
+                onClick: () => x(!1),
+                iconColor: a.colors.midnight,
+                highlight1: a.colors.white,
+                highlight2: y,
                 rightDrawer: !0,
-                children: /* @__PURE__ */ i(Te, {})
+                children: /* @__PURE__ */ i(Re, {})
               }
             ),
             /* @__PURE__ */ i(
-              L,
+              j,
               {
-                ...le,
-                navItems: xe,
+                ...ce,
+                navItems: ve,
                 themeColors: {
-                  iconPrimary: r.colors.midnight,
-                  highlightPrimary: S,
-                  highlightTertiary: k,
-                  shadowSecondary: Q,
-                  scrollColor: A
+                  iconPrimary: a.colors.midnight,
+                  highlightPrimary: W,
+                  highlightTertiary: y,
+                  shadowSecondary: K,
+                  scrollColor: F
                 }
               }
             )
           ]
         }
       ),
-      c && /* @__PURE__ */ y(ke, { children: [
-        /* @__PURE__ */ y(
-          Eo,
+      c && /* @__PURE__ */ C(ye, { children: [
+        /* @__PURE__ */ C(
+          Do,
           {
             anchor: "right",
             open: M,
-            onClose: () => v(!1),
-            backgroundQuaternary: q,
+            onClose: () => x(!1),
+            $topOffset: k,
+            backgroundQuaternary: s,
             children: [
-              /* @__PURE__ */ y(Me, { children: [
-                /* @__PURE__ */ i(Ho, { color: r.colors.midnight, children: "Settings" }),
+              /* @__PURE__ */ C(Ee, { children: [
+                /* @__PURE__ */ i(zo, { color: a.colors.midnight, children: "Settings" }),
                 /* @__PURE__ */ i(
-                  re,
+                  ne,
                   {
                     variant: "icon",
                     size: 36,
-                    onClick: () => v(!1),
-                    color: r.colors.midnight,
-                    children: /* @__PURE__ */ i(Pe, {})
+                    onClick: () => x(!1),
+                    color: a.colors.midnight,
+                    children: /* @__PURE__ */ i(Te, {})
                   }
                 )
               ] }),
               /* @__PURE__ */ i(
-                L,
+                j,
                 {
-                  ...le,
-                  navItems: xe,
+                  ...ce,
+                  navItems: ve,
                   themeColors: {
-                    iconPrimary: r.colors.midnight,
-                    highlightPrimary: S,
-                    highlightTertiary: k,
-                    shadowSecondary: Q,
-                    scrollColor: A
+                    iconPrimary: a.colors.midnight,
+                    highlightPrimary: W,
+                    highlightTertiary: y,
+                    shadowSecondary: K,
+                    scrollColor: F
                   }
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ i(Mo, { backgroundColor: B, open: W, children: /* @__PURE__ */ i(Z, { scrollColor: A, direction: "vertical", children: d }) })
+        /* @__PURE__ */ i(
+          Eo,
+          {
+            backgroundColor: L,
+            open: X,
+            $topOffset: k,
+            children: /* @__PURE__ */ i(oe, { scrollColor: F, direction: "vertical", children: d })
+          }
+        )
       ] }),
-      !c && /* @__PURE__ */ y(
-        yo,
+      !c && /* @__PURE__ */ C(
+        Co,
         {
-          withActionsPanel: ae,
-          tablet: p,
-          borderColor: X,
-          backgroundColor: B,
+          withActionsPanel: se,
+          tablet: v,
+          borderColor: Y,
+          backgroundColor: L,
           children: [
-            N && /* @__PURE__ */ i(Z, { scrollColor: A, direction: "vertical", children: d && d }),
-            p && /* @__PURE__ */ i(
-              re,
+            I && /* @__PURE__ */ i(oe, { scrollColor: F, direction: "vertical", children: d && d }),
+            v && /* @__PURE__ */ i(
+              ne,
               {
                 variant: "icon",
                 size: 36,
-                onClick: () => R(!0),
-                color: z,
-                children: /* @__PURE__ */ i(Pe, {})
+                onClick: () => $(!0),
+                color: V,
+                children: /* @__PURE__ */ i(Te, {})
               }
             )
           ]
         }
       ),
       !c && /* @__PURE__ */ i(
-        Co,
+        Po,
         {
-          show: se && se.length > 0,
-          borderColor: X,
-          backgroundColor: B,
-          width: g,
-          children: /* @__PURE__ */ i(L, { ...Fe })
+          show: le && le.length > 0,
+          borderColor: Y,
+          backgroundColor: L,
+          width: f,
+          children: /* @__PURE__ */ i(j, { ...je })
         }
       ),
       /* @__PURE__ */ i(
-        Po,
+        To,
         {
-          withActionsPanel: ae,
-          borderColor: X,
-          backgroundColor: S,
+          withActionsPanel: se,
+          borderColor: Y,
+          backgroundColor: W,
           mobileScreen: c,
-          children: /* @__PURE__ */ i(Z, { scrollColor: A, children: b })
+          children: /* @__PURE__ */ i(oe, { scrollColor: F, children: g })
         }
       )
     ] })
   ] });
 };
 export {
-  rr as default
+  tr as default
 };