@xyo-network/react-appbar 2.25.68 → 2.25.69

package/dist/cjs/WebAppNavigationType.d.ts

@@ -0,0 +1 @@
+export declare type WebAppNavigationType = 'menu' | 'sidebar';

package/dist/cjs/WebAppNavigationType.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=WebAppNavigationType.js.map

package/dist/cjs/WebAppNavigationType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebAppNavigationType.js","sourceRoot":"","sources":["../../src/WebAppNavigationType.ts"],"names":[],"mappings":""}

package/dist/cjs/components/AppBar/Application.js

@@ -6,8 +6,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_common_1 = require("@xylabs/react-common");
 const Toolbar_1 = require("../Toolbar");
 const ApplicationAppBar = (_a) => {
-    var { systemToolbar = (0, jsx_runtime_1.jsx)(Toolbar_1.SystemToolbar, {}), contextToolbar = (0, jsx_runtime_1.jsx)(Toolbar_1.ContextToolbar, {}), responsive = true } = _a, props = tslib_1.__rest(_a, ["systemToolbar", "contextToolbar", "responsive"]);
-    return (0, jsx_runtime_1.jsx)(react_common_1.AppBarEx, Object.assign({ systemToolbar: systemToolbar, contextToolbar: contextToolbar, position: "sticky", responsive: responsive }, props));
+    var { systemToolbar, contextToolbar, responsive = true } = _a, props = tslib_1.__rest(_a, ["systemToolbar", "contextToolbar", "responsive"]);
+    return (0, jsx_runtime_1.jsx)(react_common_1.AppBarEx, Object.assign({ systemToolbar: systemToolbar !== null && systemToolbar !== void 0 ? systemToolbar : (0, jsx_runtime_1.jsx)(Toolbar_1.SystemToolbar, {}), contextToolbar: contextToolbar !== null && contextToolbar !== void 0 ? contextToolbar : (0, jsx_runtime_1.jsx)(Toolbar_1.ContextToolbar, {}), position: "sticky", responsive: responsive }, props));
 };
 exports.ApplicationAppBar = ApplicationAppBar;
 //# sourceMappingURL=Application.js.map

package/dist/cjs/components/AppBar/Application.js.map

@@ -1 +1 @@
-{"version":3,"file":"Application.js","sourceRoot":"","sources":["../../../../src/components/AppBar/Application.tsx"],"names":[],"mappings":";;;;;AACA,uDAA8D;AAG9D,wCAA0D;AAQnD,MAAM,iBAAiB,GAAqC,CAAC,EAAuG,EAAE,EAAE;QAA3G,EAAE,aAAa,GAAG,uBAAC,uBAAa,KAAG,EAAE,cAAc,GAAG,uBAAC,wBAAc,KAAG,EAAE,UAAU,GAAG,IAAI,OAAY,EAAP,KAAK,sBAArG,iDAAuG,CAAF;IACvK,OAAO,uBAAC,uBAAQ,kBAAC,aAAa,EAAE,aAAa,EAAE,cAAc,EAAE,cAAc,EAAE,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAE,UAAU,IAAM,KAAK,EAAI,CAAA;AACxI,CAAC,CAAA;AAFY,QAAA,iBAAiB,qBAE7B"}
+{"version":3,"file":"Application.js","sourceRoot":"","sources":["../../../../src/components/AppBar/Application.tsx"],"names":[],"mappings":";;;;;AACA,uDAA8D;AAG9D,wCAA0D;AAQnD,MAAM,iBAAiB,GAAqC,CAAC,EAA8D,EAAE,EAAE;QAAlE,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,GAAG,IAAI,OAAY,EAAP,KAAK,sBAA5D,iDAA8D,CAAF;IAC9H,OAAO,uBAAC,uBAAQ,kBAAC,aAAa,EAAE,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,uBAAC,uBAAa,KAAG,EAAE,cAAc,EAAE,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,uBAAC,wBAAc,KAAG,EAAE,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAE,UAAU,IAAM,KAAK,EAAI,CAAA;AACnL,CAAC,CAAA;AAFY,QAAA,iBAAiB,qBAE7B"}

package/dist/cjs/components/DarkModeIconButton.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconButtonProps } from '@mui/material';
+export declare const DarkModeIconButton: React.FC<IconButtonProps>;

package/dist/cjs/components/DarkModeIconButton.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DarkModeIconButton = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const DarkModeRounded_1 = tslib_1.__importDefault(require("@mui/icons-material/DarkModeRounded"));
+const LightModeRounded_1 = tslib_1.__importDefault(require("@mui/icons-material/LightModeRounded"));
+const material_1 = require("@mui/material");
+const DarkModeIconButton = (props) => {
+    const { darkMode, enableDarkMode } = useAppSettings();
+    const handleDarkModeChange = () => {
+        enableDarkMode === null || enableDarkMode === void 0 ? void 0 : enableDarkMode(!darkMode);
+    };
+    return ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: handleDarkModeChange }, props, { children: darkMode ? (0, jsx_runtime_1.jsx)(DarkModeRounded_1.default, {}) : (0, jsx_runtime_1.jsx)(LightModeRounded_1.default, {}) })));
+};
+exports.DarkModeIconButton = DarkModeIconButton;
+//# sourceMappingURL=DarkModeIconButton.js.map

package/dist/cjs/components/DarkModeIconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DarkModeIconButton.js","sourceRoot":"","sources":["../../../src/components/DarkModeIconButton.tsx"],"names":[],"mappings":";;;;;AAAA,kGAAqE;AACrE,oGAAuE;AACvE,4CAA2D;AAEpD,MAAM,kBAAkB,GAA8B,CAAC,KAAK,EAAE,EAAE;IACrE,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,cAAc,EAAE,CAAA;IAErD,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,CAAC,QAAQ,CAAC,CAAA;IAC7B,CAAC,CAAA;IAED,OAAO,CACL,uBAAC,qBAAU,kBAAC,OAAO,EAAE,oBAAoB,IAAM,KAAK,cACjD,QAAQ,CAAC,CAAC,CAAC,uBAAC,yBAAmB,KAAG,CAAC,CAAC,CAAC,uBAAC,0BAAoB,KAAG,IACnD,CACd,CAAA;AACH,CAAC,CAAA;AAZY,QAAA,kBAAkB,sBAY9B"}

package/dist/cjs/components/Toolbar/System/SystemToolbar.d.ts

@@ -7,9 +7,8 @@ export interface SystemToolbarProps extends ToolbarProps {
     archiveSelectProps?: SelectExProps<string>;
     hideNetworkSelect?: boolean;
     hideArchiveSelect?: boolean;
-    menu?: ReactNode;
     darkModeButton?: boolean;
     authButton?: boolean;
-    noMenu?: boolean;
+    menuItems?: ReactNode;
 }
 export declare const SystemToolbar: React.FC<SystemToolbarProps>;

package/dist/cjs/components/Toolbar/System/SystemToolbar.js

@@ -5,14 +5,14 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const react_flexbox_1 = require("@xylabs/react-flexbox");
+const react_app_settings_1 = require("@xyo-network/react-app-settings");
 const react_archive_1 = require("@xyo-network/react-archive");
 const react_auth_1 = require("@xyo-network/react-auth");
 const react_network_1 = require("@xyo-network/react-network");
-const react_shared_1 = require("@xyo-network/react-shared");
 const SiteMenu_1 = require("../../SiteMenu");
 const SystemToolbar = (_a) => {
-    var { children, networkSelectProps, archiveSelectProps, hideNetworkSelect, hideArchiveSelect, menu, darkModeButton = false, authButton = false, noMenu = false } = _a, props = tslib_1.__rest(_a, ["children", "networkSelectProps", "archiveSelectProps", "hideNetworkSelect", "hideArchiveSelect", "menu", "darkModeButton", "authButton", "noMenu"]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Toolbar, Object.assign({}, props, { children: [hideNetworkSelect ? null : ((0, jsx_runtime_1.jsx)(react_flexbox_1.FlexRow, Object.assign({ marginX: 0.5, maxWidth: 120 }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ variant: "elevation" }, { children: (0, jsx_runtime_1.jsx)(react_network_1.NetworkSelectEx, Object.assign({ fullWidth: true }, networkSelectProps)) })) }))), hideArchiveSelect ? null : ((0, jsx_runtime_1.jsx)(react_flexbox_1.FlexRow, Object.assign({ marginX: 0.5, maxWidth: 120 }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ variant: "elevation" }, { children: (0, jsx_runtime_1.jsx)(react_archive_1.ArchiveSelectEx, Object.assign({ fullWidth: true }, archiveSelectProps)) })) }))), children, authButton ? (0, jsx_runtime_1.jsx)(react_auth_1.AuthStatusIconButton, { color: "inherit" }) : null, darkModeButton ? (0, jsx_runtime_1.jsx)(react_shared_1.DarkModeIconButton, { color: "inherit" }) : null, noMenu ? null : (0, jsx_runtime_1.jsx)(SiteMenu_1.SiteMenu, { children: menu })] })));
+    var { children, networkSelectProps, archiveSelectProps, hideNetworkSelect, hideArchiveSelect, darkModeButton = false, authButton = false, menuItems } = _a, props = tslib_1.__rest(_a, ["children", "networkSelectProps", "archiveSelectProps", "hideNetworkSelect", "hideArchiveSelect", "darkModeButton", "authButton", "menuItems"]);
+    return ((0, jsx_runtime_1.jsxs)(material_1.Toolbar, Object.assign({}, props, { children: [hideNetworkSelect ? null : ((0, jsx_runtime_1.jsx)(react_flexbox_1.FlexRow, Object.assign({ marginX: 0.5, maxWidth: 120 }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ variant: "elevation" }, { children: (0, jsx_runtime_1.jsx)(react_network_1.NetworkSelectEx, Object.assign({ fullWidth: true }, networkSelectProps)) })) }))), hideArchiveSelect ? null : ((0, jsx_runtime_1.jsx)(react_flexbox_1.FlexRow, Object.assign({ marginX: 0.5, maxWidth: 120 }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ variant: "elevation" }, { children: (0, jsx_runtime_1.jsx)(react_archive_1.ArchiveSelectEx, Object.assign({ fullWidth: true }, archiveSelectProps)) })) }))), children, authButton ? (0, jsx_runtime_1.jsx)(react_auth_1.AuthStatusIconButton, { color: "inherit" }) : null, darkModeButton ? (0, jsx_runtime_1.jsx)(react_app_settings_1.DarkModeIconButton, { color: "inherit" }) : null, menuItems ? (0, jsx_runtime_1.jsx)(SiteMenu_1.SiteMenu, { children: menuItems }) : null] })));
 };
 exports.SystemToolbar = SystemToolbar;
 //# sourceMappingURL=SystemToolbar.js.map

package/dist/cjs/components/Toolbar/System/SystemToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SystemToolbar.js","sourceRoot":"","sources":["../../../../../src/components/Toolbar/System/SystemToolbar.tsx"],"names":[],"mappings":";;;;;AAAA,4CAA4D;AAE5D,yDAA+C;AAC/C,8DAA4D;AAC5D,wDAA8D;AAC9D,8DAAkF;AAClF,4DAA8D;AAG9D,6CAAyC;AAalC,MAAM,aAAa,GAAiC,CAAC,EAW3D,EAAE,EAAE;QAXuD,EAC1D,QAAQ,EACR,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,IAAI,EACJ,cAAc,GAAG,KAAK,EACtB,UAAU,GAAG,KAAK,EAClB,MAAM,GAAG,KAAK,OAEf,EADI,KAAK,sBAVkD,oJAW3D,CADS;IAER,OAAO,CACL,wBAAC,kBAAO,oBAAK,KAAK,eACf,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,uBAAC,uBAAO,kBAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,gBAClC,uBAAC,gBAAK,kBAAC,OAAO,EAAC,WAAW,gBACxB,uBAAC,+BAAe,kBAAC,SAAS,UAAK,kBAAkB,EAAI,IAC/C,IACA,CACX,EACA,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,uBAAC,uBAAO,kBAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,gBAClC,uBAAC,gBAAK,kBAAC,OAAO,EAAC,WAAW,gBACxB,uBAAC,+BAAe,kBAAC,SAAS,UAAK,kBAAkB,EAAI,IAC/C,IACA,CACX,EACA,QAAQ,EACR,UAAU,CAAC,CAAC,CAAC,uBAAC,iCAAoB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC5D,cAAc,CAAC,CAAC,CAAC,uBAAC,iCAAkB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC9D,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,uBAAC,mBAAQ,cAAE,IAAI,GAAY,KACpC,CACX,CAAA;AACH,CAAC,CAAA;AAlCY,QAAA,aAAa,iBAkCzB"}
+{"version":3,"file":"SystemToolbar.js","sourceRoot":"","sources":["../../../../../src/components/Toolbar/System/SystemToolbar.tsx"],"names":[],"mappings":";;;;;AAAA,4CAA4D;AAE5D,yDAA+C;AAC/C,wEAAoE;AACpE,8DAA4D;AAC5D,wDAA8D;AAC9D,8DAAkF;AAGlF,6CAAyC;AAYlC,MAAM,aAAa,GAAiC,CAAC,EAU3D,EAAE,EAAE;QAVuD,EAC1D,QAAQ,EACR,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,GAAG,KAAK,EACtB,UAAU,GAAG,KAAK,EAClB,SAAS,OAEV,EADI,KAAK,sBATkD,+IAU3D,CADS;IAER,OAAO,CACL,wBAAC,kBAAO,oBAAK,KAAK,eACf,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,uBAAC,uBAAO,kBAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,gBAClC,uBAAC,gBAAK,kBAAC,OAAO,EAAC,WAAW,gBACxB,uBAAC,+BAAe,kBAAC,SAAS,UAAK,kBAAkB,EAAI,IAC/C,IACA,CACX,EACA,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,uBAAC,uBAAO,kBAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,gBAClC,uBAAC,gBAAK,kBAAC,OAAO,EAAC,WAAW,gBACxB,uBAAC,+BAAe,kBAAC,SAAS,UAAK,kBAAkB,EAAI,IAC/C,IACA,CACX,EACA,QAAQ,EACR,UAAU,CAAC,CAAC,CAAC,uBAAC,iCAAoB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC5D,cAAc,CAAC,CAAC,CAAC,uBAAC,uCAAkB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC9D,SAAS,CAAC,CAAC,CAAC,uBAAC,mBAAQ,cAAE,SAAS,GAAY,CAAC,CAAC,CAAC,IAAI,KAC5C,CACX,CAAA;AACH,CAAC,CAAA;AAjCY,QAAA,aAAa,iBAiCzB"}

package/dist/esm/WebAppNavigationType.d.ts

@@ -0,0 +1 @@
+export declare type WebAppNavigationType = 'menu' | 'sidebar';

package/dist/esm/WebAppNavigationType.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=WebAppNavigationType.js.map

package/dist/esm/WebAppNavigationType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebAppNavigationType.js","sourceRoot":"","sources":["../../src/WebAppNavigationType.ts"],"names":[],"mappings":""}

package/dist/esm/components/AppBar/Application.d.ts

@@ -1,10 +1,9 @@
 import { ToolbarProps } from '@mui/material';
 import { AppBarExProps } from '@xylabs/react-common';
-import { ReactElement, ReactNode } from 'react';
+import { ReactElement } from 'react';
 export interface ApplicationAppBarProps extends AppBarExProps {
     contextToolbar?: ReactElement<ToolbarProps>;
     systemToolbar?: ReactElement<ToolbarProps>;
     responsive?: boolean;
-    menuItems?: ReactNode;
 }
 export declare const ApplicationAppBar: React.FC<ApplicationAppBarProps>;

package/dist/esm/components/AppBar/Application.js

@@ -1,9 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Toolbar } from '@mui/material';
 import { AppBarEx } from '@xylabs/react-common';
-import { SiteMenu } from '../SiteMenu';
 import { ContextToolbar, SystemToolbar } from '../Toolbar';
-export const ApplicationAppBar = ({ menuItems, menu, systemToolbar = _jsx(SystemToolbar, {}), contextToolbar = _jsx(ContextToolbar, {}), responsive = true, ...props }) => {
-    return (_jsx(AppBarEx, { systemToolbar: systemToolbar, contextToolbar: contextToolbar, menu: (menu ?? menuItems) ? (_jsx(Toolbar, { children: _jsx(SiteMenu, { children: menuItems }) })) : undefined, position: "sticky", responsive: responsive, ...props }));
+export const ApplicationAppBar = ({ systemToolbar, contextToolbar, responsive = true, ...props }) => {
+    return _jsx(AppBarEx, { systemToolbar: systemToolbar ?? _jsx(SystemToolbar, {}), contextToolbar: contextToolbar ?? _jsx(ContextToolbar, {}), position: "sticky", responsive: responsive, ...props });
 };
 //# sourceMappingURL=Application.js.map

package/dist/esm/components/AppBar/Application.js.map

@@ -1 +1 @@
-{"version":3,"file":"Application.js","sourceRoot":"","sources":["../../../../src/components/AppBar/Application.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAgB,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,QAAQ,EAAiB,MAAM,sBAAsB,CAAA;AAG9D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAS1D,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAClE,SAAS,EACT,IAAI,EACJ,aAAa,GAAG,KAAC,aAAa,KAAG,EACjC,cAAc,GAAG,KAAC,cAAc,KAAG,EACnC,UAAU,GAAG,IAAI,EACjB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,KAAC,QAAQ,IACP,aAAa,EAAE,aAAa,EAC5B,cAAc,EAAE,cAAc,EAC9B,IAAI,EACF,CAAA,IAAI,IAAI,SAAS,EAAC,CAAC,CAAC,CAClB,KAAC,OAAO,cACN,KAAC,QAAQ,cAAE,SAAS,GAAY,GACxB,CACX,CAAC,CAAC,CAAC,SAAS,EAEf,QAAQ,EAAC,QAAQ,EACjB,UAAU,EAAE,UAAU,KAClB,KAAK,GACT,CACH,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Application.js","sourceRoot":"","sources":["../../../../src/components/AppBar/Application.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAiB,MAAM,sBAAsB,CAAA;AAG9D,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAQ1D,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACpI,OAAO,KAAC,QAAQ,IAAC,aAAa,EAAE,aAAa,IAAI,KAAC,aAAa,KAAG,EAAE,cAAc,EAAE,cAAc,IAAI,KAAC,cAAc,KAAG,EAAE,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAE,UAAU,KAAM,KAAK,GAAI,CAAA;AACnL,CAAC,CAAA"}

package/dist/esm/components/DarkModeIconButton.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconButtonProps } from '@mui/material';
+export declare const DarkModeIconButton: React.FC<IconButtonProps>;

package/dist/esm/components/DarkModeIconButton.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import DarkModeRoundedIcon from '@mui/icons-material/DarkModeRounded';
+import LightModeRoundedIcon from '@mui/icons-material/LightModeRounded';
+import { IconButton } from '@mui/material';
+export const DarkModeIconButton = (props) => {
+    const { darkMode, enableDarkMode } = useAppSettings();
+    const handleDarkModeChange = () => {
+        enableDarkMode?.(!darkMode);
+    };
+    return (_jsx(IconButton, { onClick: handleDarkModeChange, ...props, children: darkMode ? _jsx(DarkModeRoundedIcon, {}) : _jsx(LightModeRoundedIcon, {}) }));
+};
+//# sourceMappingURL=DarkModeIconButton.js.map

package/dist/esm/components/DarkModeIconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DarkModeIconButton.js","sourceRoot":"","sources":["../../../src/components/DarkModeIconButton.tsx"],"names":[],"mappings":";AAAA,OAAO,mBAAmB,MAAM,qCAAqC,CAAA;AACrE,OAAO,oBAAoB,MAAM,sCAAsC,CAAA;AACvE,OAAO,EAAE,UAAU,EAAmB,MAAM,eAAe,CAAA;AAE3D,MAAM,CAAC,MAAM,kBAAkB,GAA8B,CAAC,KAAK,EAAE,EAAE;IACrE,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,cAAc,EAAE,CAAA;IAErD,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,cAAc,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAA;IAC7B,CAAC,CAAA;IAED,OAAO,CACL,KAAC,UAAU,IAAC,OAAO,EAAE,oBAAoB,KAAM,KAAK,YACjD,QAAQ,CAAC,CAAC,CAAC,KAAC,mBAAmB,KAAG,CAAC,CAAC,CAAC,KAAC,oBAAoB,KAAG,GACnD,CACd,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/Toolbar/System/SystemToolbar.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
 import { ToolbarProps } from '@mui/material';
 import { SelectExProps } from '@xylabs/react-common';
 import { NetworkSelectExProps } from '@xyo-network/react-network';
+import { ReactNode } from 'react';
 export interface SystemToolbarProps extends ToolbarProps {
     networkSelectProps?: NetworkSelectExProps;
     archiveSelectProps?: SelectExProps<string>;
@@ -9,5 +9,6 @@ export interface SystemToolbarProps extends ToolbarProps {
     hideArchiveSelect?: boolean;
     darkModeButton?: boolean;
     authButton?: boolean;
+    menuItems?: ReactNode;
 }
 export declare const SystemToolbar: React.FC<SystemToolbarProps>;

package/dist/esm/components/Toolbar/System/SystemToolbar.js

@@ -5,7 +5,8 @@ import { DarkModeIconButton } from '@xyo-network/react-app-settings';
 import { ArchiveSelectEx } from '@xyo-network/react-archive';
 import { AuthStatusIconButton } from '@xyo-network/react-auth';
 import { NetworkSelectEx } from '@xyo-network/react-network';
-export const SystemToolbar = ({ children, networkSelectProps, archiveSelectProps, hideNetworkSelect, hideArchiveSelect, darkModeButton = false, authButton = false, ...props }) => {
-    return (_jsxs(Toolbar, { ...props, children: [hideNetworkSelect ? null : (_jsx(FlexRow, { marginX: 0.5, maxWidth: 120, children: _jsx(Paper, { variant: "elevation", children: _jsx(NetworkSelectEx, { fullWidth: true, ...networkSelectProps }) }) })), hideArchiveSelect ? null : (_jsx(FlexRow, { marginX: 0.5, maxWidth: 120, children: _jsx(Paper, { variant: "elevation", children: _jsx(ArchiveSelectEx, { fullWidth: true, ...archiveSelectProps }) }) })), children, authButton ? _jsx(AuthStatusIconButton, { color: "inherit" }) : null, darkModeButton ? _jsx(DarkModeIconButton, { color: "inherit" }) : null] }));
+import { SiteMenu } from '../../SiteMenu';
+export const SystemToolbar = ({ children, networkSelectProps, archiveSelectProps, hideNetworkSelect, hideArchiveSelect, darkModeButton = false, authButton = false, menuItems, ...props }) => {
+    return (_jsxs(Toolbar, { ...props, children: [hideNetworkSelect ? null : (_jsx(FlexRow, { marginX: 0.5, maxWidth: 120, children: _jsx(Paper, { variant: "elevation", children: _jsx(NetworkSelectEx, { fullWidth: true, ...networkSelectProps }) }) })), hideArchiveSelect ? null : (_jsx(FlexRow, { marginX: 0.5, maxWidth: 120, children: _jsx(Paper, { variant: "elevation", children: _jsx(ArchiveSelectEx, { fullWidth: true, ...archiveSelectProps }) }) })), children, authButton ? _jsx(AuthStatusIconButton, { color: "inherit" }) : null, darkModeButton ? _jsx(DarkModeIconButton, { color: "inherit" }) : null, menuItems ? _jsx(SiteMenu, { children: menuItems }) : null] }));
 };
 //# sourceMappingURL=SystemToolbar.js.map

package/dist/esm/components/Toolbar/System/SystemToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SystemToolbar.js","sourceRoot":"","sources":["../../../../../src/components/Toolbar/System/SystemToolbar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,OAAO,EAAgB,MAAM,eAAe,CAAA;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAA;AACpE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAC9D,OAAO,EAAE,eAAe,EAAwB,MAAM,4BAA4B,CAAA;AAWlF,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,EACR,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,GAAG,KAAK,EACtB,UAAU,GAAG,KAAK,EAClB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,MAAC,OAAO,OAAK,KAAK,aACf,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,KAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,YAClC,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,YACxB,KAAC,eAAe,IAAC,SAAS,WAAK,kBAAkB,GAAI,GAC/C,GACA,CACX,EACA,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,KAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,YAClC,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,YACxB,KAAC,eAAe,IAAC,SAAS,WAAK,kBAAkB,GAAI,GAC/C,GACA,CACX,EACA,QAAQ,EACR,UAAU,CAAC,CAAC,CAAC,KAAC,oBAAoB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC5D,cAAc,CAAC,CAAC,CAAC,KAAC,kBAAkB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,IACvD,CACX,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"SystemToolbar.js","sourceRoot":"","sources":["../../../../../src/components/Toolbar/System/SystemToolbar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,OAAO,EAAgB,MAAM,eAAe,CAAA;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAA;AACpE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAC9D,OAAO,EAAE,eAAe,EAAwB,MAAM,4BAA4B,CAAA;AAGlF,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAYzC,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,EACR,kBAAkB,EAClB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,GAAG,KAAK,EACtB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,MAAC,OAAO,OAAK,KAAK,aACf,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,KAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,YAClC,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,YACxB,KAAC,eAAe,IAAC,SAAS,WAAK,kBAAkB,GAAI,GAC/C,GACA,CACX,EACA,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,KAAC,OAAO,IAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,YAClC,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,YACxB,KAAC,eAAe,IAAC,SAAS,WAAK,kBAAkB,GAAI,GAC/C,GACA,CACX,EACA,QAAQ,EACR,UAAU,CAAC,CAAC,CAAC,KAAC,oBAAoB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC5D,cAAc,CAAC,CAAC,CAAC,KAAC,kBAAkB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC9D,SAAS,CAAC,CAAC,CAAC,KAAC,QAAQ,cAAE,SAAS,GAAY,CAAC,CAAC,CAAC,IAAI,IAC5C,CACX,CAAA;AACH,CAAC,CAAA"}

package/package.json

@@ -19,13 +19,13 @@
     "@xylabs/react-flexbox": "^2.14.4",
     "@xylabs/react-shared": "^2.14.4",
     "@xyo-network/core": "^2.20.45",
-    "@xyo-network/react-app-settings": "^2.25.67",
-    "@xyo-network/react-archive": "^2.25.68",
-    "@xyo-network/react-archivist-api": "^2.25.68",
-    "@xyo-network/react-auth": "^2.25.68",
-    "@xyo-network/react-network": "^2.25.68",
-    "@xyo-network/react-shared": "^2.25.68",
-    "@xyo-network/react-wallet": "^2.25.68",
+    "@xyo-network/react-app-settings": "^2.25.68",
+    "@xyo-network/react-archive": "^2.25.69",
+    "@xyo-network/react-archivist-api": "^2.25.69",
+    "@xyo-network/react-auth": "^2.25.69",
+    "@xyo-network/react-network": "^2.25.69",
+    "@xyo-network/react-shared": "^2.25.69",
+    "@xyo-network/react-wallet": "^2.25.69",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.3.0",
@@ -87,6 +87,6 @@
   },
   "sideEffects": false,
   "types": "dist/esm/index.d.ts",
-  "version": "2.25.68",
+  "version": "2.25.69",
   "packageManager": "yarn@3.1.1"
 }

package/src/components/AppBar/Application.stories.tsx

@@ -33,10 +33,14 @@ const Template: ComponentStory<typeof ApplicationAppBar> = (args) => (
           <ArchivesProvider>
             <ArchiveProvider>
               <ApplicationAppBar
-                menuItems={
-                  <List>
-                    <SiteMenuListItem primary="Hello" />
-                  </List>
+                systemToolbar={
+                  <SystemToolbar
+                    menuItems={
+                      <List>
+                        <SiteMenuListItem primary="Hello" />
+                      </List>
+                    }
+                  />
                 }
                 {...args}
               ></ApplicationAppBar>
@@ -52,7 +56,21 @@ const Default = Template.bind({})
 Default.args = {}
 
 const WithSearchBar = Template.bind({})
-WithSearchBar.args = { children: <SearchBar flexGrow={1} onSearch={(term) => alert(term)} />, color: 'primary', systemToolbar: <SystemToolbar darkModeButton authButton /> }
+WithSearchBar.args = {
+  children: <SearchBar flexGrow={1} onSearch={(term) => alert(term)} />,
+  color: 'primary',
+  systemToolbar: (
+    <SystemToolbar
+      darkModeButton
+      authButton
+      menuItems={
+        <List>
+          <SiteMenuListItem primary="Hello" />
+        </List>
+      }
+    />
+  ),
+}
 
 const WithWalletSelectBar = Template.bind({})
 WithWalletSelectBar.args = {

package/src/components/AppBar/Application.tsx

@@ -1,39 +1,15 @@
-import { Toolbar, ToolbarProps } from '@mui/material'
+import { ToolbarProps } from '@mui/material'
 import { AppBarEx, AppBarExProps } from '@xylabs/react-common'
-import { ReactElement, ReactNode } from 'react'
+import { ReactElement } from 'react'
 
-import { SiteMenu } from '../SiteMenu'
 import { ContextToolbar, SystemToolbar } from '../Toolbar'
 
 export interface ApplicationAppBarProps extends AppBarExProps {
   contextToolbar?: ReactElement<ToolbarProps>
   systemToolbar?: ReactElement<ToolbarProps>
   responsive?: boolean
-  menuItems?: ReactNode
 }
 
-export const ApplicationAppBar: React.FC<ApplicationAppBarProps> = ({
-  menuItems,
-  menu,
-  systemToolbar = <SystemToolbar />,
-  contextToolbar = <ContextToolbar />,
-  responsive = true,
-  ...props
-}) => {
-  return (
-    <AppBarEx
-      systemToolbar={systemToolbar}
-      contextToolbar={contextToolbar}
-      menu={
-        menu ?? menuItems ? (
-          <Toolbar>
-            <SiteMenu>{menuItems}</SiteMenu>
-          </Toolbar>
-        ) : undefined
-      }
-      position="sticky"
-      responsive={responsive}
-      {...props}
-    />
-  )
+export const ApplicationAppBar: React.FC<ApplicationAppBarProps> = ({ systemToolbar, contextToolbar, responsive = true, ...props }) => {
+  return <AppBarEx systemToolbar={systemToolbar ?? <SystemToolbar />} contextToolbar={contextToolbar ?? <ContextToolbar />} position="sticky" responsive={responsive} {...props} />
 }

package/src/components/Toolbar/System/SystemToolbar.stories.tsx

@@ -1,4 +1,5 @@
 /* eslint-disable import/no-internal-modules */
+import { List } from '@mui/material'
 import { ComponentMeta, ComponentStory } from '@storybook/react'
 import { BrowserRouter } from 'react-router-dom'
 
@@ -7,6 +8,7 @@ import { ArchiveProvider, ArchivesProvider } from '../../../../../archive/src'
 import { ArchivistApiProvider } from '../../../../../archivist-api/src'
 import { AuthProvider, AuthState } from '../../../../../auth/src'
 import { NetworkMemoryProvider } from '../../../../../network/src'
+import { SiteMenuListItem } from '../../SiteMenu'
 import { SystemToolbar } from './SystemToolbar'
 
 const StorybookEntry = {
@@ -41,7 +43,13 @@ const TemplateWithAuthContext: ComponentStory<WrappedAuthComponent> = ({ authSta
         <BrowserRouter>
           <NetworkMemoryProvider>
             <ArchiveProvider>
-              <SystemToolbar />
+              <SystemToolbar
+                menuItems={
+                  <List>
+                    <SiteMenuListItem primary="Hello" />
+                  </List>
+                }
+              />
             </ArchiveProvider>
           </NetworkMemoryProvider>
         </BrowserRouter>

package/src/components/Toolbar/System/SystemToolbar.tsx

@@ -5,6 +5,9 @@ import { DarkModeIconButton } from '@xyo-network/react-app-settings'
 import { ArchiveSelectEx } from '@xyo-network/react-archive'
 import { AuthStatusIconButton } from '@xyo-network/react-auth'
 import { NetworkSelectEx, NetworkSelectExProps } from '@xyo-network/react-network'
+import { ReactNode } from 'react'
+
+import { SiteMenu } from '../../SiteMenu'
 
 export interface SystemToolbarProps extends ToolbarProps {
   networkSelectProps?: NetworkSelectExProps
@@ -13,6 +16,7 @@ export interface SystemToolbarProps extends ToolbarProps {
   hideArchiveSelect?: boolean
   darkModeButton?: boolean
   authButton?: boolean
+  menuItems?: ReactNode
 }
 
 export const SystemToolbar: React.FC<SystemToolbarProps> = ({
@@ -23,6 +27,7 @@ export const SystemToolbar: React.FC<SystemToolbarProps> = ({
   hideArchiveSelect,
   darkModeButton = false,
   authButton = false,
+  menuItems,
   ...props
 }) => {
   return (
@@ -44,6 +49,7 @@ export const SystemToolbar: React.FC<SystemToolbarProps> = ({
       {children}
       {authButton ? <AuthStatusIconButton color="inherit" /> : null}
       {darkModeButton ? <DarkModeIconButton color="inherit" /> : null}
+      {menuItems ? <SiteMenu>{menuItems}</SiteMenu> : null}
     </Toolbar>
   )
 }