@iowas/toolpad 1.0.0 → 1.0.1

package/dist/{chunk-ZXM3V5SD.mjs → chunk-IDMYUY7L.mjs}

@@ -1,40 +1,36 @@
-import {
-  AuthenticationContext,
-  BrandingContext,
-  DashboardSidebarPageItemContext,
-  DialogsContext,
-  NavigationContext,
-  NotificationsContext,
-  PaletteModeContext,
-  RouterContext,
-  SessionContext,
-  WindowContext,
-  useLocaleText
-} from "./chunk-LUTZBKSG.mjs";
-import {
-  warnOnce
-} from "./chunk-F6JD4MSY.mjs";
 import {
   __objRest,
   __spreadProps,
   __spreadValues,
-  useNonNullableContext
-} from "./chunk-3JWXE2JW.mjs";
+  useNonNullableContext,
+  warnOnce
+} from "./chunk-6JQJK2JX.mjs";
 
 // src/toolpad-core/Account/Account.tsx
-import * as React7 from "react";
-import PropTypes6 from "prop-types";
+import * as React16 from "react";
+import PropTypes8 from "prop-types";
 import Popover from "@mui/material/Popover";
 import Divider from "@mui/material/Divider";
 import Stack3 from "@mui/material/Stack";
 
 // src/toolpad-core/Account/SignInButton.tsx
-import * as React4 from "react";
-import PropTypes from "prop-types";
-import Button2 from "@mui/material/Button";
+import * as React13 from "react";
+import PropTypes3 from "prop-types";
+import Button3 from "@mui/material/Button";
+
+// src/toolpad-core/AppProvider/AppProvider.tsx
+import * as React11 from "react";
+import PropTypes2 from "prop-types";
+import { createTheme } from "@mui/material/styles";
 
 // src/toolpad-core/useNotifications/useNotifications.tsx
+import * as React2 from "react";
+
+// src/toolpad-core/useNotifications/NotificationsContext.ts
 import * as React from "react";
+var NotificationsContext = React.createContext(null);
+
+// src/toolpad-core/useNotifications/useNotifications.tsx
 var serverNotifications = {
   show: () => {
     throw new Error("Not supported on server side");
@@ -44,15 +40,223 @@ var serverNotifications = {
   }
 };
 function useNotifications() {
-  const context = React.useContext(NotificationsContext);
+  const context = React2.useContext(NotificationsContext);
   if (context) {
     return context;
   }
   return serverNotifications;
 }
 
+// src/toolpad-core/useNotifications/NotificationsProvider.tsx
+import * as React4 from "react";
+import {
+  Alert,
+  Badge,
+  Button,
+  IconButton,
+  Snackbar,
+  SnackbarContent
+} from "@mui/material";
+import CloseIcon from "@mui/icons-material/Close";
+import useSlotProps from "@mui/utils/useSlotProps";
+
+// src/toolpad-core/AppProvider/LocalizationProvider.tsx
+import * as React3 from "react";
+import PropTypes from "prop-types";
+import { useTheme } from "@mui/material/styles";
+
+// src/toolpad-core/locales/getLocalization.ts
+var getLocalization = (translations) => {
+  return {
+    components: {
+      MuiLocalizationProvider: {
+        defaultProps: {
+          localeText: __spreadValues({}, translations)
+        }
+      }
+    }
+  };
+};
+
+// src/toolpad-core/locales/en.tsx
+var enLabels = {
+  // Account
+  accountSignInLabel: "Sign In",
+  accountSignOutLabel: "Sign Out",
+  // AccountPreview
+  accountPreviewTitle: "Account",
+  accountPreviewIconButtonLabel: "Current User",
+  // SignInPage
+  signInTitle: (brandingTitle) => brandingTitle ? `Sign in to ${brandingTitle}` : "Sign in",
+  signInSubtitle: "Welcome user, please sign in to continue",
+  signInRememberMe: "Remember Me",
+  providerSignInTitle: (provider) => `Sign in with ${provider}`,
+  // Common authentication labels
+  email: "Email",
+  password: "Password",
+  username: "Username",
+  passkey: "Passkey",
+  // Common action labels
+  save: "Save",
+  cancel: "Cancel",
+  ok: "Ok",
+  or: "Or",
+  to: "To",
+  with: "With",
+  close: "Close",
+  delete: "Delete",
+  alert: "Alert",
+  confirm: "Confirm",
+  loading: "Loading...",
+  // CRUD
+  createNewButtonLabel: "Create new",
+  reloadButtonLabel: "Reload data",
+  createLabel: "Create",
+  createSuccessMessage: "Item created successfully.",
+  createErrorMessage: "Failed to create item. Reason:",
+  editLabel: "Edit",
+  editSuccessMessage: "Item edited successfully.",
+  editErrorMessage: "Failed to edit item. Reason:",
+  deleteLabel: "Delete",
+  deleteConfirmTitle: "Delete item?",
+  deleteConfirmMessage: "Do you wish to delete this item?",
+  deleteConfirmLabel: "Delete",
+  deleteCancelLabel: "Cancel",
+  deleteSuccessMessage: "Item deleted successfully.",
+  deleteErrorMessage: "Failed to delete item. Reason:",
+  deletedItemMessage: "This item has been deleted."
+};
+var en_default = getLocalization(enLabels);
+
+// src/toolpad-core/AppProvider/LocalizationProvider.tsx
+import { jsx } from "react/jsx-runtime";
+var LocalizationContext = React3.createContext({});
+var LocalizationProvider = function LocalizationProvider2(props) {
+  var _a, _b, _c;
+  const { localeText: propsLocaleText, children } = props;
+  const theme = useTheme();
+  const themeLocaleText = (_c = (_b = (_a = theme == null ? void 0 : theme.components) == null ? void 0 : _a.MuiLocalizationProvider) == null ? void 0 : _b.defaultProps) == null ? void 0 : _c.localeText;
+  const defaultLocaleText3 = en_default.components.MuiLocalizationProvider.defaultProps.localeText;
+  const localeText = React3.useMemo(
+    () => __spreadValues(__spreadValues(__spreadValues({}, defaultLocaleText3), themeLocaleText), propsLocaleText),
+    [defaultLocaleText3, themeLocaleText, propsLocaleText]
+  );
+  return /* @__PURE__ */ jsx(LocalizationContext.Provider, { value: localeText, children });
+};
+LocalizationProvider.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * Locale for components texts
+   */
+  localeText: PropTypes.object
+};
+function useLocaleText() {
+  return React3.useContext(LocalizationContext);
+}
+
+// src/toolpad-core/useNotifications/NotificationsProvider.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var RootPropsContext = React4.createContext(null);
+var defaultLocaleText = {
+  close: "Close"
+};
+function Notification({ notificationKey, open, message, options, badge }) {
+  var _a, _b, _c;
+  const globalLocaleText = useLocaleText();
+  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText), globalLocaleText);
+  const { close } = useNonNullableContext(NotificationsContext);
+  const { severity, actionText, onAction, autoHideDuration } = options;
+  const handleClose = React4.useCallback(
+    (event, reason) => {
+      if (reason === "clickaway") {
+        return;
+      }
+      close(notificationKey);
+    },
+    [notificationKey, close]
+  );
+  const action = /* @__PURE__ */ jsxs(React4.Fragment, { children: [
+    onAction ? /* @__PURE__ */ jsx2(Button, { color: "inherit", size: "small", onClick: onAction, children: actionText != null ? actionText : "Action" }) : null,
+    /* @__PURE__ */ jsx2(
+      IconButton,
+      {
+        size: "small",
+        "aria-label": localeText == null ? void 0 : localeText.close,
+        title: localeText == null ? void 0 : localeText.close,
+        color: "inherit",
+        onClick: handleClose,
+        children: /* @__PURE__ */ jsx2(CloseIcon, { fontSize: "small" })
+      }
+    )
+  ] });
+  const props = React4.useContext(RootPropsContext);
+  const SnackbarComponent = (_b = (_a = props == null ? void 0 : props.slots) == null ? void 0 : _a.snackbar) != null ? _b : Snackbar;
+  const snackbarSlotProps = useSlotProps({
+    elementType: SnackbarComponent,
+    ownerState: props,
+    externalSlotProps: (_c = props == null ? void 0 : props.slotProps) == null ? void 0 : _c.snackbar,
+    additionalProps: {
+      open,
+      autoHideDuration,
+      onClose: handleClose,
+      action
+    }
+  });
+  return /* @__PURE__ */ jsx2(SnackbarComponent, __spreadProps(__spreadValues({}, snackbarSlotProps), { children: /* @__PURE__ */ jsx2(Badge, { badgeContent: badge, color: "primary", sx: { width: "100%" }, children: severity ? /* @__PURE__ */ jsx2(Alert, { severity, sx: { width: "100%" }, action, children: message }) : /* @__PURE__ */ jsx2(SnackbarContent, { message, action }) }) }), notificationKey);
+}
+function Notifications({ state }) {
+  var _a;
+  const currentNotification = (_a = state.queue[0]) != null ? _a : null;
+  return currentNotification ? /* @__PURE__ */ jsx2(
+    Notification,
+    __spreadProps(__spreadValues({}, currentNotification), {
+      badge: state.queue.length > 1 ? String(state.queue.length) : null
+    })
+  ) : null;
+}
+var nextId = 0;
+var generateId = () => {
+  const id = nextId;
+  nextId += 1;
+  return id;
+};
+function NotificationsProvider(props) {
+  const { children } = props;
+  const [state, setState] = React4.useState({ queue: [] });
+  const show = React4.useCallback((message, options = {}) => {
+    var _a;
+    const notificationKey = (_a = options.key) != null ? _a : `::toolpad-internal::notification::${generateId()}`;
+    setState((prev) => {
+      if (prev.queue.some((n) => n.notificationKey === notificationKey)) {
+        return prev;
+      }
+      return __spreadProps(__spreadValues({}, prev), {
+        queue: [...prev.queue, { message, options, notificationKey, open: true }]
+      });
+    });
+    return notificationKey;
+  }, []);
+  const close = React4.useCallback((key) => {
+    setState((prev) => __spreadProps(__spreadValues({}, prev), {
+      queue: prev.queue.filter((n) => n.notificationKey !== key)
+    }));
+  }, []);
+  const contextValue = React4.useMemo(() => ({ show, close }), [show, close]);
+  return /* @__PURE__ */ jsx2(RootPropsContext.Provider, { value: props, children: /* @__PURE__ */ jsxs(NotificationsContext.Provider, { value: contextValue, children: [
+    children,
+    /* @__PURE__ */ jsx2(Notifications, { state })
+  ] }) });
+}
+
 // src/toolpad-core/useDialogs/useDialogs.tsx
-import Button from "@mui/material/Button";
+import Button2 from "@mui/material/Button";
 import Dialog from "@mui/material/Dialog";
 import DialogTitle from "@mui/material/DialogTitle";
 import DialogContent from "@mui/material/DialogContent";
@@ -60,17 +264,37 @@ import DialogActions from "@mui/material/DialogActions";
 import TextField from "@mui/material/TextField";
 import DialogContentText from "@mui/material/DialogContentText";
 import invariant from "invariant";
-import * as React2 from "react";
+import * as React7 from "react";
 import useEventCallback from "@mui/utils/useEventCallback";
-import { jsx, jsxs } from "react/jsx-runtime";
-var defaultLocaleText = {
+
+// src/toolpad-core/useDialogs/DialogsContext.tsx
+import * as React5 from "react";
+var DialogsContext = React5.createContext(null);
+
+// src/toolpad-core/shared/context.ts
+import * as React6 from "react";
+var BrandingContext = React6.createContext(null);
+var NavigationContext = React6.createContext([]);
+var PaletteModeContext = React6.createContext({
+  paletteMode: "light",
+  setPaletteMode: () => {
+  },
+  isDualTheme: false
+});
+var RouterContext = React6.createContext(null);
+var DashboardSidebarPageItemContext = React6.createContext(null);
+var WindowContext = React6.createContext(void 0);
+
+// src/toolpad-core/useDialogs/useDialogs.tsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var defaultLocaleText2 = {
   alert: "Alert",
   confirm: "Confirm",
   cancel: "Cancel",
   ok: "Ok"
 };
 function useDialogLoadingButton(onClose) {
-  const [loading, setLoading] = React2.useState(false);
+  const [loading, setLoading] = React7.useState(false);
   const handleClick = async () => {
     try {
       setLoading(true);
@@ -86,11 +310,11 @@ function useDialogLoadingButton(onClose) {
 }
 function AlertDialog({ open, payload, onClose }) {
   var _a, _b;
-  const appWindowContext = React2.useContext(WindowContext);
+  const appWindowContext = React7.useContext(WindowContext);
   const globalLocaleText = useLocaleText();
-  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText), globalLocaleText);
+  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText2), globalLocaleText);
   const okButtonProps = useDialogLoadingButton(() => onClose());
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs2(
     Dialog,
     {
       maxWidth: "xs",
@@ -99,21 +323,21 @@ function AlertDialog({ open, payload, onClose }) {
       onClose: () => onClose(),
       container: appWindowContext == null ? void 0 : appWindowContext.document.body,
       children: [
-        /* @__PURE__ */ jsx(DialogTitle, { children: (_a = payload.title) != null ? _a : localeText.alert }),
-        /* @__PURE__ */ jsx(DialogContent, { children: payload.msg }),
-        /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ disabled: !open }, okButtonProps), { children: (_b = payload.okText) != null ? _b : localeText.ok })) })
+        /* @__PURE__ */ jsx3(DialogTitle, { children: (_a = payload.title) != null ? _a : localeText.alert }),
+        /* @__PURE__ */ jsx3(DialogContent, { children: payload.msg }),
+        /* @__PURE__ */ jsx3(DialogActions, { children: /* @__PURE__ */ jsx3(Button2, __spreadProps(__spreadValues({ disabled: !open }, okButtonProps), { children: (_b = payload.okText) != null ? _b : localeText.ok })) })
       ]
     }
   );
 }
 function ConfirmDialog({ open, payload, onClose }) {
   var _a, _b, _c;
-  const appWindowContext = React2.useContext(WindowContext);
+  const appWindowContext = React7.useContext(WindowContext);
   const globalLocaleText = useLocaleText();
-  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText), globalLocaleText);
+  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText2), globalLocaleText);
   const cancelButtonProps = useDialogLoadingButton(() => onClose(false));
   const okButtonProps = useDialogLoadingButton(() => onClose(true));
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs2(
     Dialog,
     {
       maxWidth: "xs",
@@ -122,11 +346,11 @@ function ConfirmDialog({ open, payload, onClose }) {
       onClose: () => onClose(false),
       container: appWindowContext == null ? void 0 : appWindowContext.document.body,
       children: [
-        /* @__PURE__ */ jsx(DialogTitle, { children: (_a = payload.title) != null ? _a : localeText.confirm }),
-        /* @__PURE__ */ jsx(DialogContent, { children: payload.msg }),
-        /* @__PURE__ */ jsxs(DialogActions, { children: [
-          /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ autoFocus: true, disabled: !open }, cancelButtonProps), { children: (_b = payload.cancelText) != null ? _b : localeText.cancel })),
-          /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ color: payload.severity, disabled: !open }, okButtonProps), { children: (_c = payload.okText) != null ? _c : localeText.ok }))
+        /* @__PURE__ */ jsx3(DialogTitle, { children: (_a = payload.title) != null ? _a : localeText.confirm }),
+        /* @__PURE__ */ jsx3(DialogContent, { children: payload.msg }),
+        /* @__PURE__ */ jsxs2(DialogActions, { children: [
+          /* @__PURE__ */ jsx3(Button2, __spreadProps(__spreadValues({ autoFocus: true, disabled: !open }, cancelButtonProps), { children: (_b = payload.cancelText) != null ? _b : localeText.cancel })),
+          /* @__PURE__ */ jsx3(Button2, __spreadProps(__spreadValues({ color: payload.severity, disabled: !open }, okButtonProps), { children: (_c = payload.okText) != null ? _c : localeText.ok }))
         ] })
       ]
     }
@@ -134,14 +358,14 @@ function ConfirmDialog({ open, payload, onClose }) {
 }
 function PromptDialog({ open, payload, onClose }) {
   var _a, _b, _c;
-  const appWindowContext = React2.useContext(WindowContext);
+  const appWindowContext = React7.useContext(WindowContext);
   const globalLocaleText = useLocaleText();
-  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText), globalLocaleText);
-  const [input, setInput] = React2.useState("");
+  const localeText = __spreadValues(__spreadValues({}, defaultLocaleText2), globalLocaleText);
+  const [input, setInput] = React7.useState("");
   const cancelButtonProps = useDialogLoadingButton(() => onClose(null));
-  const [loading, setLoading] = React2.useState(false);
+  const [loading, setLoading] = React7.useState(false);
   const name = "input";
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs2(
     Dialog,
     {
       maxWidth: "xs",
@@ -166,13 +390,13 @@ function PromptDialog({ open, payload, onClose }) {
       },
       container: appWindowContext == null ? void 0 : appWindowContext.document.body,
       children: [
-        /* @__PURE__ */ jsx(DialogTitle, { children: (_a = payload.title) != null ? _a : localeText.confirm }),
-        /* @__PURE__ */ jsxs(DialogContent, { children: [
-          /* @__PURE__ */ jsxs(DialogContentText, { children: [
+        /* @__PURE__ */ jsx3(DialogTitle, { children: (_a = payload.title) != null ? _a : localeText.confirm }),
+        /* @__PURE__ */ jsxs2(DialogContent, { children: [
+          /* @__PURE__ */ jsxs2(DialogContentText, { children: [
             payload.msg,
             " "
           ] }),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx3(
             TextField,
             {
               autoFocus: true,
@@ -188,9 +412,9 @@ function PromptDialog({ open, payload, onClose }) {
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs(DialogActions, { children: [
-          /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ disabled: !open }, cancelButtonProps), { children: (_b = payload.cancelText) != null ? _b : localeText.cancel })),
-          /* @__PURE__ */ jsx(Button, { disabled: !open, loading, type: "submit", children: (_c = payload.okText) != null ? _c : localeText.ok })
+        /* @__PURE__ */ jsxs2(DialogActions, { children: [
+          /* @__PURE__ */ jsx3(Button2, __spreadProps(__spreadValues({ disabled: !open }, cancelButtonProps), { children: (_b = payload.cancelText) != null ? _b : localeText.cancel })),
+          /* @__PURE__ */ jsx3(Button2, { disabled: !open, loading, type: "submit", children: (_c = payload.okText) != null ? _c : localeText.ok })
         ] })
       ]
     }
@@ -216,7 +440,7 @@ function useDialogs() {
       return open(PromptDialog, __spreadProps(__spreadValues({}, options), { msg }), { onClose });
     }
   );
-  return React2.useMemo(
+  return React7.useMemo(
     () => ({
       alert,
       confirm,
@@ -228,19 +452,467 @@ function useDialogs() {
   );
 }
 
+// src/toolpad-core/useDialogs/DialogsProvider.tsx
+import invariant2 from "invariant";
+import * as React8 from "react";
+import useEventCallback2 from "@mui/utils/useEventCallback";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function DialogsProvider(props) {
+  const { children, unmountAfter = 1e3 } = props;
+  const [stack, setStack] = React8.useState([]);
+  const keyPrefix = React8.useId();
+  const nextId2 = React8.useRef(0);
+  const dialogMetadata = React8.useRef(/* @__PURE__ */ new WeakMap());
+  const requestDialog = useEventCallback2(function open(Component, payload, options = {}) {
+    const { onClose = async () => {
+    } } = options;
+    let resolve;
+    const promise = new Promise((resolveImpl) => {
+      resolve = resolveImpl;
+    });
+    invariant2(resolve, "resolve not set");
+    const key = `${keyPrefix}-${nextId2.current}`;
+    nextId2.current += 1;
+    const newEntry = {
+      key,
+      open: true,
+      promise,
+      Component,
+      payload,
+      onClose,
+      resolve
+    };
+    dialogMetadata.current.set(promise, newEntry);
+    setStack((prevStack) => [...prevStack, newEntry]);
+    return promise;
+  });
+  const closeDialogUi = useEventCallback2(function closeDialogUi2(dialog) {
+    setStack(
+      (prevStack) => prevStack.map((entry) => entry.promise === dialog ? __spreadProps(__spreadValues({}, entry), { open: false }) : entry)
+    );
+    setTimeout(() => {
+      setStack((prevStack) => prevStack.filter((entry) => entry.promise !== dialog));
+    }, unmountAfter);
+  });
+  const closeDialog = useEventCallback2(async function closeDialog2(dialog, result) {
+    const entryToClose = dialogMetadata.current.get(dialog);
+    invariant2(entryToClose, "dialog not found");
+    try {
+      await entryToClose.onClose(result);
+    } finally {
+      entryToClose.resolve(result);
+      closeDialogUi(dialog);
+    }
+    return dialog;
+  });
+  const contextValue = React8.useMemo(
+    () => ({ open: requestDialog, close: closeDialog }),
+    [requestDialog, closeDialog]
+  );
+  return /* @__PURE__ */ jsxs3(DialogsContext.Provider, { value: contextValue, children: [
+    children,
+    stack.map(({ key, open, Component, payload, promise }) => /* @__PURE__ */ jsx4(
+      Component,
+      {
+        payload,
+        open,
+        onClose: async (result) => {
+          await closeDialog(promise, result);
+        }
+      },
+      key
+    ))
+  ] });
+}
+
+// src/toolpad-core/AppProvider/AppThemeProvider.tsx
+import * as React10 from "react";
+import { useMediaQuery } from "@mui/material";
+import { ThemeProvider, useColorScheme } from "@mui/material/styles";
+import InitColorSchemeScript from "@mui/material/InitColorSchemeScript";
+import CssBaseline from "@mui/material/CssBaseline";
+import invariant3 from "invariant";
+
+// src/toolpad-core/persistence/useStorageState.tsx
+import * as React9 from "react";
+
+// src/toolpad-core/persistence/codec.tsx
+var CODEC_STRING = {
+  parse: (value) => value,
+  stringify: (value) => value
+};
+
+// src/toolpad-core/persistence/useStorageState.tsx
+var currentTabChangeListeners = /* @__PURE__ */ new Map();
+function onCurrentTabStorageChange(key, handler) {
+  let listeners = currentTabChangeListeners.get(key);
+  if (!listeners) {
+    listeners = /* @__PURE__ */ new Set();
+    currentTabChangeListeners.set(key, listeners);
+  }
+  listeners.add(handler);
+}
+function offCurrentTabStorageChange(key, handler) {
+  const listeners = currentTabChangeListeners.get(key);
+  if (!listeners) {
+    return;
+  }
+  listeners.delete(handler);
+  if (listeners.size === 0) {
+    currentTabChangeListeners.delete(key);
+  }
+}
+function emitCurrentTabStorageChange(key) {
+  const listeners = currentTabChangeListeners.get(key);
+  if (listeners) {
+    listeners.forEach((listener) => listener());
+  }
+}
+if (typeof window !== "undefined") {
+  const origSetItem = window.localStorage.setItem;
+  window.localStorage.setItem = function setItem(key, value) {
+    const result = origSetItem.call(this, key, value);
+    emitCurrentTabStorageChange(key);
+    return result;
+  };
+}
+function subscribe(area, key, callback) {
+  if (!key) {
+    return () => {
+    };
+  }
+  const storageHandler = (event) => {
+    if (event.storageArea === area && event.key === key) {
+      callback();
+    }
+  };
+  window.addEventListener("storage", storageHandler);
+  onCurrentTabStorageChange(key, callback);
+  return () => {
+    window.removeEventListener("storage", storageHandler);
+    offCurrentTabStorageChange(key, callback);
+  };
+}
+function getSnapshot(area, key) {
+  if (!key) {
+    return null;
+  }
+  try {
+    return area.getItem(key);
+  } catch (e) {
+    return null;
+  }
+}
+function setValue(area, key, value) {
+  if (!key) {
+    return;
+  }
+  try {
+    if (value === null) {
+      area.removeItem(key);
+    } else {
+      area.setItem(key, String(value));
+    }
+  } catch (e) {
+    return;
+  }
+  emitCurrentTabStorageChange(key);
+}
+var serverValue = [null, () => {
+}];
+function useStorageStateServer() {
+  return serverValue;
+}
+function encode(codec, value) {
+  return value === null ? null : codec.stringify(value);
+}
+function decode(codec, value) {
+  return value === null ? null : codec.parse(value);
+}
+var getKeyServerSnapshot = () => null;
+function useStorageState(area, key, initializer = null, options) {
+  var _a;
+  const codec = (_a = options == null ? void 0 : options.codec) != null ? _a : CODEC_STRING;
+  const [initialValue] = React9.useState(initializer);
+  const encodedInitialValue = React9.useMemo(
+    () => encode(codec, initialValue),
+    [codec, initialValue]
+  );
+  const subscribeKey = React9.useCallback(
+    (callback) => subscribe(area, key, callback),
+    [area, key]
+  );
+  const getKeySnapshot = React9.useCallback(
+    () => {
+      var _a2;
+      return (_a2 = getSnapshot(area, key)) != null ? _a2 : encodedInitialValue;
+    },
+    [area, encodedInitialValue, key]
+  );
+  const encodedStoredValue = React9.useSyncExternalStore(
+    subscribeKey,
+    getKeySnapshot,
+    getKeyServerSnapshot
+  );
+  const storedValue = React9.useMemo(
+    () => decode(codec, encodedStoredValue),
+    [codec, encodedStoredValue]
+  );
+  const setStoredValue = React9.useCallback(
+    (value) => {
+      const valueToStore = value instanceof Function ? value(storedValue) : value;
+      const encodedValueToStore = encode(codec, valueToStore);
+      setValue(area, key, encodedValueToStore);
+    },
+    [area, codec, storedValue, key]
+  );
+  const [nonStoredValue, setNonStoredValue] = React9.useState(initialValue);
+  if (!key) {
+    return [nonStoredValue, setNonStoredValue];
+  }
+  return [storedValue, setStoredValue];
+}
+
+// src/toolpad-core/useLocalStorageState/useLocalStorageState.tsx
+var useLocalStorageStateBrowser = (...args) => useStorageState(window.localStorage, ...args);
+var useLocalStorageState = typeof window === "undefined" ? useStorageStateServer : useLocalStorageStateBrowser;
+
+// src/toolpad-core/AppProvider/AppThemeProvider.tsx
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var COLOR_SCHEME_STORAGE_KEY = "toolpad-color-scheme";
+var MODE_STORAGE_KEY = "toolpad-mode";
+function usePreferredMode(window2) {
+  const prefersDarkMode = useMediaQuery(
+    "(prefers-color-scheme: dark)",
+    window2 && {
+      matchMedia: window2.matchMedia
+    }
+  );
+  return prefersDarkMode ? "dark" : "light";
+}
+function isCssVarsTheme(theme) {
+  return "vars" in theme;
+}
+function LegacyThemeProvider(props) {
+  const { children, theme, window: appWindow } = props;
+  invariant3(!isCssVarsTheme(theme), "This provider only accepts legacy themes.");
+  const isDualTheme = "light" in theme || "dark" in theme;
+  const preferredMode = usePreferredMode(appWindow);
+  const [userMode, setUserMode] = useLocalStorageState(MODE_STORAGE_KEY, "system");
+  const paletteMode = !userMode || userMode === "system" ? preferredMode : userMode;
+  const dualAwareTheme = React10.useMemo(
+    () => {
+      var _a;
+      return isDualTheme ? (_a = theme[paletteMode === "dark" ? "dark" : "light"]) != null ? _a : theme[paletteMode === "dark" ? "light" : "dark"] : theme;
+    },
+    [isDualTheme, paletteMode, theme]
+  );
+  const paletteModeContextValue = React10.useMemo(
+    () => ({
+      paletteMode,
+      setPaletteMode: setUserMode,
+      isDualTheme
+    }),
+    [isDualTheme, paletteMode, setUserMode]
+  );
+  return /* @__PURE__ */ jsx5(ThemeProvider, { theme: dualAwareTheme, children: /* @__PURE__ */ jsxs4(PaletteModeContext.Provider, { value: paletteModeContextValue, children: [
+    /* @__PURE__ */ jsx5(CssBaseline, { enableColorScheme: true }),
+    children
+  ] }) });
+}
+function CssVarsPaletteModeProvider(props) {
+  const { children, window: appWindow } = props;
+  const preferredMode = usePreferredMode(appWindow);
+  const { mode, setMode, allColorSchemes } = useColorScheme();
+  const paletteModeContextValue = React10.useMemo(() => {
+    return {
+      paletteMode: !mode || mode === "system" ? preferredMode : mode,
+      setPaletteMode: setMode,
+      isDualTheme: allColorSchemes.length > 1
+    };
+  }, [allColorSchemes, mode, preferredMode, setMode]);
+  return /* @__PURE__ */ jsx5(PaletteModeContext.Provider, { value: paletteModeContextValue, children });
+}
+function CssVarsThemeProvider(props) {
+  const { children, theme, window: appWindow, nonce } = props;
+  invariant3(isCssVarsTheme(theme), "This provider only accepts CSS vars themes.");
+  return /* @__PURE__ */ jsxs4(
+    ThemeProvider,
+    {
+      theme,
+      documentNode: appWindow == null ? void 0 : appWindow.document,
+      colorSchemeNode: appWindow == null ? void 0 : appWindow.document.documentElement,
+      disableNestedContext: true,
+      colorSchemeStorageKey: COLOR_SCHEME_STORAGE_KEY,
+      modeStorageKey: MODE_STORAGE_KEY,
+      children: [
+        /* @__PURE__ */ jsx5(
+          InitColorSchemeScript,
+          {
+            attribute: theme.colorSchemeSelector,
+            colorSchemeStorageKey: COLOR_SCHEME_STORAGE_KEY,
+            modeStorageKey: MODE_STORAGE_KEY,
+            nonce
+          }
+        ),
+        /* @__PURE__ */ jsxs4(CssVarsPaletteModeProvider, { window: appWindow, children: [
+          /* @__PURE__ */ jsx5(CssBaseline, { enableColorScheme: true }),
+          children
+        ] })
+      ]
+    }
+  );
+}
+function AppThemeProvider(props) {
+  const _a = props, { children, theme } = _a, rest = __objRest(_a, ["children", "theme"]);
+  const useCssVarsProvider = isCssVarsTheme(theme);
+  return useCssVarsProvider ? /* @__PURE__ */ jsx5(CssVarsThemeProvider, __spreadProps(__spreadValues({ theme }, rest), { children })) : /* @__PURE__ */ jsx5(LegacyThemeProvider, __spreadProps(__spreadValues({ theme }, rest), { children }));
+}
+
+// src/toolpad-core/AppProvider/AppProvider.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var AuthenticationContext = React11.createContext(null);
+var SessionContext = React11.createContext(null);
+function createDefaultTheme() {
+  return createTheme({
+    cssVariables: {
+      colorSchemeSelector: "data-toolpad-color-scheme"
+    },
+    colorSchemes: { dark: true }
+  });
+}
+function AppProvider(props) {
+  const {
+    children,
+    theme = createDefaultTheme(),
+    branding = null,
+    navigation = [],
+    localeText,
+    router = null,
+    authentication = null,
+    session = null,
+    window: appWindow,
+    nonce
+  } = props;
+  return /* @__PURE__ */ jsx6(WindowContext.Provider, { value: appWindow, children: /* @__PURE__ */ jsx6(AuthenticationContext.Provider, { value: authentication, children: /* @__PURE__ */ jsx6(SessionContext.Provider, { value: session, children: /* @__PURE__ */ jsx6(RouterContext.Provider, { value: router, children: /* @__PURE__ */ jsx6(AppThemeProvider, { theme, window: appWindow, nonce, children: /* @__PURE__ */ jsx6(LocalizationProvider, { localeText, children: /* @__PURE__ */ jsx6(NotificationsProvider, { children: /* @__PURE__ */ jsx6(DialogsProvider, { children: /* @__PURE__ */ jsx6(BrandingContext.Provider, { value: branding, children: /* @__PURE__ */ jsx6(NavigationContext.Provider, { value: navigation, children }) }) }) }) }) }) }) }) }) });
+}
+AppProvider.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Authentication methods.
+   * @default null
+   */
+  authentication: PropTypes2.shape({
+    signIn: PropTypes2.func.isRequired,
+    signOut: PropTypes2.func.isRequired
+  }),
+  /**
+   * Branding options for the app.
+   * @default null
+   */
+  branding: PropTypes2.shape({
+    homeUrl: PropTypes2.string,
+    logo: PropTypes2.node,
+    title: PropTypes2.string
+  }),
+  /**
+   * The content of the app provider.
+   */
+  children: PropTypes2.node,
+  /**
+   * Locale text for components
+   */
+  localeText: PropTypes2.object,
+  /**
+   * Navigation definition for the app. [Find out more](https://mui.com/toolpad/core/react-app-provider/#navigation).
+   * @default []
+   */
+  navigation: PropTypes2.arrayOf(
+    PropTypes2.oneOfType([
+      PropTypes2.shape({
+        action: PropTypes2.node,
+        children: PropTypes2.arrayOf(
+          PropTypes2.oneOfType([
+            PropTypes2.object,
+            PropTypes2.shape({
+              kind: PropTypes2.oneOf(["header"]).isRequired,
+              title: PropTypes2.string.isRequired
+            }),
+            PropTypes2.shape({
+              kind: PropTypes2.oneOf(["divider"]).isRequired
+            })
+          ]).isRequired
+        ),
+        icon: PropTypes2.node,
+        kind: PropTypes2.oneOf(["page"]),
+        pattern: PropTypes2.string,
+        segment: PropTypes2.string,
+        title: PropTypes2.string
+      }),
+      PropTypes2.shape({
+        kind: PropTypes2.oneOf(["header"]).isRequired,
+        title: PropTypes2.string.isRequired
+      }),
+      PropTypes2.shape({
+        kind: PropTypes2.oneOf(["divider"]).isRequired
+      })
+    ]).isRequired
+  ),
+  /**
+   * The nonce to be used for inline scripts.
+   */
+  nonce: PropTypes2.string,
+  /**
+   * Router implementation used inside Toolpad components.
+   * @default null
+   */
+  router: PropTypes2.shape({
+    Link: PropTypes2.elementType,
+    navigate: PropTypes2.func.isRequired,
+    pathname: PropTypes2.string.isRequired,
+    searchParams: PropTypes2.instanceOf(URLSearchParams).isRequired
+  }),
+  /**
+   * Session info about the current user.
+   * @default null
+   */
+  session: PropTypes2.shape({
+    user: PropTypes2.shape({
+      email: PropTypes2.string,
+      id: PropTypes2.string,
+      image: PropTypes2.string,
+      name: PropTypes2.string
+    })
+  }),
+  /**
+   * [Theme or themes](https://mui.com/toolpad/core/react-app-provider/#theming) to be used by the app in light/dark mode. A [CSS variables theme](https://mui.com/material-ui/customization/css-theme-variables/overview/) is recommended.
+   * @default createDefaultTheme()
+   */
+  theme: PropTypes2.object,
+  /**
+   * The window where the application is rendered.
+   * This is needed when rendering the app inside an iframe, for example.
+   * @default window
+   */
+  window: PropTypes2.object
+};
+
 // src/toolpad-core/Account/AccountLocaleContext.tsx
-import * as React3 from "react";
-var AccountLocaleContext = React3.createContext(null);
+import * as React12 from "react";
+var AccountLocaleContext = React12.createContext(null);
 
 // src/toolpad-core/Account/SignInButton.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
 function SignInButton(props) {
-  const authentication = React4.useContext(AuthenticationContext);
+  const authentication = React13.useContext(AuthenticationContext);
   const globalLocaleText = useLocaleText();
-  const accountLocaleText = React4.useContext(AccountLocaleContext);
+  const accountLocaleText = React13.useContext(AccountLocaleContext);
   const localeText = __spreadValues(__spreadValues({}, globalLocaleText), accountLocaleText);
-  return /* @__PURE__ */ jsx2(
-    Button2,
+  return /* @__PURE__ */ jsx7(
+    Button3,
     __spreadProps(__spreadValues({
       disableElevation: true,
       variant: "contained",
@@ -269,22 +941,22 @@ SignInButton.propTypes = {
   /**
    * The content of the component.
    */
-  children: PropTypes.node
+  children: PropTypes3.node
 };
 
 // src/toolpad-core/Account/SignOutButton.tsx
-import * as React5 from "react";
-import PropTypes2 from "prop-types";
-import Button3 from "@mui/material/Button";
+import * as React14 from "react";
+import PropTypes4 from "prop-types";
+import Button4 from "@mui/material/Button";
 import LogoutIcon from "@mui/icons-material/Logout";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 function SignOutButton(props) {
-  const authentication = React5.useContext(AuthenticationContext);
+  const authentication = React14.useContext(AuthenticationContext);
   const globalLocaleText = useLocaleText();
-  const accountLocaleText = React5.useContext(AccountLocaleContext);
+  const accountLocaleText = React14.useContext(AccountLocaleContext);
   const localeText = __spreadValues(__spreadValues({}, globalLocaleText), accountLocaleText);
-  return /* @__PURE__ */ jsx3(
-    Button3,
+  return /* @__PURE__ */ jsx8(
+    Button4,
     __spreadProps(__spreadValues({
       disabled: !authentication,
       variant: "outlined",
@@ -300,7 +972,7 @@ function SignOutButton(props) {
           filter: "opacity(1)"
         }
       },
-      startIcon: /* @__PURE__ */ jsx3(LogoutIcon, {})
+      startIcon: /* @__PURE__ */ jsx8(LogoutIcon, {})
     }, props), {
       children: localeText == null ? void 0 : localeText.accountSignOutLabel
     })
@@ -314,30 +986,30 @@ SignOutButton.propTypes = {
   /**
    * The content of the component.
    */
-  children: PropTypes2.node
+  children: PropTypes4.node
 };
 
 // src/toolpad-core/Account/AccountPreview.tsx
-import * as React6 from "react";
-import PropTypes3 from "prop-types";
+import * as React15 from "react";
+import PropTypes5 from "prop-types";
 import Avatar from "@mui/material/Avatar";
 import Typography from "@mui/material/Typography";
 import Tooltip from "@mui/material/Tooltip";
 import Stack from "@mui/material/Stack";
-import IconButton from "@mui/material/IconButton";
+import IconButton2 from "@mui/material/IconButton";
 import MoreVertIcon from "@mui/icons-material/MoreVert";
-import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
 function AccountPreview(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h;
   const { slots, variant = "condensed", slotProps, open, handleClick, sx } = props;
-  const session = React6.useContext(SessionContext);
+  const session = React15.useContext(SessionContext);
   const globalLocaleText = useLocaleText();
-  const accountLocaleText = React6.useContext(AccountLocaleContext);
+  const accountLocaleText = React15.useContext(AccountLocaleContext);
   const localeText = __spreadValues(__spreadValues({}, globalLocaleText), accountLocaleText);
   if (!session || !session.user) {
     return null;
   }
-  const avatarContent = (slots == null ? void 0 : slots.avatar) ? /* @__PURE__ */ jsx4(slots.avatar, {}) : /* @__PURE__ */ jsx4(
+  const avatarContent = (slots == null ? void 0 : slots.avatar) ? /* @__PURE__ */ jsx9(slots.avatar, {}) : /* @__PURE__ */ jsx9(
     Avatar,
     __spreadValues({
       src: ((_a = session.user) == null ? void 0 : _a.image) || "",
@@ -346,28 +1018,28 @@ function AccountPreview(props) {
     }, slotProps == null ? void 0 : slotProps.avatar)
   );
   if (variant === "expanded") {
-    return /* @__PURE__ */ jsxs2(Stack, { direction: "row", justifyContent: "space-between", sx: __spreadValues({ py: 1, px: 2, gap: 2 }, sx), children: [
-      /* @__PURE__ */ jsxs2(Stack, { direction: "row", justifyContent: "flex-start", spacing: 2, overflow: "hidden", children: [
+    return /* @__PURE__ */ jsxs5(Stack, { direction: "row", justifyContent: "space-between", sx: __spreadValues({ py: 1, px: 2, gap: 2 }, sx), children: [
+      /* @__PURE__ */ jsxs5(Stack, { direction: "row", justifyContent: "flex-start", spacing: 2, overflow: "hidden", children: [
         avatarContent,
-        /* @__PURE__ */ jsxs2(Stack, { direction: "column", justifyContent: "space-evenly", overflow: "hidden", children: [
-          /* @__PURE__ */ jsx4(Typography, { variant: "body2", fontWeight: "bolder", noWrap: true, children: (_d = session.user) == null ? void 0 : _d.name }),
-          /* @__PURE__ */ jsx4(Typography, { variant: "caption", noWrap: true, children: (_e = session.user) == null ? void 0 : _e.email })
+        /* @__PURE__ */ jsxs5(Stack, { direction: "column", justifyContent: "space-evenly", overflow: "hidden", children: [
+          /* @__PURE__ */ jsx9(Typography, { variant: "body2", fontWeight: "bolder", noWrap: true, children: (_d = session.user) == null ? void 0 : _d.name }),
+          /* @__PURE__ */ jsx9(Typography, { variant: "caption", noWrap: true, children: (_e = session.user) == null ? void 0 : _e.email })
         ] })
       ] }),
-      handleClick && ((slots == null ? void 0 : slots.moreIconButton) ? /* @__PURE__ */ jsx4(slots.moreIconButton, {}) : /* @__PURE__ */ jsx4(
-        IconButton,
+      handleClick && ((slots == null ? void 0 : slots.moreIconButton) ? /* @__PURE__ */ jsx9(slots.moreIconButton, {}) : /* @__PURE__ */ jsx9(
+        IconButton2,
         __spreadProps(__spreadValues({
           size: "small",
           onClick: handleClick
         }, slotProps == null ? void 0 : slotProps.moreIconButton), {
           sx: __spreadValues({ alignSelf: "center" }, (_f = slotProps == null ? void 0 : slotProps.moreIconButton) == null ? void 0 : _f.sx),
-          children: /* @__PURE__ */ jsx4(MoreVertIcon, { fontSize: "small" })
+          children: /* @__PURE__ */ jsx9(MoreVertIcon, { fontSize: "small" })
         })
       ))
     ] });
   }
-  return /* @__PURE__ */ jsx4(Tooltip, { title: (_g = session.user.name) != null ? _g : accountLocaleText == null ? void 0 : accountLocaleText.accountPreviewTitle, children: (slots == null ? void 0 : slots.avatarIconButton) ? /* @__PURE__ */ jsx4(slots.avatarIconButton, __spreadValues({}, slotProps == null ? void 0 : slotProps.avatarIconButton)) : /* @__PURE__ */ jsx4(Stack, { sx: __spreadValues({ py: 0.5 }, sx), children: /* @__PURE__ */ jsx4(
-    IconButton,
+  return /* @__PURE__ */ jsx9(Tooltip, { title: (_g = session.user.name) != null ? _g : accountLocaleText == null ? void 0 : accountLocaleText.accountPreviewTitle, children: (slots == null ? void 0 : slots.avatarIconButton) ? /* @__PURE__ */ jsx9(slots.avatarIconButton, __spreadValues({}, slotProps == null ? void 0 : slotProps.avatarIconButton)) : /* @__PURE__ */ jsx9(Stack, { sx: __spreadValues({ py: 0.5 }, sx), children: /* @__PURE__ */ jsx9(
+    IconButton2,
     __spreadProps(__spreadValues({
       onClick: handleClick,
       "aria-label": localeText == null ? void 0 : localeText.accountPreviewIconButtonLabel,
@@ -389,35 +1061,35 @@ AccountPreview.propTypes = {
   /**
    * The handler used when the preview is expanded
    */
-  handleClick: PropTypes3.func,
+  handleClick: PropTypes5.func,
   /**
    * The state of the Account popover
    * @default false
    */
-  open: PropTypes3.bool,
+  open: PropTypes5.bool,
   /**
    * The props used for each slot inside.
    */
-  slotProps: PropTypes3.shape({
-    avatar: PropTypes3.object,
-    avatarIconButton: PropTypes3.object,
-    moreIconButton: PropTypes3.object
+  slotProps: PropTypes5.shape({
+    avatar: PropTypes5.object,
+    avatarIconButton: PropTypes5.object,
+    moreIconButton: PropTypes5.object
   }),
   /**
    * The components used for each slot inside.
    */
-  slots: PropTypes3.shape({
-    avatar: PropTypes3.elementType,
-    avatarIconButton: PropTypes3.elementType,
-    moreIconButton: PropTypes3.elementType
+  slots: PropTypes5.shape({
+    avatar: PropTypes5.elementType,
+    avatarIconButton: PropTypes5.elementType,
+    moreIconButton: PropTypes5.elementType
   }),
   /**
    * The prop used to customize the styling of the preview
    */
-  sx: PropTypes3.oneOfType([
-    PropTypes3.arrayOf(PropTypes3.oneOfType([PropTypes3.func, PropTypes3.object, PropTypes3.bool])),
-    PropTypes3.func,
-    PropTypes3.object
+  sx: PropTypes5.oneOfType([
+    PropTypes5.arrayOf(PropTypes5.oneOfType([PropTypes5.func, PropTypes5.object, PropTypes5.bool])),
+    PropTypes5.func,
+    PropTypes5.object
   ]),
   /**
    * The type of account details to display.
@@ -425,16 +1097,16 @@ AccountPreview.propTypes = {
    * @property {'expanded'} expanded - Displays the user's avatar, name, and email if available.
    * @default 'condensed'
    */
-  variant: PropTypes3.oneOf(["condensed", "expanded"])
+  variant: PropTypes5.oneOf(["condensed", "expanded"])
 };
 
 // src/toolpad-core/Account/AccountPopoverHeader.tsx
-import PropTypes4 from "prop-types";
+import PropTypes6 from "prop-types";
 import Stack2 from "@mui/material/Stack";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function AccountPopoverHeader(props) {
   const _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
-  return /* @__PURE__ */ jsx5(Stack2, __spreadProps(__spreadValues({}, rest), { children }));
+  return /* @__PURE__ */ jsx10(Stack2, __spreadProps(__spreadValues({}, rest), { children }));
 }
 AccountPopoverHeader.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
@@ -444,16 +1116,16 @@ AccountPopoverHeader.propTypes = {
   /**
    * The content of the component.
    */
-  children: PropTypes4.node
+  children: PropTypes6.node
 };
 
 // src/toolpad-core/Account/AccountPopoverFooter.tsx
-import PropTypes5 from "prop-types";
+import PropTypes7 from "prop-types";
 import Box from "@mui/material/Box";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function AccountPopoverFooter(props) {
   const _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx11(
     Box,
     __spreadProps(__spreadValues({}, rest), {
       sx: __spreadValues({ display: "flex", flexDirection: "row", p: 1, justifyContent: "flex-end" }, rest.sx),
@@ -469,19 +1141,19 @@ AccountPopoverFooter.propTypes = {
   /**
    * @ignore
    */
-  children: PropTypes5.node,
+  children: PropTypes7.node,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes5.oneOfType([
-    PropTypes5.arrayOf(PropTypes5.oneOfType([PropTypes5.func, PropTypes5.object, PropTypes5.bool])),
-    PropTypes5.func,
-    PropTypes5.object
+  sx: PropTypes7.oneOfType([
+    PropTypes7.arrayOf(PropTypes7.oneOfType([PropTypes7.func, PropTypes7.object, PropTypes7.bool])),
+    PropTypes7.func,
+    PropTypes7.object
   ])
 };
 
 // src/toolpad-core/Account/Account.tsx
-import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 var defaultAccountLocaleText = {
   accountPreviewIconButtonLabel: "Current User",
   accountPreviewTitle: "Account",
@@ -492,14 +1164,14 @@ function Account(props) {
   var _a;
   const { localeText: propsLocaleText } = props;
   const globalLocaleText = useLocaleText();
-  const localeText = React7.useMemo(
+  const localeText = React16.useMemo(
     () => __spreadValues(__spreadValues(__spreadValues({}, defaultAccountLocaleText), globalLocaleText), propsLocaleText),
     [globalLocaleText, propsLocaleText]
   );
   const { slots, slotProps } = props;
-  const [anchorEl, setAnchorEl] = React7.useState(null);
-  const session = React7.useContext(SessionContext);
-  const authentication = React7.useContext(AuthenticationContext);
+  const [anchorEl, setAnchorEl] = React16.useState(null);
+  const session = React16.useContext(SessionContext);
+  const authentication = React16.useContext(AuthenticationContext);
   const open = Boolean(anchorEl);
   const handleClick = (event) => {
     setAnchorEl(event.currentTarget);
@@ -512,10 +1184,10 @@ function Account(props) {
   }
   let accountContent = null;
   if (!(session == null ? void 0 : session.user)) {
-    accountContent = (slots == null ? void 0 : slots.signInButton) ? /* @__PURE__ */ jsx7(slots.signInButton, { onClick: authentication.signIn }) : /* @__PURE__ */ jsx7(SignInButton, __spreadValues({}, slotProps == null ? void 0 : slotProps.signInButton));
+    accountContent = (slots == null ? void 0 : slots.signInButton) ? /* @__PURE__ */ jsx12(slots.signInButton, { onClick: authentication.signIn }) : /* @__PURE__ */ jsx12(SignInButton, __spreadValues({}, slotProps == null ? void 0 : slotProps.signInButton));
   } else {
-    accountContent = /* @__PURE__ */ jsxs3(React7.Fragment, { children: [
-      (slots == null ? void 0 : slots.preview) ? /* @__PURE__ */ jsx7(slots.preview, { handleClick, open }) : /* @__PURE__ */ jsx7(
+    accountContent = /* @__PURE__ */ jsxs6(React16.Fragment, { children: [
+      (slots == null ? void 0 : slots.preview) ? /* @__PURE__ */ jsx12(slots.preview, { handleClick, open }) : /* @__PURE__ */ jsx12(
         AccountPreview,
         __spreadValues({
           variant: "condensed",
@@ -523,14 +1195,14 @@ function Account(props) {
           open
         }, slotProps == null ? void 0 : slotProps.preview)
       ),
-      (slots == null ? void 0 : slots.popover) ? /* @__PURE__ */ jsx7(
+      (slots == null ? void 0 : slots.popover) ? /* @__PURE__ */ jsx12(
         slots.popover,
         __spreadValues({
           open,
           onClick: handleClick,
           onClose: handleClose
         }, slotProps == null ? void 0 : slotProps.popover)
-      ) : /* @__PURE__ */ jsx7(
+      ) : /* @__PURE__ */ jsx12(
         Popover,
         __spreadProps(__spreadValues({
           anchorEl,
@@ -563,16 +1235,16 @@ function Account(props) {
               }
             }
           }, (_a = slotProps == null ? void 0 : slotProps.popover) == null ? void 0 : _a.slotProps),
-          children: (slots == null ? void 0 : slots.popoverContent) ? /* @__PURE__ */ jsx7(slots.popoverContent, __spreadValues({}, slotProps == null ? void 0 : slotProps.popoverContent)) : /* @__PURE__ */ jsxs3(Stack3, __spreadProps(__spreadValues({ direction: "column" }, slotProps == null ? void 0 : slotProps.popoverContent), { children: [
-            /* @__PURE__ */ jsx7(AccountPopoverHeader, { children: /* @__PURE__ */ jsx7(AccountPreview, { variant: "expanded" }) }),
-            /* @__PURE__ */ jsx7(Divider, {}),
-            /* @__PURE__ */ jsx7(AccountPopoverFooter, { children: /* @__PURE__ */ jsx7(SignOutButton, __spreadValues({}, slotProps == null ? void 0 : slotProps.signOutButton)) })
+          children: (slots == null ? void 0 : slots.popoverContent) ? /* @__PURE__ */ jsx12(slots.popoverContent, __spreadValues({}, slotProps == null ? void 0 : slotProps.popoverContent)) : /* @__PURE__ */ jsxs6(Stack3, __spreadProps(__spreadValues({ direction: "column" }, slotProps == null ? void 0 : slotProps.popoverContent), { children: [
+            /* @__PURE__ */ jsx12(AccountPopoverHeader, { children: /* @__PURE__ */ jsx12(AccountPreview, { variant: "expanded" }) }),
+            /* @__PURE__ */ jsx12(Divider, {}),
+            /* @__PURE__ */ jsx12(AccountPopoverFooter, { children: /* @__PURE__ */ jsx12(SignOutButton, __spreadValues({}, slotProps == null ? void 0 : slotProps.signOutButton)) })
           ] }))
         })
       )
     ] });
   }
-  return /* @__PURE__ */ jsx7(AccountLocaleContext.Provider, { value: localeText, children: accountContent });
+  return /* @__PURE__ */ jsx12(AccountLocaleContext.Provider, { value: localeText, children: accountContent });
 }
 Account.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
@@ -582,64 +1254,64 @@ Account.propTypes = {
   /**
    * The labels for the account component.
    */
-  localeText: PropTypes6.object,
+  localeText: PropTypes8.object,
   /**
    * The props used for each slot inside.
    */
-  slotProps: PropTypes6.shape({
-    popover: PropTypes6.object,
-    popoverContent: PropTypes6.object,
-    preview: PropTypes6.shape({
-      handleClick: PropTypes6.func,
-      open: PropTypes6.bool,
-      slotProps: PropTypes6.shape({
-        avatar: PropTypes6.object,
-        avatarIconButton: PropTypes6.object,
-        moreIconButton: PropTypes6.object
+  slotProps: PropTypes8.shape({
+    popover: PropTypes8.object,
+    popoverContent: PropTypes8.object,
+    preview: PropTypes8.shape({
+      handleClick: PropTypes8.func,
+      open: PropTypes8.bool,
+      slotProps: PropTypes8.shape({
+        avatar: PropTypes8.object,
+        avatarIconButton: PropTypes8.object,
+        moreIconButton: PropTypes8.object
       }),
-      slots: PropTypes6.shape({
-        avatar: PropTypes6.elementType,
-        avatarIconButton: PropTypes6.elementType,
-        moreIconButton: PropTypes6.elementType
+      slots: PropTypes8.shape({
+        avatar: PropTypes8.elementType,
+        avatarIconButton: PropTypes8.elementType,
+        moreIconButton: PropTypes8.elementType
       }),
-      sx: PropTypes6.oneOfType([
-        PropTypes6.arrayOf(PropTypes6.oneOfType([PropTypes6.func, PropTypes6.object, PropTypes6.bool])),
-        PropTypes6.func,
-        PropTypes6.object
+      sx: PropTypes8.oneOfType([
+        PropTypes8.arrayOf(PropTypes8.oneOfType([PropTypes8.func, PropTypes8.object, PropTypes8.bool])),
+        PropTypes8.func,
+        PropTypes8.object
       ]),
-      variant: PropTypes6.oneOf(["condensed", "expanded"])
+      variant: PropTypes8.oneOf(["condensed", "expanded"])
     }),
-    signInButton: PropTypes6.object,
-    signOutButton: PropTypes6.object
+    signInButton: PropTypes8.object,
+    signOutButton: PropTypes8.object
   }),
   /**
    * The components used for each slot inside.
    */
-  slots: PropTypes6.shape({
-    popover: PropTypes6.elementType,
-    popoverContent: PropTypes6.elementType,
-    preview: PropTypes6.elementType,
-    signInButton: PropTypes6.elementType,
-    signOutButton: PropTypes6.elementType
+  slots: PropTypes8.shape({
+    popover: PropTypes8.elementType,
+    popoverContent: PropTypes8.elementType,
+    preview: PropTypes8.elementType,
+    signInButton: PropTypes8.elementType,
+    signOutButton: PropTypes8.elementType
   })
 };
 
 // src/toolpad-core/DashboardLayout/DashboardLayout.tsx
-import * as React16 from "react";
-import PropTypes9 from "prop-types";
-import { useTheme as useTheme3 } from "@mui/material/styles";
-import useMediaQuery from "@mui/material/useMediaQuery";
+import * as React25 from "react";
+import PropTypes11 from "prop-types";
+import { useTheme as useTheme4 } from "@mui/material/styles";
+import useMediaQuery2 from "@mui/material/useMediaQuery";
 import Box4 from "@mui/material/Box";
 import Drawer from "@mui/material/Drawer";
 import Toolbar2 from "@mui/material/Toolbar";
 
 // src/toolpad-core/DashboardLayout/DashboardHeader.tsx
-import * as React12 from "react";
-import PropTypes7 from "prop-types";
+import * as React21 from "react";
+import PropTypes9 from "prop-types";
 import { styled as styled2 } from "@mui/material/styles";
 import Box2 from "@mui/material/Box";
 import MuiAppBar from "@mui/material/AppBar";
-import IconButton3 from "@mui/material/IconButton";
+import IconButton4 from "@mui/material/IconButton";
 import Toolbar from "@mui/material/Toolbar";
 import Tooltip3 from "@mui/material/Tooltip";
 import MenuIcon from "@mui/icons-material/Menu";
@@ -649,15 +1321,15 @@ import Stack6 from "@mui/material/Stack";
 // src/toolpad-core/DashboardLayout/AppTitle.tsx
 import Typography2 from "@mui/material/Typography";
 import Stack4 from "@mui/material/Stack";
-import { styled, useTheme } from "@mui/material";
+import { styled, useTheme as useTheme2 } from "@mui/material";
 
 // src/toolpad-core/shared/Link.tsx
-import * as React8 from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var DefaultLink = React8.forwardRef(function Link(props, ref) {
+import * as React17 from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var DefaultLink = React17.forwardRef(function Link(props, ref) {
   const _a = props, { children, href, onClick, history } = _a, rest = __objRest(_a, ["children", "href", "onClick", "history"]);
-  const routerContext = React8.useContext(RouterContext);
-  const handleLinkClick = React8.useMemo(() => {
+  const routerContext = React17.useContext(RouterContext);
+  const handleLinkClick = React17.useMemo(() => {
     if (!routerContext) {
       return onClick;
     }
@@ -668,25 +1340,25 @@ var DefaultLink = React8.forwardRef(function Link(props, ref) {
       onClick == null ? void 0 : onClick(event);
     };
   }, [routerContext, onClick, history]);
-  return /* @__PURE__ */ jsx8("a", __spreadProps(__spreadValues({ ref, href }, rest), { onClick: handleLinkClick, children }));
+  return /* @__PURE__ */ jsx13("a", __spreadProps(__spreadValues({ ref, href }, rest), { onClick: handleLinkClick, children }));
 });
-var Link2 = React8.forwardRef(function Link3(props, ref) {
+var Link2 = React17.forwardRef(function Link3(props, ref) {
   var _a;
-  const routerContext = React8.useContext(RouterContext);
+  const routerContext = React17.useContext(RouterContext);
   const LinkComponent = (_a = routerContext == null ? void 0 : routerContext.Link) != null ? _a : DefaultLink;
-  return /* @__PURE__ */ jsx8(LinkComponent, __spreadProps(__spreadValues({ ref }, props), { children: props.children }));
+  return /* @__PURE__ */ jsx13(LinkComponent, __spreadProps(__spreadValues({ ref }, props), { children: props.children }));
 });
 
 // src/toolpad-core/DashboardLayout/ToolpadLogo.tsx
-import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 function ToolpadLogo({ size = 40 }) {
-  return /* @__PURE__ */ jsxs4("svg", { width: size, height: size, fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ jsxs4("g", { mask: "url(#a)", children: [
-      /* @__PURE__ */ jsx9("path", { d: "M22.74 27.73v-7.6l6.64-3.79v7.6l-6.64 3.79Z", fill: "#007FFF" }),
-      /* @__PURE__ */ jsx9("path", { d: "M16.1 23.93v-7.59l6.64 3.8v7.59l-6.65-3.8Z", fill: "#39F" }),
-      /* @__PURE__ */ jsx9("path", { d: "m16.1 16.34 6.64-3.8 6.64 3.8-6.64 3.8-6.65-3.8Z", fill: "#A5D8FF" })
+  return /* @__PURE__ */ jsxs7("svg", { width: size, height: size, fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsxs7("g", { mask: "url(#a)", children: [
+      /* @__PURE__ */ jsx14("path", { d: "M22.74 27.73v-7.6l6.64-3.79v7.6l-6.64 3.79Z", fill: "#007FFF" }),
+      /* @__PURE__ */ jsx14("path", { d: "M16.1 23.93v-7.59l6.64 3.8v7.59l-6.65-3.8Z", fill: "#39F" }),
+      /* @__PURE__ */ jsx14("path", { d: "m16.1 16.34 6.64-3.8 6.64 3.8-6.64 3.8-6.65-3.8Z", fill: "#A5D8FF" })
     ] }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx14(
       "mask",
       {
         id: "b",
@@ -698,7 +1370,7 @@ function ToolpadLogo({ size = 40 }) {
         y: "17",
         width: "14",
         height: "15",
-        children: /* @__PURE__ */ jsx9(
+        children: /* @__PURE__ */ jsx14(
           "path",
           {
             d: "M8.5 22.3c0-1.05.56-2 1.46-2.53l3.75-2.14c.89-.5 1.98-.5 2.87 0l3.75 2.14a2.9 2.9 0 0 1 1.46 2.52v4.23c0 1.04-.56 2-1.46 2.52l-3.75 2.14c-.89.5-1.98.5-2.87 0l-3.75-2.14a2.9 2.9 0 0 1-1.46-2.52v-4.23Z",
@@ -707,12 +1379,12 @@ function ToolpadLogo({ size = 40 }) {
         )
       }
     ),
-    /* @__PURE__ */ jsxs4("g", { mask: "url(#b)", children: [
-      /* @__PURE__ */ jsx9("path", { d: "M15.14 32v-7.6l6.65-3.8v7.6L15.14 32Z", fill: "#007FFF" }),
-      /* @__PURE__ */ jsx9("path", { d: "M8.5 28.2v-7.6l6.64 3.8V32L8.5 28.2Z", fill: "#39F" }),
-      /* @__PURE__ */ jsx9("path", { d: "m8.5 20.6 6.64-3.79 6.65 3.8-6.65 3.8-6.64-3.8Z", fill: "#A5D8FF" })
+    /* @__PURE__ */ jsxs7("g", { mask: "url(#b)", children: [
+      /* @__PURE__ */ jsx14("path", { d: "M15.14 32v-7.6l6.65-3.8v7.6L15.14 32Z", fill: "#007FFF" }),
+      /* @__PURE__ */ jsx14("path", { d: "M8.5 28.2v-7.6l6.64 3.8V32L8.5 28.2Z", fill: "#39F" }),
+      /* @__PURE__ */ jsx14("path", { d: "m8.5 20.6 6.64-3.79 6.65 3.8-6.65 3.8-6.64-3.8Z", fill: "#A5D8FF" })
     ] }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx14(
       "mask",
       {
         id: "c",
@@ -724,7 +1396,7 @@ function ToolpadLogo({ size = 40 }) {
         y: "4",
         width: "22",
         height: "20",
-        children: /* @__PURE__ */ jsx9(
+        children: /* @__PURE__ */ jsx14(
           "path",
           {
             d: "M24.17 4.82a2.9 2.9 0 0 0-2.87 0L9.97 11.22a2.9 2.9 0 0 0-1.47 2.53v4.22c0 1.04.56 2 1.46 2.52l3.75 2.14c.89.5 1.98.5 2.87 0l11.33-6.42a2.9 2.9 0 0 0 1.47-2.52V9.48c0-1.04-.56-2-1.46-2.52l-3.75-2.14Z",
@@ -733,24 +1405,24 @@ function ToolpadLogo({ size = 40 }) {
         )
       }
     ),
-    /* @__PURE__ */ jsxs4("g", { mask: "url(#c)", children: [
-      /* @__PURE__ */ jsx9("path", { d: "M15.14 23.46v-7.6L29.38 7.8v7.59l-14.24 8.07Z", fill: "#007FFF" }),
-      /* @__PURE__ */ jsx9("path", { d: "M8.5 19.66v-7.6l6.64 3.8v7.6l-6.64-3.8Z", fill: "#39F" }),
-      /* @__PURE__ */ jsx9("path", { d: "M8.5 12.07 22.74 4l6.64 3.8-14.24 8.06-6.64-3.8Z", fill: "#A5D8FF" })
+    /* @__PURE__ */ jsxs7("g", { mask: "url(#c)", children: [
+      /* @__PURE__ */ jsx14("path", { d: "M15.14 23.46v-7.6L29.38 7.8v7.59l-14.24 8.07Z", fill: "#007FFF" }),
+      /* @__PURE__ */ jsx14("path", { d: "M8.5 19.66v-7.6l6.64 3.8v7.6l-6.64-3.8Z", fill: "#39F" }),
+      /* @__PURE__ */ jsx14("path", { d: "M8.5 12.07 22.74 4l6.64 3.8-14.24 8.06-6.64-3.8Z", fill: "#A5D8FF" })
     ] })
   ] });
 }
 
 // src/toolpad-core/shared/branding.ts
-import * as React9 from "react";
+import * as React18 from "react";
 function useApplicationTitle() {
   var _a;
-  const branding = React9.useContext(BrandingContext);
+  const branding = React18.useContext(BrandingContext);
   return (_a = branding == null ? void 0 : branding.title) != null ? _a : "Toolpad";
 }
 
 // src/toolpad-core/DashboardLayout/AppTitle.tsx
-import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 var LogoContainer = styled("div")({
   position: "relative",
   height: 40,
@@ -762,12 +1434,12 @@ var LogoContainer = styled("div")({
 });
 function AppTitle(props) {
   var _a, _b, _c, _d, _e, _f, _g;
-  const theme = useTheme();
+  const theme = useTheme2();
   const defaultTitle = useApplicationTitle();
   const title = (_b = (_a = props == null ? void 0 : props.branding) == null ? void 0 : _a.title) != null ? _b : defaultTitle;
-  return /* @__PURE__ */ jsx10(Link2, { href: (_d = (_c = props == null ? void 0 : props.branding) == null ? void 0 : _c.homeUrl) != null ? _d : "/", style: { textDecoration: "none" }, children: /* @__PURE__ */ jsxs5(Stack4, { direction: "row", alignItems: "center", children: [
-    /* @__PURE__ */ jsx10(LogoContainer, { children: (_f = (_e = props == null ? void 0 : props.branding) == null ? void 0 : _e.logo) != null ? _f : /* @__PURE__ */ jsx10(ToolpadLogo, { size: 40 }) }),
-    /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx15(Link2, { href: (_d = (_c = props == null ? void 0 : props.branding) == null ? void 0 : _c.homeUrl) != null ? _d : "/", style: { textDecoration: "none" }, children: /* @__PURE__ */ jsxs8(Stack4, { direction: "row", alignItems: "center", children: [
+    /* @__PURE__ */ jsx15(LogoContainer, { children: (_f = (_e = props == null ? void 0 : props.branding) == null ? void 0 : _e.logo) != null ? _f : /* @__PURE__ */ jsx15(ToolpadLogo, { size: 40 }) }),
+    /* @__PURE__ */ jsx15(
       Typography2,
       {
         variant: "h6",
@@ -788,54 +1460,54 @@ function AppTitle(props) {
 import Stack5 from "@mui/material/Stack";
 
 // src/toolpad-core/DashboardLayout/ThemeSwitcher.tsx
-import * as React11 from "react";
-import { useTheme as useTheme2 } from "@mui/material";
-import IconButton2 from "@mui/material/IconButton";
+import * as React20 from "react";
+import { useTheme as useTheme3 } from "@mui/material";
+import IconButton3 from "@mui/material/IconButton";
 import Tooltip2 from "@mui/material/Tooltip";
 import DarkModeIcon from "@mui/icons-material/DarkMode";
 import LightModeIcon from "@mui/icons-material/LightMode";
 
 // src/toolpad-utils/hooks/useSsr.ts
-import * as React10 from "react";
-function subscribe() {
+import * as React19 from "react";
+function subscribe2() {
   return () => {
   };
 }
-function getSnapshot() {
+function getSnapshot2() {
   return false;
 }
 function getServerSnapshot() {
   return true;
 }
 function useSsr() {
-  return React10.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+  return React19.useSyncExternalStore(subscribe2, getSnapshot2, getServerSnapshot);
 }
 
 // src/toolpad-core/DashboardLayout/ThemeSwitcher.tsx
-import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 function ThemeSwitcher() {
   var _a;
   const isSsr = useSsr();
-  const theme = useTheme2();
-  const { paletteMode, setPaletteMode, isDualTheme } = React11.useContext(PaletteModeContext);
-  const toggleMode = React11.useCallback(() => {
+  const theme = useTheme3();
+  const { paletteMode, setPaletteMode, isDualTheme } = React20.useContext(PaletteModeContext);
+  const toggleMode = React20.useCallback(() => {
     setPaletteMode(paletteMode === "dark" ? "light" : "dark");
   }, [paletteMode, setPaletteMode]);
-  return isDualTheme ? /* @__PURE__ */ jsx11(
+  return isDualTheme ? /* @__PURE__ */ jsx16(
     Tooltip2,
     {
       title: isSsr ? "Switch mode" : `${paletteMode === "dark" ? "Light" : "Dark"} mode`,
       enterDelay: 1e3,
-      children: /* @__PURE__ */ jsx11("div", { children: /* @__PURE__ */ jsx11(
-        IconButton2,
+      children: /* @__PURE__ */ jsx16("div", { children: /* @__PURE__ */ jsx16(
+        IconButton3,
         {
           "aria-label": isSsr ? "Switch theme mode" : `Switch to ${paletteMode === "dark" ? "light" : "dark"} mode`,
           onClick: toggleMode,
           sx: {
             color: ((_a = theme.vars) != null ? _a : theme).palette.primary.dark
           },
-          children: theme.getColorSchemeSelector ? /* @__PURE__ */ jsxs6(React11.Fragment, { children: [
-            /* @__PURE__ */ jsx11(
+          children: theme.getColorSchemeSelector ? /* @__PURE__ */ jsxs9(React20.Fragment, { children: [
+            /* @__PURE__ */ jsx16(
               DarkModeIcon,
               {
                 sx: {
@@ -846,7 +1518,7 @@ function ThemeSwitcher() {
                 }
               }
             ),
-            /* @__PURE__ */ jsx11(
+            /* @__PURE__ */ jsx16(
               LightModeIcon,
               {
                 sx: {
@@ -857,7 +1529,7 @@ function ThemeSwitcher() {
                 }
               }
             )
-          ] }) : /* @__PURE__ */ jsx11(React11.Fragment, { children: isSsr || paletteMode !== "dark" ? /* @__PURE__ */ jsx11(DarkModeIcon, {}) : /* @__PURE__ */ jsx11(LightModeIcon, {}) })
+          ] }) : /* @__PURE__ */ jsx16(React20.Fragment, { children: isSsr || paletteMode !== "dark" ? /* @__PURE__ */ jsx16(DarkModeIcon, {}) : /* @__PURE__ */ jsx16(LightModeIcon, {}) })
         }
       ) })
     }
@@ -865,16 +1537,16 @@ function ThemeSwitcher() {
 }
 
 // src/toolpad-core/DashboardLayout/ToolbarActions.tsx
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
 function ToolbarActions() {
-  return /* @__PURE__ */ jsxs7(Stack5, { direction: "row", alignItems: "center", children: [
-    /* @__PURE__ */ jsx12(ThemeSwitcher, {}),
-    /* @__PURE__ */ jsx12(Account, {})
+  return /* @__PURE__ */ jsxs10(Stack5, { direction: "row", alignItems: "center", children: [
+    /* @__PURE__ */ jsx17(ThemeSwitcher, {}),
+    /* @__PURE__ */ jsx17(Account, {})
   ] });
 }
 
 // src/toolpad-core/DashboardLayout/DashboardHeader.tsx
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
 var AppBar = styled2(MuiAppBar)(({ theme }) => {
   var _a;
   return {
@@ -896,26 +1568,26 @@ function DashboardHeader(props) {
     slots,
     slotProps
   } = props;
-  const brandingContext = React12.useContext(BrandingContext);
+  const brandingContext = React21.useContext(BrandingContext);
   const branding = __spreadValues(__spreadValues({}, brandingContext), brandingProp);
-  const handleMenuOpen = React12.useCallback(() => {
+  const handleMenuOpen = React21.useCallback(() => {
     onToggleMenu(!menuOpen);
   }, [menuOpen, onToggleMenu]);
-  const getMenuIcon = React12.useCallback(
+  const getMenuIcon = React21.useCallback(
     (isExpanded) => {
       const expandMenuActionText = "Expand";
       const collapseMenuActionText = "Collapse";
-      return /* @__PURE__ */ jsx13(
+      return /* @__PURE__ */ jsx18(
         Tooltip3,
         {
           title: `${isExpanded ? collapseMenuActionText : expandMenuActionText} menu`,
           enterDelay: 1e3,
-          children: /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13(
-            IconButton3,
+          children: /* @__PURE__ */ jsx18("div", { children: /* @__PURE__ */ jsx18(
+            IconButton4,
             {
               "aria-label": `${isExpanded ? collapseMenuActionText : expandMenuActionText} navigation menu`,
               onClick: handleMenuOpen,
-              children: isExpanded ? /* @__PURE__ */ jsx13(MenuOpenIcon, {}) : /* @__PURE__ */ jsx13(MenuIcon, {})
+              children: isExpanded ? /* @__PURE__ */ jsx18(MenuOpenIcon, {}) : /* @__PURE__ */ jsx18(MenuIcon, {})
             }
           ) })
         }
@@ -925,7 +1597,7 @@ function DashboardHeader(props) {
   );
   const ToolbarActionsSlot = (_a = slots == null ? void 0 : slots.toolbarActions) != null ? _a : ToolbarActions;
   const ToolbarAccountSlot = (_b = slots == null ? void 0 : slots.toolbarAccount) != null ? _b : (() => null);
-  return /* @__PURE__ */ jsx13(AppBar, { color: "inherit", position: "absolute", sx: { displayPrint: "none" }, children: /* @__PURE__ */ jsx13(Toolbar, { sx: { backgroundColor: "inherit", mx: { xs: -0.75, sm: -1 } }, children: /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsx18(AppBar, { color: "inherit", position: "absolute", sx: { displayPrint: "none" }, children: /* @__PURE__ */ jsx18(Toolbar, { sx: { backgroundColor: "inherit", mx: { xs: -0.75, sm: -1 } }, children: /* @__PURE__ */ jsxs11(
     Stack6,
     {
       direction: "row",
@@ -936,9 +1608,9 @@ function DashboardHeader(props) {
         width: "100%"
       },
       children: [
-        /* @__PURE__ */ jsxs8(Stack6, { direction: "row", children: [
-          !hideMenuButton ? /* @__PURE__ */ jsxs8(React12.Fragment, { children: [
-            /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsxs11(Stack6, { direction: "row", children: [
+          !hideMenuButton ? /* @__PURE__ */ jsxs11(React21.Fragment, { children: [
+            /* @__PURE__ */ jsx18(
               Box2,
               {
                 sx: {
@@ -948,7 +1620,7 @@ function DashboardHeader(props) {
                 children: getMenuIcon(menuOpen)
               }
             ),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx18(
               Box2,
               {
                 sx: {
@@ -959,18 +1631,18 @@ function DashboardHeader(props) {
               }
             )
           ] }) : null,
-          (slots == null ? void 0 : slots.appTitle) ? /* @__PURE__ */ jsx13(slots.appTitle, __spreadValues({}, slotProps == null ? void 0 : slotProps.appTitle)) : (
+          (slots == null ? void 0 : slots.appTitle) ? /* @__PURE__ */ jsx18(slots.appTitle, __spreadValues({}, slotProps == null ? void 0 : slotProps.appTitle)) : (
             /* Hierarchy of application of `branding`
              * 1. Branding prop passed in the `slotProps.appTitle`
              * 2. Branding prop passed to the `DashboardLayout`
              * 3. Branding prop passed to the `AppProvider`
              */
-            /* @__PURE__ */ jsx13(AppTitle, __spreadValues({ branding }, slotProps == null ? void 0 : slotProps.appTitle))
+            /* @__PURE__ */ jsx18(AppTitle, __spreadValues({ branding }, slotProps == null ? void 0 : slotProps.appTitle))
           )
         ] }),
-        /* @__PURE__ */ jsxs8(Stack6, { direction: "row", alignItems: "center", spacing: 1, sx: { marginLeft: "auto" }, children: [
-          /* @__PURE__ */ jsx13(ToolbarActionsSlot, __spreadValues({}, slotProps == null ? void 0 : slotProps.toolbarActions)),
-          /* @__PURE__ */ jsx13(ToolbarAccountSlot, __spreadValues({}, slotProps == null ? void 0 : slotProps.toolbarAccount))
+        /* @__PURE__ */ jsxs11(Stack6, { direction: "row", alignItems: "center", spacing: 1, sx: { marginLeft: "auto" }, children: [
+          /* @__PURE__ */ jsx18(ToolbarActionsSlot, __spreadValues({}, slotProps == null ? void 0 : slotProps.toolbarActions)),
+          /* @__PURE__ */ jsx18(ToolbarAccountSlot, __spreadValues({}, slotProps == null ? void 0 : slotProps.toolbarAccount))
         ] })
       ]
     }
@@ -985,75 +1657,75 @@ DashboardHeader.propTypes = {
    * Branding options for the header.
    * @default null
    */
-  branding: PropTypes7.shape({
-    homeUrl: PropTypes7.string,
-    logo: PropTypes7.node,
-    title: PropTypes7.string
+  branding: PropTypes9.shape({
+    homeUrl: PropTypes9.string,
+    logo: PropTypes9.node,
+    title: PropTypes9.string
   }),
   /**
    * Whether the menu icon should always be hidden.
    * @default false
    */
-  hideMenuButton: PropTypes7.bool,
+  hideMenuButton: PropTypes9.bool,
   /**
    * If `true`, show menu button as if menu is expanded, otherwise show it as if menu is collapsed.
    */
-  menuOpen: PropTypes7.bool.isRequired,
+  menuOpen: PropTypes9.bool.isRequired,
   /**
    * Callback fired when the menu button is clicked.
    */
-  onToggleMenu: PropTypes7.func.isRequired,
+  onToggleMenu: PropTypes9.func.isRequired,
   /**
    * The props used for each slot inside.
    * @default {}
    */
-  slotProps: PropTypes7.shape({
-    appTitle: PropTypes7.shape({
-      branding: PropTypes7.shape({
-        homeUrl: PropTypes7.string,
-        logo: PropTypes7.node,
-        title: PropTypes7.string
+  slotProps: PropTypes9.shape({
+    appTitle: PropTypes9.shape({
+      branding: PropTypes9.shape({
+        homeUrl: PropTypes9.string,
+        logo: PropTypes9.node,
+        title: PropTypes9.string
       })
     }),
-    toolbarAccount: PropTypes7.shape({
-      localeText: PropTypes7.object,
-      slotProps: PropTypes7.shape({
-        popover: PropTypes7.object,
-        popoverContent: PropTypes7.object,
-        preview: PropTypes7.object,
-        signInButton: PropTypes7.object,
-        signOutButton: PropTypes7.object
+    toolbarAccount: PropTypes9.shape({
+      localeText: PropTypes9.object,
+      slotProps: PropTypes9.shape({
+        popover: PropTypes9.object,
+        popoverContent: PropTypes9.object,
+        preview: PropTypes9.object,
+        signInButton: PropTypes9.object,
+        signOutButton: PropTypes9.object
       }),
-      slots: PropTypes7.shape({
-        popover: PropTypes7.elementType,
-        popoverContent: PropTypes7.elementType,
-        preview: PropTypes7.elementType,
-        signInButton: PropTypes7.elementType,
-        signOutButton: PropTypes7.elementType
+      slots: PropTypes9.shape({
+        popover: PropTypes9.elementType,
+        popoverContent: PropTypes9.elementType,
+        preview: PropTypes9.elementType,
+        signInButton: PropTypes9.elementType,
+        signOutButton: PropTypes9.elementType
       })
     }),
-    toolbarActions: PropTypes7.object
+    toolbarActions: PropTypes9.object
   }),
   /**
    * The components used for each slot inside.
    * @default {}
    */
-  slots: PropTypes7.shape({
-    appTitle: PropTypes7.elementType,
-    toolbarAccount: PropTypes7.elementType,
-    toolbarActions: PropTypes7.elementType
+  slots: PropTypes9.shape({
+    appTitle: PropTypes9.elementType,
+    toolbarAccount: PropTypes9.elementType,
+    toolbarActions: PropTypes9.elementType
   })
 };
 
 // src/toolpad-core/DashboardLayout/DashboardSidebarSubNavigation.tsx
-import * as React15 from "react";
+import * as React24 from "react";
 import Divider2 from "@mui/material/Divider";
 import List from "@mui/material/List";
 import ListSubheader from "@mui/material/ListSubheader";
 
 // src/toolpad-core/shared/navigation.tsx
 import { pathToRegexp } from "path-to-regexp";
-import invariant2 from "invariant";
+import invariant4 from "invariant";
 var getItemKind = (item) => {
   var _a;
   return (_a = item.kind) != null ? _a : "page";
@@ -1139,7 +1811,7 @@ function matchPath(navigation, path) {
 function getItemPath(navigation, item) {
   const map = getItemToPathMap(navigation);
   const path = map.get(item);
-  invariant2(path, `Item not found in navigation: ${item.title}`);
+  invariant4(path, `Item not found in navigation: ${item.title}`);
   return path;
 }
 function hasSelectedNavigationChildren(navigation, item, activePagePath) {
@@ -1173,15 +1845,15 @@ function getDrawerWidthTransitionMixin(isExpanded) {
 }
 
 // src/toolpad-core/useActivePage/useActivePage.ts
-import * as React13 from "react";
+import * as React22 from "react";
 function useActivePage() {
   var _a;
-  const navigationContext = React13.useContext(NavigationContext);
-  const routerContext = React13.useContext(RouterContext);
+  const navigationContext = React22.useContext(NavigationContext);
+  const routerContext = React22.useContext(RouterContext);
   const pathname = (_a = routerContext == null ? void 0 : routerContext.pathname) != null ? _a : "/";
   const activeItem = matchPath(navigationContext, pathname);
   const rootItem = matchPath(navigationContext, "/");
-  return React13.useMemo(() => {
+  return React22.useMemo(() => {
     if (!activeItem) {
       return null;
     }
@@ -1219,8 +1891,8 @@ function useActivePage() {
 }
 
 // src/toolpad-core/DashboardLayout/DashboardSidebarPageItem.tsx
-import * as React14 from "react";
-import PropTypes8 from "prop-types";
+import * as React23 from "react";
+import PropTypes10 from "prop-types";
 import { styled as styled3 } from "@mui/material";
 import Avatar2 from "@mui/material/Avatar";
 import Box3 from "@mui/material/Box";
@@ -1233,13 +1905,13 @@ import ListItemText from "@mui/material/ListItemText";
 import Paper from "@mui/material/Paper";
 import Typography3 from "@mui/material/Typography";
 import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
-import invariant3 from "invariant";
+import invariant5 from "invariant";
 
 // src/toolpad-core/DashboardLayout/shared.ts
 var MINI_DRAWER_WIDTH = 84;
 
 // src/toolpad-core/DashboardLayout/DashboardSidebarPageItem.tsx
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
 var NavigationListItemButton = styled3(ListItemButton)(({ theme }) => {
   var _a, _b, _c, _d, _e, _f, _g;
   return {
@@ -1272,9 +1944,9 @@ var NavigationListItemButton = styled3(ListItemButton)(({ theme }) => {
 var LIST_ITEM_ICON_SIZE = 34;
 function DashboardSidebarPageItem(props) {
   var _a;
-  const navigationContext = React14.useContext(NavigationContext);
-  const pageItemContextProps = React14.useContext(DashboardSidebarPageItemContext);
-  invariant3(pageItemContextProps, "No navigation page item context provided.");
+  const navigationContext = React23.useContext(NavigationContext);
+  const pageItemContextProps = React23.useContext(DashboardSidebarPageItemContext);
+  invariant5(pageItemContextProps, "No navigation page item context provided.");
   const contextAwareProps = __spreadValues(__spreadValues({}, pageItemContextProps), props);
   const {
     item,
@@ -1290,10 +1962,10 @@ function DashboardSidebarPageItem(props) {
     isSidebarFullyCollapsed = false,
     renderNestedNavigation
   } = contextAwareProps;
-  const [hoveredMiniSidebarItemId, setHoveredMiniSidebarItemId] = React14.useState(
+  const [hoveredMiniSidebarItemId, setHoveredMiniSidebarItemId] = React23.useState(
     null
   );
-  const handleClick = React14.useCallback(() => {
+  const handleClick = React23.useCallback(() => {
     onClick(id, item);
   }, [id, item, onClick]);
   let nestedNavigationCollapseSx = { display: "none" };
@@ -1318,7 +1990,7 @@ function DashboardSidebarPageItem(props) {
   const hasExternalHref = href.startsWith("http://") || href.startsWith("https://");
   const LinkComponent = LinkComponentProp != null ? LinkComponentProp : hasExternalHref ? "a" : Link2;
   const title = getItemTitle(item);
-  const listItem = /* @__PURE__ */ jsxs9(
+  const listItem = /* @__PURE__ */ jsxs12(
     ListItem,
     __spreadProps(__spreadValues({}, item.children && isMini ? {
       onMouseEnter: () => {
@@ -1334,7 +2006,7 @@ function DashboardSidebarPageItem(props) {
         overflowX: "hidden"
       },
       children: [
-        /* @__PURE__ */ jsxs9(
+        /* @__PURE__ */ jsxs12(
           NavigationListItemButton,
           __spreadProps(__spreadValues(__spreadValues({
             selected,
@@ -1355,7 +2027,7 @@ function DashboardSidebarPageItem(props) {
             onClick: handleClick
           }) : {}), {
             children: [
-              item.icon || isMini ? /* @__PURE__ */ jsxs9(
+              item.icon || isMini ? /* @__PURE__ */ jsxs12(
                 Box3,
                 {
                   sx: isMini ? {
@@ -1365,7 +2037,7 @@ function DashboardSidebarPageItem(props) {
                     transform: "translate(-50%, -50%)"
                   } : {},
                   children: [
-                    /* @__PURE__ */ jsxs9(
+                    /* @__PURE__ */ jsxs12(
                       ListItemIcon,
                       {
                         sx: {
@@ -1376,7 +2048,7 @@ function DashboardSidebarPageItem(props) {
                         },
                         children: [
                           (_a = item.icon) != null ? _a : null,
-                          !item.icon && isMini ? /* @__PURE__ */ jsx14(
+                          !item.icon && isMini ? /* @__PURE__ */ jsx19(
                             Avatar2,
                             {
                               sx: {
@@ -1390,7 +2062,7 @@ function DashboardSidebarPageItem(props) {
                         ]
                       }
                     ),
-                    isMini ? /* @__PURE__ */ jsx14(
+                    isMini ? /* @__PURE__ */ jsx19(
                       Typography3,
                       {
                         variant: "caption",
@@ -1413,7 +2085,7 @@ function DashboardSidebarPageItem(props) {
                   ]
                 }
               ) : null,
-              !isMini ? /* @__PURE__ */ jsx14(
+              !isMini ? /* @__PURE__ */ jsx19(
                 ListItemText,
                 {
                   primary: title,
@@ -1425,11 +2097,11 @@ function DashboardSidebarPageItem(props) {
                 }
               ) : null,
               item.action && !isMini && isSidebarFullyExpanded ? item.action : null,
-              item.children ? /* @__PURE__ */ jsx14(ExpandMoreIcon, { sx: nestedNavigationCollapseSx }) : null
+              item.children ? /* @__PURE__ */ jsx19(ExpandMoreIcon, { sx: nestedNavigationCollapseSx }) : null
             ]
           })
         ),
-        item.children && isMini ? /* @__PURE__ */ jsx14(Grow, { in: id === hoveredMiniSidebarItemId, children: /* @__PURE__ */ jsx14(
+        item.children && isMini ? /* @__PURE__ */ jsx19(Grow, { in: id === hoveredMiniSidebarItemId, children: /* @__PURE__ */ jsx19(
           Box3,
           {
             sx: {
@@ -1437,7 +2109,7 @@ function DashboardSidebarPageItem(props) {
               left: MINI_DRAWER_WIDTH - 2,
               pl: "6px"
             },
-            children: /* @__PURE__ */ jsx14(
+            children: /* @__PURE__ */ jsx19(
               Paper,
               {
                 sx: {
@@ -1453,9 +2125,9 @@ function DashboardSidebarPageItem(props) {
       ]
     })
   );
-  return /* @__PURE__ */ jsxs9(React14.Fragment, { children: [
+  return /* @__PURE__ */ jsxs12(React23.Fragment, { children: [
     listItem,
-    item.children && !isMini ? /* @__PURE__ */ jsx14(Collapse, { in: expanded, timeout: "auto", unmountOnExit: true, children: renderNestedNavigation(item.children) }) : null
+    item.children && !isMini ? /* @__PURE__ */ jsx19(Collapse, { in: expanded, timeout: "auto", unmountOnExit: true, children: renderNestedNavigation(item.children) }) : null
   ] }, id);
 }
 DashboardSidebarPageItem.propTypes = {
@@ -1467,54 +2139,54 @@ DashboardSidebarPageItem.propTypes = {
    * If `true`, the item is disabled.
    * @default false
    */
-  disabled: PropTypes8.bool,
+  disabled: PropTypes10.bool,
   /**
    * If `true`, expands any nested navigation in the item, otherwise collapse it.
    * @default false
    */
-  expanded: PropTypes8.bool,
+  expanded: PropTypes10.bool,
   /**
    * Link `href` for when the item is rendered as a link.
    * @default getItemPath(navigationContext, item)
    */
-  href: PropTypes8.string,
+  href: PropTypes10.string,
   /**
    * Navigation page item definition.
    */
-  item: PropTypes8.shape({
-    action: PropTypes8.node,
-    children: PropTypes8.arrayOf(
-      PropTypes8.oneOfType([
-        PropTypes8.object,
-        PropTypes8.shape({
-          kind: PropTypes8.oneOf(["header"]).isRequired,
-          title: PropTypes8.string.isRequired
+  item: PropTypes10.shape({
+    action: PropTypes10.node,
+    children: PropTypes10.arrayOf(
+      PropTypes10.oneOfType([
+        PropTypes10.object,
+        PropTypes10.shape({
+          kind: PropTypes10.oneOf(["header"]).isRequired,
+          title: PropTypes10.string.isRequired
         }),
-        PropTypes8.shape({
-          kind: PropTypes8.oneOf(["divider"]).isRequired
+        PropTypes10.shape({
+          kind: PropTypes10.oneOf(["divider"]).isRequired
         })
       ]).isRequired
     ),
-    icon: PropTypes8.node,
-    kind: PropTypes8.oneOf(["page"]),
-    pattern: PropTypes8.string,
-    segment: PropTypes8.string,
-    title: PropTypes8.string
+    icon: PropTypes10.node,
+    kind: PropTypes10.oneOf(["page"]),
+    pattern: PropTypes10.string,
+    segment: PropTypes10.string,
+    title: PropTypes10.string
   }).isRequired,
   /**
    * The component used to render the item as a link.
    * @default Link
    */
-  LinkComponent: PropTypes8.elementType,
+  LinkComponent: PropTypes10.elementType,
   /**
    * Use to apply selected styling.
    * @default false
    */
-  selected: PropTypes8.bool
+  selected: PropTypes10.bool
 };
 
 // src/toolpad-core/DashboardLayout/DashboardSidebarSubNavigation.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 function DashboardSidebarSubNavigationPageItem({
   id,
   item,
@@ -1528,11 +2200,11 @@ function DashboardSidebarSubNavigationPageItem({
   sidebarExpandedWidth,
   renderPageItem
 }) {
-  const navigationContext = React15.useContext(NavigationContext);
+  const navigationContext = React24.useContext(NavigationContext);
   const activePage = useActivePage();
   const isActive = !!activePage && activePage.path === getItemPath(navigationContext, item);
   const isSelected = activePage && item.children && isMini ? hasSelectedNavigationChildren(navigationContext, item, activePage.path) : isActive && !item.children;
-  const pageItemContextProps = React15.useMemo(
+  const pageItemContextProps = React24.useMemo(
     () => ({
       expanded: isExpanded,
       selected: isSelected,
@@ -1543,7 +2215,7 @@ function DashboardSidebarSubNavigationPageItem({
       isSidebarFullyCollapsed: isFullyCollapsed,
       renderNestedNavigation: () => {
         var _a;
-        return /* @__PURE__ */ jsx15(
+        return /* @__PURE__ */ jsx20(
           DashboardSidebarSubNavigation,
           {
             subNavigation: (_a = item.children) != null ? _a : [],
@@ -1569,7 +2241,7 @@ function DashboardSidebarSubNavigationPageItem({
       sidebarExpandedWidth
     ]
   );
-  return /* @__PURE__ */ jsx15(DashboardSidebarPageItemContext.Provider, { value: pageItemContextProps, children: renderPageItem ? renderPageItem(item, { mini: isMini }) : /* @__PURE__ */ jsx15(DashboardSidebarPageItem, { item }) });
+  return /* @__PURE__ */ jsx20(DashboardSidebarPageItemContext.Provider, { value: pageItemContextProps, children: renderPageItem ? renderPageItem(item, { mini: isMini }) : /* @__PURE__ */ jsx20(DashboardSidebarPageItem, { item }) });
 }
 function DashboardSidebarSubNavigation({
   subNavigation,
@@ -1583,9 +2255,9 @@ function DashboardSidebarSubNavigation({
   sidebarExpandedWidth,
   renderPageItem
 }) {
-  const navigationContext = React15.useContext(NavigationContext);
+  const navigationContext = React24.useContext(NavigationContext);
   const activePage = useActivePage();
-  const initialExpandedItemIds = React15.useMemo(
+  const initialExpandedItemIds = React24.useMemo(
     () => subNavigation.map((navigationItem, navigationItemIndex) => ({
       navigationItem,
       originalIndex: navigationItemIndex
@@ -1594,8 +2266,8 @@ function DashboardSidebarSubNavigation({
     ).map(({ originalIndex }) => `page-${depth}-${originalIndex}`),
     [activePage, depth, navigationContext, subNavigation]
   );
-  const [expandedItemIds, setExpandedItemIds] = React15.useState(initialExpandedItemIds);
-  const handlePageItemClick = React15.useCallback(
+  const [expandedItemIds, setExpandedItemIds] = React24.useState(initialExpandedItemIds);
+  const handlePageItemClick = React24.useCallback(
     (itemId, item) => {
       if (item.children && !isMini) {
         setExpandedItemIds(
@@ -1607,7 +2279,7 @@ function DashboardSidebarSubNavigation({
     },
     [isMini, onLinkClick]
   );
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx20(
     List,
     {
       sx: {
@@ -1620,7 +2292,7 @@ function DashboardSidebarSubNavigation({
       },
       children: subNavigation.map((navigationItem, navigationItemIndex) => {
         if (navigationItem.kind === "header") {
-          return /* @__PURE__ */ jsx15(
+          return /* @__PURE__ */ jsx20(
             ListSubheader,
             {
               sx: __spreadProps(__spreadValues({
@@ -1642,7 +2314,7 @@ function DashboardSidebarSubNavigation({
         }
         if (navigationItem.kind === "divider") {
           const nextItem = subNavigation[navigationItemIndex + 1];
-          return /* @__PURE__ */ jsx15("li", { children: /* @__PURE__ */ jsx15(
+          return /* @__PURE__ */ jsx20("li", { children: /* @__PURE__ */ jsx20(
             Divider2,
             {
               sx: __spreadValues({
@@ -1655,7 +2327,7 @@ function DashboardSidebarSubNavigation({
           ) }, `divider-${depth}-${navigationItemIndex}`);
         }
         const pageItemId = `page-${depth}-${navigationItemIndex}`;
-        return /* @__PURE__ */ jsx15(
+        return /* @__PURE__ */ jsx20(
           DashboardSidebarSubNavigationPageItem,
           {
             id: pageItemId,
@@ -1678,7 +2350,7 @@ function DashboardSidebarSubNavigation({
 }
 
 // src/toolpad-core/DashboardLayout/DashboardLayout.tsx
-import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
 function DashboardLayout(props) {
   var _a, _b;
   const {
@@ -1699,26 +2371,26 @@ function DashboardLayout(props) {
       "The navigation prop in the DashboardLayout component is deprecated and will eventually be removed. Set the navigation prop in the AppProvider instead (https://mui.com/toolpad/core/react-app-provider/#navigation)."
     );
   }
-  const theme = useTheme3();
-  const navigationContext = React16.useContext(NavigationContext);
-  const appWindowContext = React16.useContext(WindowContext);
+  const theme = useTheme4();
+  const navigationContext = React25.useContext(NavigationContext);
+  const appWindowContext = React25.useContext(WindowContext);
   const navigation = navigationProp != null ? navigationProp : navigationContext;
-  const [isDesktopNavigationExpanded, setIsDesktopNavigationExpanded] = React16.useState(!defaultSidebarCollapsed);
-  const [isMobileNavigationExpanded, setIsMobileNavigationExpanded] = React16.useState(false);
-  const isOverSmViewport = useMediaQuery(
+  const [isDesktopNavigationExpanded, setIsDesktopNavigationExpanded] = React25.useState(!defaultSidebarCollapsed);
+  const [isMobileNavigationExpanded, setIsMobileNavigationExpanded] = React25.useState(false);
+  const isOverSmViewport = useMediaQuery2(
     theme.breakpoints.up("sm"),
     appWindowContext && {
       matchMedia: appWindowContext.matchMedia
     }
   );
-  const isOverMdViewport = useMediaQuery(
+  const isOverMdViewport = useMediaQuery2(
     theme.breakpoints.up("md"),
     appWindowContext && {
       matchMedia: appWindowContext.matchMedia
     }
   );
   const isNavigationExpanded = isOverMdViewport ? isDesktopNavigationExpanded : isMobileNavigationExpanded;
-  const setIsNavigationExpanded = React16.useCallback(
+  const setIsNavigationExpanded = React25.useCallback(
     (newExpanded) => {
       if (isOverMdViewport) {
         setIsDesktopNavigationExpanded(newExpanded);
@@ -1728,9 +2400,9 @@ function DashboardLayout(props) {
     },
     [isOverMdViewport]
   );
-  const [isNavigationFullyExpanded, setIsNavigationFullyExpanded] = React16.useState(isNavigationExpanded);
-  const [isNavigationFullyCollapsed, setIsNavigationFullyCollapsed] = React16.useState(!isNavigationExpanded);
-  React16.useEffect(() => {
+  const [isNavigationFullyExpanded, setIsNavigationFullyExpanded] = React25.useState(isNavigationExpanded);
+  const [isNavigationFullyCollapsed, setIsNavigationFullyCollapsed] = React25.useState(!isNavigationExpanded);
+  React25.useEffect(() => {
     if (isNavigationExpanded) {
       const drawerWidthTransitionTimeout = setTimeout(() => {
         setIsNavigationFullyExpanded(true);
@@ -1741,7 +2413,7 @@ function DashboardLayout(props) {
     return () => {
     };
   }, [isNavigationExpanded, theme]);
-  React16.useEffect(() => {
+  React25.useEffect(() => {
     if (!isNavigationExpanded) {
       const drawerWidthTransitionTimeout = setTimeout(() => {
         setIsNavigationFullyCollapsed(true);
@@ -1752,19 +2424,19 @@ function DashboardLayout(props) {
     return () => {
     };
   }, [isNavigationExpanded, theme]);
-  const handleSetNavigationExpanded = React16.useCallback(
+  const handleSetNavigationExpanded = React25.useCallback(
     (newExpanded) => () => {
       setIsNavigationExpanded(newExpanded);
     },
     [setIsNavigationExpanded]
   );
-  const handleToggleHeaderMenu = React16.useCallback(
+  const handleToggleHeaderMenu = React25.useCallback(
     (isExpanded) => {
       setIsNavigationExpanded(isExpanded);
     },
     [setIsNavigationExpanded]
   );
-  const handleNavigationLinkClick = React16.useCallback(() => {
+  const handleNavigationLinkClick = React25.useCallback(() => {
     setIsMobileNavigationExpanded(false);
   }, [setIsMobileNavigationExpanded]);
   const isDesktopMini = !disableCollapsibleSidebar && !isDesktopNavigationExpanded;
@@ -1772,7 +2444,7 @@ function DashboardLayout(props) {
   const hasDrawerTransitions = isOverSmViewport && (!disableCollapsibleSidebar || isOverMdViewport);
   const SidebarFooterSlot = (_a = slots == null ? void 0 : slots.sidebarFooter) != null ? _a : null;
   const HeaderSlot = (_b = slots == null ? void 0 : slots.header) != null ? _b : DashboardHeader;
-  const headerSlotProps = React16.useMemo(
+  const headerSlotProps = React25.useMemo(
     () => __spreadValues({
       branding,
       menuOpen: isNavigationExpanded,
@@ -1800,12 +2472,12 @@ function DashboardLayout(props) {
       slots
     ]
   );
-  const getDrawerContent = React16.useCallback(
+  const getDrawerContent = React25.useCallback(
     (isMini, viewport) => {
       var _a2;
-      return /* @__PURE__ */ jsxs10(React16.Fragment, { children: [
-        /* @__PURE__ */ jsx16(Toolbar2, {}),
-        /* @__PURE__ */ jsxs10(
+      return /* @__PURE__ */ jsxs13(React25.Fragment, { children: [
+        /* @__PURE__ */ jsx21(Toolbar2, {}),
+        /* @__PURE__ */ jsxs13(
           Box4,
           {
             component: "nav",
@@ -1821,7 +2493,7 @@ function DashboardLayout(props) {
               pt: ((_a2 = navigation[0]) == null ? void 0 : _a2.kind) === "header" && !isMini ? 0 : 2
             }, hasDrawerTransitions ? getDrawerSxTransitionMixin(isNavigationFullyExpanded, "padding") : {}),
             children: [
-              /* @__PURE__ */ jsx16(
+              /* @__PURE__ */ jsx21(
                 DashboardSidebarSubNavigation,
                 {
                   subNavigation: navigation,
@@ -1834,7 +2506,7 @@ function DashboardLayout(props) {
                   renderPageItem
                 }
               ),
-              SidebarFooterSlot ? /* @__PURE__ */ jsx16(SidebarFooterSlot, __spreadValues({ mini: isMini }, slotProps == null ? void 0 : slotProps.sidebarFooter)) : null
+              SidebarFooterSlot ? /* @__PURE__ */ jsx21(SidebarFooterSlot, __spreadValues({ mini: isMini }, slotProps == null ? void 0 : slotProps.sidebarFooter)) : null
             ]
           }
         )
@@ -1852,7 +2524,7 @@ function DashboardLayout(props) {
       slotProps == null ? void 0 : slotProps.sidebarFooter
     ]
   );
-  const getDrawerSharedSx = React16.useCallback(
+  const getDrawerSharedSx = React25.useCallback(
     (isMini, isTemporary) => {
       const drawerWidth = isMini ? MINI_DRAWER_WIDTH : sidebarExpandedWidth;
       return __spreadProps(__spreadValues(__spreadValues({
@@ -1870,7 +2542,7 @@ function DashboardLayout(props) {
     },
     [isNavigationExpanded, sidebarExpandedWidth]
   );
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs13(
     Box4,
     {
       sx: __spreadValues({
@@ -1881,9 +2553,9 @@ function DashboardLayout(props) {
         width: "100vw"
       }, sx),
       children: [
-        /* @__PURE__ */ jsx16(HeaderSlot, __spreadValues({}, headerSlotProps)),
-        !hideNavigation ? /* @__PURE__ */ jsxs10(React16.Fragment, { children: [
-          /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsx21(HeaderSlot, __spreadValues({}, headerSlotProps)),
+        !hideNavigation ? /* @__PURE__ */ jsxs13(React25.Fragment, { children: [
+          /* @__PURE__ */ jsx21(
             Drawer,
             {
               container: appWindowContext == null ? void 0 : appWindowContext.document.body,
@@ -1904,7 +2576,7 @@ function DashboardLayout(props) {
               children: getDrawerContent(false, "phone")
             }
           ),
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx21(
             Drawer,
             {
               variant: "permanent",
@@ -1918,7 +2590,7 @@ function DashboardLayout(props) {
               children: getDrawerContent(isMobileMini, "tablet")
             }
           ),
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx21(
             Drawer,
             {
               variant: "permanent",
@@ -1929,7 +2601,7 @@ function DashboardLayout(props) {
             }
           )
         ] }) : null,
-        /* @__PURE__ */ jsxs10(
+        /* @__PURE__ */ jsxs13(
           Box4,
           {
             sx: {
@@ -1939,8 +2611,8 @@ function DashboardLayout(props) {
               minWidth: 0
             },
             children: [
-              /* @__PURE__ */ jsx16(Toolbar2, { sx: { displayPrint: "none" } }),
-              /* @__PURE__ */ jsx16(
+              /* @__PURE__ */ jsx21(Toolbar2, { sx: { displayPrint: "none" } }),
+              /* @__PURE__ */ jsx21(
                 Box4,
                 {
                   component: "main",
@@ -1969,63 +2641,63 @@ DashboardLayout.propTypes = {
    * Branding options for the dashboard.
    * @default null
    */
-  branding: PropTypes9.shape({
-    homeUrl: PropTypes9.string,
-    logo: PropTypes9.node,
-    title: PropTypes9.string
+  branding: PropTypes11.shape({
+    homeUrl: PropTypes11.string,
+    logo: PropTypes11.node,
+    title: PropTypes11.string
   }),
   /**
    * The content of the dashboard.
    */
-  children: PropTypes9.node,
+  children: PropTypes11.node,
   /**
    * Whether the sidebar should start collapsed in desktop size screens.
    * @default false
    */
-  defaultSidebarCollapsed: PropTypes9.bool,
+  defaultSidebarCollapsed: PropTypes11.bool,
   /**
    * Whether the sidebar should not be collapsible to a mini variant in desktop and tablet viewports.
    * @default false
    */
-  disableCollapsibleSidebar: PropTypes9.bool,
+  disableCollapsibleSidebar: PropTypes11.bool,
   /**
    * Whether the navigation bar and menu icon should be hidden.
    * @default false
    */
-  hideNavigation: PropTypes9.bool,
+  hideNavigation: PropTypes11.bool,
   /**
    * Navigation definition for the dashboard. [Find out more](https://mui.com/toolpad/core/react-dashboard-layout/#navigation).
    * @default []
    * @deprecated Set the navigation in the [AppProvider](https://mui.com/toolpad/core/react-app-provider/#navigation) instead.
    */
-  navigation: PropTypes9.arrayOf(
-    PropTypes9.oneOfType([
-      PropTypes9.shape({
-        action: PropTypes9.node,
-        children: PropTypes9.arrayOf(
-          PropTypes9.oneOfType([
-            PropTypes9.object,
-            PropTypes9.shape({
-              kind: PropTypes9.oneOf(["header"]).isRequired,
-              title: PropTypes9.string.isRequired
+  navigation: PropTypes11.arrayOf(
+    PropTypes11.oneOfType([
+      PropTypes11.shape({
+        action: PropTypes11.node,
+        children: PropTypes11.arrayOf(
+          PropTypes11.oneOfType([
+            PropTypes11.object,
+            PropTypes11.shape({
+              kind: PropTypes11.oneOf(["header"]).isRequired,
+              title: PropTypes11.string.isRequired
             }),
-            PropTypes9.shape({
-              kind: PropTypes9.oneOf(["divider"]).isRequired
+            PropTypes11.shape({
+              kind: PropTypes11.oneOf(["divider"]).isRequired
             })
           ]).isRequired
         ),
-        icon: PropTypes9.node,
-        kind: PropTypes9.oneOf(["page"]),
-        pattern: PropTypes9.string,
-        segment: PropTypes9.string,
-        title: PropTypes9.string
+        icon: PropTypes11.node,
+        kind: PropTypes11.oneOf(["page"]),
+        pattern: PropTypes11.string,
+        segment: PropTypes11.string,
+        title: PropTypes11.string
       }),
-      PropTypes9.shape({
-        kind: PropTypes9.oneOf(["header"]).isRequired,
-        title: PropTypes9.string.isRequired
+      PropTypes11.shape({
+        kind: PropTypes11.oneOf(["header"]).isRequired,
+        title: PropTypes11.string.isRequired
       }),
-      PropTypes9.shape({
-        kind: PropTypes9.oneOf(["divider"]).isRequired
+      PropTypes11.shape({
+        kind: PropTypes11.oneOf(["divider"]).isRequired
       })
     ]).isRequired
   ),
@@ -2036,106 +2708,106 @@ DashboardLayout.propTypes = {
    * @param {{ mini: boolean }} params
    * @returns {ReactNode}
    */
-  renderPageItem: PropTypes9.func,
+  renderPageItem: PropTypes11.func,
   /**
    * Width of the sidebar when expanded.
    * @default 320
    */
-  sidebarExpandedWidth: PropTypes9.oneOfType([PropTypes9.number, PropTypes9.string]),
+  sidebarExpandedWidth: PropTypes11.oneOfType([PropTypes11.number, PropTypes11.string]),
   /**
    * The props used for each slot inside.
    * @default {}
    */
-  slotProps: PropTypes9.shape({
-    appTitle: PropTypes9.shape({
-      branding: PropTypes9.shape({
-        homeUrl: PropTypes9.string,
-        logo: PropTypes9.node,
-        title: PropTypes9.string
+  slotProps: PropTypes11.shape({
+    appTitle: PropTypes11.shape({
+      branding: PropTypes11.shape({
+        homeUrl: PropTypes11.string,
+        logo: PropTypes11.node,
+        title: PropTypes11.string
       })
     }),
-    header: PropTypes9.shape({
-      branding: PropTypes9.shape({
-        homeUrl: PropTypes9.string,
-        logo: PropTypes9.node,
-        title: PropTypes9.string
+    header: PropTypes11.shape({
+      branding: PropTypes11.shape({
+        homeUrl: PropTypes11.string,
+        logo: PropTypes11.node,
+        title: PropTypes11.string
       }),
-      hideMenuButton: PropTypes9.bool,
-      menuOpen: PropTypes9.bool.isRequired,
-      onToggleMenu: PropTypes9.func.isRequired,
-      slotProps: PropTypes9.shape({
-        appTitle: PropTypes9.object,
-        toolbarAccount: PropTypes9.object,
-        toolbarActions: PropTypes9.object
+      hideMenuButton: PropTypes11.bool,
+      menuOpen: PropTypes11.bool.isRequired,
+      onToggleMenu: PropTypes11.func.isRequired,
+      slotProps: PropTypes11.shape({
+        appTitle: PropTypes11.object,
+        toolbarAccount: PropTypes11.object,
+        toolbarActions: PropTypes11.object
       }),
-      slots: PropTypes9.shape({
-        appTitle: PropTypes9.elementType,
-        toolbarAccount: PropTypes9.elementType,
-        toolbarActions: PropTypes9.elementType
+      slots: PropTypes11.shape({
+        appTitle: PropTypes11.elementType,
+        toolbarAccount: PropTypes11.elementType,
+        toolbarActions: PropTypes11.elementType
       })
     }),
-    sidebarFooter: PropTypes9.shape({
-      mini: PropTypes9.bool.isRequired
+    sidebarFooter: PropTypes11.shape({
+      mini: PropTypes11.bool.isRequired
     }),
-    toolbarAccount: PropTypes9.shape({
-      localeText: PropTypes9.object,
-      slotProps: PropTypes9.shape({
-        popover: PropTypes9.object,
-        popoverContent: PropTypes9.object,
-        preview: PropTypes9.object,
-        signInButton: PropTypes9.object,
-        signOutButton: PropTypes9.object
+    toolbarAccount: PropTypes11.shape({
+      localeText: PropTypes11.object,
+      slotProps: PropTypes11.shape({
+        popover: PropTypes11.object,
+        popoverContent: PropTypes11.object,
+        preview: PropTypes11.object,
+        signInButton: PropTypes11.object,
+        signOutButton: PropTypes11.object
       }),
-      slots: PropTypes9.shape({
-        popover: PropTypes9.elementType,
-        popoverContent: PropTypes9.elementType,
-        preview: PropTypes9.elementType,
-        signInButton: PropTypes9.elementType,
-        signOutButton: PropTypes9.elementType
+      slots: PropTypes11.shape({
+        popover: PropTypes11.elementType,
+        popoverContent: PropTypes11.elementType,
+        preview: PropTypes11.elementType,
+        signInButton: PropTypes11.elementType,
+        signOutButton: PropTypes11.elementType
       })
     }),
-    toolbarActions: PropTypes9.object
+    toolbarActions: PropTypes11.object
   }),
   /**
    * The components used for each slot inside.
    * @default {}
    */
-  slots: PropTypes9.shape({
-    appTitle: PropTypes9.elementType,
-    header: PropTypes9.elementType,
-    sidebarFooter: PropTypes9.elementType,
-    toolbarAccount: PropTypes9.elementType,
-    toolbarActions: PropTypes9.elementType
+  slots: PropTypes11.shape({
+    appTitle: PropTypes11.elementType,
+    header: PropTypes11.elementType,
+    sidebarFooter: PropTypes11.elementType,
+    toolbarAccount: PropTypes11.elementType,
+    toolbarActions: PropTypes11.elementType
   }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes9.oneOfType([
-    PropTypes9.arrayOf(PropTypes9.oneOfType([PropTypes9.func, PropTypes9.object, PropTypes9.bool])),
-    PropTypes9.func,
-    PropTypes9.object
+  sx: PropTypes11.oneOfType([
+    PropTypes11.arrayOf(PropTypes11.oneOfType([PropTypes11.func, PropTypes11.object, PropTypes11.bool])),
+    PropTypes11.func,
+    PropTypes11.object
   ])
 };
 
 // src/toolpad-core/PageContainer/PageContainer.tsx
-import PropTypes12 from "prop-types";
+import PropTypes14 from "prop-types";
 import Box5 from "@mui/material/Box";
 import Container from "@mui/material/Container";
 import Stack8 from "@mui/material/Stack";
 
 // src/toolpad-core/PageContainer/PageHeader.tsx
-import PropTypes11 from "prop-types";
+import PropTypes13 from "prop-types";
 import Breadcrumbs from "@mui/material/Breadcrumbs";
 import Link4 from "@mui/material/Link";
 import Stack7 from "@mui/material/Stack";
 import Typography4 from "@mui/material/Typography";
-import useSlotProps from "@mui/utils/useSlotProps";
+import useSlotProps2 from "@mui/utils/useSlotProps";
 import { styled as styled5 } from "@mui/material";
 
 // src/toolpad-core/PageContainer/PageHeaderToolbar.tsx
-import PropTypes10 from "prop-types";
+import PropTypes12 from "prop-types";
 import { styled as styled4 } from "@mui/material";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 var PageHeaderToolbarRoot = styled4("div")(({ theme }) => ({
   display: "flex",
   flexDirection: "row",
@@ -2144,7 +2816,7 @@ var PageHeaderToolbarRoot = styled4("div")(({ theme }) => ({
   marginLeft: "auto"
 }));
 function PageHeaderToolbar(props) {
-  return /* @__PURE__ */ jsx17(PageHeaderToolbarRoot, __spreadValues({}, props));
+  return /* @__PURE__ */ jsx22(PageHeaderToolbarRoot, __spreadValues({}, props));
 }
 PageHeaderToolbar.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
@@ -2154,11 +2826,11 @@ PageHeaderToolbar.propTypes = {
   /**
    * @ignore
    */
-  children: PropTypes10.node
+  children: PropTypes12.node
 };
 
 // src/toolpad-core/PageContainer/PageHeader.tsx
-import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
 var PageContentHeader = styled5("div")(({ theme }) => ({
   display: "flex",
   flexDirection: "row",
@@ -2172,15 +2844,15 @@ function PageHeader(props) {
   const resolvedBreadcrumbs = (_a = breadcrumbs != null ? breadcrumbs : activePage == null ? void 0 : activePage.breadcrumbs) != null ? _a : [];
   const resolvedTitle = (_b = title != null ? title : activePage == null ? void 0 : activePage.title) != null ? _b : "";
   const ToolbarComponent = (_d = (_c = props == null ? void 0 : props.slots) == null ? void 0 : _c.toolbar) != null ? _d : PageHeaderToolbar;
-  const toolbarSlotProps = useSlotProps({
+  const toolbarSlotProps = useSlotProps2({
     elementType: ToolbarComponent,
     ownerState: props,
     externalSlotProps: (_e = props == null ? void 0 : props.slotProps) == null ? void 0 : _e.toolbar,
     additionalProps: {}
   });
-  return /* @__PURE__ */ jsxs11(Stack7, { children: [
-    /* @__PURE__ */ jsx18(Breadcrumbs, { "aria-label": "breadcrumb", children: resolvedBreadcrumbs ? resolvedBreadcrumbs.map((item, index) => {
-      return item.path ? /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsxs14(Stack7, { children: [
+    /* @__PURE__ */ jsx23(Breadcrumbs, { "aria-label": "breadcrumb", children: resolvedBreadcrumbs ? resolvedBreadcrumbs.map((item, index) => {
+      return item.path ? /* @__PURE__ */ jsx23(
         Link4,
         {
           component: Link2,
@@ -2190,11 +2862,11 @@ function PageHeader(props) {
           children: getItemTitle(item)
         },
         index
-      ) : /* @__PURE__ */ jsx18(Typography4, { color: "text.primary", children: getItemTitle(item) }, index);
+      ) : /* @__PURE__ */ jsx23(Typography4, { color: "text.primary", children: getItemTitle(item) }, index);
     }) : null }),
-    /* @__PURE__ */ jsxs11(PageContentHeader, { children: [
-      resolvedTitle ? /* @__PURE__ */ jsx18(Typography4, { variant: "h4", children: resolvedTitle }) : null,
-      /* @__PURE__ */ jsx18(ToolbarComponent, __spreadValues({}, toolbarSlotProps))
+    /* @__PURE__ */ jsxs14(PageContentHeader, { children: [
+      resolvedTitle ? /* @__PURE__ */ jsx23(Typography4, { variant: "h4", children: resolvedTitle }) : null,
+      /* @__PURE__ */ jsx23(ToolbarComponent, __spreadValues({}, toolbarSlotProps))
     ] })
   ] });
 }
@@ -2206,41 +2878,41 @@ PageHeader.propTypes = {
   /**
    * The breadcrumbs of the page. Leave blank to use the active page breadcrumbs.
    */
-  breadcrumbs: PropTypes11.arrayOf(
-    PropTypes11.shape({
-      path: PropTypes11.string,
-      title: PropTypes11.string.isRequired
+  breadcrumbs: PropTypes13.arrayOf(
+    PropTypes13.shape({
+      path: PropTypes13.string,
+      title: PropTypes13.string.isRequired
     })
   ),
   /**
    * The props used for each slot inside.
    */
-  slotProps: PropTypes11.shape({
-    toolbar: PropTypes11.shape({
-      children: PropTypes11.node
+  slotProps: PropTypes13.shape({
+    toolbar: PropTypes13.shape({
+      children: PropTypes13.node
     }).isRequired
   }),
   /**
    * The components used for each slot inside.
    */
-  slots: PropTypes11.shape({
-    toolbar: PropTypes11.elementType
+  slots: PropTypes13.shape({
+    toolbar: PropTypes13.elementType
   }),
   /**
    * The title of the page. Leave blank to use the active page title.
    */
-  title: PropTypes11.string
+  title: PropTypes13.string
 };
 
 // src/toolpad-core/PageContainer/PageContainer.tsx
-import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
 function PageContainer(props) {
   var _b;
   const _a = props, { children, breadcrumbs, slots, slotProps, title } = _a, rest = __objRest(_a, ["children", "breadcrumbs", "slots", "slotProps", "title"]);
   const PageHeaderSlot = (_b = slots == null ? void 0 : slots.header) != null ? _b : PageHeader;
-  return /* @__PURE__ */ jsx19(Container, __spreadProps(__spreadValues({}, rest), { sx: __spreadValues({ flex: 1, display: "flex", flexDirection: "column" }, rest.sx), children: /* @__PURE__ */ jsxs12(Stack8, { sx: { flex: 1, my: 2 }, spacing: 2, children: [
-    /* @__PURE__ */ jsx19(PageHeaderSlot, __spreadValues({ title, breadcrumbs }, slotProps == null ? void 0 : slotProps.header)),
-    /* @__PURE__ */ jsx19(Box5, { sx: { flex: 1, display: "flex", flexDirection: "column" }, children })
+  return /* @__PURE__ */ jsx24(Container, __spreadProps(__spreadValues({}, rest), { sx: __spreadValues({ flex: 1, display: "flex", flexDirection: "column" }, rest.sx), children: /* @__PURE__ */ jsxs15(Stack8, { sx: { flex: 1, my: 2 }, spacing: 2, children: [
+    /* @__PURE__ */ jsx24(PageHeaderSlot, __spreadValues({ title, breadcrumbs }, slotProps == null ? void 0 : slotProps.header)),
+    /* @__PURE__ */ jsx24(Box5, { sx: { flex: 1, display: "flex", flexDirection: "column" }, children })
   ] }) }));
 }
 PageContainer.propTypes = {
@@ -2251,62 +2923,74 @@ PageContainer.propTypes = {
   /**
    * The breadcrumbs of the page. Leave blank to use the active page breadcrumbs.
    */
-  breadcrumbs: PropTypes12.arrayOf(
-    PropTypes12.shape({
-      path: PropTypes12.string,
-      title: PropTypes12.string.isRequired
+  breadcrumbs: PropTypes14.arrayOf(
+    PropTypes14.shape({
+      path: PropTypes14.string,
+      title: PropTypes14.string.isRequired
     })
   ),
   /**
    * @ignore
    */
-  children: PropTypes12.node,
+  children: PropTypes14.node,
   /**
    * The props used for each slot inside.
    */
-  slotProps: PropTypes12.shape({
-    header: PropTypes12.shape({
-      breadcrumbs: PropTypes12.arrayOf(
-        PropTypes12.shape({
-          path: PropTypes12.string,
-          title: PropTypes12.string.isRequired
+  slotProps: PropTypes14.shape({
+    header: PropTypes14.shape({
+      breadcrumbs: PropTypes14.arrayOf(
+        PropTypes14.shape({
+          path: PropTypes14.string,
+          title: PropTypes14.string.isRequired
         })
       ),
-      slotProps: PropTypes12.shape({
-        toolbar: PropTypes12.object.isRequired
+      slotProps: PropTypes14.shape({
+        toolbar: PropTypes14.object.isRequired
       }),
-      slots: PropTypes12.shape({
-        toolbar: PropTypes12.elementType
+      slots: PropTypes14.shape({
+        toolbar: PropTypes14.elementType
       }),
-      title: PropTypes12.string
+      title: PropTypes14.string
     }).isRequired
   }),
   /**
    * The components used for each slot inside.
    */
-  slots: PropTypes12.shape({
-    header: PropTypes12.elementType
+  slots: PropTypes14.shape({
+    header: PropTypes14.elementType
   }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes12.oneOfType([
-    PropTypes12.arrayOf(PropTypes12.oneOfType([PropTypes12.func, PropTypes12.object, PropTypes12.bool])),
-    PropTypes12.func,
-    PropTypes12.object
+  sx: PropTypes14.oneOfType([
+    PropTypes14.arrayOf(PropTypes14.oneOfType([PropTypes14.func, PropTypes14.object, PropTypes14.bool])),
+    PropTypes14.func,
+    PropTypes14.object
   ]),
   /**
    * The title of the page. Leave blank to use the active page title.
    */
-  title: PropTypes12.string
+  title: PropTypes14.string
 };
 
 export {
   useNotifications,
+  en_default,
+  LocalizationContext,
+  LocalizationProvider,
+  useLocaleText,
+  NotificationsProvider,
   AlertDialog,
   ConfirmDialog,
   PromptDialog,
   useDialogs,
+  DialogsProvider,
+  useStorageStateServer,
+  useStorageState,
+  useLocalStorageState,
+  AuthenticationContext,
+  SessionContext,
+  AppProvider,
   SignInButton,
   SignOutButton,
   AccountPreview,