@j2inn/fin5-ui-utils 6.0.3 → 6.0.5-beta.0
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/README.md +5 -5
- package/dist/fantomProps/createFin5Props/index.d.ts +12 -12
- package/dist/fantomProps/createFin5Props/index.js +146 -146
- package/dist/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
- package/dist/fantomProps/createFin5Props/runCreateFin5Props.js +16 -16
- package/dist/fantomProps/fantomPropsToObject.d.ts +8 -8
- package/dist/fantomProps/fantomPropsToObject.js +183 -183
- package/dist/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
- package/dist/fantomProps/generateJsonFromFantomPropsFile.js +41 -41
- package/dist/fantomProps/localePropsToJson.d.ts +1 -1
- package/dist/fantomProps/localePropsToJson.js +50 -50
- package/dist/fantomProps/readFantomPropsFile.d.ts +5 -5
- package/dist/fantomProps/readFantomPropsFile.js +66 -61
- package/dist/fantomProps/readFantomPropsFile.js.map +1 -1
- package/dist/fin5Top/fin5FileUpload.d.ts +24 -24
- package/dist/fin5Top/fin5FileUpload.js +51 -51
- package/dist/fin5Top/fin5Top.d.ts +124 -124
- package/dist/fin5Top/fin5Top.js +53 -53
- package/dist/fin5Top/finEdge2Cloud.d.ts +6 -6
- package/dist/fin5Top/finEdge2Cloud.js +15 -15
- package/dist/fin5Top/getFin5BinUrl.d.ts +2 -2
- package/dist/fin5Top/getFin5BinUrl.js +9 -9
- package/dist/fin5Top/openFin5Alarm.d.ts +22 -22
- package/dist/fin5Top/openFin5Alarm.js +23 -23
- package/dist/fin5Top/openFin5Historian.d.ts +3 -3
- package/dist/fin5Top/openFin5Historian.js +19 -19
- package/dist/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
- package/dist/fin5Top/useFin5AppURLHashParameter.js +133 -133
- package/dist/index.d.ts +35 -35
- package/dist/index.js +69 -69
- package/dist/jobs/jobUtils.d.ts +14 -14
- package/dist/jobs/jobUtils.js +15 -15
- package/dist/react/app/Fin5AppContainer.d.ts +36 -36
- package/dist/react/app/Fin5AppContainer.js +102 -102
- package/dist/react/app/Fin5AppContainer.js.map +1 -1
- package/dist/react/app/Fin5AppRootStore.d.ts +40 -38
- package/dist/react/app/Fin5AppRootStore.js +69 -68
- package/dist/react/app/Fin5AppRootStore.js.map +1 -1
- package/dist/react/components/ErrorBoundary.d.ts +57 -57
- package/dist/react/components/ErrorBoundary.js +150 -150
- package/dist/react/components/ErrorDisplayer.d.ts +19 -19
- package/dist/react/components/ErrorDisplayer.js +36 -36
- package/dist/react/components/Loader.d.ts +9 -9
- package/dist/react/components/Loader.js +17 -17
- package/dist/react/components/LoadingSpinner.d.ts +2 -2
- package/dist/react/components/LoadingSpinner.js +27 -27
- package/dist/react/components/RecordImage.d.ts +20 -20
- package/dist/react/components/RecordImage.js +51 -51
- package/dist/react/components/charts/QRCode.d.ts +25 -25
- package/dist/react/components/charts/QRCode.js +82 -82
- package/dist/react/components/charts/line-bar/Chart.d.ts +166 -166
- package/dist/react/components/charts/line-bar/Chart.js +442 -442
- package/dist/react/components/charts/line-bar/HGridChart.d.ts +58 -58
- package/dist/react/components/charts/line-bar/HGridChart.js +285 -285
- package/dist/react/components/charts/pie/PieChart.d.ts +94 -94
- package/dist/react/components/charts/pie/PieChart.js +204 -204
- package/dist/react/components/charts/pie/SimplePieChart.d.ts +21 -21
- package/dist/react/components/charts/pie/SimplePieChart.js +55 -55
- package/dist/react/components/graphics/GraphicViewer.d.ts +10 -10
- package/dist/react/components/graphics/GraphicViewer.js +29 -29
- package/dist/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
- package/dist/react/components/graphics/GraphicsTabViewer.js +90 -90
- package/dist/react/components/makeCustomElement.d.ts +16 -16
- package/dist/react/components/makeCustomElement.js +150 -150
- package/dist/react/components/navigation/BasicLayout.d.ts +41 -41
- package/dist/react/components/navigation/BasicLayout.js +155 -155
- package/dist/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
- package/dist/react/components/navigation/HeaderSiderLayout.js +110 -110
- package/dist/react/components/navigation/MenuPage.d.ts +37 -37
- package/dist/react/components/navigation/MenuPage.js +36 -36
- package/dist/react/components/navigation/MenuTrigger.d.ts +9 -9
- package/dist/react/components/navigation/MenuTrigger.js +33 -33
- package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
- package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.js +25 -25
- package/dist/react/components/navigation/ReactRouterLayout.d.ts +46 -46
- package/dist/react/components/navigation/ReactRouterLayout.js +132 -132
- package/dist/react/components/navigation/customRouting/Router.d.ts +12 -12
- package/dist/react/components/navigation/customRouting/Router.js +45 -45
- package/dist/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
- package/dist/react/components/navigation/customRouting/RouterLayout.js +61 -61
- package/dist/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
- package/dist/react/components/resolvable/configurationForm/ConfigurationForm.js +95 -95
- package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
- package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +88 -88
- package/dist/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
- package/dist/react/components/resolvable/configurationForm/getSectionDefault.js +99 -99
- package/dist/react/hooks/useFin5BinUrl.d.ts +6 -6
- package/dist/react/hooks/useFin5BinUrl.js +15 -15
- package/dist/react/hooks/useFin5ColorScheme.d.ts +2 -2
- package/dist/react/hooks/useFin5ColorScheme.js +49 -49
- package/dist/react/hooks/useScreenSize.d.ts +7 -7
- package/dist/react/hooks/useScreenSize.js +31 -31
- package/dist_es/fantomProps/createFin5Props/index.d.ts +12 -12
- package/dist_es/fantomProps/createFin5Props/index.js +140 -140
- package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
- package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.js +11 -11
- package/dist_es/fantomProps/fantomPropsToObject.d.ts +8 -8
- package/dist_es/fantomProps/fantomPropsToObject.js +178 -178
- package/dist_es/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
- package/dist_es/fantomProps/generateJsonFromFantomPropsFile.js +12 -12
- package/dist_es/fantomProps/localePropsToJson.d.ts +1 -1
- package/dist_es/fantomProps/localePropsToJson.js +21 -21
- package/dist_es/fantomProps/readFantomPropsFile.d.ts +5 -5
- package/dist_es/fantomProps/readFantomPropsFile.js +40 -35
- package/dist_es/fantomProps/readFantomPropsFile.js.map +1 -1
- package/dist_es/fin5Top/fin5FileUpload.d.ts +24 -24
- package/dist_es/fin5Top/fin5FileUpload.js +47 -47
- package/dist_es/fin5Top/fin5Top.d.ts +124 -124
- package/dist_es/fin5Top/fin5Top.js +49 -49
- package/dist_es/fin5Top/finEdge2Cloud.d.ts +6 -6
- package/dist_es/fin5Top/finEdge2Cloud.js +11 -11
- package/dist_es/fin5Top/getFin5BinUrl.d.ts +2 -2
- package/dist_es/fin5Top/getFin5BinUrl.js +5 -5
- package/dist_es/fin5Top/openFin5Alarm.d.ts +22 -22
- package/dist_es/fin5Top/openFin5Alarm.js +19 -19
- package/dist_es/fin5Top/openFin5Historian.d.ts +3 -3
- package/dist_es/fin5Top/openFin5Historian.js +15 -15
- package/dist_es/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
- package/dist_es/fin5Top/useFin5AppURLHashParameter.js +124 -124
- package/dist_es/index.d.ts +35 -35
- package/dist_es/index.js +53 -53
- package/dist_es/jobs/jobUtils.d.ts +14 -14
- package/dist_es/jobs/jobUtils.js +9 -9
- package/dist_es/react/app/Fin5AppContainer.d.ts +36 -36
- package/dist_es/react/app/Fin5AppContainer.js +73 -73
- package/dist_es/react/app/Fin5AppContainer.js.map +1 -1
- package/dist_es/react/app/Fin5AppContainer.jsx +82 -0
- package/dist_es/react/app/Fin5AppContainer.jsx.map +1 -0
- package/dist_es/react/app/Fin5AppRootStore.d.ts +40 -38
- package/dist_es/react/app/Fin5AppRootStore.js +65 -64
- package/dist_es/react/app/Fin5AppRootStore.js.map +1 -1
- package/dist_es/react/components/ErrorBoundary.d.ts +57 -57
- package/dist_es/react/components/ErrorBoundary.js +123 -123
- package/dist_es/react/components/ErrorBoundary.jsx +150 -0
- package/dist_es/react/components/ErrorBoundary.jsx.map +1 -0
- package/dist_es/react/components/ErrorDisplayer.d.ts +19 -19
- package/dist_es/react/components/ErrorDisplayer.js +28 -28
- package/dist_es/react/components/ErrorDisplayer.jsx +36 -0
- package/dist_es/react/components/ErrorDisplayer.jsx.map +1 -0
- package/dist_es/react/components/Loader.d.ts +9 -9
- package/dist_es/react/components/Loader.js +12 -12
- package/dist_es/react/components/Loader.jsx +13 -0
- package/dist_es/react/components/Loader.jsx.map +1 -0
- package/dist_es/react/components/LoadingSpinner.d.ts +2 -2
- package/dist_es/react/components/LoadingSpinner.js +20 -20
- package/dist_es/react/components/LoadingSpinner.jsx +22 -0
- package/dist_es/react/components/LoadingSpinner.jsx.map +1 -0
- package/dist_es/react/components/RecordImage.d.ts +20 -20
- package/dist_es/react/components/RecordImage.js +24 -24
- package/dist_es/react/components/charts/QRCode.d.ts +25 -25
- package/dist_es/react/components/charts/QRCode.js +52 -52
- package/dist_es/react/components/charts/line-bar/Chart.d.ts +166 -166
- package/dist_es/react/components/charts/line-bar/Chart.js +415 -415
- package/dist_es/react/components/charts/line-bar/HGridChart.d.ts +58 -58
- package/dist_es/react/components/charts/line-bar/HGridChart.js +250 -250
- package/dist_es/react/components/charts/line-bar/ZincGridChart.d.ts +12 -0
- package/dist_es/react/components/charts/line-bar/ZincGridChart.js +17 -0
- package/dist_es/react/components/charts/line-bar/ZincGridChart.js.map +1 -0
- package/dist_es/react/components/charts/pie/PieChart.d.ts +94 -94
- package/dist_es/react/components/charts/pie/PieChart.js +177 -177
- package/dist_es/react/components/charts/pie/SimplePieChart.d.ts +21 -21
- package/dist_es/react/components/charts/pie/SimplePieChart.js +25 -25
- package/dist_es/react/components/graphics/GraphicViewer.d.ts +10 -10
- package/dist_es/react/components/graphics/GraphicViewer.js +22 -22
- package/dist_es/react/components/graphics/GraphicViewer.jsx +23 -0
- package/dist_es/react/components/graphics/GraphicViewer.jsx.map +1 -0
- package/dist_es/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
- package/dist_es/react/components/graphics/GraphicsTabViewer.js +60 -60
- package/dist_es/react/components/graphics/GraphicsTabViewer.jsx +63 -0
- package/dist_es/react/components/graphics/GraphicsTabViewer.jsx.map +1 -0
- package/dist_es/react/components/makeCustomElement.d.ts +16 -16
- package/dist_es/react/components/makeCustomElement.js +142 -142
- package/dist_es/react/components/navigation/BasicLayout.d.ts +41 -41
- package/dist_es/react/components/navigation/BasicLayout.js +124 -124
- package/dist_es/react/components/navigation/BasicLayout.jsx +133 -0
- package/dist_es/react/components/navigation/BasicLayout.jsx.map +1 -0
- package/dist_es/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
- package/dist_es/react/components/navigation/HeaderSiderLayout.js +80 -80
- package/dist_es/react/components/navigation/MenuPage.d.ts +37 -37
- package/dist_es/react/components/navigation/MenuPage.js +30 -30
- package/dist_es/react/components/navigation/MenuPage.jsx +31 -0
- package/dist_es/react/components/navigation/MenuPage.jsx.map +1 -0
- package/dist_es/react/components/navigation/MenuTrigger.d.ts +9 -9
- package/dist_es/react/components/navigation/MenuTrigger.js +28 -28
- package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
- package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.js +18 -18
- package/dist_es/react/components/navigation/ReactRouterLayout.d.ts +46 -46
- package/dist_es/react/components/navigation/ReactRouterLayout.js +99 -99
- package/dist_es/react/components/navigation/Router.d.ts +12 -0
- package/dist_es/react/components/navigation/Router.js +19 -0
- package/dist_es/react/components/navigation/Router.js.map +1 -0
- package/dist_es/react/components/navigation/Router.jsx +19 -0
- package/dist_es/react/components/navigation/Router.jsx.map +1 -0
- package/dist_es/react/components/navigation/customRouting/Router.d.ts +12 -12
- package/dist_es/react/components/navigation/customRouting/Router.js +18 -18
- package/dist_es/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
- package/dist_es/react/components/navigation/customRouting/RouterLayout.js +34 -34
- package/dist_es/react/components/navigation/react-router/BasicLayout.d.ts +23 -0
- package/dist_es/react/components/navigation/react-router/BasicLayout.js +82 -0
- package/dist_es/react/components/navigation/react-router/BasicLayout.js.map +1 -0
- package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.d.ts +24 -0
- package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js +82 -0
- package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js.map +1 -0
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.js +64 -64
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +58 -58
- package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
- package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.js +94 -94
- package/dist_es/react/hooks/useFin5BinUrl.d.ts +6 -6
- package/dist_es/react/hooks/useFin5BinUrl.js +11 -11
- package/dist_es/react/hooks/useFin5ColorScheme.d.ts +2 -2
- package/dist_es/react/hooks/useFin5ColorScheme.js +45 -45
- package/dist_es/react/hooks/useScreenSize.d.ts +7 -7
- package/dist_es/react/hooks/useScreenSize.js +27 -27
- package/package.json +2 -2
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
import { LayoutProps, MenuProps, SiderProps } from 'antd';
|
|
2
|
-
import React, { PropsWithChildren, ReactElement } from 'react';
|
|
3
|
-
import { MenuPage } from './MenuPage';
|
|
4
|
-
export interface BasicLayoutStyleVariables {
|
|
5
|
-
isMobile?: boolean;
|
|
6
|
-
compactSider?: boolean;
|
|
7
|
-
siderWidth?: number | string;
|
|
8
|
-
headerHeight: number;
|
|
9
|
-
}
|
|
10
|
-
export interface BasicLayoutProps<T extends MenuPage> extends PropsWithChildren {
|
|
11
|
-
pages?: T[];
|
|
12
|
-
defaultPage?: string;
|
|
13
|
-
selectedPages?: string[];
|
|
14
|
-
onSelect?: (key: string) => void;
|
|
15
|
-
compactSider?: {
|
|
16
|
-
isCompact?: boolean;
|
|
17
|
-
showButton?: boolean;
|
|
18
|
-
buttonClassName?: string;
|
|
19
|
-
};
|
|
20
|
-
layoutProps?: LayoutProps;
|
|
21
|
-
mobileHeaderProps?: LayoutProps;
|
|
22
|
-
siderProps?: SiderProps;
|
|
23
|
-
contentProps?: LayoutProps;
|
|
24
|
-
menuProps?: Omit<MenuProps, 'items' | 'selectedKeys' | 'onSelect'>;
|
|
25
|
-
menuBefore?: React.ReactNode;
|
|
26
|
-
menuAfter?: React.ReactNode;
|
|
27
|
-
menuTriggerClassName?: string;
|
|
28
|
-
headerHeight?: number;
|
|
29
|
-
}
|
|
30
|
-
/**
|
|
31
|
-
* Copy the array and recursively remove pages having the `showInMenu` flag set to false.
|
|
32
|
-
* @param pages
|
|
33
|
-
* @returns
|
|
34
|
-
*/
|
|
35
|
-
export declare const getMenuPages: (pages: MenuPage[]) => MenuPage<Record<string, unknown>>[];
|
|
36
|
-
export declare const DEFAULT_HEADER_HEIGHT = 45;
|
|
37
|
-
/**
|
|
38
|
-
* Basic layout with sider and mobile navigation management.
|
|
39
|
-
* Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
|
|
40
|
-
*/
|
|
41
|
-
export declare function BasicLayout<T extends MenuPage>({ pages, defaultPage, selectedPages, onSelect, compactSider, layoutProps, mobileHeaderProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight, children, }: BasicLayoutProps<T>): ReactElement;
|
|
1
|
+
import { LayoutProps, MenuProps, SiderProps } from 'antd';
|
|
2
|
+
import React, { PropsWithChildren, ReactElement } from 'react';
|
|
3
|
+
import { MenuPage } from './MenuPage';
|
|
4
|
+
export interface BasicLayoutStyleVariables {
|
|
5
|
+
isMobile?: boolean;
|
|
6
|
+
compactSider?: boolean;
|
|
7
|
+
siderWidth?: number | string;
|
|
8
|
+
headerHeight: number;
|
|
9
|
+
}
|
|
10
|
+
export interface BasicLayoutProps<T extends MenuPage> extends PropsWithChildren {
|
|
11
|
+
pages?: T[];
|
|
12
|
+
defaultPage?: string;
|
|
13
|
+
selectedPages?: string[];
|
|
14
|
+
onSelect?: (key: string) => void;
|
|
15
|
+
compactSider?: {
|
|
16
|
+
isCompact?: boolean;
|
|
17
|
+
showButton?: boolean;
|
|
18
|
+
buttonClassName?: string;
|
|
19
|
+
};
|
|
20
|
+
layoutProps?: LayoutProps;
|
|
21
|
+
mobileHeaderProps?: LayoutProps;
|
|
22
|
+
siderProps?: SiderProps;
|
|
23
|
+
contentProps?: LayoutProps;
|
|
24
|
+
menuProps?: Omit<MenuProps, 'items' | 'selectedKeys' | 'onSelect'>;
|
|
25
|
+
menuBefore?: React.ReactNode;
|
|
26
|
+
menuAfter?: React.ReactNode;
|
|
27
|
+
menuTriggerClassName?: string;
|
|
28
|
+
headerHeight?: number;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Copy the array and recursively remove pages having the `showInMenu` flag set to false.
|
|
32
|
+
* @param pages
|
|
33
|
+
* @returns
|
|
34
|
+
*/
|
|
35
|
+
export declare const getMenuPages: (pages: MenuPage[]) => MenuPage<Record<string, unknown>>[];
|
|
36
|
+
export declare const DEFAULT_HEADER_HEIGHT = 45;
|
|
37
|
+
/**
|
|
38
|
+
* Basic layout with sider and mobile navigation management.
|
|
39
|
+
* Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
|
|
40
|
+
*/
|
|
41
|
+
export declare function BasicLayout<T extends MenuPage>({ pages, defaultPage, selectedPages, onSelect, compactSider, layoutProps, mobileHeaderProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight, children, }: BasicLayoutProps<T>): ReactElement;
|
|
@@ -1,125 +1,125 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright (c) 2023, J2 Innovations. All Rights Reserved
|
|
3
|
-
*/
|
|
4
|
-
import { LeftOutlined } from '@ant-design/icons';
|
|
5
|
-
import { ant_prefix, Layout, Menu } from '@j2inn/ui';
|
|
6
|
-
import classNames from 'classnames';
|
|
7
|
-
import React, { useMemo, useState, } from 'react';
|
|
8
|
-
import { createUseStyles } from 'react-jss';
|
|
9
|
-
import MenuTrigger from './MenuTrigger';
|
|
10
|
-
const useStyles = createUseStyles({
|
|
11
|
-
header: ({ headerHeight }) => ({
|
|
12
|
-
position: 'fixed',
|
|
13
|
-
width: '100%',
|
|
14
|
-
zIndex: 1000,
|
|
15
|
-
padding: 0,
|
|
16
|
-
height: headerHeight,
|
|
17
|
-
lineHeight: `${headerHeight}px`,
|
|
18
|
-
}),
|
|
19
|
-
sider: {
|
|
20
|
-
overflow: 'auto',
|
|
21
|
-
height: '100vh',
|
|
22
|
-
position: 'fixed',
|
|
23
|
-
left: 0,
|
|
24
|
-
top: 0,
|
|
25
|
-
bottom: 0,
|
|
26
|
-
zIndex: 999,
|
|
27
|
-
paddingTop: ({ isMobile, headerHeight }) => isMobile ? headerHeight : 0,
|
|
28
|
-
[`& .${ant_prefix}-layout-sider-children`]: {
|
|
29
|
-
display: 'flex',
|
|
30
|
-
flexDirection: 'column',
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
compactSiderButton: {
|
|
34
|
-
position: 'sticky',
|
|
35
|
-
bottom: 0,
|
|
36
|
-
width: '100%',
|
|
37
|
-
textAlign: 'center',
|
|
38
|
-
fontSize: '1.3rem',
|
|
39
|
-
padding: '0.5rem',
|
|
40
|
-
cursor: 'pointer',
|
|
41
|
-
transition: '0.3s',
|
|
42
|
-
},
|
|
43
|
-
compactSiderButtonItem: {
|
|
44
|
-
transition: '0.3s',
|
|
45
|
-
},
|
|
46
|
-
compactSiderButtonItemCollapsed: {
|
|
47
|
-
transform: ' rotate(180deg)',
|
|
48
|
-
},
|
|
49
|
-
content: ({ isMobile, compactSider, siderWidth = 200, headerHeight, }) => ({
|
|
50
|
-
paddingLeft: isMobile ? 0 : compactSider ? 45 : siderWidth,
|
|
51
|
-
paddingTop: isMobile ? headerHeight : 0,
|
|
52
|
-
}),
|
|
53
|
-
});
|
|
54
|
-
// Workaround j2inn/ui exporting problem
|
|
55
|
-
const Header = Layout.Header;
|
|
56
|
-
const Sider = Layout.Sider;
|
|
57
|
-
const Content = Layout.Content;
|
|
58
|
-
/**
|
|
59
|
-
* Copy the array and recursively remove pages having the `showInMenu` flag set to false.
|
|
60
|
-
* @param pages
|
|
61
|
-
* @returns
|
|
62
|
-
*/
|
|
63
|
-
export const getMenuPages = (pages) => {
|
|
64
|
-
const menuPages = [];
|
|
65
|
-
pages.forEach((page) => {
|
|
66
|
-
const show = page.showInMenu == null || page.showInMenu;
|
|
67
|
-
if (show) {
|
|
68
|
-
const copiedPage = Object.assign({}, page);
|
|
69
|
-
if (copiedPage.children) {
|
|
70
|
-
const filteredChildren = getMenuPages(copiedPage.children);
|
|
71
|
-
copiedPage.children = filteredChildren.length
|
|
72
|
-
? filteredChildren
|
|
73
|
-
: undefined;
|
|
74
|
-
}
|
|
75
|
-
menuPages.push(copiedPage);
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
return menuPages;
|
|
79
|
-
};
|
|
80
|
-
export const DEFAULT_HEADER_HEIGHT = 45;
|
|
81
|
-
/**
|
|
82
|
-
* Basic layout with sider and mobile navigation management.
|
|
83
|
-
* Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
|
|
84
|
-
*/
|
|
85
|
-
export function BasicLayout({ pages = [], defaultPage, selectedPages = [], onSelect, compactSider, layoutProps, mobileHeaderProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight = DEFAULT_HEADER_HEIGHT, children, }) {
|
|
86
|
-
// manage mobile navigation
|
|
87
|
-
const [isMobile, setIsMobile] = useState(false);
|
|
88
|
-
const [isSiderCompact, setIsSiderCompact] = useState(compactSider?.isCompact ?? false);
|
|
89
|
-
const [hiddenSider, setHiddenSider] = useState(false);
|
|
90
|
-
const siderWidth = siderProps?.width;
|
|
91
|
-
const classes = useStyles({
|
|
92
|
-
isMobile,
|
|
93
|
-
compactSider: isSiderCompact,
|
|
94
|
-
siderWidth,
|
|
95
|
-
headerHeight,
|
|
96
|
-
});
|
|
97
|
-
const menuPages = useMemo(() => getMenuPages(pages), [pages]);
|
|
98
|
-
return (React.createElement(Layout, { hasSider: true, ...layoutProps },
|
|
99
|
-
isMobile && (React.createElement(Header, { ...mobileHeaderProps, className: classNames(classes.header, mobileHeaderProps?.className) },
|
|
100
|
-
React.createElement(MenuTrigger, { hiddenSider: hiddenSider, headerHeight: headerHeight, className: menuTriggerClassName, onClick: () => {
|
|
101
|
-
setHiddenSider(!hiddenSider);
|
|
102
|
-
} }))),
|
|
103
|
-
React.createElement(Sider, { ...siderProps, className: classNames(classes.sider, siderProps?.className), breakpoint: 'md', onBreakpoint: (broken) => {
|
|
104
|
-
setIsMobile(broken);
|
|
105
|
-
setHiddenSider(true);
|
|
106
|
-
}, collapsed: (isMobile && hiddenSider) || isSiderCompact, collapsedWidth: isMobile && hiddenSider
|
|
107
|
-
? 0
|
|
108
|
-
: isSiderCompact
|
|
109
|
-
? headerHeight
|
|
110
|
-
: 0, trigger: null },
|
|
111
|
-
menuBefore,
|
|
112
|
-
React.createElement(Menu, { style: { flex: 1 }, ...menuProps, defaultSelectedKeys: defaultPage ? [defaultPage] : undefined, items: menuPages, selectedKeys: selectedPages, onSelect: ({ key }) => {
|
|
113
|
-
if (!hiddenSider) {
|
|
114
|
-
setHiddenSider(true);
|
|
115
|
-
}
|
|
116
|
-
onSelect?.(key);
|
|
117
|
-
} }),
|
|
118
|
-
menuAfter,
|
|
119
|
-
compactSider?.showButton && !isMobile && (React.createElement("div", { className: classNames(classes.compactSiderButton, compactSider.buttonClassName), onClick: () => setIsSiderCompact(!isSiderCompact) },
|
|
120
|
-
React.createElement(LeftOutlined, { className: classNames(classes.compactSiderButtonItem, {
|
|
121
|
-
[classes.compactSiderButtonItemCollapsed]: isSiderCompact,
|
|
122
|
-
}) })))),
|
|
123
|
-
React.createElement(Content, { ...contentProps, className: classNames(classes.content, contentProps?.className) }, children)));
|
|
124
|
-
}
|
|
1
|
+
/*
|
|
2
|
+
* Copyright (c) 2023, J2 Innovations. All Rights Reserved
|
|
3
|
+
*/
|
|
4
|
+
import { LeftOutlined } from '@ant-design/icons';
|
|
5
|
+
import { ant_prefix, Layout, Menu } from '@j2inn/ui';
|
|
6
|
+
import classNames from 'classnames';
|
|
7
|
+
import React, { useMemo, useState, } from 'react';
|
|
8
|
+
import { createUseStyles } from 'react-jss';
|
|
9
|
+
import MenuTrigger from './MenuTrigger';
|
|
10
|
+
const useStyles = createUseStyles({
|
|
11
|
+
header: ({ headerHeight }) => ({
|
|
12
|
+
position: 'fixed',
|
|
13
|
+
width: '100%',
|
|
14
|
+
zIndex: 1000,
|
|
15
|
+
padding: 0,
|
|
16
|
+
height: headerHeight,
|
|
17
|
+
lineHeight: `${headerHeight}px`,
|
|
18
|
+
}),
|
|
19
|
+
sider: {
|
|
20
|
+
overflow: 'auto',
|
|
21
|
+
height: '100vh',
|
|
22
|
+
position: 'fixed',
|
|
23
|
+
left: 0,
|
|
24
|
+
top: 0,
|
|
25
|
+
bottom: 0,
|
|
26
|
+
zIndex: 999,
|
|
27
|
+
paddingTop: ({ isMobile, headerHeight }) => isMobile ? headerHeight : 0,
|
|
28
|
+
[`& .${ant_prefix}-layout-sider-children`]: {
|
|
29
|
+
display: 'flex',
|
|
30
|
+
flexDirection: 'column',
|
|
31
|
+
},
|
|
32
|
+
},
|
|
33
|
+
compactSiderButton: {
|
|
34
|
+
position: 'sticky',
|
|
35
|
+
bottom: 0,
|
|
36
|
+
width: '100%',
|
|
37
|
+
textAlign: 'center',
|
|
38
|
+
fontSize: '1.3rem',
|
|
39
|
+
padding: '0.5rem',
|
|
40
|
+
cursor: 'pointer',
|
|
41
|
+
transition: '0.3s',
|
|
42
|
+
},
|
|
43
|
+
compactSiderButtonItem: {
|
|
44
|
+
transition: '0.3s',
|
|
45
|
+
},
|
|
46
|
+
compactSiderButtonItemCollapsed: {
|
|
47
|
+
transform: ' rotate(180deg)',
|
|
48
|
+
},
|
|
49
|
+
content: ({ isMobile, compactSider, siderWidth = 200, headerHeight, }) => ({
|
|
50
|
+
paddingLeft: isMobile ? 0 : compactSider ? 45 : siderWidth,
|
|
51
|
+
paddingTop: isMobile ? headerHeight : 0,
|
|
52
|
+
}),
|
|
53
|
+
});
|
|
54
|
+
// Workaround j2inn/ui exporting problem
|
|
55
|
+
const Header = Layout.Header;
|
|
56
|
+
const Sider = Layout.Sider;
|
|
57
|
+
const Content = Layout.Content;
|
|
58
|
+
/**
|
|
59
|
+
* Copy the array and recursively remove pages having the `showInMenu` flag set to false.
|
|
60
|
+
* @param pages
|
|
61
|
+
* @returns
|
|
62
|
+
*/
|
|
63
|
+
export const getMenuPages = (pages) => {
|
|
64
|
+
const menuPages = [];
|
|
65
|
+
pages.forEach((page) => {
|
|
66
|
+
const show = page.showInMenu == null || page.showInMenu;
|
|
67
|
+
if (show) {
|
|
68
|
+
const copiedPage = Object.assign({}, page);
|
|
69
|
+
if (copiedPage.children) {
|
|
70
|
+
const filteredChildren = getMenuPages(copiedPage.children);
|
|
71
|
+
copiedPage.children = filteredChildren.length
|
|
72
|
+
? filteredChildren
|
|
73
|
+
: undefined;
|
|
74
|
+
}
|
|
75
|
+
menuPages.push(copiedPage);
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
return menuPages;
|
|
79
|
+
};
|
|
80
|
+
export const DEFAULT_HEADER_HEIGHT = 45;
|
|
81
|
+
/**
|
|
82
|
+
* Basic layout with sider and mobile navigation management.
|
|
83
|
+
* Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
|
|
84
|
+
*/
|
|
85
|
+
export function BasicLayout({ pages = [], defaultPage, selectedPages = [], onSelect, compactSider, layoutProps, mobileHeaderProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight = DEFAULT_HEADER_HEIGHT, children, }) {
|
|
86
|
+
// manage mobile navigation
|
|
87
|
+
const [isMobile, setIsMobile] = useState(false);
|
|
88
|
+
const [isSiderCompact, setIsSiderCompact] = useState(compactSider?.isCompact ?? false);
|
|
89
|
+
const [hiddenSider, setHiddenSider] = useState(false);
|
|
90
|
+
const siderWidth = siderProps?.width;
|
|
91
|
+
const classes = useStyles({
|
|
92
|
+
isMobile,
|
|
93
|
+
compactSider: isSiderCompact,
|
|
94
|
+
siderWidth,
|
|
95
|
+
headerHeight,
|
|
96
|
+
});
|
|
97
|
+
const menuPages = useMemo(() => getMenuPages(pages), [pages]);
|
|
98
|
+
return (React.createElement(Layout, { hasSider: true, ...layoutProps },
|
|
99
|
+
isMobile && (React.createElement(Header, { ...mobileHeaderProps, className: classNames(classes.header, mobileHeaderProps?.className) },
|
|
100
|
+
React.createElement(MenuTrigger, { hiddenSider: hiddenSider, headerHeight: headerHeight, className: menuTriggerClassName, onClick: () => {
|
|
101
|
+
setHiddenSider(!hiddenSider);
|
|
102
|
+
} }))),
|
|
103
|
+
React.createElement(Sider, { ...siderProps, className: classNames(classes.sider, siderProps?.className), breakpoint: 'md', onBreakpoint: (broken) => {
|
|
104
|
+
setIsMobile(broken);
|
|
105
|
+
setHiddenSider(true);
|
|
106
|
+
}, collapsed: (isMobile && hiddenSider) || isSiderCompact, collapsedWidth: isMobile && hiddenSider
|
|
107
|
+
? 0
|
|
108
|
+
: isSiderCompact
|
|
109
|
+
? headerHeight
|
|
110
|
+
: 0, trigger: null },
|
|
111
|
+
menuBefore,
|
|
112
|
+
React.createElement(Menu, { style: { flex: 1 }, ...menuProps, defaultSelectedKeys: defaultPage ? [defaultPage] : undefined, items: menuPages, selectedKeys: selectedPages, onSelect: ({ key }) => {
|
|
113
|
+
if (!hiddenSider) {
|
|
114
|
+
setHiddenSider(true);
|
|
115
|
+
}
|
|
116
|
+
onSelect?.(key);
|
|
117
|
+
} }),
|
|
118
|
+
menuAfter,
|
|
119
|
+
compactSider?.showButton && !isMobile && (React.createElement("div", { className: classNames(classes.compactSiderButton, compactSider.buttonClassName), onClick: () => setIsSiderCompact(!isSiderCompact) },
|
|
120
|
+
React.createElement(LeftOutlined, { className: classNames(classes.compactSiderButtonItem, {
|
|
121
|
+
[classes.compactSiderButtonItemCollapsed]: isSiderCompact,
|
|
122
|
+
}) })))),
|
|
123
|
+
React.createElement(Content, { ...contentProps, className: classNames(classes.content, contentProps?.className) }, children)));
|
|
124
|
+
}
|
|
125
125
|
//# sourceMappingURL=BasicLayout.js.map
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Copyright (c) 2022, J2 Innovations. All Rights Reserved
|
|
3
|
+
*/
|
|
4
|
+
import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
|
|
5
|
+
import { Button, Layout, Menu } from '@j2inn/ui';
|
|
6
|
+
import classNames from 'classnames';
|
|
7
|
+
import React, { useEffect, useMemo, useState } from 'react';
|
|
8
|
+
import { createUseStyles } from 'react-jss';
|
|
9
|
+
import { ErrorDisplayer } from '../ErrorDisplayer';
|
|
10
|
+
import { findPageByName } from './MenuPage';
|
|
11
|
+
import { Router } from './Router';
|
|
12
|
+
const HEADER_HEIGHT = 45;
|
|
13
|
+
const useStyles = createUseStyles((theme) => {
|
|
14
|
+
return {
|
|
15
|
+
header: {
|
|
16
|
+
position: 'fixed',
|
|
17
|
+
width: '100%',
|
|
18
|
+
zIndex: 1000,
|
|
19
|
+
padding: 0,
|
|
20
|
+
height: HEADER_HEIGHT,
|
|
21
|
+
lineHeight: '45px',
|
|
22
|
+
},
|
|
23
|
+
sider: {
|
|
24
|
+
overflow: 'auto',
|
|
25
|
+
height: '100vh',
|
|
26
|
+
position: 'fixed',
|
|
27
|
+
left: 0,
|
|
28
|
+
top: 0,
|
|
29
|
+
bottom: 0,
|
|
30
|
+
zIndex: 999,
|
|
31
|
+
paddingTop: ({ isMobile }) => isMobile ? HEADER_HEIGHT : 0,
|
|
32
|
+
},
|
|
33
|
+
menuTrigger: {
|
|
34
|
+
width: 45,
|
|
35
|
+
height: '100%',
|
|
36
|
+
textAlign: 'center',
|
|
37
|
+
fontSize: 18,
|
|
38
|
+
cursor: 'pointer',
|
|
39
|
+
transition: 'color 0.3s ease-in-out',
|
|
40
|
+
backgroundColor: 'transparent',
|
|
41
|
+
color: 'white',
|
|
42
|
+
'&:hover': {
|
|
43
|
+
color: theme.linkActiveColor,
|
|
44
|
+
},
|
|
45
|
+
},
|
|
46
|
+
content: ({ isMobile, compactSider, siderWidth = 200, }) => ({
|
|
47
|
+
paddingLeft: isMobile ? 0 : compactSider ? 45 : siderWidth,
|
|
48
|
+
paddingTop: isMobile ? HEADER_HEIGHT : 0,
|
|
49
|
+
}),
|
|
50
|
+
};
|
|
51
|
+
});
|
|
52
|
+
// Workaround j2inn/ui exporting problem
|
|
53
|
+
const Header = Layout.Header;
|
|
54
|
+
const Sider = Layout.Sider;
|
|
55
|
+
const Content = Layout.Content;
|
|
56
|
+
/**
|
|
57
|
+
* Copy the array and recursively remove pages having the `showInMenu` flag set to false.
|
|
58
|
+
* @param pages
|
|
59
|
+
* @returns
|
|
60
|
+
*/
|
|
61
|
+
const getMenuPages = (pages) => {
|
|
62
|
+
const menuPages = [];
|
|
63
|
+
pages.forEach((page) => {
|
|
64
|
+
const show = page.showInMenu == null || page.showInMenu;
|
|
65
|
+
if (show) {
|
|
66
|
+
const copiedPage = Object.assign({}, page);
|
|
67
|
+
if (copiedPage.children) {
|
|
68
|
+
const filteredChildren = getMenuPages(copiedPage.children);
|
|
69
|
+
copiedPage.children = filteredChildren.length
|
|
70
|
+
? filteredChildren
|
|
71
|
+
: undefined;
|
|
72
|
+
}
|
|
73
|
+
menuPages.push(copiedPage);
|
|
74
|
+
}
|
|
75
|
+
});
|
|
76
|
+
return menuPages;
|
|
77
|
+
};
|
|
78
|
+
/**
|
|
79
|
+
* Basic layout that combines menu and routing into one.
|
|
80
|
+
*/
|
|
81
|
+
export const BasicLayout = ({ pages = [], defaultPage = pages?.[0].key ?? '', onPageChange, compactSider, layoutProps, mobileHeaderProps, siderProps, contentProps, menuProps, page, }) => {
|
|
82
|
+
const [currentPage, setCurrentPage] = useState(page ?? defaultPage);
|
|
83
|
+
useEffect(() => {
|
|
84
|
+
if (page) {
|
|
85
|
+
setCurrentPage(page);
|
|
86
|
+
}
|
|
87
|
+
}, [page]);
|
|
88
|
+
// Fire onChange
|
|
89
|
+
useEffect(() => {
|
|
90
|
+
onPageChange?.(currentPage);
|
|
91
|
+
}, [currentPage]);
|
|
92
|
+
// manage mobile navigation
|
|
93
|
+
const [isMobile, setIsMobile] = useState(false);
|
|
94
|
+
const [hiddenSider, setHiddenSider] = useState(false);
|
|
95
|
+
const siderWidth = siderProps?.width;
|
|
96
|
+
const classes = useStyles({ isMobile, compactSider, siderWidth });
|
|
97
|
+
const menuPages = useMemo(() => getMenuPages(pages), [pages]);
|
|
98
|
+
return (<Layout hasSider {...layoutProps}>
|
|
99
|
+
{isMobile && (<Header {...mobileHeaderProps} className={classNames(classes.header, mobileHeaderProps?.className)}>
|
|
100
|
+
{hiddenSider ? (<MenuUnfoldOutlined className={classes.menuTrigger} onClick={() => {
|
|
101
|
+
setHiddenSider(!hiddenSider);
|
|
102
|
+
}}/>) : (<MenuFoldOutlined className={classes.menuTrigger} onClick={() => {
|
|
103
|
+
setHiddenSider(!hiddenSider);
|
|
104
|
+
}}/>)}
|
|
105
|
+
</Header>)}
|
|
106
|
+
<Sider {...siderProps} className={classNames(classes.sider, siderProps?.className)} breakpoint='md' onBreakpoint={(broken) => {
|
|
107
|
+
setIsMobile(broken);
|
|
108
|
+
setHiddenSider(true);
|
|
109
|
+
}} collapsed={(isMobile && hiddenSider) || compactSider} collapsedWidth={isMobile && hiddenSider
|
|
110
|
+
? 0
|
|
111
|
+
: compactSider
|
|
112
|
+
? HEADER_HEIGHT
|
|
113
|
+
: 0} trigger={null}>
|
|
114
|
+
<Menu {...menuProps} items={menuPages} selectedKeys={[currentPage]} onSelect={({ key }) => {
|
|
115
|
+
if (!hiddenSider) {
|
|
116
|
+
setHiddenSider(true);
|
|
117
|
+
}
|
|
118
|
+
const page = findPageByName(pages, key);
|
|
119
|
+
if (page?.component) {
|
|
120
|
+
setCurrentPage(key);
|
|
121
|
+
}
|
|
122
|
+
}}/>
|
|
123
|
+
</Sider>
|
|
124
|
+
<Content {...contentProps} className={classNames(classes.content, contentProps?.className)}>
|
|
125
|
+
<Router pages={pages} currentPage={currentPage} fallbackComponent={<ErrorDisplayer error={new Error('Page Not Found')} extra={[
|
|
126
|
+
<Button type='primary' key='refresh' onClick={() => setCurrentPage(defaultPage)}>
|
|
127
|
+
Go Home
|
|
128
|
+
</Button>,
|
|
129
|
+
]}/>}/>
|
|
130
|
+
</Content>
|
|
131
|
+
</Layout>);
|
|
132
|
+
};
|
|
133
|
+
//# sourceMappingURL=BasicLayout.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BasicLayout.jsx","sourceRoot":"","sources":["../../../../src/react/components/navigation/BasicLayout.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { LayoutProps } from 'antd';
|
|
2
|
-
import React, { ReactElement } from 'react';
|
|
3
|
-
import { BasicLayoutProps } from './BasicLayout';
|
|
4
|
-
import { MenuPage } from './MenuPage';
|
|
5
|
-
export declare type HeaderSiderLayoutProps<T extends MenuPage> = Omit<BasicLayoutProps<T>, 'mobileHeaderProps'> & {
|
|
6
|
-
header?: React.ReactNode;
|
|
7
|
-
headerProps?: LayoutProps;
|
|
8
|
-
};
|
|
9
|
-
/**
|
|
10
|
-
* Layout with header and sider. Sider is collapsed on mobile.
|
|
11
|
-
* Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
|
|
12
|
-
*/
|
|
13
|
-
export declare function HeaderSiderLayout<T extends MenuPage>({ pages, defaultPage, selectedPages, onSelect, compactSider, layoutProps, header, headerProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight, children, }: HeaderSiderLayoutProps<T>): ReactElement;
|
|
1
|
+
import { LayoutProps } from 'antd';
|
|
2
|
+
import React, { ReactElement } from 'react';
|
|
3
|
+
import { BasicLayoutProps } from './BasicLayout';
|
|
4
|
+
import { MenuPage } from './MenuPage';
|
|
5
|
+
export declare type HeaderSiderLayoutProps<T extends MenuPage> = Omit<BasicLayoutProps<T>, 'mobileHeaderProps'> & {
|
|
6
|
+
header?: React.ReactNode;
|
|
7
|
+
headerProps?: LayoutProps;
|
|
8
|
+
};
|
|
9
|
+
/**
|
|
10
|
+
* Layout with header and sider. Sider is collapsed on mobile.
|
|
11
|
+
* Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
|
|
12
|
+
*/
|
|
13
|
+
export declare function HeaderSiderLayout<T extends MenuPage>({ pages, defaultPage, selectedPages, onSelect, compactSider, layoutProps, header, headerProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight, children, }: HeaderSiderLayoutProps<T>): ReactElement;
|