@australiangreens/ag-internal-components 0.0.45 → 0.0.47

package/dist/esm/index.js

@@ -1,111 +1,110 @@
-var xt = Object.defineProperty, Ct = Object.defineProperties;
-var wt = Object.getOwnPropertyDescriptors;
-var J = Object.getOwnPropertySymbols;
-var we = Object.prototype.hasOwnProperty, be = Object.prototype.propertyIsEnumerable;
-var de = (e, t, n) => t in e ? xt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, i = (e, t) => {
+var It = Object.defineProperty, Ot = Object.defineProperties;
+var Tt = Object.getOwnPropertyDescriptors;
+var Z = Object.getOwnPropertySymbols;
+var Te = Object.prototype.hasOwnProperty, De = Object.prototype.propertyIsEnumerable;
+var ue = (e, t, n) => t in e ? It(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, r = (e, t) => {
   for (var n in t || (t = {}))
-    we.call(t, n) && de(e, n, t[n]);
-  if (J)
-    for (var n of J(t))
-      be.call(t, n) && de(e, n, t[n]);
+    Te.call(t, n) && ue(e, n, t[n]);
+  if (Z)
+    for (var n of Z(t))
+      De.call(t, n) && ue(e, n, t[n]);
   return e;
-}, x = (e, t) => Ct(e, wt(t));
-var Ae = (e, t) => {
+}, v = (e, t) => Ot(e, Tt(t));
+var Be = (e, t) => {
   var n = {};
-  for (var r in e)
-    we.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 && be.call(e, r) && (n[r] = e[r]);
+  for (var i in e)
+    Te.call(e, i) && t.indexOf(i) < 0 && (n[i] = e[i]);
+  if (e != null && Z)
+    for (var i of Z(e))
+      t.indexOf(i) < 0 && De.call(e, i) && (n[i] = e[i]);
   return n;
 };
-var Se = (e, t, n) => (de(e, typeof t != "symbol" ? t + "" : t, n), n);
-var K = (e, t, n) => new Promise((r, a) => {
+var $e = (e, t, n) => (ue(e, typeof t != "symbol" ? t + "" : t, n), n);
+var ee = (e, t, n) => new Promise((i, a) => {
   var l = (s) => {
     try {
       u(n.next(s));
-    } catch (d) {
-      a(d);
+    } catch (c) {
+      a(c);
     }
   }, p = (s) => {
     try {
       u(n.throw(s));
-    } catch (d) {
-      a(d);
+    } catch (c) {
+      a(c);
     }
-  }, u = (s) => s.done ? r(s.value) : Promise.resolve(s.value).then(l, p);
+  }, u = (s) => s.done ? i(s.value) : Promise.resolve(s.value).then(l, p);
   u((n = n.apply(e, t)).next());
 });
-import { jsxs as c, Fragment as M, jsx as o } from "react/jsx-runtime";
-import { useState as D, createContext as He, useCallback as ne, useContext as Re, useEffect as oe, useRef as ce } from "react";
-import { Typography as $, Button as bt, Paper as We, styled as X, Box as T, IconButton as V, Drawer as At, Container as ze, Avatar as Ie, Skeleton as Te, Divider as Oe, CssBaseline as St, Snackbar as It, Alert as Tt, CircularProgress as Ge, LinearProgress as Ot, Autocomplete as Dt, TextField as $t, FormHelperText as kt } from "@mui/material";
-import Bt from "@mui/material/CssBaseline";
-import { styled as _, createTheme as Ue, alpha as pe } from "@mui/material/styles";
-import Ve from "@mui/material/Drawer";
-import { AgError as Nt } from "@australiangreens/ag-error";
-import { createHelper as re } from "souvlaki";
-import Xe from "@mui/material/List";
-import De from "@mui/material/Button";
-import Et from "@mui/material/Dialog";
-import Ft 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 Pt } from "@mui/icons-material";
-import { useSetLibraryAtom as Mt, useLibraryAtom as y } from "src/providers";
-import { atom as k, getDefaultStore as _t, Provider as Ye, useAtom as Ht, useSetAtom as Rt } from "jotai";
-import { useHydrateAtoms as Wt } from "jotai/utils";
-function no({ text: e }) {
-  const [t, n] = D(0);
-  return /* @__PURE__ */ c(M, { children: [
-    /* @__PURE__ */ o($, { variant: "h6", color: "inherit", component: "div", sx: { fontSize: "22px" }, children: "Hello world" }),
-    /* @__PURE__ */ o($, { variant: "caption", display: "block", children: /* @__PURE__ */ o("span", { children: "Just ensuring MUI is working as planned as a peer dependency. v0.0.11" }) }),
+import { jsxs as d, Fragment as P, jsx as o } from "react/jsx-runtime";
+import { useState as T, createContext as qe, useCallback as re, useContext as je, useEffect as ae, useRef as he } from "react";
+import { Typography as B, Button as Dt, Paper as Qe, styled as j, Box as w, IconButton as q, Drawer as Bt, Container as Ye, Avatar as te, Skeleton as ke, List as Ee, ListItemButton as M, ListItemIcon as ge, ListItemText as _, Collapse as $t, Divider as Ne, CssBaseline as kt, Snackbar as Et, Alert as Nt, CircularProgress as Je, LinearProgress as Lt, Autocomplete as Ft, TextField as Pt, FormHelperText as yt } from "@mui/material";
+import Mt from "@mui/material/CssBaseline";
+import { styled as R, createTheme as Ke, alpha as fe } from "@mui/material/styles";
+import Ze from "@mui/material/Drawer";
+import { AgError as _t } from "@australiangreens/ag-error";
+import { createHelper as se } from "souvlaki";
+import et from "@mui/material/List";
+import Le from "@mui/material/Button";
+import Ht from "@mui/material/Dialog";
+import Rt from "@mui/material/DialogActions";
+import Wt from "@mui/material/DialogContent";
+import zt from "@mui/material/DialogTitle";
+import { ArrowForward as tt, ArrowBack as nt, Dashboard as Ut, ExpandLess as Gt, ExpandMore as Vt, Settings as Xt, Logout as qt, ViewHeadline as jt } from "@mui/icons-material";
+import { useAtomValue as Fe, atom as $, useSetAtom as Qt, useAtom as L, getDefaultStore as Yt, Provider as ot } from "jotai";
+import { useHydrateAtoms as Jt } from "jotai/utils";
+function lo({ text: e }) {
+  const [t, n] = T(0);
+  return /* @__PURE__ */ d(P, { 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,
+      Dt,
       {
         variant: "outlined",
-        onClick: () => n((r) => r + 1),
+        onClick: () => n((i) => i + 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(We, { children: [
+    /* @__PURE__ */ d(Qe, { children: [
       "This number will incremember when button pressed: ",
       t
     ] })
   ] });
 }
-const Qe = 330, Je = 73, E = "Navbar", P = {
-  root: `${E}-root`,
-  menuButton: `${E}-menuButton`,
-  hide: `${E}-hide`,
-  content: `${E}-content`,
-  userInfoHolder: `${E}-userInfoHolder`,
-  settings: `${E}-settings`,
-  pieChartIcon: `${E}-pieChartIcon`
-}, zt = _("div", { name: "NavBar" })(({ theme: e }) => ({
-  [`&.${P.root}`]: {
+const it = 330, rt = 73, N = "Navbar", H = {
+  root: `${N}-root`,
+  menuButton: `${N}-menuButton`,
+  hide: `${N}-hide`,
+  content: `${N}-content`,
+  userInfoHolder: `${N}-userInfoHolder`,
+  settings: `${N}-settings`,
+  pieChartIcon: `${N}-pieChartIcon`
+}, Kt = R("div", { name: "NavBar" })(({ theme: e }) => ({
+  [`&.${H.root}`]: {
     display: "flex"
   },
-  [`& .${P.menuButton}`]: {
+  [`& .${H.menuButton}`]: {
     marginRight: 36
   },
-  [`& .${P.hide}`]: {
+  [`& .${H.hide}`]: {
     display: "none"
   },
-  [`& .${P.content}`]: {
+  [`& .${H.content}`]: {
     flexGrow: 1,
     padding: e.spacing(3)
   },
-  [`& .${P.userInfoHolder}`]: {
+  [`& .${H.userInfoHolder}`]: {
     height: "148px",
     marginTop: "64px",
     marginBottom: "16px"
   }
-})), Ke = () => ({
+})), at = () => ({
   position: "absolute",
   height: "100%",
   overflowX: "hidden",
@@ -113,51 +112,51 @@ const Qe = 330, Je = 73, E = "Navbar", P = {
   color: "white",
   backgroundColor: "black"
   // backgroundColor: '#e8e8e8',
-}), Gt = () => i({
-  width: Qe
-}, Ke()), Ut = () => i({
-  width: Je
-}, Ke()), Vt = _(Ve, {
+}), Zt = () => r({
+  width: it
+}, at()), en = () => r({
+  width: rt
+}, at()), tn = R(Ze, {
   shouldForwardProp: (e) => e !== "open"
-})(({ theme: e, open: t }) => i(i({
-  width: t ? Qe : Je,
+})(({ theme: e, open: t }) => r(r({
+  width: t ? it : rt,
   flexShrink: 0,
   whiteSpace: "nowrap",
   boxSizing: "border-box",
   zIndex: e.zIndex.drawer + 100
 }, t && {
-  "& .MuiDrawer-paper": Gt()
+  "& .MuiDrawer-paper": Zt()
 }), !t && {
-  "& .MuiDrawer-paper": Ut()
+  "& .MuiDrawer-paper": en()
 }));
-class he extends Nt {
+class ve extends _t {
 }
-Se(he, "errorName", "ContextError");
-const Ze = He(null), Xt = {}, qt = {}, jt = ({
-  overrideState: e = Xt,
-  overrideActions: t = qt,
+$e(ve, "errorName", "ContextError");
+const st = qe(null), nn = {}, on = {}, rn = ({
+  overrideState: e = nn,
+  overrideActions: t = on,
   children: n
 }) => {
-  const [{ open: r }, a] = D({ open: !0 }), l = ne((s) => {
+  const [{ open: i }, a] = T({ open: !0 }), l = re((s) => {
     a({ open: s });
-  }, []), p = ne(() => {
-    a((s) => x(i({}, s), { open: !s.open }));
-  }, []), u = i(i({
-    open: r,
+  }, []), p = re(() => {
+    a((s) => v(r({}, s), { open: !s.open }));
+  }, []), u = r(r({
+    open: i,
     setOpen: l,
     toggleOpen: p
   }, e), t);
-  return /* @__PURE__ */ o(Ze.Provider, { value: u, children: n });
-}, Yt = () => {
-  const e = Re(Ze);
+  return /* @__PURE__ */ o(st.Provider, { value: u, children: n });
+}, an = () => {
+  const e = je(st);
   if (e === null)
-    throw new he("Error: Tried to useNavBar outside of a <NavBarProvider>");
+    throw new ve("Error: Tried to useNavBar outside of a <NavBarProvider>");
   return e;
-}, Qt = (e = {}) => i({
+}, sn = (e = {}) => r({
   open: !0
-}, e), oo = re(
-  (e = Qt(), t = {}) => ({ children: n }) => /* @__PURE__ */ o(jt, { overrideState: e, overrideActions: t, children: n })
-), $e = 7, ro = _(Xe)(({ theme: e }) => ({
+}, e), co = se(
+  (e = sn(), t = {}) => ({ children: n }) => /* @__PURE__ */ o(rn, { overrideState: e, overrideActions: t, children: n })
+), Pe = 7, po = R(et)(({ theme: e }) => ({
   backgroundColor: "black",
   color: "white",
   "& .MuiListItem-root": {
@@ -166,7 +165,7 @@ const Ze = He(null), Xt = {}, qt = {}, jt = ({
   "& .MuiListItemButton-root": {
     " .MuiListItemIcon-root": {
       color: "white",
-      padding: `${$e}px`
+      padding: `${Pe}px`
     },
     // Focus state
     "&.Mui-focusVisible": {
@@ -177,7 +176,7 @@ const Ze = He(null), Xt = {}, qt = {}, jt = ({
       borderLeftStyle: "solid",
       borderLeftWidth: "7px",
       borderLeftColor: e.palette.primary.main,
-      paddingLeft: `calc(${e.spacing(2)} - ${$e}px)`
+      paddingLeft: `calc(${e.spacing(2)} - ${Pe}px)`
     },
     // Hover state
     "&:hover": {
@@ -195,7 +194,7 @@ const Ze = He(null), Xt = {}, qt = {}, jt = ({
     // '&.Mui-selected.Mui-focusVisible:hover': {
     // },
   }
-})), ke = 7, io = _(Xe)(({ theme: e }) => ({
+})), ye = 7, uo = R(et)(({ theme: e }) => ({
   backgroundColor: "#e8e8e8",
   color: "inherit",
   "& .MuiListItem-root": {
@@ -204,7 +203,7 @@ const Ze = He(null), Xt = {}, qt = {}, jt = ({
   "& .MuiListItemButton-root": {
     " .MuiListItemIcon-root": {
       color: "inherit",
-      padding: `${ke}px`
+      padding: `${ye}px`
     },
     // Focus state
     "&.Mui-focusVisible": {
@@ -215,7 +214,7 @@ const Ze = He(null), Xt = {}, qt = {}, jt = ({
       borderLeftStyle: "solid",
       borderLeftWidth: "7px",
       borderLeftColor: e.palette.primary.main,
-      paddingLeft: `calc(${e.spacing(2)} - ${ke}px)`
+      paddingLeft: `calc(${e.spacing(2)} - ${ye}px)`
     },
     // Hover state
     "&:hover": {
@@ -234,15 +233,15 @@ const Ze = He(null), Xt = {}, qt = {}, jt = ({
     // },
   }
 }));
-function ao({
+function ho({
   "data-testid": e,
   children: t
 }) {
-  const { open: n } = Yt();
-  return /* @__PURE__ */ c(zt, { className: P.root, "data-testid": e, children: [
-    /* @__PURE__ */ o(Bt, {}),
+  const { open: n } = an();
+  return /* @__PURE__ */ d(Kt, { className: H.root, "data-testid": e, children: [
+    /* @__PURE__ */ o(Mt, {}),
     /* @__PURE__ */ o(
-      Vt,
+      tn,
       {
         variant: "permanent",
         anchor: "left",
@@ -253,44 +252,44 @@ function ao({
     )
   ] });
 }
-const Jt = ({
+const ln = ({
   isOpen: e,
   dialogTitle: t,
   children: n,
-  maxWidth: r,
+  maxWidth: i,
   primaryButton: a,
   secondaryButton: l,
   onClose: p
 }) => {
-  var d, v;
-  const [u, s] = D(!1);
-  return /* @__PURE__ */ c(
-    Et,
+  var c, x;
+  const [u, s] = T(!1);
+  return /* @__PURE__ */ d(
+    Ht,
     {
       open: e,
       onClose: () => {
         u || p();
       },
       fullWidth: !0,
-      maxWidth: r != null ? r : "xs",
+      maxWidth: i != null ? i : "xs",
       children: [
-        /* @__PURE__ */ o(yt, { children: t }),
-        /* @__PURE__ */ o(Lt, { sx: { "& > :last-child": { marginBottom: 0 } }, children: n }),
-        /* @__PURE__ */ c(Ft, { children: [
+        /* @__PURE__ */ o(zt, { children: t }),
+        /* @__PURE__ */ o(Wt, { sx: { "& > :last-child": { marginBottom: 0 } }, children: n }),
+        /* @__PURE__ */ d(Rt, { children: [
           /* @__PURE__ */ o(
-            De,
+            Le,
             {
-              onClick: (d = l == null ? void 0 : l.onClick) != null ? d : p,
+              onClick: (c = l == null ? void 0 : l.onClick) != null ? c : 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"
+              children: (x = l == null ? void 0 : l.text) != null ? x : "Cancel"
             }
           ),
           a && /* @__PURE__ */ o(
-            De,
+            Le,
             {
-              onClick: () => K(void 0, null, function* () {
+              onClick: () => ee(void 0, null, function* () {
                 var f;
                 s(!0), yield (f = a.onClick) == null ? void 0 : f.call(a), s(!1);
               }),
@@ -304,32 +303,32 @@ const Jt = ({
       ]
     }
   );
-}, Kt = 24, Zt = 64, F = "TopBar", b = {
+}, dn = 24, cn = 64, F = "TopBar", A = {
   topStripe: `${F}-topStripe`,
   titleBar: `${F}-titleBar`,
   titleSlider: `${F}-titleSlider`,
   titleText: `${F}-titleText`,
   leftPanelButton: `${F}-leftPanelButton`,
   rightPanelButton: `${F}-leftPanelButton`
-}, en = X("div", {
+}, pn = j("div", {
   shouldForwardProp: (e) => !["leftPanel", "rightPanel"].includes(e),
   name: F
 })(({ theme: e, leftPanel: t, rightPanel: n }) => {
-  var r, a;
+  var i, a;
   return {
     width: "100%",
-    [`& .${b.topStripe}`]: {
+    [`& .${A.topStripe}`]: {
       width: "100%",
-      height: `${Kt}px`,
+      height: `${dn}px`,
       backgroundColor: e.palette.primary.main
     },
-    [`& .${b.titleBar}`]: {
+    [`& .${A.titleBar}`]: {
       backgroundColor: e.palette.primary.light,
-      height: `${Zt}px`,
+      height: `${cn}px`,
       padding: e.spacing(0, 3),
       width: "100%"
     },
-    [`& .${b.titleSlider}`]: i(i({
+    [`& .${A.titleSlider}`]: r(r({
       height: "100%",
       display: "flex",
       alignItems: "center",
@@ -338,14 +337,14 @@ const Jt = ({
         easing: e.transitions.easing.sharp,
         duration: e.transitions.duration.leavingScreen
       }),
-      [`& .${b.leftPanelButton}`]: {
+      [`& .${A.leftPanelButton}`]: {
         marginRight: e.spacing(2),
         flexGrow: 0
       },
-      [`& .${b.titleText}`]: {
+      [`& .${A.titleText}`]: {
         flexGrow: 1
       },
-      [`& .${b.rightPanelButton}`]: {
+      [`& .${A.rightPanelButton}`]: {
         flexGrow: 0
       }
     }, (t == null ? void 0 : t.open) && {
@@ -353,7 +352,7 @@ const Jt = ({
         easing: e.transitions.easing.easeOut,
         duration: e.transitions.duration.enteringScreen
       }),
-      marginLeft: `${(r = t == null ? void 0 : t.width) != null ? r : 0}px`
+      marginLeft: `${(i = t == null ? void 0 : t.width) != null ? i : 0}px`
     }), (n == null ? void 0 : n.open) && {
       transition: e.transitions.create("margin", {
         easing: e.transitions.easing.easeOut,
@@ -363,19 +362,19 @@ const Jt = ({
     })
   };
 });
-function tn({
+function un({
   titleText: e = "",
   leftPanel: t,
   rightPanel: n,
-  "data-testid": r
+  "data-testid": i
 }) {
-  return /* @__PURE__ */ c(en, { leftPanel: t, rightPanel: n, "data-testid": r, children: [
-    /* @__PURE__ */ o("div", { className: b.topStripe }),
-    /* @__PURE__ */ o("div", { className: b.titleBar, children: /* @__PURE__ */ c(T, { className: b.titleSlider, children: [
-      t !== void 0 && !t.open && t.showOpenArrow && /* @__PURE__ */ c(
-        V,
+  return /* @__PURE__ */ d(pn, { leftPanel: t, rightPanel: n, "data-testid": i, children: [
+    /* @__PURE__ */ o("div", { className: A.topStripe }),
+    /* @__PURE__ */ o("div", { className: A.titleBar, children: /* @__PURE__ */ d(w, { className: A.titleSlider, children: [
+      t !== void 0 && !t.open && t.showOpenArrow && /* @__PURE__ */ d(
+        q,
         {
-          className: b.leftPanelButton,
+          className: A.leftPanelButton,
           color: "inherit",
           "aria-label": "Open left side panel",
           onClick: t == null ? void 0 : t.onOpen,
@@ -383,15 +382,15 @@ function tn({
           size: "large",
           children: [
             " ",
-            /* @__PURE__ */ o(qe, {})
+            /* @__PURE__ */ o(tt, {})
           ]
         }
       ),
-      /* @__PURE__ */ o($, { className: b.titleText, variant: "h6", noWrap: !0, children: e }),
-      n !== void 0 && !n.open && n.showOpenArrow && /* @__PURE__ */ c(
-        V,
+      /* @__PURE__ */ o(B, { className: A.titleText, variant: "h6", noWrap: !0, children: e }),
+      n !== void 0 && !n.open && n.showOpenArrow && /* @__PURE__ */ d(
+        q,
         {
-          className: b.rightPanelButton,
+          className: A.rightPanelButton,
           color: "inherit",
           "aria-label": "Open right side panel",
           onClick: n == null ? void 0 : n.onOpen,
@@ -399,14 +398,14 @@ function tn({
           size: "large",
           children: [
             " ",
-            /* @__PURE__ */ o(je, {})
+            /* @__PURE__ */ o(nt, {})
           ]
         }
       )
     ] }) })
   ] });
 }
-const et = 400, nn = X(At, {
+const lt = 400, hn = j(Bt, {
   shouldForwardProp: (e) => (
     // Note we do want anchor to be forwarded to the Drawer component
     ![
@@ -420,9 +419,9 @@ const et = 400, nn = X(At, {
   ),
   name: "SidePanelDrawer"
 })(
-  ({ width: e, debugOpacity: t = !1, anchor: n, navBarOpen: r, navBarWidthOpen: a, navBarWidthClosed: l }) => ({
+  ({ width: e, debugOpacity: t = !1, anchor: n, navBarOpen: i, navBarWidthOpen: a, navBarWidthClosed: l }) => ({
     width: e,
-    "& .MuiDrawer-paper": i(i({
+    "& .MuiDrawer-paper": r(r({
       position: "absolute",
       width: e,
       boxSizing: "border-box",
@@ -430,15 +429,15 @@ const et = 400, nn = X(At, {
       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" && i({
+    }), n === "left" && r({
       marginLeft: `${l}px`
-    }, r && {
+    }, i && {
       marginLeft: `${a}px`
     }))
   })
-), on = X(T, {
+), gn = j(w, {
   shouldForwardProp: (e) => !["anchor"].includes(e)
-})(({ theme: e, anchor: t }) => x(i({
+})(({ theme: e, anchor: t }) => v(r({
   display: "flex",
   alignItems: "center",
   padding: e.spacing(2)
@@ -456,30 +455,30 @@ const et = 400, nn = X(At, {
     marginRight: t === "right" ? e.spacing(2) : 0
   }
 }));
-function Be({
+function Me({
   children: e,
   anchor: t = "left",
   open: n,
-  onClose: r = () => {
+  onClose: i = () => {
   },
   titleText: a = "",
-  width: l = et,
+  width: l = lt,
   showCloseArrow: p = !0,
   debugOpacity: u = !1,
   headerBoxProps: s = {},
-  onOpened: d,
-  onClosed: v,
+  onOpened: c,
+  onClosed: x,
   "data-testid": f,
   navBarOpen: C = !1,
   navBarWidthOpen: m = 0,
-  navBarWidthClosed: I = 0
+  navBarWidthClosed: O = 0
 }) {
-  return /* @__PURE__ */ c(
-    nn,
+  return /* @__PURE__ */ d(
+    hn,
     {
       SlideProps: {
-        onEntered: () => d == null ? void 0 : d(),
-        onExited: () => v == null ? void 0 : v()
+        onEntered: () => c == null ? void 0 : c(),
+        onExited: () => x == null ? void 0 : x()
       },
       variant: "persistent",
       anchor: t,
@@ -489,32 +488,32 @@ function Be({
       "data-testid": f,
       navBarOpen: C,
       navBarWidthOpen: m,
-      navBarWidthClosed: I,
+      navBarWidthClosed: O,
       children: [
-        /* @__PURE__ */ o(on, x(i({ anchor: t }, s), { children: t === "left" ? /* @__PURE__ */ c(M, { children: [
-          /* @__PURE__ */ o($, { variant: "h6", color: "inherit", component: "div", children: a }),
-          p && /* @__PURE__ */ c(V, { onClick: r, size: "large", "aria-label": "Close left side panel", children: [
-            /* @__PURE__ */ o(je, { "data-testid": "arrowbackicon" }),
+        /* @__PURE__ */ o(gn, v(r({ anchor: t }, s), { children: t === "left" ? /* @__PURE__ */ d(P, { children: [
+          /* @__PURE__ */ o(B, { variant: "h6", color: "inherit", component: "div", children: a }),
+          p && /* @__PURE__ */ d(q, { onClick: i, size: "large", "aria-label": "Close left side panel", children: [
+            /* @__PURE__ */ o(nt, { "data-testid": "arrowbackicon" }),
             " "
           ] })
-        ] }) : /* @__PURE__ */ c(M, { children: [
-          p && /* @__PURE__ */ c(V, { onClick: r, size: "large", "aria-label": "Close right side panel", children: [
-            /* @__PURE__ */ o(qe, {}),
+        ] }) : /* @__PURE__ */ d(P, { children: [
+          p && /* @__PURE__ */ d(q, { onClick: i, size: "large", "aria-label": "Close right side panel", children: [
+            /* @__PURE__ */ o(tt, {}),
             " "
           ] }),
-          /* @__PURE__ */ o($, { variant: "h6", color: "inherit", component: "div", children: a })
+          /* @__PURE__ */ o(B, { variant: "h6", color: "inherit", component: "div", children: a })
         ] }) })),
         e
       ]
     }
   );
 }
-const rn = X("div", {
+const fn = j("div", {
   shouldForwardProp: (e) => !["leftPanel", "rightPanel"].includes(e),
   name: "PanelAwareMargins"
 })(({ theme: e, leftPanel: t, rightPanel: n }) => {
-  var r, a;
-  return i(i({
+  var i, a;
+  return r(r({
     transition: e.transitions.create("margin", {
       easing: e.transitions.easing.sharp,
       duration: e.transitions.duration.leavingScreen
@@ -524,7 +523,7 @@ const rn = X("div", {
       easing: e.transitions.easing.easeOut,
       duration: e.transitions.duration.enteringScreen
     }),
-    marginLeft: `${(r = t == null ? void 0 : t.width) != null ? r : 0}px`
+    marginLeft: `${(i = t == null ? void 0 : t.width) != null ? i : 0}px`
   }), (n == null ? void 0 : n.open) && {
     transition: e.transitions.create("margin", {
       easing: e.transitions.easing.easeOut,
@@ -532,171 +531,171 @@ const rn = X("div", {
     }),
     marginRight: `${(a = n == null ? void 0 : n.width) != null ? a : 0}px`
   });
-}), an = X(ze, {
+}), mn = j(Ye, {
   name: "PageContainer"
 })(({ theme: e }) => ({
   // Horizontal padding comes from the Container's gutter
   paddingTop: e.spacing(3),
   paddingBottom: e.spacing(3)
-})), ue = !1, ge = !1, Z = {
+})), me = !1, xe = !1, ne = {
   titleText: "",
   flavour: "push",
-  width: et,
+  width: lt,
   arrowButtons: "both",
   startOpen: !1,
   open: void 0,
   onChangeOpen: void 0,
-  content: /* @__PURE__ */ o(M, {}),
+  content: /* @__PURE__ */ o(P, {}),
   onOpened: void 0,
   onClosed: void 0,
   dataTestId: void 0
 };
-function so({
+function go({
   children: e,
   titleText: t = "",
   leftPanel: n,
-  rightPanel: r,
+  rightPanel: i,
   sidePanelsAreMutuallyExclusive: a = !0,
   debugOpacity: l = !1,
   pageContainerProps: p,
   pageContentDataTestId: u,
   topBarDataTestId: s,
-  navBarOpen: d,
-  navBarWidthOpen: v,
+  navBarOpen: c,
+  navBarWidthOpen: x,
   navBarWidthClosed: f
 }) {
-  const [C, m] = D(ue), [I, A] = D(ge), [w, S] = D(ue), [B, H] = D(ge), R = n !== void 0, W = r !== void 0, {
-    titleText: O,
-    content: q,
-    flavour: j,
-    open: z,
-    onChangeOpen: G,
-    width: g,
-    arrowButtons: h,
-    startOpen: L,
-    onOpened: ct,
-    onClosed: pt,
-    dataTestId: ut
-  } = n ? i(i({}, Z), n) : i({}, Z), {
-    titleText: gt,
-    content: ht,
-    flavour: me,
-    open: ie,
-    onChangeOpen: ve,
-    width: ae,
-    arrowButtons: Y,
-    startOpen: Q,
-    onOpened: ft,
-    onClosed: mt,
+  const [C, m] = T(me), [O, S] = T(xe), [b, I] = T(me), [k, W] = T(xe), z = n !== void 0, U = i !== void 0, {
+    titleText: D,
+    content: Q,
+    flavour: Y,
+    open: G,
+    onChangeOpen: V,
+    width: h,
+    arrowButtons: g,
+    startOpen: y,
+    onOpened: mt,
+    onClosed: xt,
     dataTestId: vt
-  } = r ? i(i({}, Z), r) : i({}, Z);
-  oe(() => {
-    L !== ue && (m(L), S(L));
-  }, [L]), oe(() => {
-    Q !== ge && (A(Q), H(Q));
-  }, [Q]);
-  const se = z === void 0 ? C : z, le = ie === void 0 ? I : ie, xe = (N) => {
-    z === void 0 && (m(N), a && W && (N ? (A(!1), H(I)) : A(B))), G && G(N);
-  }, Ce = (N) => {
-    ie === void 0 && (A(N), a && R && (N ? (m(!1), S(C)) : m(w))), ve && ve(N);
+  } = n ? r(r({}, ne), n) : r({}, ne), {
+    titleText: Ct,
+    content: wt,
+    flavour: Ae,
+    open: le,
+    onChangeOpen: Se,
+    width: de,
+    arrowButtons: J,
+    startOpen: K,
+    onOpened: bt,
+    onClosed: At,
+    dataTestId: St
+  } = i ? r(r({}, ne), i) : r({}, ne);
+  ae(() => {
+    y !== me && (m(y), I(y));
+  }, [y]), ae(() => {
+    K !== xe && (S(K), W(K));
+  }, [K]);
+  const ce = G === void 0 ? C : G, pe = le === void 0 ? O : le, Ie = (E) => {
+    G === void 0 && (m(E), a && U && (E ? (S(!1), W(O)) : S(k))), V && V(E);
+  }, Oe = (E) => {
+    le === void 0 && (S(E), a && z && (E ? (m(!1), I(C)) : m(b))), Se && Se(E);
   };
-  return /* @__PURE__ */ c(T, { children: [
-    R && /* @__PURE__ */ o(
-      Be,
+  return /* @__PURE__ */ d(w, { children: [
+    z && /* @__PURE__ */ o(
+      Me,
       {
-        "data-testid": ut,
+        "data-testid": vt,
         anchor: "left",
-        open: se,
-        onClose: () => xe(!1),
-        width: g,
-        titleText: O,
+        open: ce,
+        onClose: () => Ie(!1),
+        width: h,
+        titleText: D,
         debugOpacity: l,
-        showCloseArrow: h === "both" || h === "close",
-        onOpened: ct,
-        onClosed: pt,
-        navBarOpen: d,
-        navBarWidthOpen: v,
+        showCloseArrow: g === "both" || g === "close",
+        onOpened: mt,
+        onClosed: xt,
+        navBarOpen: c,
+        navBarWidthOpen: x,
         navBarWidthClosed: f,
-        children: q
+        children: Q
       }
     ),
-    W && /* @__PURE__ */ o(
-      Be,
+    U && /* @__PURE__ */ o(
+      Me,
       {
-        "data-testid": vt,
+        "data-testid": St,
         anchor: "right",
-        open: le,
-        onClose: () => Ce(!1),
-        width: ae,
-        titleText: gt,
+        open: pe,
+        onClose: () => Oe(!1),
+        width: de,
+        titleText: Ct,
         debugOpacity: l,
-        showCloseArrow: Y === "both" || Y === "close",
-        onOpened: ft,
-        onClosed: mt,
-        navBarOpen: d,
-        navBarWidthOpen: v,
+        showCloseArrow: J === "both" || J === "close",
+        onOpened: bt,
+        onClosed: At,
+        navBarOpen: c,
+        navBarWidthOpen: x,
         navBarWidthClosed: f,
-        children: ht
+        children: wt
       }
     ),
     /* @__PURE__ */ o(
-      tn,
-      i(i({
+      un,
+      r(r({
         titleText: t,
         "data-testid": s
-      }, R && j === "push" ? {
+      }, z && Y === "push" ? {
         leftPanel: {
-          open: se,
-          width: g,
-          onOpen: () => xe(!0),
-          showOpenArrow: h === "both" || h === "open"
+          open: ce,
+          width: h,
+          onOpen: () => Ie(!0),
+          showOpenArrow: g === "both" || g === "open"
         }
-      } : {}), W && me === "push" ? {
+      } : {}), U && Ae === "push" ? {
         rightPanel: {
-          open: le,
-          width: ae,
-          onOpen: () => Ce(!0),
-          showOpenArrow: Y === "both" || Y === "open"
+          open: pe,
+          width: de,
+          onOpen: () => Oe(!0),
+          showOpenArrow: J === "both" || J === "open"
         }
       } : {})
     ),
     /* @__PURE__ */ o(
-      rn,
-      x(i(i({}, j === "push" ? {
+      fn,
+      v(r(r({}, Y === "push" ? {
         leftPanel: {
-          open: se,
-          width: g
+          open: ce,
+          width: h
         }
-      } : {}), me === "push" ? {
+      } : {}), Ae === "push" ? {
         rightPanel: {
-          open: le,
-          width: ae
+          open: pe,
+          width: de
         }
       } : {}), {
-        children: /* @__PURE__ */ o(an, x(i({ "data-testid": u }, p), { children: e }))
+        children: /* @__PURE__ */ o(mn, v(r({ "data-testid": u }, p), { children: e }))
       })
     )
   ] });
 }
-const ee = "Navbar", U = {
-  root: `${ee}-root`,
-  menuButton: `${ee}-menuButton`,
-  hide: `${ee}-hide`,
-  content: `${ee}-content`
+const oe = "Navbar", X = {
+  root: `${oe}-root`,
+  menuButton: `${oe}-menuButton`,
+  hide: `${oe}-hide`,
+  content: `${oe}-content`
   // userInfoHolder: `${PREFIX}-userInfoHolder`,
   // settings: `${PREFIX}-settings`,
   // pieChartIcon: `${PREFIX}-pieChartIcon`,
-}, sn = _("div", { name: "NavBar" })(({ theme: e }) => ({
-  [`&.${U.root}`]: {
+}, xn = R("div", { name: "NavBar" })(({ theme: e }) => ({
+  [`&.${X.root}`]: {
     display: "flex"
   },
-  [`& .${U.menuButton}`]: {
+  [`& .${X.menuButton}`]: {
     marginRight: 36
   },
-  [`& .${U.hide}`]: {
+  [`& .${X.hide}`]: {
     display: "none"
   },
-  [`& .${U.content}`]: {
+  [`& .${X.content}`]: {
     flexGrow: 1,
     padding: e.spacing(3)
   }
@@ -705,109 +704,173 @@ const ee = "Navbar", U = {
   //   marginTop: '64px',
   //   marginBottom: '16px',
   // },
-})), tt = (e, t) => {
-  var n, r;
+})), dt = (e, t) => {
+  var n, i;
   return {
-    height: `calc(100vh - ${t})`,
+    height: `calc(100vh - ${t}px)`,
     top: t,
     overflowX: "hidden",
     overflowY: "hidden",
     color: "inherit",
-    backgroundColor: (r = (n = e == null ? void 0 : e.navBar) == null ? void 0 : n.backgroundColor) != null ? r : "white"
+    backgroundColor: (i = (n = e == null ? void 0 : e.navBar) == null ? void 0 : n.backgroundColor) != null ? i : "white"
     // Provide default so tests don't need to wrap theme provider
   };
-}, Ne = (e, t, n) => i({
+}, _e = (e, t, n) => r({
   width: t,
   transition: e.transitions.create("width", {
     easing: e.transitions.easing.sharp,
     duration: e.transitions.duration.enteringScreen
   })
-}, tt(e, n)), Ee = (e, t, n) => i({
+}, dt(e, n)), He = (e, t, n) => r({
   width: t,
   transition: e.transitions.create("width", {
     easing: e.transitions.easing.sharp,
     duration: e.transitions.duration.leavingScreen
   }),
   overflowX: "hidden"
-}, tt(e, n)), ln = _(Ve, {
+}, dt(e, n)), vn = R(Ze, {
   shouldForwardProp: (e) => !["open", "widthOpen", "widthClosed", "offsetTop"].includes(e)
-})(({ theme: e, open: t, widthOpen: n, widthClosed: r, offsetTop: a }) => i(i({
+})(({ theme: e, open: t, widthOpen: n, widthClosed: i, offsetTop: a }) => r(r({
   flexShrink: 0,
   whiteSpace: "nowrap",
-  boxSizing: "border-box"
-}, t && x(i({}, Ne(e, n, a)), {
-  "& .MuiDrawer-paper": Ne(e, n, a)
-})), !t && x(i({}, Ee(e, r, a)), {
-  "& .MuiDrawer-paper": Ee(e, r, a)
+  boxSizing: "border-box",
+  display: "flex",
+  flexDirection: "column"
+}, t && v(r({}, _e(e, n, a)), {
+  "& .MuiDrawer-paper": _e(e, n, a)
+})), !t && v(r({}, He(e, i, a)), {
+  "& .MuiDrawer-paper": He(e, i, a)
 })));
-function dn({ links: e }) {
+function Cn({ links: e }) {
   return /* @__PURE__ */ o("div", { children: "LinksMenu not implemented yet" });
 }
-function cn(e) {
+function Re(e) {
   let t = 0;
-  for (let n = 0, r = e.length; n < r; n++) {
+  for (let n = 0, i = e.length; n < i; n++) {
     const a = e.charCodeAt(n);
     t = (t << 5) - t + a, t |= 0;
   }
   return t;
 }
-const te = {
-  width: "5rem",
-  height: "5rem"
-}, Fe = ["#A62A21", "#7e3794", "#0B51C1", "#3A6024", "#A81563", "#B3003C"], pn = (e) => e.split(/\s/).map((t) => t.substring(0, 1).toUpperCase()).filter((t) => !!t).slice(0, 2).join("").toUpperCase();
-function un({ user: e, domainCode: t }) {
-  return /* @__PURE__ */ c(T, { marginY: "2rem", display: "flex", flexDirection: "column", alignItems: "center", gap: "1rem", children: [
-    e != null && e.name ? /* @__PURE__ */ o(
-      Ie,
-      {
-        src: e == null ? void 0 : e.picture,
-        sx: x(i({}, te), {
-          bgcolor: Fe[Math.abs(cn(e.name)) % Fe.length]
-        }),
-        children: pn(e.name)
-      }
-    ) : /* @__PURE__ */ o(Ie, { sx: te }),
-    /* @__PURE__ */ c(T, { alignItems: "center", display: "flex", flexDirection: "column", children: [
-      e != null && e.name ? /* @__PURE__ */ o($, { children: e.name }) : /* @__PURE__ */ o(Te, { animation: !1, width: te.width }),
-      t ? /* @__PURE__ */ o($, { children: t.toUpperCase() }) : /* @__PURE__ */ o(Te, { animation: !1, width: te.width })
+const ie = ["#A62A21", "#7e3794", "#0B51C1", "#3A6024", "#A81563", "#B3003C"], We = (e) => e.split(/\s/).map((t) => t.substring(0, 1).toUpperCase()).filter((t) => !!t).slice(0, 2).join("").toUpperCase();
+function wn({ user: e, domainCode: t, open: n }) {
+  const i = Fe(be), a = Fe(we);
+  return /* @__PURE__ */ o(w, { sx: { paddingTop: 3 }, children: /* @__PURE__ */ o(
+    w,
+    {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        flexDirection: "column"
+      },
+      children: n ? /* @__PURE__ */ d(P, { children: [
+        /* @__PURE__ */ o(
+          w,
+          {
+            sx: {
+              width: `${a * 0.33}px`,
+              aspectRatio: 1,
+              marginBottom: 1
+            },
+            children: e != null && e.name ? /* @__PURE__ */ o(
+              te,
+              {
+                src: e == null ? void 0 : e.picture,
+                sx: {
+                  width: "100%",
+                  height: "100%",
+                  bgcolor: ie[Math.abs(Re(e.name)) % ie.length]
+                },
+                children: We(e.name)
+              }
+            ) : /* @__PURE__ */ o(te, { sx: { width: "100%", height: "100%" } })
+          }
+        ),
+        e != null && e.name ? /* @__PURE__ */ o(B, { children: e.name }) : /* @__PURE__ */ o(ke, { animation: !1, width: "50%" }),
+        t ? /* @__PURE__ */ o(B, { children: t.toUpperCase() }) : /* @__PURE__ */ o(ke, { animation: !1, width: "25%" })
+      ] }) : /* @__PURE__ */ o(w, { sx: { width: `${i * 0.5}px`, aspectRatio: 1, marginBottom: 1 }, children: e != null && e.name ? /* @__PURE__ */ o(
+        te,
+        {
+          src: e == null ? void 0 : e.picture,
+          sx: {
+            width: "100%",
+            height: "100%",
+            bgcolor: ie[Math.abs(Re(e.name)) % ie.length]
+          },
+          children: We(e.name)
+        }
+      ) : /* @__PURE__ */ o(te, { sx: { width: "100%", height: "100%" } }) })
+    }
+  ) });
+}
+function bn({ navBarOpen: e }) {
+  const [t, n] = T(!1);
+  return /* @__PURE__ */ d(Ee, { children: [
+    /* @__PURE__ */ d(M, { onClick: () => n((i) => !i), children: [
+      /* @__PURE__ */ o(ge, { children: /* @__PURE__ */ o(Ut, {}) }),
+      /* @__PURE__ */ o(_, { primary: "Switch to ..." }),
+      t && e ? /* @__PURE__ */ o(Gt, {}) : /* @__PURE__ */ o(Vt, {})
+    ] }),
+    /* @__PURE__ */ o($t, { in: t && e, timeout: "auto", unmountOnExit: !0, children: /* @__PURE__ */ d(Ee, { component: "div", disablePadding: !0, children: [
+      /* @__PURE__ */ o(M, { sx: { pl: 2 }, children: /* @__PURE__ */ o(_, { primary: "1. Something", inset: !0 }) }),
+      /* @__PURE__ */ o(M, { sx: { pl: 2 }, children: /* @__PURE__ */ o(_, { primary: "2. Something else", inset: !0 }) }),
+      /* @__PURE__ */ o(M, { sx: { pl: 2 }, children: /* @__PURE__ */ o(_, { primary: "3. Puppies!", inset: !0 }) })
+    ] }) }),
+    /* @__PURE__ */ d(M, { children: [
+      /* @__PURE__ */ o(ge, { children: /* @__PURE__ */ o(Xt, {}) }),
+      /* @__PURE__ */ o(_, { primary: "Settings" })
+    ] }),
+    /* @__PURE__ */ d(M, { children: [
+      /* @__PURE__ */ o(ge, { children: /* @__PURE__ */ o(qt, {}) }),
+      /* @__PURE__ */ o(_, { primary: "Log out" })
     ] })
   ] });
 }
-function gn({
+function An({
   open: e,
   offsetTop: t = 0,
   widthOpen: n,
-  widthClosed: r,
+  widthClosed: i,
   "data-testid": a,
   top: l,
   middle: p,
   user: u,
   domainCode: s
 }) {
-  return /* @__PURE__ */ o(sn, { className: U.root, "data-testid": a, children: /* @__PURE__ */ o(
-    ln,
+  return /* @__PURE__ */ o(xn, { className: X.root, "data-testid": a, children: /* @__PURE__ */ d(
+    vn,
     {
       variant: "permanent",
       anchor: "left",
       open: e,
       widthOpen: n,
-      widthClosed: r,
+      widthClosed: i,
       offsetTop: t,
-      children: /* @__PURE__ */ c(T, { component: "nav", sx: {}, children: [
-        l && /* @__PURE__ */ c(T, { sx: { flexGrow: 1 }, children: [
+      PaperProps: {
+        // https://github.com/mui/material-ui/issues/27703
+        // This isn't fixed in the version we are using at time of writing
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        component: "nav"
+      },
+      children: [
+        l && /* @__PURE__ */ d(w, { sx: { flex: "0 0 auto" }, children: [
           l,
-          /* @__PURE__ */ o(Oe, { variant: "middle" })
+          /* @__PURE__ */ o(Ne, { variant: "middle" })
         ] }),
-        Array.isArray(p) ? /* @__PURE__ */ o(dn, { links: p }) : p,
-        /* @__PURE__ */ o(Oe, { variant: "middle" }),
-        /* @__PURE__ */ o(un, { user: u, domainCode: s })
-      ] })
+        /* @__PURE__ */ o(w, { sx: { flex: "1 0 auto" }, children: Array.isArray(p) ? /* @__PURE__ */ o(Cn, { links: p }) : p }),
+        /* @__PURE__ */ d(w, { sx: { flex: "0 0 auto" }, children: [
+          /* @__PURE__ */ o(Ne, { variant: "middle" }),
+          /* @__PURE__ */ o(wn, { user: u, domainCode: s, open: e }),
+          /* @__PURE__ */ o(bn, { navBarOpen: e })
+        ] })
+      ]
     }
   ) });
 }
-function hn({ children: e, topBarHeight: t }) {
+function Sn({ children: e, topBarHeight: t }) {
   return /* @__PURE__ */ o(
-    T,
+    w,
     {
       sx: {
         overflow: "auto",
@@ -817,7 +880,7 @@ function hn({ children: e, topBarHeight: t }) {
         flexGrow: 1
       },
       children: /* @__PURE__ */ o(
-        ze,
+        Ye,
         {
           component: "main",
           id: "main-content",
@@ -828,13 +891,13 @@ function hn({ children: e, topBarHeight: t }) {
     }
   );
 }
-const fn = 64, mn = 64, vn = 256, fe = k(!0), nt = k(vn), ot = k(mn), rt = k(""), it = k(fn), at = k(void 0), xn = "TopBar", Cn = {
-  titleText: `${xn}-titleText`
+const In = 64, On = 64, Tn = 256, Ce = $(!0), we = $(Tn), be = $(On), ct = $(""), pt = $(In), ut = $(void 0), Dn = "TopBar", Bn = {
+  titleText: `${Dn}-titleText`
 };
-function wn({ titleText: e = "", height: t, "data-testid": n }) {
-  const r = Mt(fe);
-  return /* @__PURE__ */ o("header", { "data-testid": n, children: /* @__PURE__ */ c(
-    We,
+function $n({ titleText: e = "", height: t, "data-testid": n }) {
+  const i = Qt(Ce);
+  return /* @__PURE__ */ o("header", { "data-testid": n, children: /* @__PURE__ */ d(
+    Qe,
     {
       square: !0,
       elevation: 0,
@@ -850,175 +913,175 @@ function wn({ titleText: e = "", height: t, "data-testid": n }) {
         height: t
       },
       children: [
-        /* @__PURE__ */ o(V, { size: "medium", color: "inherit", sx: { padding: 1.5 }, onClick: () => r((l) => !l), children: /* @__PURE__ */ o(Pt, { fontSize: "medium" }) }),
-        /* @__PURE__ */ o($, { className: Cn.titleText, variant: "h6", children: e })
+        /* @__PURE__ */ o(q, { size: "medium", color: "inherit", sx: { padding: 1.5 }, onClick: () => i((l) => !l), children: /* @__PURE__ */ o(jt, { fontSize: "medium" }) }),
+        /* @__PURE__ */ o(B, { className: Bn.titleText, variant: "h6", children: e })
       ]
     }
   ) });
 }
-function lo({
+function fo({
   children: e,
   initialTitleText: t,
   initialNavBarOpen: n,
-  pageContainerProps: r,
+  pageContainerProps: i,
   pageContentDataTestId: a,
   topBarDataTestId: l,
   navBarDataTestId: p,
   navBarMiddle: u,
   user: s,
-  domainCode: d
+  domainCode: c
 }) {
-  const [v, f] = y(fe), [C] = y(nt), [m] = y(ot), [I, A] = y(rt), [w] = y(it), [S] = y(at);
-  return oe(() => {
-    t !== void 0 && A(t);
-  }, [t, A]), oe(() => {
+  const [x, f] = L(Ce), [C] = L(we), [m] = L(be), [O, S] = L(ct), [b] = L(pt), [I] = L(ut);
+  return ae(() => {
+    t !== void 0 && S(t);
+  }, [t, S]), ae(() => {
     n !== void 0 && f(n);
-  }, [n, f]), /* @__PURE__ */ c(T, { children: [
-    /* @__PURE__ */ o(St, {}),
-    /* @__PURE__ */ o(wn, { titleText: I, "data-testid": l, height: w }),
-    /* @__PURE__ */ c(T, { sx: { display: "flex" }, children: [
+  }, [n, f]), /* @__PURE__ */ d(w, { children: [
+    /* @__PURE__ */ o(kt, {}),
+    /* @__PURE__ */ o($n, { titleText: O, "data-testid": l, height: b }),
+    /* @__PURE__ */ d(w, { sx: { display: "flex" }, children: [
       /* @__PURE__ */ o(
-        gn,
+        An,
         {
-          open: v,
-          top: S,
+          open: x,
+          top: I,
           middle: u,
           user: s,
-          domainCode: d,
+          domainCode: c,
           widthOpen: C,
           widthClosed: m,
-          offsetTop: w,
+          offsetTop: b,
           "data-testid": p
         }
       ),
       /* @__PURE__ */ o(
-        hn,
-        x(i({
+        Sn,
+        v(r({
           "data-testid": a,
-          topBarHeight: w
-        }, r), {
+          topBarHeight: b
+        }, i), {
           children: e
         })
       )
     ] })
   ] });
 }
-const bn = {
+const kn = {
   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
-}, An = {
+}, En = {
   shouldClose: (e, t) => t !== "clickaway"
-}, Le = {
+}, ze = {
   message: "",
   severity: "info",
   variant: "standard",
   progressIndicator: void 0
   // Can use 'circular' or 'linear'
-}, ye = 100, Pe = 2e3, Sn = 2e3, In = (() => {
+}, Ue = 100, Ge = 2e3, Nn = 2e3, Ln = (() => {
   let e = 0;
   return () => (e += 1, e);
-})(), Tn = {
+})(), Fn = {
   borderBottomLeftRadius: "0px",
   borderBottomRightRadius: "0px"
-}, On = {}, Dn = {}, st = He(null);
-function $n(l) {
+}, Pn = {}, yn = {}, ht = qe(null);
+function Mn(l) {
   var p = l, {
-    overrideState: e = On,
-    overrideActions: t = Dn,
-    shouldClose: n = An.shouldClose,
-    children: r
-  } = p, a = Ae(p, [
+    overrideState: e = Pn,
+    overrideActions: t = yn,
+    shouldClose: n = En.shouldClose,
+    children: i
+  } = p, a = Be(p, [
     "overrideState",
     "overrideActions",
     "shouldClose",
     "children"
   ]);
-  var G;
-  const [{ open: u }, s] = D({ open: !1 }), d = ce([]), v = ce(Date.now()), f = ce(0), C = ne((g) => {
-    s({ open: g });
-  }, []), m = ne((g = {}) => {
-    f.current += 1, d.current.length >= ye && Date.now() - v.current >= Pe && (v.current = Date.now(), console.error(
-      `SaladBarProvider: MAX_QUEUE_LENGTH (${ye}) hit ${f.current} times in last ${Pe}ms)`
+  var V;
+  const [{ open: u }, s] = T({ open: !1 }), c = he([]), x = he(Date.now()), f = he(0), C = re((h) => {
+    s({ open: h });
+  }, []), m = re((h = {}) => {
+    f.current += 1, c.current.length >= Ue && Date.now() - x.current >= Ge && (x.current = Date.now(), console.error(
+      `SaladBarProvider: MAX_QUEUE_LENGTH (${Ue}) hit ${f.current} times in last ${Ge}ms)`
     ), f.current = 0);
-    const h = i(x(i({}, Le), {
-      key: In()
-    }), g);
-    return d.current.push(h), d.current.length === 1 && s({ open: !0 }), h.key;
-  }, []), I = (g = "", h = {}) => m(i({ message: g, severity: "success" }, h)), A = (g = "", h = {}) => m(i({ message: g, severity: "info" }, h)), w = (g = "", h = {}) => m(i({ message: g, severity: "warning" }, h)), S = (g = "", h = {}) => m(i({ message: g, severity: "error" }, h)), B = (g) => {
-    const h = d.current.findIndex((L) => L.key === g);
-    if (h !== -1)
-      return h === 0 ? (s({ open: !1 }), d.current[0]) : d.current.splice(h, 1);
-  }, H = (g, h) => {
-    n(g, h) && s({ open: !1 });
-  }, R = () => {
-  }, W = () => {
-    d.current.shift(), d.current.length > 0 && s({ open: !0 });
-  }, O = (G = d.current[0]) != null ? G : i({}, Le), q = {};
-  "autoHideDuration" in O && (q.autoHideDuration = O.autoHideDuration);
-  const j = i(i({}, bn), a), z = i(i({
+    const g = r(v(r({}, ze), {
+      key: Ln()
+    }), h);
+    return c.current.push(g), c.current.length === 1 && s({ open: !0 }), g.key;
+  }, []), O = (h = "", g = {}) => m(r({ message: h, severity: "success" }, g)), S = (h = "", g = {}) => m(r({ message: h, severity: "info" }, g)), b = (h = "", g = {}) => m(r({ message: h, severity: "warning" }, g)), I = (h = "", g = {}) => m(r({ message: h, severity: "error" }, g)), k = (h) => {
+    const g = c.current.findIndex((y) => y.key === h);
+    if (g !== -1)
+      return g === 0 ? (s({ open: !1 }), c.current[0]) : c.current.splice(g, 1);
+  }, W = (h, g) => {
+    n(h, g) && s({ open: !1 });
+  }, z = () => {
+  }, U = () => {
+    c.current.shift(), c.current.length > 0 && s({ open: !0 });
+  }, D = (V = c.current[0]) != null ? V : r({}, ze), Q = {};
+  "autoHideDuration" in D && (Q.autoHideDuration = D.autoHideDuration);
+  const Y = r(r({}, kn), a), G = r(r({
     open: u,
     setOpen: C,
     enqueueNotification: m,
-    enqueueSuccessNotification: I,
-    enqueueInfoNotification: A,
-    enqueueWarningNotification: w,
-    enqueueErrorNotification: S,
-    removeNotification: B
+    enqueueSuccessNotification: O,
+    enqueueInfoNotification: S,
+    enqueueWarningNotification: b,
+    enqueueErrorNotification: I,
+    removeNotification: k
   }, e), t);
-  return /* @__PURE__ */ c(st.Provider, { value: z, children: [
-    r,
+  return /* @__PURE__ */ d(ht.Provider, { value: G, children: [
+    i,
     /* @__PURE__ */ o(
-      It,
-      x(i(i({}, j), q), {
+      Et,
+      v(r(r({}, Y), Q), {
         open: u,
-        onClose: H,
+        onClose: W,
         TransitionProps: {
-          onExited: W,
-          onExit: R
+          onExited: U,
+          onExit: z
         },
-        sx: { zIndex: Sn },
-        children: /* @__PURE__ */ c("div", { children: [
+        sx: { zIndex: Nn },
+        children: /* @__PURE__ */ d("div", { children: [
           /* @__PURE__ */ o(
-            Tt,
+            Nt,
             {
-              onClose: (g) => H(g, "closeAlert"),
-              severity: O.severity,
+              onClose: (h) => W(h, "closeAlert"),
+              severity: D.severity,
               variant: "filled",
-              icon: O.progressIndicator === "circular" ? /* @__PURE__ */ o(Ge, { size: "1em" }) : void 0,
-              style: O.progressIndicator === "linear" ? Tn : void 0,
-              children: O.message
+              icon: D.progressIndicator === "circular" ? /* @__PURE__ */ o(Je, { size: "1em" }) : void 0,
+              style: D.progressIndicator === "linear" ? Fn : void 0,
+              children: D.message
             }
           ),
-          O.progressIndicator === "linear" && /* @__PURE__ */ o(Ot, { color: "primary" })
+          D.progressIndicator === "linear" && /* @__PURE__ */ o(Lt, { color: "primary" })
         ] })
       })
     )
   ] });
 }
-function kn() {
-  const e = Re(st);
+function _n() {
+  const e = je(ht);
   if (e === null)
-    throw new he("Error: Tried to useSaladBar outside of a <SaladBarProvider>");
+    throw new ve("Error: Tried to useSaladBar outside of a <SaladBarProvider>");
   return e;
 }
-const co = re(
-  (e = { autoHideDuration: 1 }, t = {}, n = {}) => ({ children: r }) => /* @__PURE__ */ o($n, x(i({}, e), { overrideState: t, overrideActions: n, children: r }))
-), Bn = _t(), po = ({
+const mo = se(
+  (e = { autoHideDuration: 1 }, t = {}, n = {}) => ({ children: i }) => /* @__PURE__ */ o(Mn, v(r({}, e), { overrideState: t, overrideActions: n, children: i }))
+), Hn = Yt(), xo = ({
   children: e,
   store: t
-}) => /* @__PURE__ */ o(Ye, { store: t != null ? t : Bn, children: e }), Nn = (...e) => Ht(...e), uo = (...e) => Rt(...e), En = (...e) => En(...e), lt = "domainCode";
-var _e;
-const Me = k(
-  JSON.parse((_e = localStorage.getItem(lt)) != null ? _e : '{"domainCode": ""}').domainCode
-), dt = k(
-  (e) => e(Me),
+}) => /* @__PURE__ */ o(ot, { store: t != null ? t : Hn, children: e }), gt = "domainCode";
+var Xe;
+const Ve = $(
+  JSON.parse((Xe = localStorage.getItem(gt)) != null ? Xe : '{"domainCode": ""}').domainCode
+), ft = $(
+  (e) => e(Ve),
   (e, t, n) => {
-    t(Me, n), localStorage.setItem(lt, JSON.stringify({ domainCode: n }));
+    t(Ve, n), localStorage.setItem(gt, JSON.stringify({ domainCode: n }));
   }
-), Fn = {
+), Rn = {
   act: "ACT",
   nsw: "NSW",
   nt: "NT",
@@ -1030,76 +1093,76 @@ const Me = k(
   ag: "AG",
   fedmps: "Fedmps",
   "": ""
-}, Ln = (e) => {
+}, Wn = (e) => {
   var t;
-  return e === null ? "N/A" : (t = Fn[e]) != null ? t : "";
-}, go = ({
+  return e === null ? "N/A" : (t = Rn[e]) != null ? t : "";
+}, vo = ({
   isLoading: e,
   isOpen: t,
   onClose: n,
-  domainOptions: r,
+  domainOptions: i,
   applicationName: a,
   handleLogout: l
 }) => {
-  const [p, u] = Nn(dt), [s, d] = D(p), { enqueueSuccessNotification: v } = kn(), f = r.length === 0, C = !!p && !r.includes(p) && !r.includes(s), m = !p || f || C, I = () => K(void 0, null, function* () {
-    s ? (u(s), v(`Set domain to ${s}`), n()) : u("");
-  }), A = () => K(void 0, null, function* () {
-    p && !f && !C ? (d(p), n()) : m && l();
+  const [p, u] = L(ft), [s, c] = T(p), { enqueueSuccessNotification: x } = _n(), f = i.length === 0, C = !!p && !i.includes(p) && !i.includes(s), m = !p || f || C, O = () => ee(void 0, null, function* () {
+    s ? (u(s), x(`Set domain to ${s}`), n()) : u("");
+  }), S = () => ee(void 0, null, function* () {
+    p && !f && !C ? (c(p), n()) : m && l();
   });
-  let w;
-  return f ? w = "Unable to retrieve your active organisations. Try logging in again." : C && (w = "You no longer have any roles in your chosen organisation. Please choose another."), /* @__PURE__ */ c(
-    Jt,
+  let b;
+  return f ? b = "Unable to retrieve your active organisations. Try logging in again." : C && (b = "You no longer have any roles in your chosen organisation. Please choose another."), /* @__PURE__ */ d(
+    ln,
     {
       isOpen: t,
       dialogTitle: "Select an organisation",
       primaryButton: {
         text: "Confirm",
-        onClick: I,
+        onClick: O,
         disabled: !s || f || C,
         buttonColor: "primary"
       },
       secondaryButton: {
         text: m ? "Logout" : "Cancel",
-        onClick: A
+        onClick: S
       },
       onClose: m ? () => {
       } : n,
       children: [
-        /* @__PURE__ */ c($, { marginBottom: 2, children: [
+        /* @__PURE__ */ d(B, { marginBottom: 2, children: [
           "Select the default organisation that you want to use with the ",
           a,
           "."
         ] }),
         /* @__PURE__ */ o(
-          Dt,
+          Ft,
           {
             loading: e,
             multiple: !1,
             disableClearable: !1,
             value: s !== "" ? s : null,
-            onChange: (S, B) => d(B != null ? B : ""),
-            getOptionLabel: Ln,
-            options: [...r],
-            renderInput: (S) => /* @__PURE__ */ o(
-              $t,
-              x(i({}, S), {
+            onChange: (I, k) => c(k != null ? k : ""),
+            getOptionLabel: Wn,
+            options: [...i],
+            renderInput: (I) => /* @__PURE__ */ o(
+              Pt,
+              v(r({}, I), {
                 variant: "filled",
                 label: "Select organisation",
-                InputProps: x(i({}, S.InputProps), {
-                  endAdornment: /* @__PURE__ */ c(M, { children: [
-                    e ? /* @__PURE__ */ o(Ge, { color: "inherit", size: 20, sx: { marginTop: "-20px" } }) : null,
-                    S.InputProps.endAdornment
+                InputProps: v(r({}, I.InputProps), {
+                  endAdornment: /* @__PURE__ */ d(P, { children: [
+                    e ? /* @__PURE__ */ o(Je, { color: "inherit", size: 20, sx: { marginTop: "-20px" } }) : null,
+                    I.InputProps.endAdornment
                   ] })
                 })
               })
             )
           }
         ),
-        w && /* @__PURE__ */ o(kt, { error: !0, children: w })
+        b && /* @__PURE__ */ o(yt, { error: !0, children: b })
       ]
     }
   );
-}, ho = Ue({
+}, Co = Ke({
   palette: {
     primary: {
       dark: "#00A651",
@@ -1150,7 +1213,7 @@ const Me = k(
   navBar: {
     backgroundColor: "#E8E8E8"
   }
-}), fo = Ue({
+}), wo = Ke({
   palette: {
     primary: {
       main: "#007236",
@@ -1204,18 +1267,18 @@ const Me = k(
       styleOverrides: {
         root: ({ theme: e }) => ({
           "&.Mui-selected": {
-            backgroundColor: pe(
+            backgroundColor: fe(
               e.palette.secondary.main,
               e.palette.action.selectedOpacity
             ),
             "&:hover": {
-              backgroundColor: pe(
+              backgroundColor: fe(
                 e.palette.secondary.main,
                 e.palette.action.selectedOpacity
               )
             },
             "&.Mui-focusVisible": {
-              backgroundColor: pe(
+              backgroundColor: fe(
                 e.palette.secondary.main,
                 e.palette.action.focusOpacity
               )
@@ -1241,25 +1304,25 @@ const Me = k(
   navBar: {
     backgroundColor: "#E8E8E8"
   }
-}), yn = {
-  domainCode: dt,
-  navBarOpen: fe,
-  navBarWidthOpen: nt,
-  navBarWidthClosed: ot,
-  titleText: rt,
-  topBarHeight: it,
-  navBarTop: at
-}, mo = re(() => ({ children: e }) => /* @__PURE__ */ o(Ye, { children: e })), Pn = ({
+}), zn = {
+  domainCode: ft,
+  navBarOpen: Ce,
+  navBarWidthOpen: we,
+  navBarWidthClosed: be,
+  titleText: ct,
+  topBarHeight: pt,
+  navBarTop: ut
+}, bo = se(() => ({ children: e }) => /* @__PURE__ */ o(ot, { children: e })), Un = ({
   initialValues: e,
   children: t
-}) => (Wt(e), /* @__PURE__ */ o(M, { children: t })), vo = re(
+}) => (Jt(e), /* @__PURE__ */ o(P, { children: t })), Ao = se(
   (e) => ({ children: t }) => /* @__PURE__ */ o(
-    Pn,
+    Un,
     {
       initialValues: Object.entries(e).map(
-        ([n, r]) => [
-          yn[n],
-          r
+        ([n, i]) => [
+          zn[n],
+          i
         ]
       ),
       children: t
@@ -1267,42 +1330,39 @@ const Me = k(
   )
 );
 export {
-  Jt as AgDialog,
-  lo as AppLayout,
-  po as AtomProvider,
-  st as Context,
-  he as ContextError,
-  go as DomainCodeDialog,
-  no as ExampleComponent,
-  Pn as HydrateAtoms,
-  Je as NAVBAR_WIDTH_CLOSED,
-  Qe as NAVBAR_WIDTH_OPENED,
-  ao as NavBar,
-  ro as NavBarDarkStyledList,
-  io as NavBarLightStyledList,
-  jt as NavBarProvider,
-  so as PageLayout,
-  $n as SaladBarProvider,
-  Bn as atomStore,
-  Qt as buildNavBarState,
-  dt as domainCodeAtom,
-  ho as fed21Theme,
-  fo as internalAgSystemsTheme,
-  P as navBarClasses,
-  fe as navBarOpenAtom,
-  at as navBarTopAtom,
-  ot as navBarWidthClosedAtom,
-  nt as navBarWidthOpenAtom,
-  rt as titleTextAtom,
-  it as topBarHeightAtom,
-  Nn as useLibraryAtom,
-  En as useLibraryAtomValue,
-  Yt as useNavBar,
-  kn as useSaladBar,
-  uo as useSetLibraryAtom,
-  mo as withAtomProvider,
-  oo as withNavBarProvider,
-  vo as withOverrideDefaults,
-  co as withSaladBarProvider
+  ln as AgDialog,
+  fo as AppLayout,
+  xo as AtomProvider,
+  ht as Context,
+  ve as ContextError,
+  vo as DomainCodeDialog,
+  lo as ExampleComponent,
+  Un as HydrateAtoms,
+  rt as NAVBAR_WIDTH_CLOSED,
+  it as NAVBAR_WIDTH_OPENED,
+  ho as NavBar,
+  po as NavBarDarkStyledList,
+  uo as NavBarLightStyledList,
+  rn as NavBarProvider,
+  go as PageLayout,
+  Mn as SaladBarProvider,
+  Hn as atomStore,
+  sn as buildNavBarState,
+  ft as domainCodeAtom,
+  Co as fed21Theme,
+  wo as internalAgSystemsTheme,
+  H as navBarClasses,
+  Ce as navBarOpenAtom,
+  ut as navBarTopAtom,
+  be as navBarWidthClosedAtom,
+  we as navBarWidthOpenAtom,
+  ct as titleTextAtom,
+  pt as topBarHeightAtom,
+  an as useNavBar,
+  _n as useSaladBar,
+  bo as withAtomProvider,
+  co as withNavBarProvider,
+  Ao as withOverrideDefaults,
+  mo as withSaladBarProvider
 };
 //# sourceMappingURL=index.js.map