@australiangreens/ag-internal-components 0.0.56 → 0.0.58

package/dist/esm/index.js

@@ -1,111 +1,113 @@
-var xt = Object.defineProperty, Ct = Object.defineProperties;
-var wt = Object.getOwnPropertyDescriptors;
+var It = Object.defineProperty, Dt = Object.defineProperties;
+var Tt = 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 Ae = Object.prototype.hasOwnProperty, Ie = Object.prototype.propertyIsEnumerable;
+var de = (e, t, n) => t in e ? It(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]);
+    Ae.call(t, n) && de(e, n, t[n]);
   if (Y)
     for (var n of Y(t))
-      Ae.call(t, n) && le(e, n, t[n]);
+      Ie.call(t, n) && de(e, n, t[n]);
   return e;
-}, w = (e, t) => Ct(e, wt(t));
-var Se = (e, t) => {
+}, S = (e, t) => Dt(e, Tt(t));
+var De = (e, t) => {
   var n = {};
-  for (var i in e)
-    be.call(e, i) && t.indexOf(i) < 0 && (n[i] = e[i]);
+  for (var r in e)
+    Ae.call(e, r) && t.indexOf(r) < 0 && (n[r] = e[r]);
   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 of Y(e))
+      t.indexOf(r) < 0 && Ie.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 Te = (e, t, n) => (de(e, typeof t != "symbol" ? t + "" : t, n), n);
+var U = (e, t, n) => new Promise((r, a) => {
+  var s = (d) => {
     try {
-      u(n.next(s));
-    } catch (d) {
-      a(d);
+      g(n.next(d));
+    } catch (p) {
+      a(p);
     }
-  }, p = (s) => {
+  }, l = (d) => {
     try {
-      u(n.throw(s));
-    } catch (d) {
-      a(d);
+      g(n.throw(d));
+    } catch (p) {
+      a(p);
     }
-  }, u = (s) => s.done ? i(s.value) : Promise.resolve(s.value).then(l, p);
-  u((n = n.apply(e, t)).next());
+  }, g = (d) => d.done ? r(d.value) : Promise.resolve(d.value).then(s, l);
+  g((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 Nt from "@mui/material/CssBaseline";
-import { styled as $, createTheme as Ve, alpha as ce } from "@mui/material/styles";
-import { AgError as Et } from "@australiangreens/ag-error";
-import { createHelper as oe } 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 N, 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 }) {
-  const [t, n] = k(0);
-  return /* @__PURE__ */ c(y, { 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" }) }),
+import { jsxs as u, Fragment as P, jsx as o } from "react/jsx-runtime";
+import { useState as T, createContext as Ge, useCallback as te, useContext as Ve, useEffect as X, useMemo as Ot, createElement as Oe, useRef as pe } from "react";
+import { Typography as y, Button as kt, Paper as Ue, Box as I, Drawer as fe, Autocomplete as qe, TextField as Xe, CircularProgress as me, Chip as Bt, Tooltip as Et, styled as Ce, IconButton as Q, Container as je, useTheme as oe, useMediaQuery as $t, Collapse as yt, Avatar as ke, Fade as Nt, Skeleton as Be, Toolbar as Ft, Divider as Ee, CssBaseline as Pt, Snackbar as Lt, Alert as Mt, LinearProgress as _t, FormHelperText as Ht } from "@mui/material";
+import Rt from "@mui/material/CssBaseline";
+import { styled as _, createTheme as Qe, alpha as ue } from "@mui/material/styles";
+import { AgError as Wt } from "@australiangreens/ag-error";
+import { createHelper as re } from "souvlaki";
+import Ke from "@mui/material/List";
+import $e from "@mui/material/Button";
+import zt from "@mui/material/Dialog";
+import Gt from "@mui/material/DialogActions";
+import Vt from "@mui/material/DialogContent";
+import Ut from "@mui/material/DialogTitle";
+import { Cancel as qt, ArrowDropDown as Xt, ArrowForward as Je, ArrowBack as Ye, ViewHeadline as jt } from "@mui/icons-material";
+import Qt from "autosuggest-highlight/parse";
+import Kt from "autosuggest-highlight/match";
+import { atom as H, useSetAtom as Ze, useAtom as G, getDefaultStore as Jt, Provider as et } from "jotai";
+import { useHydrateAtoms as Yt } from "jotai/utils";
+function ho({ text: e }) {
+  const [t, n] = T(0);
+  return /* @__PURE__ */ u(P, { children: [
+    /* @__PURE__ */ o(y, { variant: "h6", color: "inherit", component: "div", sx: { fontSize: "22px" }, children: "Hello world" }),
+    /* @__PURE__ */ o(y, { 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,
+      kt,
       {
         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__ */ u("p", { children: [
       "This is some text: ",
       /* @__PURE__ */ o("span", { children: e })
     ] }),
-    /* @__PURE__ */ c(ze, { children: [
+    /* @__PURE__ */ u(Ue, { children: [
       "This number will incremember when button pressed: ",
       t
     ] })
   ] });
 }
-const Ye = 330, Je = 73, F = "Navbar", _ = {
-  root: `${F}-root`,
-  menuButton: `${F}-menuButton`,
-  hide: `${F}-hide`,
-  content: `${F}-content`,
-  userInfoHolder: `${F}-userInfoHolder`,
-  settings: `${F}-settings`,
-  pieChartIcon: `${F}-pieChartIcon`
-}, Wt = $(x, {
+const tt = 330, nt = 73, z = "Navbar", q = {
+  root: `${z}-root`,
+  menuButton: `${z}-menuButton`,
+  hide: `${z}-hide`,
+  content: `${z}-content`,
+  userInfoHolder: `${z}-userInfoHolder`,
+  settings: `${z}-settings`,
+  pieChartIcon: `${z}-pieChartIcon`
+}, Zt = _(I, {
   name: "NavBar"
 })(({ theme: e }) => ({
-  [`&.${_.root}`]: {
+  [`&.${q.root}`]: {
     display: "flex"
   },
-  [`& .${_.menuButton}`]: {
+  [`& .${q.menuButton}`]: {
     marginRight: 36
   },
-  [`& .${_.hide}`]: {
+  [`& .${q.hide}`]: {
     display: "none"
   },
-  [`& .${_.content}`]: {
+  [`& .${q.content}`]: {
     flexGrow: 1,
     padding: e.spacing(3)
   },
-  [`& .${_.userInfoHolder}`]: {
+  [`& .${q.userInfoHolder}`]: {
     height: "148px",
     marginTop: "64px",
     marginBottom: "16px"
   }
-})), Ke = () => ({
+})), ot = () => ({
   position: "absolute",
   height: "100%",
   overflowX: "hidden",
@@ -113,51 +115,51 @@ const Ye = 330, Je = 73, F = "Navbar", _ = {
   color: "white",
   backgroundColor: "black"
   // backgroundColor: '#e8e8e8',
-}), zt = () => r({
-  width: Ye
-}, Ke()), Gt = () => r({
-  width: Je
-}, Ke()), Ut = $(he, {
+}), en = () => i({
+  width: tt
+}, ot()), tn = () => i({
+  width: nt
+}, ot()), nn = _(fe, {
   shouldForwardProp: (e) => e !== "open"
-})(({ theme: e, open: t }) => r(r({
-  width: t ? Ye : Je,
+})(({ theme: e, open: t }) => i(i({
+  width: t ? tt : nt,
   flexShrink: 0,
   whiteSpace: "nowrap",
   boxSizing: "border-box",
   zIndex: e.zIndex.drawer + 100
 }, t && {
-  "& .MuiDrawer-paper": zt()
+  "& .MuiDrawer-paper": en()
 }), !t && {
-  "& .MuiDrawer-paper": Gt()
+  "& .MuiDrawer-paper": tn()
 }));
-class fe extends Et {
+class ve extends Wt {
 }
-Te(fe, "errorName", "ContextError");
-const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
-  overrideState: e = Vt,
-  overrideActions: t = Xt,
+Te(ve, "errorName", "ContextError");
+const rt = Ge(null), on = {}, rn = {}, an = ({
+  overrideState: e = on,
+  overrideActions: t = rn,
   children: n
 }) => {
-  const [{ open: i }, a] = k({ open: !0 }), l = ee((s) => {
-    a({ open: s });
-  }, []), p = ee(() => {
-    a((s) => w(r({}, s), { open: !s.open }));
-  }, []), u = r(r({
-    open: i,
-    setOpen: l,
-    toggleOpen: p
+  const [{ open: r }, a] = T({ open: !0 }), s = te((d) => {
+    a({ open: d });
+  }, []), l = te(() => {
+    a((d) => S(i({}, d), { open: !d.open }));
+  }, []), g = i(i({
+    open: r,
+    setOpen: s,
+    toggleOpen: l
   }, e), t);
-  return /* @__PURE__ */ o(Ze.Provider, { value: u, children: n });
-}, jt = () => {
-  const e = We(Ze);
+  return /* @__PURE__ */ o(rt.Provider, { value: g, children: n });
+}, sn = () => {
+  const e = Ve(rt);
   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({
+}, ln = (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), go = re(
+  (e = ln(), t = {}) => ({ children: n }) => /* @__PURE__ */ o(an, { overrideState: e, overrideActions: t, children: n })
+), ye = 7, fo = _(Ke)(({ theme: e }) => ({
   backgroundColor: "black",
   color: "white",
   "& .MuiListItem-root": {
@@ -166,7 +168,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
   "& .MuiListItemButton-root": {
     " .MuiListItemIcon-root": {
       color: "white",
-      padding: `${Be}px`
+      padding: `${ye}px`
     },
     // Focus state
     "&.Mui-focusVisible": {
@@ -177,7 +179,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)} - ${ye}px)`
     },
     // Hover state
     "&:hover": {
@@ -195,7 +197,7 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
     // '&.Mui-selected.Mui-focusVisible:hover': {
     // },
   }
-})), $e = 7, eo = $(Xe)(({ theme: e }) => ({
+})), Ne = 7, mo = _(Ke)(({ theme: e }) => ({
   backgroundColor: "#e8e8e8",
   color: "inherit",
   "& .MuiListItem-root": {
@@ -204,7 +206,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 +217,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 +236,15 @@ const Ze = Re(null), Vt = {}, Xt = {}, qt = ({
     // },
   }
 }));
-function to({
+function Co({
   "data-testid": e,
   children: t
 }) {
-  const { open: n } = jt();
-  return /* @__PURE__ */ c(Wt, { className: _.root, "data-testid": e, children: [
-    /* @__PURE__ */ o(Nt, {}),
+  const { open: n } = sn();
+  return /* @__PURE__ */ u(Zt, { className: q.root, "data-testid": e, children: [
+    /* @__PURE__ */ o(Rt, {}),
     /* @__PURE__ */ o(
-      Ut,
+      nn,
       {
         variant: "permanent",
         anchor: "left",
@@ -253,49 +255,49 @@ function to({
     )
   ] });
 }
-const Yt = ({
+const cn = ({
   isOpen: e,
   dialogTitle: t,
   children: n,
-  maxWidth: i,
+  maxWidth: r,
   primaryButton: a,
-  secondaryButton: l,
-  onClose: p
+  secondaryButton: s,
+  onClose: l
 }) => {
-  var d, v;
-  const [u, s] = k(!1);
-  return /* @__PURE__ */ c(
-    Ft,
+  var p, w;
+  const [g, d] = T(!1);
+  return /* @__PURE__ */ u(
+    zt,
     {
       open: e,
       onClose: () => {
-        u || p();
+        g || l();
       },
       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(Ut, { children: t }),
+        /* @__PURE__ */ o(Vt, { sx: { "& > :last-child": { marginBottom: 0 } }, children: n }),
+        /* @__PURE__ */ u(Gt, { children: [
           /* @__PURE__ */ o(
-            ke,
+            $e,
             {
-              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: (p = s == null ? void 0 : s.onClick) != null ? p : l,
+              "data-testid": s == null ? void 0 : s.testId,
+              disabled: (s == null ? void 0 : s.disabled) || g,
+              color: s == null ? void 0 : s.buttonColor,
+              children: (w = s == null ? void 0 : s.text) != null ? w : "Cancel"
             }
           ),
           a && /* @__PURE__ */ o(
-            ke,
+            $e,
             {
-              onClick: () => J(void 0, null, function* () {
-                var f;
-                s(!0), yield (f = a.onClick) == null ? void 0 : f.call(a), s(!1);
+              onClick: () => U(void 0, null, function* () {
+                var b;
+                d(!0), yield (b = a.onClick) == null ? void 0 : b.call(a), d(!1);
               }),
               "data-testid": a.testId,
-              disabled: a.disabled || u,
+              disabled: a.disabled || g,
               color: a == null ? void 0 : a.buttonColor,
               children: a.text
             }
@@ -304,32 +306,196 @@ 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", {
+};
+function vo({
+  lookup: e = () => U(this, null, function* () {
+  }),
+  enableHighlighting: t = !0,
+  onChange: n,
+  minLength: r,
+  label: a,
+  value: s,
+  dataTestidPrefix: l,
+  loadingText: g = "Loading...",
+  noOptionsText: d = "No options",
+  popupIcon: p = /* @__PURE__ */ o(Xt, {}),
+  error: w = !1,
+  helperText: b = "",
+  preLoadedOptions: f = void 0
+}) {
+  const [C, O] = T(""), [k, D] = T(f || []), [A, B] = T(!1), [L, N] = T(!1), R = (c, h) => {
+    const x = s.filter((F) => F.id !== h);
+    n(x, "delete", c);
+  };
+  X(() => {
+    let c;
+    const h = () => U(this, null, function* () {
+      c = new AbortController();
+      try {
+        const x = yield e(C, c.signal);
+        D(x != null ? x : []), N(!1);
+      } catch (x) {
+        if (x instanceof Error && x.name === "AbortError")
+          console.debug("Previous lookup request was cancelled");
+        else
+          throw x;
+      }
+    });
+    if (C !== "")
+      return (!r || C.length >= r) && !f ? (N(!0), h()) : N(!1), function() {
+        c && c.abort();
+      };
+  }, [C, e, r, f]), X(() => {
+    !A && !f && D([]), !A && f && D(f);
+  }, [A, f]);
+  const $ = Ot(() => f ? (c, h) => c.filter(
+    (x) => x.label.toLowerCase().includes(h.inputValue.toLowerCase())
+  ) : (c) => c, [f]);
+  return /* @__PURE__ */ u(P, { children: [
+    /* @__PURE__ */ o(
+      qe,
+      {
+        "data-testid": l ? l + "Autocomplete" : void 0,
+        disablePortal: !0,
+        multiple: !0,
+        getOptionLabel: (c) => typeof c == "string" ? c : c.label,
+        filterOptions: $,
+        loading: L,
+        options: [...s, ...k],
+        filterSelectedOptions: !0,
+        includeInputInList: !0,
+        value: s,
+        onOpen: () => B(!0),
+        onClose: () => B(!1),
+        onChange: (c, h, x) => {
+          n(h, x, c);
+        },
+        onInputChange: (c, h) => O(h),
+        noOptionsText: d,
+        loadingText: g,
+        popupIcon: p,
+        renderInput: (c) => /* @__PURE__ */ o(
+          Xe,
+          S(i({}, c), {
+            label: a,
+            fullWidth: !0,
+            variant: "filled",
+            error: w,
+            helperText: b,
+            InputProps: S(i({}, c.InputProps), {
+              endAdornment: /* @__PURE__ */ u(P, { children: [
+                L ? /* @__PURE__ */ o(me, { color: "inherit", size: 20 }) : null,
+                c.InputProps.endAdornment
+              ] })
+            }),
+            "data-testid": l ? l + "TextField" : void 0,
+            onKeyDown: (h) => {
+              (h.key === "Backspace" || h.key === "Delete") && h.stopPropagation();
+            }
+          })
+        ),
+        renderTags: () => null,
+        isOptionEqualToValue: (c, h) => c.id === h.id,
+        renderOption: (c, h, x) => {
+          if (t) {
+            const F = Kt(h.label, x.inputValue, {
+              insideWords: !0,
+              findAllOccurrences: !0
+            }), v = Qt(h.label, F);
+            return /* @__PURE__ */ Oe(
+              "li",
+              S(i({}, c), {
+                key: h.id,
+                "data-testid": l ? l + "li" + h.id.toString() : void 0
+              }),
+              /* @__PURE__ */ o("div", { children: v.map((m, M) => /* @__PURE__ */ o(
+                "span",
+                {
+                  style: {
+                    fontWeight: m.highlight ? 700 : 400
+                  },
+                  children: m.text
+                },
+                M
+              )) })
+            );
+          } else
+            return /* @__PURE__ */ Oe(
+              "li",
+              S(i({}, c), {
+                key: h.id,
+                "data-testid": l ? l + "li" + h.id.toString() : void 0
+              }),
+              h.label
+            );
+        }
+      }
+    ),
+    s.length > 0 && /* @__PURE__ */ o(I, { children: s.map((c) => /* @__PURE__ */ o(
+      Bt,
+      {
+        sx: {
+          marginTop: 1,
+          marginRight: 1,
+          height: "auto"
+        },
+        label: /* @__PURE__ */ o(
+          Et,
+          {
+            title: c.tooltipContent || "",
+            placement: "bottom-start",
+            PopperProps: {
+              modifiers: [
+                {
+                  name: "offset",
+                  options: {
+                    offset: [115, -15]
+                  }
+                }
+              ]
+            },
+            children: /* @__PURE__ */ o(y, { style: { whiteSpace: "normal" }, children: c.chipLabel ? c.chipLabel : c.label })
+          }
+        ),
+        "data-testid": l ? l + "Chip" + c.id.toString() : void 0,
+        onDelete: (h) => R(h, c.id),
+        deleteIcon: /* @__PURE__ */ o(
+          qt,
+          {
+            "data-testid": l ? l + "ChipDelete" + c.id.toString() : "CancelIcon"
+          }
+        )
+      },
+      c.id
+    )) })
+  ] });
+}
+const dn = 24, pn = 64, V = "TopBar", E = {
+  topStripe: `${V}-topStripe`,
+  titleBar: `${V}-titleBar`,
+  titleSlider: `${V}-titleSlider`,
+  titleText: `${V}-titleText`,
+  leftPanelButton: `${V}-leftPanelButton`,
+  rightPanelButton: `${V}-leftPanelButton`
+}, un = Ce("div", {
   shouldForwardProp: (e) => !["leftPanel", "rightPanel"].includes(e),
-  name: L
+  name: V
 })(({ theme: e, leftPanel: t, rightPanel: n }) => {
-  var i, a;
+  var r, a;
   return {
     width: "100%",
-    [`& .${A.topStripe}`]: {
+    [`& .${E.topStripe}`]: {
       width: "100%",
-      height: `${Jt}px`,
+      height: `${dn}px`,
       backgroundColor: e.palette.primary.main
     },
-    [`& .${A.titleBar}`]: {
+    [`& .${E.titleBar}`]: {
       backgroundColor: e.palette.primary.light,
-      height: `${Kt}px`,
+      height: `${pn}px`,
       padding: e.spacing(0, 3),
       width: "100%"
     },
-    [`& .${A.titleSlider}`]: r(r({
+    [`& .${E.titleSlider}`]: i(i({
       height: "100%",
       display: "flex",
       alignItems: "center",
@@ -338,14 +504,14 @@ const Yt = ({
         easing: e.transitions.easing.sharp,
         duration: e.transitions.duration.leavingScreen
       }),
-      [`& .${A.leftPanelButton}`]: {
+      [`& .${E.leftPanelButton}`]: {
         marginRight: e.spacing(2),
         flexGrow: 0
       },
-      [`& .${A.titleText}`]: {
+      [`& .${E.titleText}`]: {
         flexGrow: 1
       },
-      [`& .${A.rightPanelButton}`]: {
+      [`& .${E.rightPanelButton}`]: {
         flexGrow: 0
       }
     }, (t == null ? void 0 : t.open) && {
@@ -353,7 +519,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 +529,19 @@ const Yt = ({
     })
   };
 });
-function en({
+function hn({
   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(
-        V,
+  return /* @__PURE__ */ u(un, { leftPanel: t, rightPanel: n, "data-testid": r, children: [
+    /* @__PURE__ */ o("div", { className: E.topStripe }),
+    /* @__PURE__ */ o("div", { className: E.titleBar, children: /* @__PURE__ */ u(I, { className: E.titleSlider, children: [
+      t !== void 0 && !t.open && t.showOpenArrow && /* @__PURE__ */ u(
+        Q,
         {
-          className: A.leftPanelButton,
+          className: E.leftPanelButton,
           color: "inherit",
           "aria-label": "Open left side panel",
           onClick: t == null ? void 0 : t.onOpen,
@@ -383,15 +549,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(
-        V,
+      /* @__PURE__ */ o(y, { className: E.titleText, variant: "h6", noWrap: !0, children: e }),
+      n !== void 0 && !n.open && n.showOpenArrow && /* @__PURE__ */ u(
+        Q,
         {
-          className: A.rightPanelButton,
+          className: E.rightPanelButton,
           color: "inherit",
           "aria-label": "Open right side panel",
           onClick: n == null ? void 0 : n.onOpen,
@@ -399,14 +565,14 @@ function en({
           size: "large",
           children: [
             " ",
-            /* @__PURE__ */ o(je, {})
+            /* @__PURE__ */ o(Ye, {})
           ]
         }
       )
     ] }) })
   ] });
 }
-const et = 400, tn = ge(he, {
+const it = 400, gn = Ce(fe, {
   shouldForwardProp: (e) => (
     // Note we do want anchor to be forwarded to the Drawer component
     ![
@@ -420,9 +586,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 +596,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, {
+), fn = Ce(I, {
   shouldForwardProp: (e) => !["anchor"].includes(e)
-})(({ theme: e, anchor: t }) => w(r({
+})(({ theme: e, anchor: t }) => S(i({
   display: "flex",
   alignItems: "center",
   padding: e.spacing(2)
@@ -456,65 +622,65 @@ const et = 400, tn = ge(he, {
     marginRight: t === "right" ? e.spacing(2) : 0
   }
 }));
-function Ne({
+function Fe({
   children: e,
   anchor: t = "left",
   open: n,
-  onClose: i = () => {
+  onClose: r = () => {
   },
   titleText: a = "",
-  width: l = et,
-  showCloseArrow: p = !0,
-  debugOpacity: u = !1,
-  headerBoxProps: s = {},
-  onOpened: d,
-  onClosed: v,
-  "data-testid": f,
-  navBarOpen: C = !1,
-  navBarWidthOpen: m = 0,
-  navBarWidthClosed: T = 0
+  width: s = it,
+  showCloseArrow: l = !0,
+  debugOpacity: g = !1,
+  headerBoxProps: d = {},
+  onOpened: p,
+  onClosed: w,
+  "data-testid": b,
+  navBarOpen: f = !1,
+  navBarWidthOpen: C = 0,
+  navBarWidthClosed: O = 0
 }) {
-  return /* @__PURE__ */ c(
-    tn,
+  return /* @__PURE__ */ u(
+    gn,
     {
       SlideProps: {
-        onEntered: () => d == null ? void 0 : d(),
-        onExited: () => v == null ? void 0 : v()
+        onEntered: () => p == null ? void 0 : p(),
+        onExited: () => w == null ? void 0 : w()
       },
       variant: "persistent",
       anchor: t,
       open: n,
-      width: l,
-      debugOpacity: u,
-      "data-testid": f,
-      navBarOpen: C,
-      navBarWidthOpen: m,
-      navBarWidthClosed: T,
+      width: s,
+      debugOpacity: g,
+      "data-testid": b,
+      navBarOpen: f,
+      navBarWidthOpen: C,
+      navBarWidthClosed: O,
       children: [
-        /* @__PURE__ */ o(nn, w(r({ anchor: t }, s), { children: t === "left" ? /* @__PURE__ */ c(y, { 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" }),
+        /* @__PURE__ */ o(fn, S(i({ anchor: t }, d), { children: t === "left" ? /* @__PURE__ */ u(P, { children: [
+          /* @__PURE__ */ o(y, { variant: "h6", color: "inherit", component: "div", children: a }),
+          l && /* @__PURE__ */ u(Q, { onClick: r, size: "large", "aria-label": "Close left side panel", children: [
+            /* @__PURE__ */ o(Ye, { "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__ */ u(P, { children: [
+          l && /* @__PURE__ */ u(Q, { 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 })
+          /* @__PURE__ */ o(y, { variant: "h6", color: "inherit", component: "div", children: a })
         ] }) })),
         e
       ]
     }
   );
 }
-const on = $(x, {
+const mn = _(I, {
   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 +690,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,174 +698,179 @@ const on = $(x, {
     }),
     marginRight: `${(a = n == null ? void 0 : n.width) != null ? a : 0}px`
   });
-}), rn = $(Ge, {
+}), Cn = _(je, {
   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 = {
+  // TODO: Remove max width
+})), he = !1, ge = !1, Z = {
   titleText: "",
   flavour: "push",
-  width: et,
+  width: it,
   arrowButtons: "both",
   startOpen: !1,
   open: void 0,
   onChangeOpen: void 0,
-  content: /* @__PURE__ */ o(y, {}),
+  content: /* @__PURE__ */ o(P, {}),
   onOpened: void 0,
   onClosed: void 0,
   dataTestId: void 0
 };
-function no({
+function xo({
   children: e,
   titleText: t = "",
   leftPanel: n,
-  rightPanel: i,
+  rightPanel: r,
   sidePanelsAreMutuallyExclusive: a = !0,
-  debugOpacity: l = !1,
-  pageContainerProps: p,
-  pageContentDataTestId: u,
-  topBarDataTestId: s,
-  navBarOpen: d,
-  navBarWidthOpen: v,
-  navBarWidthClosed: f
+  debugOpacity: s = !1,
+  pageContainerProps: l,
+  pageContentDataTestId: g,
+  topBarDataTestId: d,
+  navBarOpen: p,
+  navBarWidthOpen: w,
+  navBarWidthClosed: b
 }) {
-  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, {
-    titleText: D,
-    content: X,
-    flavour: q,
-    open: z,
-    onChangeOpen: G,
-    width: h,
-    arrowButtons: g,
+  const [f, C] = T(he), [O, k] = T(ge), [D, A] = T(he), [B, L] = T(ge), N = n !== void 0, R = r !== void 0, {
+    titleText: $,
+    content: c,
+    flavour: h,
+    open: x,
+    onChangeOpen: F,
+    width: v,
+    arrowButtons: m,
     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,
-    arrowButtons: j,
-    startOpen: Q,
-    onOpened: ft,
-    onClosed: mt,
+    onOpened: mt,
+    onClosed: Ct,
     dataTestId: vt
-  } = i ? r(r({}, K), i) : r({}, K);
-  te(() => {
-    M !== pe && (m(M), b(M));
-  }, [M]), te(() => {
-    Q !== ue && (I(Q), H(Q));
-  }, [Q]);
-  const ae = z === void 0 ? C : z, se = ie === void 0 ? T : ie, Ce = (E) => {
-    z === void 0 && (m(E), a && W && (E ? (I(!1), H(T)) : I(O))), G && G(E);
-  }, we = (E) => {
-    ie === void 0 && (I(E), a && R && (E ? (m(!1), b(C)) : m(S))), xe && xe(E);
+  } = n ? i(i({}, Z), n) : i({}, Z), {
+    titleText: xt,
+    content: wt,
+    flavour: xe,
+    open: ae,
+    onChangeOpen: we,
+    width: se,
+    arrowButtons: K,
+    startOpen: J,
+    onOpened: bt,
+    onClosed: St,
+    dataTestId: At
+  } = r ? i(i({}, Z), r) : i({}, Z);
+  X(() => {
+    M !== he && (C(M), A(M));
+  }, [M]), X(() => {
+    J !== ge && (k(J), L(J));
+  }, [J]);
+  const le = x === void 0 ? f : x, ce = ae === void 0 ? O : ae, be = (W) => {
+    x === void 0 && (C(W), a && R && (W ? (k(!1), L(O)) : k(B))), F && F(W);
+  }, Se = (W) => {
+    ae === void 0 && (k(W), a && N && (W ? (C(!1), A(f)) : C(D))), we && we(W);
   };
-  return /* @__PURE__ */ c(x, { children: [
-    R && /* @__PURE__ */ o(
-      Ne,
+  return /* @__PURE__ */ u(I, { children: [
+    N && /* @__PURE__ */ o(
+      Fe,
       {
-        "data-testid": ut,
+        "data-testid": vt,
         anchor: "left",
-        open: ae,
-        onClose: () => Ce(!1),
-        width: h,
-        titleText: D,
-        debugOpacity: l,
-        showCloseArrow: g === "both" || g === "close",
-        onOpened: ct,
-        onClosed: pt,
-        navBarOpen: d,
-        navBarWidthOpen: v,
-        navBarWidthClosed: f,
-        children: X
+        open: le,
+        onClose: () => be(!1),
+        width: v,
+        titleText: $,
+        debugOpacity: s,
+        showCloseArrow: m === "both" || m === "close",
+        onOpened: mt,
+        onClosed: Ct,
+        navBarOpen: p,
+        navBarWidthOpen: w,
+        navBarWidthClosed: b,
+        children: c
       }
     ),
-    W && /* @__PURE__ */ o(
-      Ne,
+    R && /* @__PURE__ */ o(
+      Fe,
       {
-        "data-testid": vt,
+        "data-testid": At,
         anchor: "right",
-        open: se,
-        onClose: () => we(!1),
-        width: re,
-        titleText: ht,
-        debugOpacity: l,
-        showCloseArrow: j === "both" || j === "close",
-        onOpened: ft,
-        onClosed: mt,
-        navBarOpen: d,
-        navBarWidthOpen: v,
-        navBarWidthClosed: f,
-        children: gt
+        open: ce,
+        onClose: () => Se(!1),
+        width: se,
+        titleText: xt,
+        debugOpacity: s,
+        showCloseArrow: K === "both" || K === "close",
+        onOpened: bt,
+        onClosed: St,
+        navBarOpen: p,
+        navBarWidthOpen: w,
+        navBarWidthClosed: b,
+        children: wt
       }
     ),
     /* @__PURE__ */ o(
-      en,
-      r(r({
+      hn,
+      i(i({
         titleText: t,
-        "data-testid": s
-      }, R && q === "push" ? {
+        "data-testid": d
+      }, N && h === "push" ? {
         leftPanel: {
-          open: ae,
-          width: h,
-          onOpen: () => Ce(!0),
-          showOpenArrow: g === "both" || g === "open"
+          open: le,
+          width: v,
+          onOpen: () => be(!0),
+          showOpenArrow: m === "both" || m === "open"
         }
-      } : {}), W && ve === "push" ? {
+      } : {}), R && xe === "push" ? {
         rightPanel: {
-          open: se,
-          width: re,
-          onOpen: () => we(!0),
-          showOpenArrow: j === "both" || j === "open"
+          open: ce,
+          width: se,
+          onOpen: () => Se(!0),
+          showOpenArrow: K === "both" || K === "open"
         }
       } : {})
     ),
     /* @__PURE__ */ o(
-      on,
-      w(r(r({}, q === "push" ? {
+      mn,
+      S(i(i({}, h === "push" ? {
         leftPanel: {
-          open: ae,
-          width: h
+          open: le,
+          width: v
         }
-      } : {}), 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, S(i({ "data-testid": g }, l), { children: e }))
       })
     )
   ] });
 }
-function an({ links: e }) {
+const at = () => {
+  const e = oe();
+  return $t(e.breakpoints.down("sm"));
+}, vn = 64, xn = 64, wn = 256, ie = H(!0), st = H(wn), lt = H(xn), ct = H(""), dt = H(vn), pt = H(void 0);
+function bn({ links: e }) {
   return /* @__PURE__ */ o("div", { children: "LinksMenu not implemented yet" });
 }
-const Z = "Navbar", U = {
-  root: `${Z}-root`,
-  menuButton: `${Z}-menuButton`,
-  hide: `${Z}-hide`,
-  content: `${Z}-content`
+const ee = "Navbar", j = {
+  root: `${ee}-root`,
+  menuButton: `${ee}-menuButton`,
+  hide: `${ee}-hide`,
+  content: `${ee}-content`
   // userInfoHolder: `${PREFIX}-userInfoHolder`,
   // settings: `${PREFIX}-settings`,
   // pieChartIcon: `${PREFIX}-pieChartIcon`,
-}, sn = $(x, { name: "NavBar" })(({ theme: e }) => ({
-  [`&.${U.root}`]: {
+}, Sn = _(I, { name: "NavBar" })(({ theme: e }) => ({
+  [`&.${j.root}`]: {
     display: "flex"
   },
-  [`& .${U.menuButton}`]: {
+  [`& .${j.menuButton}`]: {
     marginRight: 36
   },
-  [`& .${U.hide}`]: {
+  [`& .${j.hide}`]: {
     display: "none"
   },
-  [`& .${U.content}`]: {
+  [`& .${j.content}`]: {
     flexGrow: 1,
     padding: e.spacing(3)
   }
@@ -711,50 +882,60 @@ 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;
+}), An = (e) => {
+  const t = oe();
+  return /* @__PURE__ */ o(
+    yt,
+    i({
+      easing: t.transitions.easing.sharp,
+      timeout: {
+        enter: t.transitions.duration.enteringScreen,
+        exit: t.transitions.duration.leavingScreen
+      }
+    }, e)
+  );
+}, ut = (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
   };
-}, Ee = (e, t, n) => r({
+}, Pe = (e, t) => i({
   width: t,
   transition: ne(e, "width", "entering")
-}, tt(e, n)), Fe = (e, t, n) => r({
+}, ut(e)), Le = (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")
+}, ut(e)), In = _(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({}, Ee(e, n, a)), {
-  "& .MuiDrawer-paper": Ee(e, n, a)
-})), !t && w(r({}, Fe(e, i, a)), {
-  "& .MuiDrawer-paper": Fe(e, i, a)
+}, t && S(i({}, Pe(e, n)), {
+  backgroundColor: "",
+  "& .MuiDrawer-paper": Pe(e, n)
+})), !t && S(i({}, Le(e, a ? n : r)), {
+  backgroundColor: "",
+  "& .MuiDrawer-paper": Le(e, a ? n : r)
 })));
-function dn(e) {
+function Dn(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(
-    x,
+const Me = ["#A62A21", "#7e3794", "#0B51C1", "#3A6024", "#A81563", "#B3003C"], Tn = (e) => e.split(/\s/).map((t) => t.substring(0, 1).toUpperCase()).filter((t) => !!t).slice(0, 2).join("").toUpperCase();
+function On({ user: e, domainCode: t, open: n }) {
+  const r = oe();
+  return /* @__PURE__ */ u(
+    I,
     {
       sx: {
         paddingTop: 3,
@@ -765,89 +946,85 @@ function pn({ user: e, domainCode: t, open: n }) {
       },
       children: [
         /* @__PURE__ */ o(
-          x,
+          I,
           {
             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,
+              ke,
               {
                 src: e == null ? void 0 : e.picture,
                 sx: {
                   width: "100%",
                   height: "100%",
-                  bgcolor: Pe[Math.abs(dn(e.name)) % Pe.length]
+                  bgcolor: Me[Math.abs(Dn(e.name)) % Me.length]
                 },
-                children: cn(e.name)
+                children: Tn(e.name)
               }
-            ) : /* @__PURE__ */ o(Ie, { sx: { width: "100%", height: "100%" } })
+            ) : /* @__PURE__ */ o(ke, { 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
-            },
-            in: n,
-            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(An, { sx: { width: "100%" }, in: n, children: /* @__PURE__ */ o(Nt, { in: n, children: /* @__PURE__ */ u(I, { width: "100%", display: "flex", flexDirection: "column", alignItems: "center", children: [
+          e != null && e.name ? /* @__PURE__ */ o(y, { children: e.name }) : /* @__PURE__ */ o(Be, { animation: !1, width: "50%" }),
+          t ? /* @__PURE__ */ o(y, { children: t.toUpperCase() }) : /* @__PURE__ */ o(Be, { animation: !1, width: "25%" })
+        ] }) }) })
       ]
     }
   );
 }
-function un({
+function kn({
   open: e,
-  offsetTop: t = 0,
+  widthClosed: t,
   widthOpen: n,
-  widthClosed: i,
-  "data-testid": a,
-  top: l,
-  middle: p,
-  bottom: u,
-  user: s,
+  "data-testid": r,
+  top: a,
+  middle: s,
+  bottom: l,
+  user: g,
   domainCode: d
 }) {
-  return /* @__PURE__ */ o(sn, { className: U.root, "data-testid": a, children: /* @__PURE__ */ c(
-    ln,
+  const p = at(), w = Ze(ie);
+  return /* @__PURE__ */ o(Sn, { className: j.root, "data-testid": r, children: /* @__PURE__ */ u(
+    In,
     {
-      variant: "permanent",
-      anchor: "left",
       open: e,
       widthOpen: n,
-      widthClosed: i,
-      offsetTop: t,
+      widthClosed: t,
+      anchor: "left",
+      variant: p ? "temporary" : "permanent",
       PaperProps: {
         component: "nav"
       },
+      onClose: () => {
+        w(!1);
+      },
+      isSmallScreen: p,
       children: [
-        l && /* @__PURE__ */ c(x, { flexGrow: "0", children: [
-          l,
-          /* @__PURE__ */ o(De, { variant: "middle" })
+        !p && /* @__PURE__ */ o(Ft, {}),
+        a && /* @__PURE__ */ u(I, { flexGrow: "0", children: [
+          a,
+          /* @__PURE__ */ o(Ee, { 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(I, { flexGrow: "1", children: Array.isArray(s) ? /* @__PURE__ */ o(bn, { links: s }) : s }),
+        /* @__PURE__ */ u(I, { flexGrow: "0", children: [
+          /* @__PURE__ */ o(Ee, { variant: "middle" }),
+          /* @__PURE__ */ o(On, { user: g, domainCode: d, open: e }),
+          l && /* @__PURE__ */ o(P, { children: l })
         ] })
       ]
     }
   ) });
 }
-function hn({ children: e, topBarHeight: t }) {
+function Bn({
+  children: e,
+  topBarHeight: t,
+  maxWidth: n = !1
+}) {
   return /* @__PURE__ */ o(
-    x,
+    I,
     {
       sx: {
         overflow: "auto",
@@ -857,10 +1034,11 @@ function hn({ children: e, topBarHeight: t }) {
         flexGrow: 1
       },
       children: /* @__PURE__ */ o(
-        Ge,
+        je,
         {
           component: "main",
           id: "main-content",
+          maxWidth: n,
           sx: { paddingTop: 3, paddingBottom: 3, flexGrow: 1 },
           children: e
         }
@@ -868,13 +1046,13 @@ function hn({ children: e, topBarHeight: t }) {
     }
   );
 }
-const gn = 64, fn = 64, mn = 256, me = N(!0), nt = N(mn), ot = N(fn), it = N(""), rt = N(gn), at = N(void 0), vn = "TopBar", xn = {
-  titleText: `${vn}-titleText`
+const En = "TopBar", $n = {
+  titleText: `${En}-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 yn({ titleText: e = "", height: t, "data-testid": n }) {
+  const r = Ze(ie), a = () => r((g) => !g), s = oe(), l = at();
+  return /* @__PURE__ */ o("header", { "data-testid": n, children: /* @__PURE__ */ u(
+    Ue,
     {
       square: !0,
       elevation: 0,
@@ -887,180 +1065,181 @@ function Cn({ titleText: e = "", height: t, "data-testid": n }) {
         alignItems: "center",
         gap: 2,
         flexShrink: 0,
-        height: t
+        height: t,
+        zIndex: l ? 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(Q, { size: "medium", color: "inherit", sx: { padding: 1.5 }, onClick: a, children: /* @__PURE__ */ o(jt, { fontSize: "medium" }) }),
+        /* @__PURE__ */ o(y, { className: $n.titleText, variant: "h6", children: e })
       ]
     }
   ) });
 }
-function oo({
+function wo({
   children: e,
   initialTitleText: t,
   initialNavBarOpen: n,
-  pageContainerProps: i,
+  pageContainerProps: r,
   pageContentDataTestId: a,
-  topBarDataTestId: l,
-  navBarDataTestId: p,
-  navBarMiddle: u,
-  navBarBottom: s,
-  user: d,
-  domainCode: v
+  topBarDataTestId: s,
+  navBarDataTestId: l,
+  navBarMiddle: g,
+  navBarBottom: d,
+  user: p,
+  domainCode: w
 }) {
-  const [f, C] = P(me), [m] = P(nt), [T] = P(ot), [I, S] = P(it), [b] = P(rt), [O] = P(at);
-  return te(() => {
-    t !== void 0 && S(t);
-  }, [t, S]), 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: [
+  const [b, f] = G(ie), [C] = G(st), [O] = G(lt), [k, D] = G(ct), [A] = G(dt), [B] = G(pt);
+  return X(() => {
+    t !== void 0 && D(t);
+  }, [t, D]), X(() => {
+    n !== void 0 && f(n);
+  }, [n, f]), /* @__PURE__ */ u(I, { children: [
+    /* @__PURE__ */ o(Pt, {}),
+    /* @__PURE__ */ o(yn, { titleText: k, "data-testid": s, height: A }),
+    /* @__PURE__ */ u(I, { sx: { display: "flex" }, children: [
       /* @__PURE__ */ o(
-        un,
+        kn,
         {
-          open: f,
-          top: O,
-          middle: u,
-          bottom: s,
-          user: d,
-          domainCode: v,
-          widthOpen: m,
-          widthClosed: T,
-          offsetTop: b,
-          "data-testid": p
+          open: b,
+          top: B,
+          middle: g,
+          bottom: d,
+          user: p,
+          domainCode: w,
+          widthOpen: C,
+          widthClosed: O,
+          offsetTop: A,
+          "data-testid": l
         }
       ),
       /* @__PURE__ */ o(
-        hn,
-        w(r({
+        Bn,
+        S(i({
           "data-testid": a,
-          topBarHeight: b
-        }, i), {
+          topBarHeight: A
+        }, r), {
           children: e
         })
       )
     ] })
   ] });
 }
-const wn = {
+const Nn = {
   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 = {
+}, Fn = {
   shouldClose: (e, t) => t !== "clickaway"
-}, Le = {
+}, _e = {
   message: "",
   severity: "info",
   variant: "standard",
   progressIndicator: void 0
   // Can use 'circular' or 'linear'
-}, ye = 100, Me = 2e3, An = 2e3, Sn = (() => {
+}, He = 100, Re = 2e3, Pn = 2e3, Ln = (() => {
   let e = 0;
   return () => (e += 1, e);
-})(), Tn = {
+})(), Mn = {
   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 = {}, Hn = {}, ht = Ge(null);
+function Rn(s) {
+  var l = s, {
+    overrideState: e = _n,
+    overrideActions: t = Hn,
+    shouldClose: n = Fn.shouldClose,
+    children: r
+  } = l, a = De(l, [
     "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()
-    }), 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);
-    if (g !== -1)
-      return g === 0 ? (s({ open: !1 }), d.current[0]) : d.current.splice(g, 1);
-  }, H = (h, g) => {
-    n(h, g) && s({ open: !1 });
+  var F;
+  const [{ open: g }, d] = T({ open: !1 }), p = pe([]), w = pe(Date.now()), b = pe(0), f = te((v) => {
+    d({ open: v });
+  }, []), C = te((v = {}) => {
+    b.current += 1, p.current.length >= He && Date.now() - w.current >= Re && (w.current = Date.now(), console.error(
+      `SaladBarProvider: MAX_QUEUE_LENGTH (${He}) hit ${b.current} times in last ${Re}ms)`
+    ), b.current = 0);
+    const m = i(S(i({}, _e), {
+      key: Ln()
+    }), v);
+    return p.current.push(m), p.current.length === 1 && d({ open: !0 }), m.key;
+  }, []), O = (v = "", m = {}) => C(i({ message: v, severity: "success" }, m)), k = (v = "", m = {}) => C(i({ message: v, severity: "info" }, m)), D = (v = "", m = {}) => C(i({ message: v, severity: "warning" }, m)), A = (v = "", m = {}) => C(i({ message: v, severity: "error" }, m)), B = (v) => {
+    const m = p.current.findIndex((M) => M.key === v);
+    if (m !== -1)
+      return m === 0 ? (d({ open: !1 }), p.current[0]) : p.current.splice(m, 1);
+  }, L = (v, m) => {
+    n(v, m) && d({ open: !1 });
+  }, N = () => {
   }, 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({
-    open: u,
-    setOpen: C,
-    enqueueNotification: m,
-    enqueueSuccessNotification: T,
-    enqueueInfoNotification: I,
-    enqueueWarningNotification: S,
-    enqueueErrorNotification: b,
-    removeNotification: O
+    p.current.shift(), p.current.length > 0 && d({ open: !0 });
+  }, $ = (F = p.current[0]) != null ? F : i({}, _e), c = {};
+  "autoHideDuration" in $ && (c.autoHideDuration = $.autoHideDuration);
+  const h = i(i({}, Nn), a), x = i(i({
+    open: g,
+    setOpen: f,
+    enqueueNotification: C,
+    enqueueSuccessNotification: O,
+    enqueueInfoNotification: k,
+    enqueueWarningNotification: D,
+    enqueueErrorNotification: A,
+    removeNotification: B
   }, e), t);
-  return /* @__PURE__ */ c(st.Provider, { value: z, children: [
-    i,
+  return /* @__PURE__ */ u(ht.Provider, { value: x, children: [
+    r,
     /* @__PURE__ */ o(
-      It,
-      w(r(r({}, q), X), {
-        open: u,
-        onClose: H,
+      Lt,
+      S(i(i({}, h), c), {
+        open: g,
+        onClose: L,
         TransitionProps: {
-          onExited: W,
-          onExit: R
+          onExited: R,
+          onExit: N
         },
-        sx: { zIndex: An },
-        children: /* @__PURE__ */ c("div", { children: [
+        sx: { zIndex: Pn },
+        children: /* @__PURE__ */ u("div", { children: [
           /* @__PURE__ */ o(
-            Ot,
+            Mt,
             {
-              onClose: (h) => H(h, "closeAlert"),
-              severity: D.severity,
+              onClose: (v) => L(v, "closeAlert"),
+              severity: $.severity,
               variant: "filled",
-              icon: D.progressIndicator === "circular" ? /* @__PURE__ */ o(Ue, { size: "1em" }) : void 0,
-              style: D.progressIndicator === "linear" ? Tn : void 0,
-              children: D.message
+              icon: $.progressIndicator === "circular" ? /* @__PURE__ */ o(me, { size: "1em" }) : void 0,
+              style: $.progressIndicator === "linear" ? Mn : void 0,
+              children: $.message
             }
           ),
-          D.progressIndicator === "linear" && /* @__PURE__ */ o(Dt, { color: "primary" })
+          $.progressIndicator === "linear" && /* @__PURE__ */ o(_t, { color: "primary" })
         ] })
       })
     )
   ] });
 }
-function kn() {
-  const e = We(st);
+function Wn() {
+  const e = Ve(ht);
   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 bo = re(
+  (e = { autoHideDuration: 1 }, t = {}, n = {}) => ({ children: r }) => /* @__PURE__ */ o(Rn, S(i({}, e), { overrideState: t, overrideActions: n, children: r }))
+), zn = Jt(), So = ({
   children: e,
   store: t
-}) => /* @__PURE__ */ o(Qe, { store: t != null ? t : Bn, children: e }), lt = "domainCode";
-var He;
-const _e = N(
-  JSON.parse((He = localStorage.getItem(lt)) != null ? He : '{"domainCode": ""}').domainCode
-), dt = N(
-  (e) => e(_e),
+}) => /* @__PURE__ */ o(et, { store: t != null ? t : zn, children: e }), gt = "domainCode";
+var ze;
+const We = H(
+  JSON.parse((ze = localStorage.getItem(gt)) != null ? ze : '{"domainCode": ""}').domainCode
+), ft = H(
+  (e) => e(We),
   (e, t, n) => {
-    t(_e, n), localStorage.setItem(lt, JSON.stringify({ domainCode: n }));
+    t(We, n), localStorage.setItem(gt, JSON.stringify({ domainCode: n }));
   }
-), $n = {
+), Gn = {
   act: "ACT",
   nsw: "NSW",
   nt: "NT",
@@ -1072,76 +1251,76 @@ const _e = N(
   ag: "AG",
   fedmps: "Fedmps",
   "": ""
-}, Nn = (e) => {
+}, Vn = (e) => {
   var t;
-  return e === null ? "N/A" : (t = $n[e]) != null ? t : "";
-}, ao = ({
+  return e === null ? "N/A" : (t = Gn[e]) != null ? t : "";
+}, Ao = ({
   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 [l, g] = G(ft), [d, p] = T(l), { enqueueSuccessNotification: w } = Wn(), b = r.length === 0, f = !!l && !r.includes(l) && !r.includes(d), C = !l || b || f, O = () => U(void 0, null, function* () {
+    d ? (g(d), w(`Set domain to ${d}`), n()) : g("");
+  }), k = () => U(void 0, null, function* () {
+    l && !b && !f ? (p(l), n()) : C && 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 D;
+  return b ? D = "Unable to retrieve your active organisations. Try logging in again." : f && (D = "You no longer have any roles in your chosen organisation. Please choose another."), /* @__PURE__ */ u(
+    cn,
     {
       isOpen: t,
       dialogTitle: "Select an organisation",
       primaryButton: {
         text: "Confirm",
-        onClick: T,
-        disabled: !s || f || C,
+        onClick: O,
+        disabled: !d || b || f,
         buttonColor: "primary"
       },
       secondaryButton: {
-        text: m ? "Logout" : "Cancel",
-        onClick: I
+        text: C ? "Logout" : "Cancel",
+        onClick: k
       },
-      onClose: m ? () => {
+      onClose: C ? () => {
       } : n,
       children: [
-        /* @__PURE__ */ c(B, { marginBottom: 2, children: [
+        /* @__PURE__ */ u(y, { marginBottom: 2, children: [
           "Select the default organisation that you want to use with the ",
           a,
           "."
         ] }),
         /* @__PURE__ */ o(
-          kt,
+          qe,
           {
             loading: e,
             multiple: !1,
             disableClearable: !1,
-            value: s !== "" ? s : null,
-            onChange: (b, O) => d(O != null ? O : ""),
-            getOptionLabel: Nn,
-            options: [...i],
-            renderInput: (b) => /* @__PURE__ */ o(
-              Bt,
-              w(r({}, b), {
+            value: d !== "" ? d : null,
+            onChange: (A, B) => p(B != null ? B : ""),
+            getOptionLabel: Vn,
+            options: [...r],
+            renderInput: (A) => /* @__PURE__ */ o(
+              Xe,
+              S(i({}, A), {
                 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,
-                    b.InputProps.endAdornment
+                InputProps: S(i({}, A.InputProps), {
+                  endAdornment: /* @__PURE__ */ u(P, { children: [
+                    e ? /* @__PURE__ */ o(me, { color: "inherit", size: 20, sx: { marginTop: "-20px" } }) : null,
+                    A.InputProps.endAdornment
                   ] })
                 })
               })
             )
           }
         ),
-        S && /* @__PURE__ */ o($t, { error: !0, children: S })
+        D && /* @__PURE__ */ o(Ht, { error: !0, children: D })
       ]
     }
   );
-}, so = Ve({
+}, Io = Qe({
   palette: {
     primary: {
       dark: "#00A651",
@@ -1192,7 +1371,7 @@ const _e = N(
   navBar: {
     backgroundColor: "#E8E8E8"
   }
-}), lo = Ve({
+}), Do = Qe({
   palette: {
     primary: {
       main: "#007236",
@@ -1246,18 +1425,18 @@ const _e = N(
       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
               )
@@ -1283,25 +1462,25 @@ const _e = N(
   navBar: {
     backgroundColor: "#E8E8E8"
   }
-}), En = {
-  domainCode: dt,
-  navBarOpen: me,
-  navBarWidthOpen: nt,
-  navBarWidthClosed: ot,
-  titleText: it,
-  topBarHeight: rt,
-  navBarTop: at
-}, co = oe(() => ({ children: e }) => /* @__PURE__ */ o(Qe, { children: e })), Fn = ({
+}), Un = {
+  domainCode: ft,
+  navBarOpen: ie,
+  navBarWidthOpen: st,
+  navBarWidthClosed: lt,
+  titleText: ct,
+  topBarHeight: dt,
+  navBarTop: pt
+}, To = re(() => ({ children: e }) => /* @__PURE__ */ o(et, { children: e })), qn = ({
   initialValues: e,
   children: t
-}) => (Rt(e), /* @__PURE__ */ o(y, { children: t })), po = oe(
+}) => (Yt(e), /* @__PURE__ */ o(P, { children: t })), Oo = re(
   (e) => ({ children: t }) => /* @__PURE__ */ o(
-    Fn,
+    qn,
     {
       initialValues: Object.entries(e).map(
-        ([n, i]) => [
-          En[n],
-          i
+        ([n, r]) => [
+          Un[n],
+          r
         ]
       ),
       children: t
@@ -1309,39 +1488,41 @@ const _e = N(
   )
 );
 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,
-  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,
-  _ 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
+  cn as AgDialog,
+  wo as AppLayout,
+  So as AtomProvider,
+  ht as Context,
+  ve as ContextError,
+  Ao as DomainCodeDialog,
+  ho as ExampleComponent,
+  vo as FetchAutocomplete,
+  qn as HydrateAtoms,
+  nt as NAVBAR_WIDTH_CLOSED,
+  tt as NAVBAR_WIDTH_OPENED,
+  Co as NavBar,
+  fo as NavBarDarkStyledList,
+  mo as NavBarLightStyledList,
+  an as NavBarProvider,
+  xo as PageLayout,
+  Rn as SaladBarProvider,
+  zn as atomStore,
+  ln as buildNavBarState,
+  ft as domainCodeAtom,
+  Io as fed21Theme,
+  Do as internalAgSystemsTheme,
+  q as navBarClasses,
+  ie as navBarOpenAtom,
+  pt as navBarTopAtom,
+  lt as navBarWidthClosedAtom,
+  st as navBarWidthOpenAtom,
+  ct as titleTextAtom,
+  dt as topBarHeightAtom,
+  sn as useNavBar,
+  Wn as useSaladBar,
+  at as useSmallScreen,
+  To as withAtomProvider,
+  go as withNavBarProvider,
+  Oo as withOverrideDefaults,
+  bo as withSaladBarProvider
 };
 //# sourceMappingURL=index.js.map