@australiangreens/ag-internal-components 0.0.55 → 0.0.57

package/dist/esm/index.js

@@ -1,82 +1,82 @@
-var xt = Object.defineProperty, Ct = Object.defineProperties;
-var wt = Object.getOwnPropertyDescriptors;
-var Y = Object.getOwnPropertySymbols;
-var be = Object.prototype.hasOwnProperty, Ae = Object.prototype.propertyIsEnumerable;
-var le = (e, t, n) => t in e ? xt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, r = (e, t) => {
+var bt = Object.defineProperty, St = Object.defineProperties;
+var At = Object.getOwnPropertyDescriptors;
+var J = Object.getOwnPropertySymbols;
+var Se = Object.prototype.hasOwnProperty, Ae = Object.prototype.propertyIsEnumerable;
+var de = (e, t, n) => t in e ? bt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, i = (e, t) => {
   for (var n in t || (t = {}))
-    be.call(t, n) && le(e, n, t[n]);
-  if (Y)
-    for (var n of Y(t))
-      Ae.call(t, n) && le(e, n, t[n]);
+    Se.call(t, n) && de(e, n, t[n]);
+  if (J)
+    for (var n of J(t))
+      Ae.call(t, n) && de(e, n, t[n]);
   return e;
-}, w = (e, t) => Ct(e, wt(t));
-var Se = (e, t) => {
+}, w = (e, t) => St(e, At(t));
+var Te = (e, t) => {
   var n = {};
-  for (var i in e)
-    be.call(e, i) && t.indexOf(i) < 0 && (n[i] = e[i]);
-  if (e != null && Y)
-    for (var i of Y(e))
-      t.indexOf(i) < 0 && Ae.call(e, i) && (n[i] = e[i]);
+  for (var r in e)
+    Se.call(e, r) && t.indexOf(r) < 0 && (n[r] = e[r]);
+  if (e != null && J)
+    for (var r of J(e))
+      t.indexOf(r) < 0 && Ae.call(e, r) && (n[r] = e[r]);
   return n;
 };
-var Te = (e, t, n) => (le(e, typeof t != "symbol" ? t + "" : t, n), n);
-var J = (e, t, n) => new Promise((i, a) => {
-  var l = (s) => {
+var Ie = (e, t, n) => (de(e, typeof t != "symbol" ? t + "" : t, n), n);
+var K = (e, t, n) => new Promise((r, a) => {
+  var s = (l) => {
     try {
-      u(n.next(s));
-    } catch (d) {
-      a(d);
+      u(n.next(l));
+    } catch (c) {
+      a(c);
     }
-  }, p = (s) => {
+  }, p = (l) => {
     try {
-      u(n.throw(s));
-    } catch (d) {
-      a(d);
+      u(n.throw(l));
+    } catch (c) {
+      a(c);
     }
-  }, u = (s) => s.done ? i(s.value) : Promise.resolve(s.value).then(l, p);
+  }, u = (l) => l.done ? r(l.value) : Promise.resolve(l.value).then(s, p);
   u((n = n.apply(e, t)).next());
 });
-import { jsxs as c, Fragment as y, jsx as o } from "react/jsx-runtime";
-import { useState as k, createContext as Re, useCallback as ee, useContext as We, useEffect as te, useRef as de } from "react";
-import { Typography as B, Button as bt, Paper as ze, Box as x, Drawer as he, styled as ge, IconButton as V, Container as Ge, useTheme as At, Avatar as Ie, Collapse as St, Skeleton as Oe, Divider as De, CssBaseline as Tt, Snackbar as It, Alert as Ot, CircularProgress as Ue, LinearProgress as Dt, Autocomplete as kt, TextField as Bt, FormHelperText as $t } from "@mui/material";
-import Et from "@mui/material/CssBaseline";
-import { styled as $, createTheme as Ve, alpha as ce } from "@mui/material/styles";
-import { AgError as Nt } from "@australiangreens/ag-error";
-import { createHelper as oe } from "souvlaki";
+import { jsxs as d, Fragment as L, jsx as o } from "react/jsx-runtime";
+import { useState as k, createContext as ze, useCallback as ee, useContext as We, useEffect as te, useRef as pe } from "react";
+import { Typography as B, Button as Tt, Paper as Ge, Box as x, Drawer as fe, styled as me, IconButton as V, Container as Ue, useTheme as oe, useMediaQuery as It, Collapse as Ot, Avatar as Oe, Fade as Dt, Skeleton as De, Toolbar as kt, Divider as ke, CssBaseline as Bt, Snackbar as $t, Alert as Nt, CircularProgress as Ve, LinearProgress as Et, Autocomplete as Ft, TextField as Pt, FormHelperText as yt } from "@mui/material";
+import Lt from "@mui/material/CssBaseline";
+import { styled as $, createTheme as qe, alpha as ue } from "@mui/material/styles";
+import { AgError as Mt } from "@australiangreens/ag-error";
+import { createHelper as re } from "souvlaki";
 import Xe from "@mui/material/List";
-import ke from "@mui/material/Button";
-import Ft from "@mui/material/Dialog";
-import Pt from "@mui/material/DialogActions";
-import Lt from "@mui/material/DialogContent";
-import yt from "@mui/material/DialogTitle";
-import { ArrowForward as qe, ArrowBack as je, ViewHeadline as Mt } from "@mui/icons-material";
-import { atom as E, useSetAtom as _t, useAtom as P, getDefaultStore as Ht, Provider as Qe } from "jotai";
-import { useHydrateAtoms as Rt } from "jotai/utils";
-function Jn({ text: e }) {
+import Be from "@mui/material/Button";
+import _t from "@mui/material/Dialog";
+import Ht from "@mui/material/DialogActions";
+import Rt from "@mui/material/DialogContent";
+import zt from "@mui/material/DialogTitle";
+import { ArrowForward as je, ArrowBack as Qe, ViewHeadline as Wt } from "@mui/icons-material";
+import { atom as N, useSetAtom as Je, useAtom as P, getDefaultStore as Gt, Provider as Ke } from "jotai";
+import { useHydrateAtoms as Ut } from "jotai/utils";
+function no({ text: e }) {
   const [t, n] = k(0);
-  return /* @__PURE__ */ c(y, { children: [
+  return /* @__PURE__ */ d(L, { children: [
     /* @__PURE__ */ o(B, { variant: "h6", color: "inherit", component: "div", sx: { fontSize: "22px" }, children: "Hello world" }),
     /* @__PURE__ */ o(B, { variant: "caption", display: "block", children: /* @__PURE__ */ o("span", { children: "Just ensuring MUI is working as planned as a peer dependency. v0.0.11" }) }),
     /* @__PURE__ */ o(
-      bt,
+      Tt,
       {
         variant: "outlined",
-        onClick: () => n((i) => i + 1),
+        onClick: () => n((r) => r + 1),
         "aria-label": "Increment",
         children: "Hello I am a button"
       }
     ),
-    /* @__PURE__ */ c("p", { children: [
+    /* @__PURE__ */ d("p", { children: [
       "This is some text: ",
       /* @__PURE__ */ o("span", { children: e })
     ] }),
-    /* @__PURE__ */ c(ze, { children: [
+    /* @__PURE__ */ d(Ge, { children: [
       "This number will incremember when button pressed: ",
       t
     ] })
   ] });
 }
-const Ye = 330, Je = 73, F = "Navbar", _ = {
+const Ye = 330, Ze = 73, F = "Navbar", _ = {
   root: `${F}-root`,
   menuButton: `${F}-menuButton`,
   hide: `${F}-hide`,
@@ -84,7 +84,7 @@ const Ye = 330, Je = 73, F = "Navbar", _ = {
   userInfoHolder: `${F}-userInfoHolder`,
   settings: `${F}-settings`,
   pieChartIcon: `${F}-pieChartIcon`
-}, Wt = $(x, {
+}, Vt = $(x, {
   name: "NavBar"
 })(({ theme: e }) => ({
   [`&.${_.root}`]: {
@@ -105,7 +105,7 @@ const Ye = 330, Je = 73, F = "Navbar", _ = {
     marginTop: "64px",
     marginBottom: "16px"
   }
-})), Ke = () => ({
+})), et = () => ({
   position: "absolute",
   height: "100%",
   overflowX: "hidden",
@@ -113,51 +113,51 @@ const Ye = 330, Je = 73, F = "Navbar", _ = {
   color: "white",
   backgroundColor: "black"
   // backgroundColor: '#e8e8e8',
-}), zt = () => r({
+}), qt = () => i({
   width: Ye
-}, Ke()), Gt = () => r({
-  width: Je
-}, Ke()), Ut = $(he, {
+}, et()), Xt = () => i({
+  width: Ze
+}, et()), jt = $(fe, {
   shouldForwardProp: (e) => e !== "open"
-})(({ theme: e, open: t }) => r(r({
-  width: t ? Ye : Je,
+})(({ theme: e, open: t }) => i(i({
+  width: t ? Ye : Ze,
   flexShrink: 0,
   whiteSpace: "nowrap",
   boxSizing: "border-box",
   zIndex: e.zIndex.drawer + 100
 }, t && {
-  "& .MuiDrawer-paper": zt()
+  "& .MuiDrawer-paper": qt()
 }), !t && {
-  "& .MuiDrawer-paper": Gt()
+  "& .MuiDrawer-paper": Xt()
 }));
-class fe extends Nt {
+class ve extends Mt {
 }
-Te(fe, "errorName", "ContextError");
-const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
-  overrideState: e = Vt,
-  overrideActions: t = Xt,
+Ie(ve, "errorName", "ContextError");
+const tt = ze(null), Qt = {}, Jt = {}, Kt = ({
+  overrideState: e = Qt,
+  overrideActions: t = Jt,
   children: n
 }) => {
-  const [{ open: i }, a] = k({ open: !0 }), l = ee((s) => {
-    a({ open: s });
+  const [{ open: r }, a] = k({ open: !0 }), s = ee((l) => {
+    a({ open: l });
   }, []), p = ee(() => {
-    a((s) => w(r({}, s), { open: !s.open }));
-  }, []), u = r(r({
-    open: i,
-    setOpen: l,
+    a((l) => w(i({}, l), { open: !l.open }));
+  }, []), u = i(i({
+    open: r,
+    setOpen: s,
     toggleOpen: p
   }, e), t);
-  return /* @__PURE__ */ o(Ze.Provider, { value: u, children: n });
-}, jt = () => {
-  const e = We(Ze);
+  return /* @__PURE__ */ o(tt.Provider, { value: u, children: n });
+}, Yt = () => {
+  const e = We(tt);
   if (e === null)
-    throw new fe("Error: Tried to useNavBar outside of a <NavBarProvider>");
+    throw new ve("Error: Tried to useNavBar outside of a <NavBarProvider>");
   return e;
-}, Qt = (e = {}) => r({
+}, Zt = (e = {}) => i({
   open: !0
-}, e), Kn = oe(
-  (e = Qt(), t = {}) => ({ children: n }) => /* @__PURE__ */ o(qt, { overrideState: e, overrideActions: t, children: n })
-), Be = 7, Zn = $(Xe)(({ theme: e }) => ({
+}, e), oo = re(
+  (e = Zt(), t = {}) => ({ children: n }) => /* @__PURE__ */ o(Kt, { overrideState: e, overrideActions: t, children: n })
+), $e = 7, ro = $(Xe)(({ theme: e }) => ({
   backgroundColor: "black",
   color: "white",
   "& .MuiListItem-root": {
@@ -166,7 +166,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
   "& .MuiListItemButton-root": {
     " .MuiListItemIcon-root": {
       color: "white",
-      padding: `${Be}px`
+      padding: `${$e}px`
     },
     // Focus state
     "&.Mui-focusVisible": {
@@ -177,7 +177,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
       borderLeftStyle: "solid",
       borderLeftWidth: "7px",
       borderLeftColor: e.palette.primary.main,
-      paddingLeft: `calc(${e.spacing(2)} - ${Be}px)`
+      paddingLeft: `calc(${e.spacing(2)} - ${$e}px)`
     },
     // Hover state
     "&:hover": {
@@ -195,7 +195,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
     // '&.Mui-selected.Mui-focusVisible:hover': {
     // },
   }
-})), $e = 7, eo = $(Xe)(({ theme: e }) => ({
+})), Ne = 7, io = $(Xe)(({ theme: e }) => ({
   backgroundColor: "#e8e8e8",
   color: "inherit",
   "& .MuiListItem-root": {
@@ -204,7 +204,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
   "& .MuiListItemButton-root": {
     " .MuiListItemIcon-root": {
       color: "inherit",
-      padding: `${$e}px`
+      padding: `${Ne}px`
     },
     // Focus state
     "&.Mui-focusVisible": {
@@ -215,7 +215,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
       borderLeftStyle: "solid",
       borderLeftWidth: "7px",
       borderLeftColor: e.palette.primary.main,
-      paddingLeft: `calc(${e.spacing(2)} - ${$e}px)`
+      paddingLeft: `calc(${e.spacing(2)} - ${Ne}px)`
     },
     // Hover state
     "&:hover": {
@@ -234,15 +234,15 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
     // },
   }
 }));
-function to({
+function ao({
   "data-testid": e,
   children: t
 }) {
-  const { open: n } = jt();
-  return /* @__PURE__ */ c(Wt, { className: _.root, "data-testid": e, children: [
-    /* @__PURE__ */ o(Et, {}),
+  const { open: n } = Yt();
+  return /* @__PURE__ */ d(Vt, { className: _.root, "data-testid": e, children: [
+    /* @__PURE__ */ o(Lt, {}),
     /* @__PURE__ */ o(
-      Ut,
+      jt,
       {
         variant: "permanent",
         anchor: "left",
@@ -253,46 +253,46 @@ function to({
     )
   ] });
 }
-const Yt = ({
+const en = ({
   isOpen: e,
   dialogTitle: t,
   children: n,
-  maxWidth: i,
+  maxWidth: r,
   primaryButton: a,
-  secondaryButton: l,
+  secondaryButton: s,
   onClose: p
 }) => {
-  var d, v;
-  const [u, s] = k(!1);
-  return /* @__PURE__ */ c(
-    Ft,
+  var c, f;
+  const [u, l] = k(!1);
+  return /* @__PURE__ */ d(
+    _t,
     {
       open: e,
       onClose: () => {
         u || p();
       },
       fullWidth: !0,
-      maxWidth: i != null ? i : "xs",
+      maxWidth: r != null ? r : "xs",
       children: [
-        /* @__PURE__ */ o(yt, { children: t }),
-        /* @__PURE__ */ o(Lt, { sx: { "& > :last-child": { marginBottom: 0 } }, children: n }),
-        /* @__PURE__ */ c(Pt, { children: [
+        /* @__PURE__ */ o(zt, { children: t }),
+        /* @__PURE__ */ o(Rt, { sx: { "& > :last-child": { marginBottom: 0 } }, children: n }),
+        /* @__PURE__ */ d(Ht, { children: [
           /* @__PURE__ */ o(
-            ke,
+            Be,
             {
-              onClick: (d = l == null ? void 0 : l.onClick) != null ? d : p,
-              "data-testid": l == null ? void 0 : l.testId,
-              disabled: (l == null ? void 0 : l.disabled) || u,
-              color: l == null ? void 0 : l.buttonColor,
-              children: (v = l == null ? void 0 : l.text) != null ? v : "Cancel"
+              onClick: (c = s == null ? void 0 : s.onClick) != null ? c : p,
+              "data-testid": s == null ? void 0 : s.testId,
+              disabled: (s == null ? void 0 : s.disabled) || u,
+              color: s == null ? void 0 : s.buttonColor,
+              children: (f = s == null ? void 0 : s.text) != null ? f : "Cancel"
             }
           ),
           a && /* @__PURE__ */ o(
-            ke,
+            Be,
             {
-              onClick: () => J(void 0, null, function* () {
-                var f;
-                s(!0), yield (f = a.onClick) == null ? void 0 : f.call(a), s(!1);
+              onClick: () => K(void 0, null, function* () {
+                var m;
+                l(!0), yield (m = a.onClick) == null ? void 0 : m.call(a), l(!1);
               }),
               "data-testid": a.testId,
               disabled: a.disabled || u,
@@ -304,32 +304,32 @@ const Yt = ({
       ]
     }
   );
-}, Jt = 24, Kt = 64, L = "TopBar", A = {
-  topStripe: `${L}-topStripe`,
-  titleBar: `${L}-titleBar`,
-  titleSlider: `${L}-titleSlider`,
-  titleText: `${L}-titleText`,
-  leftPanelButton: `${L}-leftPanelButton`,
-  rightPanelButton: `${L}-leftPanelButton`
-}, Zt = ge("div", {
+}, tn = 24, nn = 64, y = "TopBar", S = {
+  topStripe: `${y}-topStripe`,
+  titleBar: `${y}-titleBar`,
+  titleSlider: `${y}-titleSlider`,
+  titleText: `${y}-titleText`,
+  leftPanelButton: `${y}-leftPanelButton`,
+  rightPanelButton: `${y}-leftPanelButton`
+}, on = me("div", {
   shouldForwardProp: (e) => !["leftPanel", "rightPanel"].includes(e),
-  name: L
+  name: y
 })(({ theme: e, leftPanel: t, rightPanel: n }) => {
-  var i, a;
+  var r, a;
   return {
     width: "100%",
-    [`& .${A.topStripe}`]: {
+    [`& .${S.topStripe}`]: {
       width: "100%",
-      height: `${Jt}px`,
+      height: `${tn}px`,
       backgroundColor: e.palette.primary.main
     },
-    [`& .${A.titleBar}`]: {
+    [`& .${S.titleBar}`]: {
       backgroundColor: e.palette.primary.light,
-      height: `${Kt}px`,
+      height: `${nn}px`,
       padding: e.spacing(0, 3),
       width: "100%"
     },
-    [`& .${A.titleSlider}`]: r(r({
+    [`& .${S.titleSlider}`]: i(i({
       height: "100%",
       display: "flex",
       alignItems: "center",
@@ -338,14 +338,14 @@ const Yt = ({
         easing: e.transitions.easing.sharp,
         duration: e.transitions.duration.leavingScreen
       }),
-      [`& .${A.leftPanelButton}`]: {
+      [`& .${S.leftPanelButton}`]: {
         marginRight: e.spacing(2),
         flexGrow: 0
       },
-      [`& .${A.titleText}`]: {
+      [`& .${S.titleText}`]: {
         flexGrow: 1
       },
-      [`& .${A.rightPanelButton}`]: {
+      [`& .${S.rightPanelButton}`]: {
         flexGrow: 0
       }
     }, (t == null ? void 0 : t.open) && {
@@ -353,7 +353,7 @@ const Yt = ({
         easing: e.transitions.easing.easeOut,
         duration: e.transitions.duration.enteringScreen
       }),
-      marginLeft: `${(i = t == null ? void 0 : t.width) != null ? i : 0}px`
+      marginLeft: `${(r = t == null ? void 0 : t.width) != null ? r : 0}px`
     }), (n == null ? void 0 : n.open) && {
       transition: e.transitions.create("margin", {
         easing: e.transitions.easing.easeOut,
@@ -363,19 +363,19 @@ const Yt = ({
     })
   };
 });
-function en({
+function rn({
   titleText: e = "",
   leftPanel: t,
   rightPanel: n,
-  "data-testid": i
+  "data-testid": r
 }) {
-  return /* @__PURE__ */ c(Zt, { leftPanel: t, rightPanel: n, "data-testid": i, children: [
-    /* @__PURE__ */ o("div", { className: A.topStripe }),
-    /* @__PURE__ */ o("div", { className: A.titleBar, children: /* @__PURE__ */ c(x, { className: A.titleSlider, children: [
-      t !== void 0 && !t.open && t.showOpenArrow && /* @__PURE__ */ c(
+  return /* @__PURE__ */ d(on, { leftPanel: t, rightPanel: n, "data-testid": r, children: [
+    /* @__PURE__ */ o("div", { className: S.topStripe }),
+    /* @__PURE__ */ o("div", { className: S.titleBar, children: /* @__PURE__ */ d(x, { className: S.titleSlider, children: [
+      t !== void 0 && !t.open && t.showOpenArrow && /* @__PURE__ */ d(
         V,
         {
-          className: A.leftPanelButton,
+          className: S.leftPanelButton,
           color: "inherit",
           "aria-label": "Open left side panel",
           onClick: t == null ? void 0 : t.onOpen,
@@ -383,15 +383,15 @@ function en({
           size: "large",
           children: [
             " ",
-            /* @__PURE__ */ o(qe, {})
+            /* @__PURE__ */ o(je, {})
           ]
         }
       ),
-      /* @__PURE__ */ o(B, { className: A.titleText, variant: "h6", noWrap: !0, children: e }),
-      n !== void 0 && !n.open && n.showOpenArrow && /* @__PURE__ */ c(
+      /* @__PURE__ */ o(B, { className: S.titleText, variant: "h6", noWrap: !0, children: e }),
+      n !== void 0 && !n.open && n.showOpenArrow && /* @__PURE__ */ d(
         V,
         {
-          className: A.rightPanelButton,
+          className: S.rightPanelButton,
           color: "inherit",
           "aria-label": "Open right side panel",
           onClick: n == null ? void 0 : n.onOpen,
@@ -399,14 +399,14 @@ function en({
           size: "large",
           children: [
             " ",
-            /* @__PURE__ */ o(je, {})
+            /* @__PURE__ */ o(Qe, {})
           ]
         }
       )
     ] }) })
   ] });
 }
-const et = 400, tn = ge(he, {
+const nt = 400, an = me(fe, {
   shouldForwardProp: (e) => (
     // Note we do want anchor to be forwarded to the Drawer component
     ![
@@ -420,9 +420,9 @@ const et = 400, tn = ge(he, {
   ),
   name: "SidePanelDrawer"
 })(
-  ({ width: e, debugOpacity: t = !1, anchor: n, navBarOpen: i, navBarWidthOpen: a, navBarWidthClosed: l }) => ({
+  ({ width: e, debugOpacity: t = !1, anchor: n, navBarOpen: r, navBarWidthOpen: a, navBarWidthClosed: s }) => ({
     width: e,
-    "& .MuiDrawer-paper": r(r({
+    "& .MuiDrawer-paper": i(i({
       position: "absolute",
       width: e,
       boxSizing: "border-box",
@@ -430,15 +430,15 @@ const et = 400, tn = ge(he, {
       boxShadow: "0px 4px 5px rgba(0, 0, 0, 0.14), 0px 1px 10px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.2)"
     }, t && {
       opacity: "50%"
-    }), n === "left" && r({
-      marginLeft: `${l}px`
-    }, i && {
+    }), n === "left" && i({
+      marginLeft: `${s}px`
+    }, r && {
       marginLeft: `${a}px`
     }))
   })
-), nn = ge(x, {
+), sn = me(x, {
   shouldForwardProp: (e) => !["anchor"].includes(e)
-})(({ theme: e, anchor: t }) => w(r({
+})(({ theme: e, anchor: t }) => w(i({
   display: "flex",
   alignItems: "center",
   padding: e.spacing(2)
@@ -460,46 +460,46 @@ function Ee({
   children: e,
   anchor: t = "left",
   open: n,
-  onClose: i = () => {
+  onClose: r = () => {
   },
   titleText: a = "",
-  width: l = et,
+  width: s = nt,
   showCloseArrow: p = !0,
   debugOpacity: u = !1,
-  headerBoxProps: s = {},
-  onOpened: d,
-  onClosed: v,
-  "data-testid": f,
+  headerBoxProps: l = {},
+  onOpened: c,
+  onClosed: f,
+  "data-testid": m,
   navBarOpen: C = !1,
-  navBarWidthOpen: m = 0,
+  navBarWidthOpen: v = 0,
   navBarWidthClosed: T = 0
 }) {
-  return /* @__PURE__ */ c(
-    tn,
+  return /* @__PURE__ */ d(
+    an,
     {
       SlideProps: {
-        onEntered: () => d == null ? void 0 : d(),
-        onExited: () => v == null ? void 0 : v()
+        onEntered: () => c == null ? void 0 : c(),
+        onExited: () => f == null ? void 0 : f()
       },
       variant: "persistent",
       anchor: t,
       open: n,
-      width: l,
+      width: s,
       debugOpacity: u,
-      "data-testid": f,
+      "data-testid": m,
       navBarOpen: C,
-      navBarWidthOpen: m,
+      navBarWidthOpen: v,
       navBarWidthClosed: T,
       children: [
-        /* @__PURE__ */ o(nn, w(r({ anchor: t }, s), { children: t === "left" ? /* @__PURE__ */ c(y, { children: [
+        /* @__PURE__ */ o(sn, w(i({ anchor: t }, l), { children: t === "left" ? /* @__PURE__ */ d(L, { children: [
           /* @__PURE__ */ o(B, { variant: "h6", color: "inherit", component: "div", children: a }),
-          p && /* @__PURE__ */ c(V, { onClick: i, size: "large", "aria-label": "Close left side panel", children: [
-            /* @__PURE__ */ o(je, { "data-testid": "arrowbackicon" }),
+          p && /* @__PURE__ */ d(V, { onClick: r, size: "large", "aria-label": "Close left side panel", children: [
+            /* @__PURE__ */ o(Qe, { "data-testid": "arrowbackicon" }),
             " "
           ] })
-        ] }) : /* @__PURE__ */ c(y, { children: [
-          p && /* @__PURE__ */ c(V, { onClick: i, size: "large", "aria-label": "Close right side panel", children: [
-            /* @__PURE__ */ o(qe, {}),
+        ] }) : /* @__PURE__ */ d(L, { children: [
+          p && /* @__PURE__ */ d(V, { onClick: r, size: "large", "aria-label": "Close right side panel", children: [
+            /* @__PURE__ */ o(je, {}),
             " "
           ] }),
           /* @__PURE__ */ o(B, { variant: "h6", color: "inherit", component: "div", children: a })
@@ -509,12 +509,12 @@ function Ee({
     }
   );
 }
-const on = $(x, {
+const ln = $(x, {
   shouldForwardProp: (e) => !["leftPanel", "rightPanel"].includes(e),
   name: "PanelAwareMargins"
 })(({ theme: e, leftPanel: t, rightPanel: n }) => {
-  var i, a;
-  return r(r({
+  var r, a;
+  return i(i({
     transition: e.transitions.create("margin", {
       easing: e.transitions.easing.sharp,
       duration: e.transitions.duration.leavingScreen
@@ -524,7 +524,7 @@ const on = $(x, {
       easing: e.transitions.easing.easeOut,
       duration: e.transitions.duration.enteringScreen
     }),
-    marginLeft: `${(i = t == null ? void 0 : t.width) != null ? i : 0}px`
+    marginLeft: `${(r = t == null ? void 0 : t.width) != null ? r : 0}px`
   }), (n == null ? void 0 : n.open) && {
     transition: e.transitions.create("margin", {
       easing: e.transitions.easing.easeOut,
@@ -532,153 +532,157 @@ const on = $(x, {
     }),
     marginRight: `${(a = n == null ? void 0 : n.width) != null ? a : 0}px`
   });
-}), rn = $(Ge, {
+}), cn = $(Ue, {
   name: "PageContainer"
 })(({ theme: e }) => ({
   // Horizontal padding comes from the Container's gutter
   paddingTop: e.spacing(3),
   paddingBottom: e.spacing(3)
-})), pe = !1, ue = !1, K = {
+})), he = !1, ge = !1, Y = {
   titleText: "",
   flavour: "push",
-  width: et,
+  width: nt,
   arrowButtons: "both",
   startOpen: !1,
   open: void 0,
   onChangeOpen: void 0,
-  content: /* @__PURE__ */ o(y, {}),
+  content: /* @__PURE__ */ o(L, {}),
   onOpened: void 0,
   onClosed: void 0,
   dataTestId: void 0
 };
-function no({
+function so({
   children: e,
   titleText: t = "",
   leftPanel: n,
-  rightPanel: i,
+  rightPanel: r,
   sidePanelsAreMutuallyExclusive: a = !0,
-  debugOpacity: l = !1,
+  debugOpacity: s = !1,
   pageContainerProps: p,
   pageContentDataTestId: u,
-  topBarDataTestId: s,
-  navBarOpen: d,
-  navBarWidthOpen: v,
-  navBarWidthClosed: f
+  topBarDataTestId: l,
+  navBarOpen: c,
+  navBarWidthOpen: f,
+  navBarWidthClosed: m
 }) {
-  const [C, m] = k(pe), [T, I] = k(ue), [S, b] = k(pe), [O, H] = k(ue), R = n !== void 0, W = i !== void 0, {
+  const [C, v] = k(he), [T, I] = k(ge), [A, b] = k(he), [O, H] = k(ge), R = n !== void 0, z = r !== void 0, {
     titleText: D,
-    content: X,
-    flavour: q,
-    open: z,
+    content: q,
+    flavour: X,
+    open: W,
     onChangeOpen: G,
     width: h,
     arrowButtons: g,
     startOpen: M,
-    onOpened: ct,
-    onClosed: pt,
-    dataTestId: ut
-  } = n ? r(r({}, K), n) : r({}, K), {
-    titleText: ht,
-    content: gt,
-    flavour: ve,
-    open: ie,
-    onChangeOpen: xe,
-    width: re,
+    onOpened: ht,
+    onClosed: gt,
+    dataTestId: ft
+  } = n ? i(i({}, Y), n) : i({}, Y), {
+    titleText: mt,
+    content: vt,
+    flavour: xe,
+    open: ae,
+    onChangeOpen: Ce,
+    width: se,
     arrowButtons: j,
     startOpen: Q,
-    onOpened: ft,
-    onClosed: mt,
-    dataTestId: vt
-  } = i ? r(r({}, K), i) : r({}, K);
+    onOpened: xt,
+    onClosed: Ct,
+    dataTestId: wt
+  } = r ? i(i({}, Y), r) : i({}, Y);
   te(() => {
-    M !== pe && (m(M), b(M));
+    M !== he && (v(M), b(M));
   }, [M]), te(() => {
-    Q !== ue && (I(Q), H(Q));
+    Q !== ge && (I(Q), H(Q));
   }, [Q]);
-  const ae = z === void 0 ? C : z, se = ie === void 0 ? T : ie, Ce = (N) => {
-    z === void 0 && (m(N), a && W && (N ? (I(!1), H(T)) : I(O))), G && G(N);
-  }, we = (N) => {
-    ie === void 0 && (I(N), a && R && (N ? (m(!1), b(C)) : m(S))), xe && xe(N);
+  const le = W === void 0 ? C : W, ce = ae === void 0 ? T : ae, we = (E) => {
+    W === void 0 && (v(E), a && z && (E ? (I(!1), H(T)) : I(O))), G && G(E);
+  }, be = (E) => {
+    ae === void 0 && (I(E), a && R && (E ? (v(!1), b(C)) : v(A))), Ce && Ce(E);
   };
-  return /* @__PURE__ */ c(x, { children: [
+  return /* @__PURE__ */ d(x, { children: [
     R && /* @__PURE__ */ o(
       Ee,
       {
-        "data-testid": ut,
+        "data-testid": ft,
         anchor: "left",
-        open: ae,
-        onClose: () => Ce(!1),
+        open: le,
+        onClose: () => we(!1),
         width: h,
         titleText: D,
-        debugOpacity: l,
+        debugOpacity: s,
         showCloseArrow: g === "both" || g === "close",
-        onOpened: ct,
-        onClosed: pt,
-        navBarOpen: d,
-        navBarWidthOpen: v,
-        navBarWidthClosed: f,
-        children: X
+        onOpened: ht,
+        onClosed: gt,
+        navBarOpen: c,
+        navBarWidthOpen: f,
+        navBarWidthClosed: m,
+        children: q
       }
     ),
-    W && /* @__PURE__ */ o(
+    z && /* @__PURE__ */ o(
       Ee,
       {
-        "data-testid": vt,
+        "data-testid": wt,
         anchor: "right",
-        open: se,
-        onClose: () => we(!1),
-        width: re,
-        titleText: ht,
-        debugOpacity: l,
+        open: ce,
+        onClose: () => be(!1),
+        width: se,
+        titleText: mt,
+        debugOpacity: s,
         showCloseArrow: j === "both" || j === "close",
-        onOpened: ft,
-        onClosed: mt,
-        navBarOpen: d,
-        navBarWidthOpen: v,
-        navBarWidthClosed: f,
-        children: gt
+        onOpened: xt,
+        onClosed: Ct,
+        navBarOpen: c,
+        navBarWidthOpen: f,
+        navBarWidthClosed: m,
+        children: vt
       }
     ),
     /* @__PURE__ */ o(
-      en,
-      r(r({
+      rn,
+      i(i({
         titleText: t,
-        "data-testid": s
-      }, R && q === "push" ? {
+        "data-testid": l
+      }, R && X === "push" ? {
         leftPanel: {
-          open: ae,
+          open: le,
           width: h,
-          onOpen: () => Ce(!0),
+          onOpen: () => we(!0),
           showOpenArrow: g === "both" || g === "open"
         }
-      } : {}), W && ve === "push" ? {
+      } : {}), z && xe === "push" ? {
         rightPanel: {
-          open: se,
-          width: re,
-          onOpen: () => we(!0),
+          open: ce,
+          width: se,
+          onOpen: () => be(!0),
           showOpenArrow: j === "both" || j === "open"
         }
       } : {})
     ),
     /* @__PURE__ */ o(
-      on,
-      w(r(r({}, q === "push" ? {
+      ln,
+      w(i(i({}, X === "push" ? {
         leftPanel: {
-          open: ae,
+          open: le,
           width: h
         }
-      } : {}), ve === "push" ? {
+      } : {}), xe === "push" ? {
         rightPanel: {
-          open: se,
-          width: re
+          open: ce,
+          width: se
         }
       } : {}), {
-        children: /* @__PURE__ */ o(rn, w(r({ "data-testid": u }, p), { children: e }))
+        children: /* @__PURE__ */ o(cn, w(i({ "data-testid": u }, p), { children: e }))
       })
     )
   ] });
 }
-function an({ links: e }) {
+const ot = () => {
+  const e = oe();
+  return It(e.breakpoints.down("sm"));
+}, dn = 64, pn = 64, un = 256, ie = N(!0), rt = N(un), it = N(pn), at = N(""), st = N(dn), lt = N(void 0);
+function hn({ links: e }) {
   return /* @__PURE__ */ o("div", { children: "LinksMenu not implemented yet" });
 }
 const Z = "Navbar", U = {
@@ -689,7 +693,7 @@ const Z = "Navbar", U = {
   // userInfoHolder: `${PREFIX}-userInfoHolder`,
   // settings: `${PREFIX}-settings`,
   // pieChartIcon: `${PREFIX}-pieChartIcon`,
-}, sn = $(x, { name: "NavBar" })(({ theme: e }) => ({
+}, gn = $(x, { name: "NavBar" })(({ theme: e }) => ({
   [`&.${U.root}`]: {
     display: "flex"
   },
@@ -711,49 +715,59 @@ const Z = "Navbar", U = {
 })), ne = (e, t, n) => e.transitions.create(t, {
   easing: e.transitions.easing.sharp,
   duration: n === "leaving" ? e.transitions.duration.leavingScreen : e.transitions.duration.enteringScreen
-}), tt = (e, t) => {
-  var n, i;
+}), fn = (e) => {
+  const t = oe();
+  return /* @__PURE__ */ o(
+    Ot,
+    i({
+      easing: t.transitions.easing.sharp,
+      timeout: {
+        enter: t.transitions.duration.enteringScreen,
+        exit: t.transitions.duration.leavingScreen
+      }
+    }, e)
+  );
+}, ct = (e) => {
+  var t, n;
   return {
-    height: `calc(100vh - ${t}px)`,
-    top: t,
     overflowX: "hidden",
-    overflowY: "hidden",
     color: "inherit",
-    backgroundColor: (i = (n = e == null ? void 0 : e.navBar) == null ? void 0 : n.backgroundColor) != null ? i : "white"
+    backgroundColor: (n = (t = e == null ? void 0 : e.navBar) == null ? void 0 : t.backgroundColor) != null ? n : "white"
     // Provide default so tests don't need to wrap theme provider
   };
-}, Ne = (e, t, n) => r({
+}, Fe = (e, t) => i({
   width: t,
   transition: ne(e, "width", "entering")
-}, tt(e, n)), Fe = (e, t, n) => r({
+}, ct(e)), Pe = (e, t) => i({
   width: t,
-  transition: ne(e, "width", "leaving"),
-  overflowX: "hidden"
-}, tt(e, n)), ln = $(he, {
-  shouldForwardProp: (e) => !["open", "widthOpen", "widthClosed", "offsetTop"].includes(e)
-})(({ theme: e, open: t, widthOpen: n, widthClosed: i, offsetTop: a }) => r(r({
+  transition: ne(e, "width", "leaving")
+}, ct(e)), mn = $(fe, {
+  shouldForwardProp: (e) => !["widthOpen", "widthClosed", "isSmallScreen"].includes(e)
+})(({ theme: e, open: t, widthOpen: n, widthClosed: r, isSmallScreen: a }) => i(i({
   flexShrink: 0,
   whiteSpace: "nowrap",
   boxSizing: "border-box",
   display: "flex",
   flexDirection: "column"
-}, t && w(r({}, Ne(e, n, a)), {
-  "& .MuiDrawer-paper": Ne(e, n, a)
-})), !t && w(r({}, Fe(e, i, a)), {
-  "& .MuiDrawer-paper": Fe(e, i, a)
+}, t && w(i({}, Fe(e, n)), {
+  backgroundColor: "",
+  "& .MuiDrawer-paper": Fe(e, n)
+})), !t && w(i({}, Pe(e, a ? n : r)), {
+  backgroundColor: "",
+  "& .MuiDrawer-paper": Pe(e, a ? n : r)
 })));
-function dn(e) {
+function vn(e) {
   let t = 0;
-  for (let n = 0, i = e.length; n < i; n++) {
+  for (let n = 0, r = e.length; n < r; n++) {
     const a = e.charCodeAt(n);
     t = (t << 5) - t + a, t |= 0;
   }
   return t;
 }
-const Pe = ["#A62A21", "#7e3794", "#0B51C1", "#3A6024", "#A81563", "#B3003C"], cn = (e) => e.split(/\s/).map((t) => t.substring(0, 1).toUpperCase()).filter((t) => !!t).slice(0, 2).join("").toUpperCase();
-function pn({ user: e, domainCode: t, open: n }) {
-  const i = At();
-  return /* @__PURE__ */ c(
+const ye = ["#A62A21", "#7e3794", "#0B51C1", "#3A6024", "#A81563", "#B3003C"], xn = (e) => e.split(/\s/).map((t) => t.substring(0, 1).toUpperCase()).filter((t) => !!t).slice(0, 2).join("").toUpperCase();
+function Cn({ user: e, domainCode: t, open: n }) {
+  const r = oe();
+  return /* @__PURE__ */ d(
     x,
     {
       sx: {
@@ -761,7 +775,7 @@ function pn({ user: e, domainCode: t, open: n }) {
         display: "flex",
         alignItems: "center",
         flexDirection: "column",
-        gap: "8px"
+        gap: "0.5rem"
       },
       children: [
         /* @__PURE__ */ o(
@@ -769,84 +783,75 @@ function pn({ user: e, domainCode: t, open: n }) {
           {
             sx: {
               width: n ? "5rem" : "2rem",
-              transition: n ? ne(i, ["width", "height"], "entering") : ne(i, ["width", "height"], "leaving"),
+              transition: n ? ne(r, ["width", "height"], "entering") : ne(r, ["width", "height"], "leaving"),
               aspectRatio: 1
             },
             children: e != null && e.name ? /* @__PURE__ */ o(
-              Ie,
+              Oe,
               {
                 src: e == null ? void 0 : e.picture,
                 sx: {
                   width: "100%",
                   height: "100%",
-                  bgcolor: Pe[Math.abs(dn(e.name)) % Pe.length]
+                  bgcolor: ye[Math.abs(vn(e.name)) % ye.length]
                 },
-                children: cn(e.name)
+                children: xn(e.name)
               }
-            ) : /* @__PURE__ */ o(Ie, { sx: { width: "100%", height: "100%" } })
+            ) : /* @__PURE__ */ o(Oe, { sx: { width: "100%", height: "100%" } })
           }
         ),
-        /* @__PURE__ */ o(
-          St,
-          {
-            sx: { width: "100%" },
-            easing: i.transitions.easing.sharp,
-            timeout: {
-              enter: i.transitions.duration.enteringScreen,
-              exit: i.transitions.duration.leavingScreen - 37
-            },
-            in: n,
-            unmountOnExit: !0,
-            children: /* @__PURE__ */ c(x, { width: "100%", display: "flex", flexDirection: "column", alignItems: "center", children: [
-              e != null && e.name ? /* @__PURE__ */ o(B, { children: e.name }) : /* @__PURE__ */ o(Oe, { animation: !1, width: "50%" }),
-              t ? /* @__PURE__ */ o(B, { children: t.toUpperCase() }) : /* @__PURE__ */ o(Oe, { animation: !1, width: "25%" })
-            ] })
-          }
-        )
+        /* @__PURE__ */ o(fn, { sx: { width: "100%" }, in: n, children: /* @__PURE__ */ o(Dt, { in: n, children: /* @__PURE__ */ d(x, { width: "100%", display: "flex", flexDirection: "column", alignItems: "center", children: [
+          e != null && e.name ? /* @__PURE__ */ o(B, { children: e.name }) : /* @__PURE__ */ o(De, { animation: !1, width: "50%" }),
+          t ? /* @__PURE__ */ o(B, { children: t.toUpperCase() }) : /* @__PURE__ */ o(De, { animation: !1, width: "25%" })
+        ] }) }) })
       ]
     }
   );
 }
-function un({
+function wn({
   open: e,
-  offsetTop: t = 0,
+  widthClosed: t,
   widthOpen: n,
-  widthClosed: i,
-  "data-testid": a,
-  top: l,
-  middle: p,
-  bottom: u,
-  user: s,
-  domainCode: d
+  "data-testid": r,
+  top: a,
+  middle: s,
+  bottom: p,
+  user: u,
+  domainCode: l
 }) {
-  return /* @__PURE__ */ o(sn, { className: U.root, "data-testid": a, children: /* @__PURE__ */ c(
-    ln,
+  const c = ot(), f = Je(ie);
+  return /* @__PURE__ */ o(gn, { className: U.root, "data-testid": r, children: /* @__PURE__ */ d(
+    mn,
     {
-      variant: "permanent",
-      anchor: "left",
       open: e,
       widthOpen: n,
-      widthClosed: i,
-      offsetTop: t,
+      widthClosed: t,
+      anchor: "left",
+      variant: c ? "temporary" : "permanent",
       PaperProps: {
         component: "nav"
       },
+      onClose: () => {
+        f(!1);
+      },
+      isSmallScreen: c,
       children: [
-        l && /* @__PURE__ */ c(x, { flexGrow: "0", children: [
-          l,
-          /* @__PURE__ */ o(De, { variant: "middle" })
+        !c && /* @__PURE__ */ o(kt, {}),
+        a && /* @__PURE__ */ d(x, { flexGrow: "0", children: [
+          a,
+          /* @__PURE__ */ o(ke, { variant: "middle" })
         ] }),
-        /* @__PURE__ */ o(x, { flexGrow: "1", children: Array.isArray(p) ? /* @__PURE__ */ o(an, { links: p }) : p }),
-        /* @__PURE__ */ c(x, { flexGrow: "0", children: [
-          /* @__PURE__ */ o(De, { variant: "middle" }),
-          /* @__PURE__ */ o(pn, { user: s, domainCode: d, open: e }),
-          u && /* @__PURE__ */ o(y, { children: u })
+        /* @__PURE__ */ o(x, { flexGrow: "1", children: Array.isArray(s) ? /* @__PURE__ */ o(hn, { links: s }) : s }),
+        /* @__PURE__ */ d(x, { flexGrow: "0", children: [
+          /* @__PURE__ */ o(ke, { variant: "middle" }),
+          /* @__PURE__ */ o(Cn, { user: u, domainCode: l, open: e }),
+          p && /* @__PURE__ */ o(L, { children: p })
         ] })
       ]
     }
   ) });
 }
-function hn({ children: e, topBarHeight: t }) {
+function bn({ children: e, topBarHeight: t }) {
   return /* @__PURE__ */ o(
     x,
     {
@@ -858,7 +863,7 @@ function hn({ children: e, topBarHeight: t }) {
         flexGrow: 1
       },
       children: /* @__PURE__ */ o(
-        Ge,
+        Ue,
         {
           component: "main",
           id: "main-content",
@@ -869,13 +874,13 @@ function hn({ children: e, topBarHeight: t }) {
     }
   );
 }
-const gn = 64, fn = 64, mn = 256, me = E(!0), nt = E(mn), ot = E(fn), it = E(""), rt = E(gn), at = E(void 0), vn = "TopBar", xn = {
-  titleText: `${vn}-titleText`
+const Sn = "TopBar", An = {
+  titleText: `${Sn}-titleText`
 };
-function Cn({ titleText: e = "", height: t, "data-testid": n }) {
-  const i = _t(me);
-  return /* @__PURE__ */ o("header", { "data-testid": n, children: /* @__PURE__ */ c(
-    ze,
+function Tn({ titleText: e = "", height: t, "data-testid": n }) {
+  const r = Je(ie), a = () => r((u) => !u), s = oe(), p = ot();
+  return /* @__PURE__ */ o("header", { "data-testid": n, children: /* @__PURE__ */ d(
+    Ge,
     {
       square: !0,
       elevation: 0,
@@ -888,71 +893,72 @@ function Cn({ titleText: e = "", height: t, "data-testid": n }) {
         alignItems: "center",
         gap: 2,
         flexShrink: 0,
-        height: t
+        height: t,
+        zIndex: p ? 0 : s.zIndex.drawer + 1
       },
       children: [
-        /* @__PURE__ */ o(V, { size: "medium", color: "inherit", sx: { padding: 1.5 }, onClick: () => i((l) => !l), children: /* @__PURE__ */ o(Mt, { fontSize: "medium" }) }),
-        /* @__PURE__ */ o(B, { className: xn.titleText, variant: "h6", children: e })
+        /* @__PURE__ */ o(V, { size: "medium", color: "inherit", sx: { padding: 1.5 }, onClick: a, children: /* @__PURE__ */ o(Wt, { fontSize: "medium" }) }),
+        /* @__PURE__ */ o(B, { className: An.titleText, variant: "h6", children: e })
       ]
     }
   ) });
 }
-function oo({
+function lo({
   children: e,
   initialTitleText: t,
   initialNavBarOpen: n,
-  pageContainerProps: i,
+  pageContainerProps: r,
   pageContentDataTestId: a,
-  topBarDataTestId: l,
+  topBarDataTestId: s,
   navBarDataTestId: p,
   navBarMiddle: u,
-  navBarBottom: s,
-  user: d,
-  domainCode: v
+  navBarBottom: l,
+  user: c,
+  domainCode: f
 }) {
-  const [f, C] = P(me), [m] = P(nt), [T] = P(ot), [I, S] = P(it), [b] = P(rt), [O] = P(at);
+  const [m, C] = P(ie), [v] = P(rt), [T] = P(it), [I, A] = P(at), [b] = P(st), [O] = P(lt);
   return te(() => {
-    t !== void 0 && S(t);
-  }, [t, S]), te(() => {
+    t !== void 0 && A(t);
+  }, [t, A]), te(() => {
     n !== void 0 && C(n);
-  }, [n, C]), /* @__PURE__ */ c(x, { children: [
-    /* @__PURE__ */ o(Tt, {}),
-    /* @__PURE__ */ o(Cn, { titleText: I, "data-testid": l, height: b }),
-    /* @__PURE__ */ c(x, { sx: { display: "flex" }, children: [
+  }, [n, C]), /* @__PURE__ */ d(x, { children: [
+    /* @__PURE__ */ o(Bt, {}),
+    /* @__PURE__ */ o(Tn, { titleText: I, "data-testid": s, height: b }),
+    /* @__PURE__ */ d(x, { sx: { display: "flex" }, children: [
       /* @__PURE__ */ o(
-        un,
+        wn,
         {
-          open: f,
+          open: m,
           top: O,
           middle: u,
-          bottom: s,
-          user: d,
-          domainCode: v,
-          widthOpen: m,
+          bottom: l,
+          user: c,
+          domainCode: f,
+          widthOpen: v,
           widthClosed: T,
           offsetTop: b,
           "data-testid": p
         }
       ),
       /* @__PURE__ */ o(
-        hn,
-        w(r({
+        bn,
+        w(i({
           "data-testid": a,
           topBarHeight: b
-        }, i), {
+        }, r), {
           children: e
         })
       )
     ] })
   ] });
 }
-const wn = {
+const In = {
   autoHideDuration: 6e3,
   anchorOrigin: { vertical: "top", horizontal: "center" },
   // The default is false. If we prefer timer to continue when window loses
   // focus, change to true
   disableWindowBlurListener: !1
-}, bn = {
+}, On = {
   shouldClose: (e, t) => t !== "clickaway"
 }, Le = {
   message: "",
@@ -960,108 +966,108 @@ const wn = {
   variant: "standard",
   progressIndicator: void 0
   // Can use 'circular' or 'linear'
-}, ye = 100, Me = 2e3, An = 2e3, Sn = (() => {
+}, Me = 100, _e = 2e3, Dn = 2e3, kn = (() => {
   let e = 0;
   return () => (e += 1, e);
-})(), Tn = {
+})(), Bn = {
   borderBottomLeftRadius: "0px",
   borderBottomRightRadius: "0px"
-}, In = {}, On = {}, st = Re(null);
-function Dn(l) {
-  var p = l, {
-    overrideState: e = In,
-    overrideActions: t = On,
-    shouldClose: n = bn.shouldClose,
-    children: i
-  } = p, a = Se(p, [
+}, $n = {}, Nn = {}, dt = ze(null);
+function En(s) {
+  var p = s, {
+    overrideState: e = $n,
+    overrideActions: t = Nn,
+    shouldClose: n = On.shouldClose,
+    children: r
+  } = p, a = Te(p, [
     "overrideState",
     "overrideActions",
     "shouldClose",
     "children"
   ]);
   var G;
-  const [{ open: u }, s] = k({ open: !1 }), d = de([]), v = de(Date.now()), f = de(0), C = ee((h) => {
-    s({ open: h });
-  }, []), m = ee((h = {}) => {
-    f.current += 1, d.current.length >= ye && Date.now() - v.current >= Me && (v.current = Date.now(), console.error(
-      `SaladBarProvider: MAX_QUEUE_LENGTH (${ye}) hit ${f.current} times in last ${Me}ms)`
-    ), f.current = 0);
-    const g = r(w(r({}, Le), {
-      key: Sn()
+  const [{ open: u }, l] = k({ open: !1 }), c = pe([]), f = pe(Date.now()), m = pe(0), C = ee((h) => {
+    l({ open: h });
+  }, []), v = ee((h = {}) => {
+    m.current += 1, c.current.length >= Me && Date.now() - f.current >= _e && (f.current = Date.now(), console.error(
+      `SaladBarProvider: MAX_QUEUE_LENGTH (${Me}) hit ${m.current} times in last ${_e}ms)`
+    ), m.current = 0);
+    const g = i(w(i({}, Le), {
+      key: kn()
     }), h);
-    return d.current.push(g), d.current.length === 1 && s({ open: !0 }), g.key;
-  }, []), T = (h = "", g = {}) => m(r({ message: h, severity: "success" }, g)), I = (h = "", g = {}) => m(r({ message: h, severity: "info" }, g)), S = (h = "", g = {}) => m(r({ message: h, severity: "warning" }, g)), b = (h = "", g = {}) => m(r({ message: h, severity: "error" }, g)), O = (h) => {
-    const g = d.current.findIndex((M) => M.key === h);
+    return c.current.push(g), c.current.length === 1 && l({ open: !0 }), g.key;
+  }, []), T = (h = "", g = {}) => v(i({ message: h, severity: "success" }, g)), I = (h = "", g = {}) => v(i({ message: h, severity: "info" }, g)), A = (h = "", g = {}) => v(i({ message: h, severity: "warning" }, g)), b = (h = "", g = {}) => v(i({ message: h, severity: "error" }, g)), O = (h) => {
+    const g = c.current.findIndex((M) => M.key === h);
     if (g !== -1)
-      return g === 0 ? (s({ open: !1 }), d.current[0]) : d.current.splice(g, 1);
+      return g === 0 ? (l({ open: !1 }), c.current[0]) : c.current.splice(g, 1);
   }, H = (h, g) => {
-    n(h, g) && s({ open: !1 });
+    n(h, g) && l({ open: !1 });
   }, R = () => {
-  }, W = () => {
-    d.current.shift(), d.current.length > 0 && s({ open: !0 });
-  }, D = (G = d.current[0]) != null ? G : r({}, Le), X = {};
-  "autoHideDuration" in D && (X.autoHideDuration = D.autoHideDuration);
-  const q = r(r({}, wn), a), z = r(r({
+  }, z = () => {
+    c.current.shift(), c.current.length > 0 && l({ open: !0 });
+  }, D = (G = c.current[0]) != null ? G : i({}, Le), q = {};
+  "autoHideDuration" in D && (q.autoHideDuration = D.autoHideDuration);
+  const X = i(i({}, In), a), W = i(i({
     open: u,
     setOpen: C,
-    enqueueNotification: m,
+    enqueueNotification: v,
     enqueueSuccessNotification: T,
     enqueueInfoNotification: I,
-    enqueueWarningNotification: S,
+    enqueueWarningNotification: A,
     enqueueErrorNotification: b,
     removeNotification: O
   }, e), t);
-  return /* @__PURE__ */ c(st.Provider, { value: z, children: [
-    i,
+  return /* @__PURE__ */ d(dt.Provider, { value: W, children: [
+    r,
     /* @__PURE__ */ o(
-      It,
-      w(r(r({}, q), X), {
+      $t,
+      w(i(i({}, X), q), {
         open: u,
         onClose: H,
         TransitionProps: {
-          onExited: W,
+          onExited: z,
           onExit: R
         },
-        sx: { zIndex: An },
-        children: /* @__PURE__ */ c("div", { children: [
+        sx: { zIndex: Dn },
+        children: /* @__PURE__ */ d("div", { children: [
           /* @__PURE__ */ o(
-            Ot,
+            Nt,
             {
               onClose: (h) => H(h, "closeAlert"),
               severity: D.severity,
               variant: "filled",
-              icon: D.progressIndicator === "circular" ? /* @__PURE__ */ o(Ue, { size: "1em" }) : void 0,
-              style: D.progressIndicator === "linear" ? Tn : void 0,
+              icon: D.progressIndicator === "circular" ? /* @__PURE__ */ o(Ve, { size: "1em" }) : void 0,
+              style: D.progressIndicator === "linear" ? Bn : void 0,
               children: D.message
             }
           ),
-          D.progressIndicator === "linear" && /* @__PURE__ */ o(Dt, { color: "primary" })
+          D.progressIndicator === "linear" && /* @__PURE__ */ o(Et, { color: "primary" })
         ] })
       })
     )
   ] });
 }
-function kn() {
-  const e = We(st);
+function Fn() {
+  const e = We(dt);
   if (e === null)
-    throw new fe("Error: Tried to useSaladBar outside of a <SaladBarProvider>");
+    throw new ve("Error: Tried to useSaladBar outside of a <SaladBarProvider>");
   return e;
 }
-const io = oe(
-  (e = { autoHideDuration: 1 }, t = {}, n = {}) => ({ children: i }) => /* @__PURE__ */ o(Dn, w(r({}, e), { overrideState: t, overrideActions: n, children: i }))
-), Bn = Ht(), ro = ({
+const co = re(
+  (e = { autoHideDuration: 1 }, t = {}, n = {}) => ({ children: r }) => /* @__PURE__ */ o(En, w(i({}, e), { overrideState: t, overrideActions: n, children: r }))
+), Pn = Gt(), po = ({
   children: e,
   store: t
-}) => /* @__PURE__ */ o(Qe, { store: t != null ? t : Bn, children: e }), lt = "domainCode";
-var He;
-const _e = E(
-  JSON.parse((He = localStorage.getItem(lt)) != null ? He : '{"domainCode": ""}').domainCode
-), dt = E(
-  (e) => e(_e),
+}) => /* @__PURE__ */ o(Ke, { store: t != null ? t : Pn, children: e }), pt = "domainCode";
+var Re;
+const He = N(
+  JSON.parse((Re = localStorage.getItem(pt)) != null ? Re : '{"domainCode": ""}').domainCode
+), ut = N(
+  (e) => e(He),
   (e, t, n) => {
-    t(_e, n), localStorage.setItem(lt, JSON.stringify({ domainCode: n }));
+    t(He, n), localStorage.setItem(pt, JSON.stringify({ domainCode: n }));
   }
-), $n = {
+), yn = {
   act: "ACT",
   nsw: "NSW",
   nt: "NT",
@@ -1073,64 +1079,64 @@ const _e = E(
   ag: "AG",
   fedmps: "Fedmps",
   "": ""
-}, En = (e) => {
+}, Ln = (e) => {
   var t;
-  return e === null ? "N/A" : (t = $n[e]) != null ? t : "";
-}, ao = ({
+  return e === null ? "N/A" : (t = yn[e]) != null ? t : "";
+}, uo = ({
   isLoading: e,
   isOpen: t,
   onClose: n,
-  domainOptions: i,
+  domainOptions: r,
   applicationName: a,
-  handleLogout: l
+  handleLogout: s
 }) => {
-  const [p, u] = P(dt), [s, d] = k(p), { enqueueSuccessNotification: v } = kn(), f = i.length === 0, C = !!p && !i.includes(p) && !i.includes(s), m = !p || f || C, T = () => J(void 0, null, function* () {
-    s ? (u(s), v(`Set domain to ${s}`), n()) : u("");
-  }), I = () => J(void 0, null, function* () {
-    p && !f && !C ? (d(p), n()) : m && l();
+  const [p, u] = P(ut), [l, c] = k(p), { enqueueSuccessNotification: f } = Fn(), m = r.length === 0, C = !!p && !r.includes(p) && !r.includes(l), v = !p || m || C, T = () => K(void 0, null, function* () {
+    l ? (u(l), f(`Set domain to ${l}`), n()) : u("");
+  }), I = () => K(void 0, null, function* () {
+    p && !m && !C ? (c(p), n()) : v && s();
   });
-  let S;
-  return f ? S = "Unable to retrieve your active organisations. Try logging in again." : C && (S = "You no longer have any roles in your chosen organisation. Please choose another."), /* @__PURE__ */ c(
-    Yt,
+  let A;
+  return m ? A = "Unable to retrieve your active organisations. Try logging in again." : C && (A = "You no longer have any roles in your chosen organisation. Please choose another."), /* @__PURE__ */ d(
+    en,
     {
       isOpen: t,
       dialogTitle: "Select an organisation",
       primaryButton: {
         text: "Confirm",
         onClick: T,
-        disabled: !s || f || C,
+        disabled: !l || m || C,
         buttonColor: "primary"
       },
       secondaryButton: {
-        text: m ? "Logout" : "Cancel",
+        text: v ? "Logout" : "Cancel",
         onClick: I
       },
-      onClose: m ? () => {
+      onClose: v ? () => {
       } : n,
       children: [
-        /* @__PURE__ */ c(B, { marginBottom: 2, children: [
+        /* @__PURE__ */ d(B, { marginBottom: 2, children: [
           "Select the default organisation that you want to use with the ",
           a,
           "."
         ] }),
         /* @__PURE__ */ o(
-          kt,
+          Ft,
           {
             loading: e,
             multiple: !1,
             disableClearable: !1,
-            value: s !== "" ? s : null,
-            onChange: (b, O) => d(O != null ? O : ""),
-            getOptionLabel: En,
-            options: [...i],
+            value: l !== "" ? l : null,
+            onChange: (b, O) => c(O != null ? O : ""),
+            getOptionLabel: Ln,
+            options: [...r],
             renderInput: (b) => /* @__PURE__ */ o(
-              Bt,
-              w(r({}, b), {
+              Pt,
+              w(i({}, b), {
                 variant: "filled",
                 label: "Select organisation",
-                InputProps: w(r({}, b.InputProps), {
-                  endAdornment: /* @__PURE__ */ c(y, { children: [
-                    e ? /* @__PURE__ */ o(Ue, { color: "inherit", size: 20, sx: { marginTop: "-20px" } }) : null,
+                InputProps: w(i({}, b.InputProps), {
+                  endAdornment: /* @__PURE__ */ d(L, { children: [
+                    e ? /* @__PURE__ */ o(Ve, { color: "inherit", size: 20, sx: { marginTop: "-20px" } }) : null,
                     b.InputProps.endAdornment
                   ] })
                 })
@@ -1138,11 +1144,11 @@ const _e = E(
             )
           }
         ),
-        S && /* @__PURE__ */ o($t, { error: !0, children: S })
+        A && /* @__PURE__ */ o(yt, { error: !0, children: A })
       ]
     }
   );
-}, so = Ve({
+}, ho = qe({
   palette: {
     primary: {
       dark: "#00A651",
@@ -1193,7 +1199,7 @@ const _e = E(
   navBar: {
     backgroundColor: "#E8E8E8"
   }
-}), lo = Ve({
+}), go = qe({
   palette: {
     primary: {
       main: "#007236",
@@ -1247,18 +1253,18 @@ const _e = E(
       styleOverrides: {
         root: ({ theme: e }) => ({
           "&.Mui-selected": {
-            backgroundColor: ce(
+            backgroundColor: ue(
               e.palette.secondary.main,
               e.palette.action.selectedOpacity
             ),
             "&:hover": {
-              backgroundColor: ce(
+              backgroundColor: ue(
                 e.palette.secondary.main,
                 e.palette.action.selectedOpacity
               )
             },
             "&.Mui-focusVisible": {
-              backgroundColor: ce(
+              backgroundColor: ue(
                 e.palette.secondary.main,
                 e.palette.action.focusOpacity
               )
@@ -1284,25 +1290,25 @@ const _e = E(
   navBar: {
     backgroundColor: "#E8E8E8"
   }
-}), Nn = {
-  domainCode: dt,
-  navBarOpen: me,
-  navBarWidthOpen: nt,
-  navBarWidthClosed: ot,
-  titleText: it,
-  topBarHeight: rt,
-  navBarTop: at
-}, co = oe(() => ({ children: e }) => /* @__PURE__ */ o(Qe, { children: e })), Fn = ({
+}), Mn = {
+  domainCode: ut,
+  navBarOpen: ie,
+  navBarWidthOpen: rt,
+  navBarWidthClosed: it,
+  titleText: at,
+  topBarHeight: st,
+  navBarTop: lt
+}, fo = re(() => ({ children: e }) => /* @__PURE__ */ o(Ke, { children: e })), _n = ({
   initialValues: e,
   children: t
-}) => (Rt(e), /* @__PURE__ */ o(y, { children: t })), po = oe(
+}) => (Ut(e), /* @__PURE__ */ o(L, { children: t })), mo = re(
   (e) => ({ children: t }) => /* @__PURE__ */ o(
-    Fn,
+    _n,
     {
       initialValues: Object.entries(e).map(
-        ([n, i]) => [
-          Nn[n],
-          i
+        ([n, r]) => [
+          Mn[n],
+          r
         ]
       ),
       children: t
@@ -1310,39 +1316,40 @@ const _e = E(
   )
 );
 export {
-  Yt as AgDialog,
-  oo as AppLayout,
-  ro as AtomProvider,
-  st as Context,
-  fe as ContextError,
-  ao as DomainCodeDialog,
-  Jn as ExampleComponent,
-  Fn as HydrateAtoms,
-  Je as NAVBAR_WIDTH_CLOSED,
+  en as AgDialog,
+  lo as AppLayout,
+  po as AtomProvider,
+  dt as Context,
+  ve as ContextError,
+  uo as DomainCodeDialog,
+  no as ExampleComponent,
+  _n as HydrateAtoms,
+  Ze as NAVBAR_WIDTH_CLOSED,
   Ye as NAVBAR_WIDTH_OPENED,
-  to as NavBar,
-  Zn as NavBarDarkStyledList,
-  eo as NavBarLightStyledList,
-  qt as NavBarProvider,
-  no as PageLayout,
-  Dn as SaladBarProvider,
-  Bn as atomStore,
-  Qt as buildNavBarState,
-  dt as domainCodeAtom,
-  so as fed21Theme,
-  lo as internalAgSystemsTheme,
+  ao as NavBar,
+  ro as NavBarDarkStyledList,
+  io as NavBarLightStyledList,
+  Kt as NavBarProvider,
+  so as PageLayout,
+  En as SaladBarProvider,
+  Pn as atomStore,
+  Zt as buildNavBarState,
+  ut as domainCodeAtom,
+  ho as fed21Theme,
+  go as internalAgSystemsTheme,
   _ as navBarClasses,
-  me as navBarOpenAtom,
-  at as navBarTopAtom,
-  ot as navBarWidthClosedAtom,
-  nt as navBarWidthOpenAtom,
-  it as titleTextAtom,
-  rt as topBarHeightAtom,
-  jt as useNavBar,
-  kn as useSaladBar,
-  co as withAtomProvider,
-  Kn as withNavBarProvider,
-  po as withOverrideDefaults,
-  io as withSaladBarProvider
+  ie as navBarOpenAtom,
+  lt as navBarTopAtom,
+  it as navBarWidthClosedAtom,
+  rt as navBarWidthOpenAtom,
+  at as titleTextAtom,
+  st as topBarHeightAtom,
+  Yt as useNavBar,
+  Fn as useSaladBar,
+  ot as useSmallScreen,
+  fo as withAtomProvider,
+  oo as withNavBarProvider,
+  mo as withOverrideDefaults,
+  co as withSaladBarProvider
 };
 //# sourceMappingURL=index.js.map