@xyo-network/react-appbar 2.25.48 → 2.25.51

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

@@ -1,6 +1,7 @@
-import { AppBarProps, ToolbarProps } from '@mui/material';
-import React, { ReactElement } from 'react';
-export interface ApplicationAppBarProps extends AppBarProps {
+import { ToolbarProps } from '@mui/material';
+import { AppBarExProps } from '@xylabs/react-common';
+import { ReactElement } from 'react';
+export interface ApplicationAppBarProps extends AppBarExProps {
     contextToolbar?: ReactElement<ToolbarProps>;
     systemToolbar?: ReactElement<ToolbarProps>;
     responsive?: boolean;

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

@@ -1,10 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AppBar, Container, Toolbar, useMediaQuery, useTheme } from '@mui/material';
-import { FlexGrowRow, FlexRow } from '@xylabs/react-flexbox';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AppBarEx } from '@xylabs/react-common';
 import { ContextToolbar, SystemToolbar } from '../Toolbar';
-export const ApplicationAppBar = ({ systemToolbar, contextToolbar, children, responsive = true, ...props }) => {
-    const { breakpoints } = useTheme();
-    const belowSm = useMediaQuery(breakpoints.down('sm'));
-    return (_jsx(AppBar, { position: "sticky", ...props, children: _jsxs(Container, { maxWidth: "xl", disableGutters: true, children: [_jsxs(FlexRow, { flexWrap: "nowrap", justifyContent: "flex-start", children: [contextToolbar ?? _jsx(ContextToolbar, { version: true }), _jsx(FlexGrowRow, { children: belowSm && responsive ? null : children }), systemToolbar ?? _jsx(SystemToolbar, {})] }), belowSm && children && responsive ? _jsx(Toolbar, { children: children }) : null] }) }));
+export const ApplicationAppBar = ({ systemToolbar = _jsx(SystemToolbar, {}), contextToolbar = _jsx(ContextToolbar, {}), responsive = true, ...props }) => {
+    return _jsx(AppBarEx, { systemToolbar: systemToolbar, contextToolbar: 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,MAAM,EAAe,SAAS,EAAE,OAAO,EAAgB,aAAa,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAC9G,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAG5D,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAQ1D,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC9I,MAAM,EAAE,WAAW,EAAE,GAAG,QAAQ,EAAE,CAAA;IAClC,MAAM,OAAO,GAAG,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IACrD,OAAO,CACL,KAAC,MAAM,IAAC,QAAQ,EAAC,QAAQ,KAAK,KAAK,YACjC,MAAC,SAAS,IAAC,QAAQ,EAAC,IAAI,EAAC,cAAc,mBACrC,MAAC,OAAO,IAAC,QAAQ,EAAC,QAAQ,EAAC,cAAc,EAAC,YAAY,aACnD,cAAc,IAAI,KAAC,cAAc,IAAC,OAAO,SAAG,EAC7C,KAAC,WAAW,cAAE,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,GAAe,EACnE,aAAa,IAAI,KAAC,aAAa,KAAG,IAC3B,EACT,OAAO,IAAI,QAAQ,IAAI,UAAU,CAAC,CAAC,CAAC,KAAC,OAAO,cAAE,QAAQ,GAAW,CAAC,CAAC,CAAC,IAAI,IAC/D,GACL,CACV,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,GAAG,KAAC,aAAa,KAAG,EAAE,cAAc,GAAG,KAAC,cAAc,KAAG,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC7K,OAAO,KAAC,QAAQ,IAAC,aAAa,EAAE,aAAa,EAAE,cAAc,EAAE,cAAc,EAAE,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAE,UAAU,KAAM,KAAK,GAAI,CAAA;AACxI,CAAC,CAAA"}

package/package.json

@@ -14,18 +14,17 @@
     "@emotion/styled": "^11.8.1",
     "@mui/icons-material": "^5.8.3",
     "@mui/material": "^5.8.3",
-    "@xylabs/react-button": "^2.12.20",
-    "@xylabs/react-common": "^2.12.20",
-    "@xylabs/react-flexbox": "^2.12.20",
-    "@xylabs/react-shared": "^2.12.20",
-    "@xyo-network/core": "^2.20.44",
-    "@xyo-network/react-archive": "^2.25.48",
-    "@xyo-network/react-archivist-api": "^2.25.48",
-    "@xyo-network/react-auth": "^2.25.48",
-    "@xyo-network/react-network": "^2.25.48",
-    "@xyo-network/react-shared": "^2.25.48",
-    "@xyo-network/react-theme": "^2.25.48",
-    "lodash": "^4.17.21",
+    "@xylabs/react-button": "^2.12.23",
+    "@xylabs/react-common": "^2.12.23",
+    "@xylabs/react-flexbox": "^2.12.23",
+    "@xylabs/react-shared": "^2.12.23",
+    "@xyo-network/core": "^2.20.45",
+    "@xyo-network/react-archive": "^2.25.51",
+    "@xyo-network/react-archivist-api": "^2.25.51",
+    "@xyo-network/react-auth": "^2.25.51",
+    "@xyo-network/react-network": "^2.25.51",
+    "@xyo-network/react-shared": "^2.25.51",
+    "@xyo-network/react-wallet": "^2.25.51",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
     "react-router-dom": "^6.3.0",
@@ -36,18 +35,9 @@
   "devDependencies": {
     "@babel/core": "^7.18.2",
     "@babel/preset-env": "^7.18.2",
-    "@storybook/addons": "^6.5.8",
-    "@storybook/api": "^6.5.8",
-    "@storybook/components": "^6.5.8",
-    "@storybook/core-events": "^6.5.8",
     "@storybook/react": "^6.5.8",
-    "@storybook/theming": "^6.5.8",
-    "@types/lodash": "^4.14.182",
-    "@xylabs/ts-scripts": "^1.0.66",
     "@xylabs/tsconfig": "^1.0.13",
-    "axios": "^0.27.2",
-    "storybook-dark-mode": "^1.1.0",
-    "typescript": "^4.7.3"
+    "axios": "^0.27.2"
   },
   "browser": "dist/esm/index.js",
   "docs": "dist/docs.json",
@@ -107,6 +97,6 @@
   },
   "sideEffects": false,
   "types": "dist/esm/index.d.ts",
-  "version": "2.25.48",
+  "version": "2.25.51",
   "packageManager": "yarn@3.1.1"
 }

package/src/components/AppBar/Application.tsx

@@ -1,28 +1,15 @@
-import { AppBar, AppBarProps, Container, Toolbar, ToolbarProps, useMediaQuery, useTheme } from '@mui/material'
-import { FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'
-import React, { ReactElement } from 'react'
+import { ToolbarProps } from '@mui/material'
+import { AppBarEx, AppBarExProps } from '@xylabs/react-common'
+import { ReactElement } from 'react'
 
 import { ContextToolbar, SystemToolbar } from '../Toolbar'
 
-export interface ApplicationAppBarProps extends AppBarProps {
+export interface ApplicationAppBarProps extends AppBarExProps {
   contextToolbar?: ReactElement<ToolbarProps>
   systemToolbar?: ReactElement<ToolbarProps>
   responsive?: boolean
 }
 
-export const ApplicationAppBar: React.FC<ApplicationAppBarProps> = ({ systemToolbar, contextToolbar, children, responsive = true, ...props }) => {
-  const { breakpoints } = useTheme()
-  const belowSm = useMediaQuery(breakpoints.down('sm'))
-  return (
-    <AppBar position="sticky" {...props}>
-      <Container maxWidth="xl" disableGutters>
-        <FlexRow flexWrap="nowrap" justifyContent="flex-start">
-          {contextToolbar ?? <ContextToolbar version />}
-          <FlexGrowRow>{belowSm && responsive ? null : children}</FlexGrowRow>
-          {systemToolbar ?? <SystemToolbar />}
-        </FlexRow>
-        {belowSm && children && responsive ? <Toolbar>{children}</Toolbar> : null}
-      </Container>
-    </AppBar>
-  )
+export const ApplicationAppBar: React.FC<ApplicationAppBarProps> = ({ systemToolbar = <SystemToolbar />, contextToolbar = <ContextToolbar />, responsive = true, ...props }) => {
+  return <AppBarEx systemToolbar={systemToolbar} contextToolbar={contextToolbar} position="sticky" responsive={responsive} {...props} />
 }