@xyo-network/react-appbar 2.44.1 → 2.45.0-rc.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/MobileSystemControls/SystemControlsUnstyled.js +1 -4
- package/dist/cjs/components/MobileSystemControls/SystemControlsUnstyled.js.map +1 -1
- package/dist/cjs/components/Toolbar/System/SystemToolbar.js +2 -4
- package/dist/cjs/components/Toolbar/System/SystemToolbar.js.map +1 -1
- package/dist/docs.json +113 -187
- package/dist/esm/components/MobileSystemControls/SystemControlsUnstyled.js +4 -7
- package/dist/esm/components/MobileSystemControls/SystemControlsUnstyled.js.map +1 -1
- package/dist/esm/components/Toolbar/System/SystemToolbar.js +2 -4
- package/dist/esm/components/Toolbar/System/SystemToolbar.js.map +1 -1
- package/dist/types/components/MobileSystemControls/SystemControlsUnstyled.d.ts.map +1 -1
- package/dist/types/components/Toolbar/System/SystemToolbar.d.ts +0 -4
- package/dist/types/components/Toolbar/System/SystemToolbar.d.ts.map +1 -1
- package/package.json +10 -12
- package/src/components/AppBar/Application.stories.tsx +17 -31
- package/src/components/MobileSystemControls/SystemControls.stories.tsx +1 -8
- package/src/components/MobileSystemControls/SystemControlsUnstyled.tsx +3 -13
- package/src/components/Toolbar/System/SystemToolbar.stories.tsx +6 -45
- package/src/components/Toolbar/System/SystemToolbar.tsx +0 -17
@@ -1,16 +1,13 @@
|
|
1
|
-
import { jsx as _jsx, Fragment as _Fragment
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
2
2
|
import { Paper, useMediaQuery } from '@mui/material';
|
3
3
|
import { FlexCol, FlexRow } from '@xylabs/react-flexbox';
|
4
|
-
import {
|
5
|
-
import {
|
6
|
-
import { ControlText, SystemControl } from './controls';
|
4
|
+
import { NetworkSelectEx } from '@xyo-network/react-network';
|
5
|
+
import { SystemControl } from './controls';
|
7
6
|
import { SystemControlsType } from './SystemControlsType';
|
8
7
|
const SystemControlsUnstyled = ({ visible, systemControlsType = SystemControlsType.WindowShade, ...props }) => {
|
9
|
-
const { network } = useNetwork();
|
10
|
-
const { archive } = useArchive();
|
11
8
|
const isSmall = useMediaQuery((theme) => theme.breakpoints.down('sm'));
|
12
9
|
if (visible || isSmall) {
|
13
|
-
return (_jsx(FlexCol, { ...props, className: `${props.className} system-controls-type-${systemControlsType}`, children: _jsx(SystemControl, { systemControlsType: systemControlsType, controlElement:
|
10
|
+
return (_jsx(FlexCol, { ...props, className: `${props.className} system-controls-type-${systemControlsType}`, children: _jsx(SystemControl, { systemControlsType: systemControlsType, controlElement: _jsx(_Fragment, { children: _jsx(FlexRow, { className: 'control-wrap', children: _jsx(Paper, { variant: "elevation", elevation: 0, children: _jsx(NetworkSelectEx, { responsive: false, className: "network-ex" }) }) }) }) }) }));
|
14
11
|
}
|
15
12
|
else {
|
16
13
|
return _jsx(FlexCol, {});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SystemControlsUnstyled.js","sourceRoot":"","sources":["../../../../src/components/MobileSystemControls/SystemControlsUnstyled.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAS,aAAa,EAAE,MAAM,eAAe,CAAA;AAC3D,OAAO,EAAgB,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AACtE,OAAO,EAAE,eAAe,EAAE,
|
1
|
+
{"version":3,"file":"SystemControlsUnstyled.js","sourceRoot":"","sources":["../../../../src/components/MobileSystemControls/SystemControlsUnstyled.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAS,aAAa,EAAE,MAAM,eAAe,CAAA;AAC3D,OAAO,EAAgB,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAE5D,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAOzD,MAAM,sBAAsB,GAA0C,CAAC,EACrE,OAAO,EACP,kBAAkB,GAAG,kBAAkB,CAAC,WAAW,EACnD,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,aAAa,CAAQ,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAE7E,IAAI,OAAO,IAAI,OAAO,EAAE;QACtB,OAAO,CACL,KAAC,OAAO,OAAK,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC,SAAS,yBAAyB,kBAAkB,EAAE,YAC5F,KAAC,aAAa,IACZ,kBAAkB,EAAE,kBAAkB,EACtC,cAAc,EACZ,4BACE,KAAC,OAAO,IAAC,SAAS,EAAE,cAAc,YAChC,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,EAAC,SAAS,EAAE,CAAC,YACrC,KAAC,eAAe,IAAC,UAAU,EAAE,KAAK,EAAE,SAAS,EAAC,YAAY,GAAG,GACvD,GACA,GACT,GAEL,GACM,CACX,CAAA;KACF;SAAM;QACL,OAAO,KAAC,OAAO,KAAG,CAAA;KACnB;AACH,CAAC,CAAA;AAGD,OAAO,EAAE,sBAAsB,EAAE,CAAA"}
|
@@ -1,12 +1,10 @@
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
2
|
import { Paper, Toolbar } from '@mui/material';
|
3
3
|
import { FlexRow } from '@xylabs/react-flexbox';
|
4
|
-
import { ArchiveSelectEx } from '@xyo-network/react-api';
|
5
4
|
import { DarkModeIconButton } from '@xyo-network/react-app-settings';
|
6
|
-
import { AuthSetsStatusIconButton } from '@xyo-network/react-auth-sets';
|
7
5
|
import { NetworkSelectEx } from '@xyo-network/react-network';
|
8
6
|
import { SiteMenu } from '../../SiteMenu';
|
9
|
-
export const SystemToolbar = ({
|
10
|
-
return (_jsxs(Toolbar, { ...props, children: [precedingChildren, hideNetworkSelect ? null : (_jsx(FlexRow, { marginX: 0.5, children: _jsx(Paper, { variant: "elevation", children: _jsx(NetworkSelectEx, { fullWidth: true, ...networkSelectProps }) }) })),
|
7
|
+
export const SystemToolbar = ({ children, darkModeButton = false, hideNetworkSelect, menuItems, networkSelectProps, onMenuToggle, precedingChildren, ...props }) => {
|
8
|
+
return (_jsxs(Toolbar, { ...props, children: [precedingChildren, hideNetworkSelect ? null : (_jsx(FlexRow, { marginX: 0.5, children: _jsx(Paper, { variant: "elevation", children: _jsx(NetworkSelectEx, { fullWidth: true, ...networkSelectProps }) }) })), children, darkModeButton ? _jsx(DarkModeIconButton, { color: "inherit" }) : null, menuItems ? _jsx(SiteMenu, { onMenuToggle: onMenuToggle, children: menuItems }) : null] }));
|
11
9
|
};
|
12
10
|
//# sourceMappingURL=SystemToolbar.js.map
|
@@ -1 +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;
|
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;AAC5D,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAA;AACpE,OAAO,EAAE,eAAe,EAAwB,MAAM,4BAA4B,CAAA;AAGlF,OAAO,EAAE,QAAQ,EAAiB,MAAM,gBAAgB,CAAA;AAYxD,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,EACR,cAAc,GAAG,KAAK,EACtB,iBAAiB,EACjB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,MAAC,OAAO,OAAK,KAAK,aACf,iBAAiB,EACjB,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC1B,KAAC,OAAO,IAAC,OAAO,EAAE,GAAG,YACnB,KAAC,KAAK,IAAC,OAAO,EAAC,WAAW,YACxB,KAAC,eAAe,IAAC,SAAS,WAAK,kBAAkB,GAAI,GAC/C,GACA,CACX,EACA,QAAQ,EACR,cAAc,CAAC,CAAC,CAAC,KAAC,kBAAkB,IAAC,KAAK,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,IAAI,EAC9D,SAAS,CAAC,CAAC,CAAC,KAAC,QAAQ,IAAC,YAAY,EAAE,YAAY,YAAG,SAAS,GAAY,CAAC,CAAC,CAAC,IAAI,IACxE,CACX,CAAA;AACH,CAAC,CAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SystemControlsUnstyled.d.ts","sourceRoot":"","sources":["../../../../src/components/MobileSystemControls/SystemControlsUnstyled.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAoB,MAAM,uBAAuB,CAAA;
|
1
|
+
{"version":3,"file":"SystemControlsUnstyled.d.ts","sourceRoot":"","sources":["../../../../src/components/MobileSystemControls/SystemControlsUnstyled.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAoB,MAAM,uBAAuB,CAAA;AAItE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAEzD,UAAU,2BAA4B,SAAQ,YAAY;IACxD,kBAAkB,CAAC,EAAE,kBAAkB,CAAA;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CA2BjE,CAAA;AAED,YAAY,EAAE,2BAA2B,EAAE,CAAA;AAC3C,OAAO,EAAE,sBAAsB,EAAE,CAAA"}
|
@@ -1,14 +1,10 @@
|
|
1
1
|
import { ToolbarProps } from '@mui/material';
|
2
|
-
import { SelectExProps } from '@xylabs/react-common';
|
3
2
|
import { NetworkSelectExProps } from '@xyo-network/react-network';
|
4
3
|
import { ReactNode } from 'react';
|
5
4
|
import { SiteMenuProps } from '../../SiteMenu';
|
6
5
|
export interface SystemToolbarProps extends ToolbarProps {
|
7
|
-
archiveSelectProps?: SelectExProps<string>;
|
8
|
-
authButton?: boolean;
|
9
6
|
darkModeButton?: boolean;
|
10
7
|
developerMode?: boolean;
|
11
|
-
hideArchiveSelect?: boolean;
|
12
8
|
hideNetworkSelect?: boolean;
|
13
9
|
menuItems?: ReactNode;
|
14
10
|
networkSelectProps?: NetworkSelectExProps;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SystemToolbar.d.ts","sourceRoot":"","sources":["../../../../../src/components/Toolbar/System/SystemToolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,YAAY,EAAE,MAAM,eAAe,CAAA;
|
1
|
+
{"version":3,"file":"SystemToolbar.d.ts","sourceRoot":"","sources":["../../../../../src/components/Toolbar/System/SystemToolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,YAAY,EAAE,MAAM,eAAe,CAAA;AAG5D,OAAO,EAAmB,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAClF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAY,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAExD,MAAM,WAAW,kBAAmB,SAAQ,YAAY;IACtD,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,kBAAkB,CAAC,EAAE,oBAAoB,CAAA;IACzC,YAAY,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IAC5C,iBAAiB,CAAC,EAAE,SAAS,CAAA;CAC9B;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAyBtD,CAAA"}
|
package/package.json
CHANGED
@@ -16,20 +16,17 @@
|
|
16
16
|
"@xylabs/react-flexbox": "^2.16.8",
|
17
17
|
"@xylabs/react-link": "^2.16.8",
|
18
18
|
"@xylabs/react-shared": "^2.16.8",
|
19
|
-
"@xyo-network/react-
|
20
|
-
"@xyo-network/react-
|
21
|
-
"@xyo-network/react-
|
22
|
-
"@xyo-network/react-network": "^2.44.1",
|
23
|
-
"@xyo-network/react-shared": "^2.44.1"
|
19
|
+
"@xyo-network/react-app-settings": "^2.45.0-rc.10",
|
20
|
+
"@xyo-network/react-network": "^2.45.0-rc.10",
|
21
|
+
"@xyo-network/react-shared": "^2.45.0-rc.10"
|
24
22
|
},
|
25
23
|
"devDependencies": {
|
26
24
|
"@storybook/react": "^6.5.16",
|
27
|
-
"@xylabs/ts-scripts-yarn3": "^2.
|
28
|
-
"@xylabs/tsconfig-react": "^2.
|
29
|
-
"@xyo-network/react-
|
30
|
-
"@xyo-network/react-
|
31
|
-
"@xyo-network/
|
32
|
-
"@xyo-network/wallet": "^2.50.2",
|
25
|
+
"@xylabs/ts-scripts-yarn3": "^2.16.0",
|
26
|
+
"@xylabs/tsconfig-react": "^2.16.0",
|
27
|
+
"@xyo-network/react-storybook": "^2.45.0-rc.10",
|
28
|
+
"@xyo-network/react-wallet": "^2.45.0-rc.10",
|
29
|
+
"@xyo-network/wallet": "^2.51.2",
|
33
30
|
"require-from-string": "^2.0.2",
|
34
31
|
"typescript": "^4.9.5"
|
35
32
|
},
|
@@ -88,5 +85,6 @@
|
|
88
85
|
},
|
89
86
|
"sideEffects": false,
|
90
87
|
"types": "dist/types/index.d.ts",
|
91
|
-
"version": "2.
|
88
|
+
"version": "2.45.0-rc.10",
|
89
|
+
"stableVersion": "2.44.1"
|
92
90
|
}
|
@@ -2,9 +2,6 @@
|
|
2
2
|
import { List, Paper } from '@mui/material'
|
3
3
|
import { ComponentMeta, ComponentStory } from '@storybook/react'
|
4
4
|
import { FlexGrowCol } from '@xylabs/react-flexbox'
|
5
|
-
import { ApiProvider, ArchiveProvider, ArchivesProvider } from '@xyo-network/react-api'
|
6
|
-
import { AuthProvider } from '@xyo-network/react-auth'
|
7
|
-
import { AuthSetsProvider } from '@xyo-network/react-auth-sets'
|
8
5
|
import { NetworkMemoryProvider } from '@xyo-network/react-network'
|
9
6
|
import { WalletAccountSelect, WalletProvider } from '@xyo-network/react-wallet'
|
10
7
|
import { XyoWalletBase } from '@xyo-network/wallet'
|
@@ -28,32 +25,22 @@ const StorybookEntry = {
|
|
28
25
|
|
29
26
|
const Template: ComponentStory<typeof ApplicationAppBar> = (args) => (
|
30
27
|
<WalletProvider defaultWallet={new XyoWalletBase('test me')}>
|
31
|
-
<
|
32
|
-
<
|
33
|
-
<
|
34
|
-
|
35
|
-
<
|
36
|
-
|
37
|
-
<
|
38
|
-
<
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
}
|
48
|
-
{...args}
|
49
|
-
></ApplicationAppBar>
|
50
|
-
</ArchiveProvider>
|
51
|
-
</ArchivesProvider>
|
52
|
-
</NetworkMemoryProvider>
|
53
|
-
</ApiProvider>
|
54
|
-
</BrowserRouter>
|
55
|
-
</AuthSetsProvider>
|
56
|
-
</AuthProvider>
|
28
|
+
<BrowserRouter>
|
29
|
+
<NetworkMemoryProvider>
|
30
|
+
<ApplicationAppBar
|
31
|
+
systemToolbar={
|
32
|
+
<SystemToolbar
|
33
|
+
menuItems={
|
34
|
+
<List>
|
35
|
+
<MenuListItemContainer primary="Hello" />
|
36
|
+
</List>
|
37
|
+
}
|
38
|
+
/>
|
39
|
+
}
|
40
|
+
{...args}
|
41
|
+
></ApplicationAppBar>
|
42
|
+
</NetworkMemoryProvider>
|
43
|
+
</BrowserRouter>
|
57
44
|
</WalletProvider>
|
58
45
|
)
|
59
46
|
|
@@ -67,7 +54,6 @@ WithSearchBar.args = {
|
|
67
54
|
systemToolbar: (
|
68
55
|
<SystemToolbar
|
69
56
|
darkModeButton
|
70
|
-
authButton
|
71
57
|
menuItems={
|
72
58
|
<List>
|
73
59
|
<MenuListItemContainer primary="Hello" />
|
@@ -87,7 +73,7 @@ WithWalletSelectBar.args = {
|
|
87
73
|
</FlexGrowCol>
|
88
74
|
),
|
89
75
|
color: 'primary',
|
90
|
-
systemToolbar: <SystemToolbar darkModeButton
|
76
|
+
systemToolbar: <SystemToolbar darkModeButton />,
|
91
77
|
}
|
92
78
|
|
93
79
|
export { Default, WithSearchBar, WithWalletSelectBar }
|
@@ -1,6 +1,5 @@
|
|
1
1
|
/* eslint-disable import/no-internal-modules */
|
2
2
|
import { ComponentStory, Meta } from '@storybook/react'
|
3
|
-
import { ApiProvider, ArchiveProvider, ArchivesProvider } from '@xyo-network/react-api'
|
4
3
|
import { NetworkMemoryProvider } from '@xyo-network/react-network'
|
5
4
|
|
6
5
|
import { SystemControls } from './SystemControls'
|
@@ -20,13 +19,7 @@ const StorybookEntry: Meta = {
|
|
20
19
|
const Template: ComponentStory<typeof SystemControls> = (props) => {
|
21
20
|
return (
|
22
21
|
<NetworkMemoryProvider>
|
23
|
-
<
|
24
|
-
<ArchivesProvider>
|
25
|
-
<ArchiveProvider>
|
26
|
-
<SystemControls {...props} />
|
27
|
-
</ArchiveProvider>
|
28
|
-
</ArchivesProvider>
|
29
|
-
</ApiProvider>
|
22
|
+
<SystemControls {...props} />
|
30
23
|
</NetworkMemoryProvider>
|
31
24
|
)
|
32
25
|
}
|
@@ -1,9 +1,8 @@
|
|
1
1
|
import { Paper, Theme, useMediaQuery } from '@mui/material'
|
2
2
|
import { FlexBoxProps, FlexCol, FlexRow } from '@xylabs/react-flexbox'
|
3
|
-
import {
|
4
|
-
import { NetworkSelectEx, useNetwork } from '@xyo-network/react-network'
|
3
|
+
import { NetworkSelectEx } from '@xyo-network/react-network'
|
5
4
|
|
6
|
-
import {
|
5
|
+
import { SystemControl } from './controls'
|
7
6
|
import { SystemControlsType } from './SystemControlsType'
|
8
7
|
|
9
8
|
interface SystemControlsUnstyledProps extends FlexBoxProps {
|
@@ -16,8 +15,6 @@ const SystemControlsUnstyled: React.FC<SystemControlsUnstyledProps> = ({
|
|
16
15
|
systemControlsType = SystemControlsType.WindowShade,
|
17
16
|
...props
|
18
17
|
}) => {
|
19
|
-
const { network } = useNetwork()
|
20
|
-
const { archive } = useArchive()
|
21
18
|
const isSmall = useMediaQuery<Theme>((theme) => theme.breakpoints.down('sm'))
|
22
19
|
|
23
20
|
if (visible || isSmall) {
|
@@ -32,16 +29,9 @@ const SystemControlsUnstyled: React.FC<SystemControlsUnstyledProps> = ({
|
|
32
29
|
<NetworkSelectEx responsive={false} className="network-ex" />
|
33
30
|
</Paper>
|
34
31
|
</FlexRow>
|
35
|
-
<FlexRow>
|
36
|
-
<Paper variant="elevation" elevation={0}>
|
37
|
-
<ArchiveSelectEx />
|
38
|
-
</Paper>
|
39
|
-
</FlexRow>
|
40
32
|
</>
|
41
33
|
}
|
42
|
-
|
43
|
-
<ControlText value={`${network?.name} : ${archive ?? 'temp'} `} />
|
44
|
-
</SystemControl>
|
34
|
+
/>
|
45
35
|
</FlexCol>
|
46
36
|
)
|
47
37
|
} else {
|
@@ -1,11 +1,8 @@
|
|
1
1
|
/* eslint-disable import/no-internal-modules */
|
2
2
|
import { List } from '@mui/material'
|
3
3
|
import { ComponentStory, Meta } from '@storybook/react'
|
4
|
-
import { ApiProvider, ArchiveProvider, ArchivesProvider } from '@xyo-network/react-api'
|
5
|
-
import { AuthProvider, AuthState } from '@xyo-network/react-auth'
|
6
4
|
import { NetworkMemoryProvider } from '@xyo-network/react-network'
|
7
5
|
import { TypographyEx } from '@xyo-network/react-shared'
|
8
|
-
import { WrappedAuthComponent } from '@xyo-network/react-storybook'
|
9
6
|
import { SyntheticEvent } from 'react'
|
10
7
|
import { BrowserRouter } from 'react-router-dom'
|
11
8
|
|
@@ -35,52 +32,16 @@ const StorybookEntry: Meta = {
|
|
35
32
|
}
|
36
33
|
|
37
34
|
const Template: ComponentStory<typeof SystemToolbar> = (args) => (
|
38
|
-
<
|
39
|
-
<
|
40
|
-
<
|
41
|
-
|
42
|
-
|
43
|
-
<SystemToolbar {...args} />
|
44
|
-
</ArchiveProvider>
|
45
|
-
</NetworkMemoryProvider>
|
46
|
-
</BrowserRouter>
|
47
|
-
</ArchivesProvider>
|
48
|
-
</ApiProvider>
|
49
|
-
)
|
50
|
-
|
51
|
-
const TemplateWithAuthContext: ComponentStory<WrappedAuthComponent> = ({ authState }) => (
|
52
|
-
<AuthProvider authState={authState as AuthState}>
|
53
|
-
<ApiProvider apiDomain="https://beta.api.archivist.xyo.network">
|
54
|
-
<ArchivesProvider>
|
55
|
-
<BrowserRouter>
|
56
|
-
<NetworkMemoryProvider>
|
57
|
-
<ArchiveProvider>
|
58
|
-
<SystemToolbar menuItems={DefaultMenu} />
|
59
|
-
</ArchiveProvider>
|
60
|
-
</NetworkMemoryProvider>
|
61
|
-
</BrowserRouter>
|
62
|
-
</ArchivesProvider>
|
63
|
-
</ApiProvider>
|
64
|
-
</AuthProvider>
|
35
|
+
<BrowserRouter>
|
36
|
+
<NetworkMemoryProvider>
|
37
|
+
<SystemToolbar {...args} />
|
38
|
+
</NetworkMemoryProvider>
|
39
|
+
</BrowserRouter>
|
65
40
|
)
|
66
41
|
|
67
42
|
const Default = Template.bind({})
|
68
43
|
Default.args = {}
|
69
44
|
|
70
|
-
const WithLoggedInAccount = TemplateWithAuthContext.bind({})
|
71
|
-
WithLoggedInAccount.args = {
|
72
|
-
authState: {
|
73
|
-
loggedInAccount: 'none@none.com',
|
74
|
-
},
|
75
|
-
}
|
76
|
-
|
77
|
-
const NeedsReAuth = TemplateWithAuthContext.bind({})
|
78
|
-
NeedsReAuth.args = {
|
79
|
-
authState: {
|
80
|
-
reAuthenticate: true,
|
81
|
-
},
|
82
|
-
}
|
83
|
-
|
84
45
|
const PrecedingChildren = Template.bind({})
|
85
46
|
PrecedingChildren.args = {
|
86
47
|
precedingChildren: (
|
@@ -96,7 +57,7 @@ WithOnMenuToggle.args = {
|
|
96
57
|
onMenuToggle: (state) => console.log(state),
|
97
58
|
}
|
98
59
|
|
99
|
-
export { Default,
|
60
|
+
export { Default, PrecedingChildren, WithOnMenuToggle }
|
100
61
|
|
101
62
|
// eslint-disable-next-line import/no-default-export
|
102
63
|
export default StorybookEntry
|
@@ -1,20 +1,14 @@
|
|
1
1
|
import { Paper, Toolbar, ToolbarProps } from '@mui/material'
|
2
|
-
import { SelectExProps } from '@xylabs/react-common'
|
3
2
|
import { FlexRow } from '@xylabs/react-flexbox'
|
4
|
-
import { ArchiveSelectEx } from '@xyo-network/react-api'
|
5
3
|
import { DarkModeIconButton } from '@xyo-network/react-app-settings'
|
6
|
-
import { AuthSetsStatusIconButton } from '@xyo-network/react-auth-sets'
|
7
4
|
import { NetworkSelectEx, NetworkSelectExProps } from '@xyo-network/react-network'
|
8
5
|
import { ReactNode } from 'react'
|
9
6
|
|
10
7
|
import { SiteMenu, SiteMenuProps } from '../../SiteMenu'
|
11
8
|
|
12
9
|
export interface SystemToolbarProps extends ToolbarProps {
|
13
|
-
archiveSelectProps?: SelectExProps<string>
|
14
|
-
authButton?: boolean
|
15
10
|
darkModeButton?: boolean
|
16
11
|
developerMode?: boolean
|
17
|
-
hideArchiveSelect?: boolean
|
18
12
|
hideNetworkSelect?: boolean
|
19
13
|
menuItems?: ReactNode
|
20
14
|
networkSelectProps?: NetworkSelectExProps
|
@@ -23,12 +17,9 @@ export interface SystemToolbarProps extends ToolbarProps {
|
|
23
17
|
}
|
24
18
|
|
25
19
|
export const SystemToolbar: React.FC<SystemToolbarProps> = ({
|
26
|
-
archiveSelectProps,
|
27
|
-
authButton = false,
|
28
20
|
children,
|
29
21
|
darkModeButton = false,
|
30
22
|
hideNetworkSelect,
|
31
|
-
hideArchiveSelect,
|
32
23
|
menuItems,
|
33
24
|
networkSelectProps,
|
34
25
|
onMenuToggle,
|
@@ -45,15 +36,7 @@ export const SystemToolbar: React.FC<SystemToolbarProps> = ({
|
|
45
36
|
</Paper>
|
46
37
|
</FlexRow>
|
47
38
|
)}
|
48
|
-
{hideArchiveSelect ? null : (
|
49
|
-
<FlexRow marginX={0.5}>
|
50
|
-
<Paper variant="elevation">
|
51
|
-
<ArchiveSelectEx fullWidth {...archiveSelectProps} />
|
52
|
-
</Paper>
|
53
|
-
</FlexRow>
|
54
|
-
)}
|
55
39
|
{children}
|
56
|
-
{authButton ? <AuthSetsStatusIconButton color="inherit" /> : null}
|
57
40
|
{darkModeButton ? <DarkModeIconButton color="inherit" /> : null}
|
58
41
|
{menuItems ? <SiteMenu onMenuToggle={onMenuToggle}>{menuItems}</SiteMenu> : null}
|
59
42
|
</Toolbar>
|