@j2inn/fin5-ui-utils 8.1.1-beta.5 → 8.1.1-beta.6

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.
Files changed (216) hide show
  1. package/README.md +5 -5
  2. package/dist/fantomProps/createFin5Props/index.d.ts +12 -12
  3. package/dist/fantomProps/createFin5Props/index.js +146 -146
  4. package/dist/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
  5. package/dist/fantomProps/createFin5Props/runCreateFin5Props.js +20 -20
  6. package/dist/fantomProps/fantomPropsToObject.d.ts +8 -8
  7. package/dist/fantomProps/fantomPropsToObject.js +183 -183
  8. package/dist/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
  9. package/dist/fantomProps/generateJsonFromFantomPropsFile.js +41 -41
  10. package/dist/fantomProps/localePropsToJson.d.ts +1 -1
  11. package/dist/fantomProps/localePropsToJson.js +50 -50
  12. package/dist/fantomProps/readFantomPropsFile.d.ts +5 -5
  13. package/dist/fantomProps/readFantomPropsFile.js +65 -65
  14. package/dist/fin5Top/fin5FileUpload.d.ts +24 -24
  15. package/dist/fin5Top/fin5FileUpload.js +51 -51
  16. package/dist/fin5Top/fin5Top.d.ts +165 -124
  17. package/dist/fin5Top/fin5Top.js +61 -53
  18. package/dist/fin5Top/fin5Top.js.map +1 -1
  19. package/dist/fin5Top/finEdge2Cloud.d.ts +6 -6
  20. package/dist/fin5Top/finEdge2Cloud.js +15 -15
  21. package/dist/fin5Top/getFin5BinUrl.d.ts +2 -2
  22. package/dist/fin5Top/getFin5BinUrl.js +9 -9
  23. package/dist/fin5Top/openFin5Alarm.d.ts +22 -22
  24. package/dist/fin5Top/openFin5Alarm.js +23 -23
  25. package/dist/fin5Top/openFin5Historian.d.ts +3 -3
  26. package/dist/fin5Top/openFin5Historian.js +19 -19
  27. package/dist/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
  28. package/dist/fin5Top/useFin5AppURLHashParameter.js +133 -133
  29. package/dist/index.d.ts +35 -35
  30. package/dist/index.js +69 -69
  31. package/dist/jobs/jobUtils.d.ts +14 -14
  32. package/dist/jobs/jobUtils.js +15 -15
  33. package/dist/react/app/Fin5AppContainer.d.ts +36 -36
  34. package/dist/react/app/Fin5AppContainer.js +145 -161
  35. package/dist/react/app/Fin5AppContainer.js.map +1 -1
  36. package/dist/react/app/Fin5AppRootStore.d.ts +40 -42
  37. package/dist/react/app/Fin5AppRootStore.js +90 -114
  38. package/dist/react/app/Fin5AppRootStore.js.map +1 -1
  39. package/dist/react/components/ErrorBoundary.d.ts +57 -57
  40. package/dist/react/components/ErrorBoundary.js +150 -150
  41. package/dist/react/components/ErrorDisplayer.d.ts +19 -19
  42. package/dist/react/components/ErrorDisplayer.js +36 -36
  43. package/dist/react/components/Loader.d.ts +9 -9
  44. package/dist/react/components/Loader.js +17 -17
  45. package/dist/react/components/LoadingSpinner.d.ts +2 -2
  46. package/dist/react/components/LoadingSpinner.js +27 -27
  47. package/dist/react/components/RecordImage.d.ts +20 -20
  48. package/dist/react/components/RecordImage.js +51 -51
  49. package/dist/react/components/charts/QRCode.d.ts +25 -25
  50. package/dist/react/components/charts/QRCode.js +82 -82
  51. package/dist/react/components/charts/line-bar/Chart.d.ts +166 -166
  52. package/dist/react/components/charts/line-bar/Chart.js +442 -442
  53. package/dist/react/components/charts/line-bar/HGridChart.d.ts +58 -58
  54. package/dist/react/components/charts/line-bar/HGridChart.js +285 -285
  55. package/dist/react/components/charts/pie/PieChart.d.ts +94 -94
  56. package/dist/react/components/charts/pie/PieChart.js +204 -204
  57. package/dist/react/components/charts/pie/SimplePieChart.d.ts +21 -21
  58. package/dist/react/components/charts/pie/SimplePieChart.js +55 -55
  59. package/dist/react/components/graphics/GraphicViewer.d.ts +10 -10
  60. package/dist/react/components/graphics/GraphicViewer.js +29 -29
  61. package/dist/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
  62. package/dist/react/components/graphics/GraphicsTabViewer.js +90 -90
  63. package/dist/react/components/makeCustomElement.d.ts +16 -16
  64. package/dist/react/components/makeCustomElement.js +150 -150
  65. package/dist/react/components/navigation/BasicLayout.d.ts +41 -41
  66. package/dist/react/components/navigation/BasicLayout.js +155 -155
  67. package/dist/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
  68. package/dist/react/components/navigation/HeaderSiderLayout.js +110 -110
  69. package/dist/react/components/navigation/MenuPage.d.ts +37 -37
  70. package/dist/react/components/navigation/MenuPage.js +36 -36
  71. package/dist/react/components/navigation/MenuTrigger.d.ts +9 -9
  72. package/dist/react/components/navigation/MenuTrigger.js +33 -33
  73. package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
  74. package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.js +25 -25
  75. package/dist/react/components/navigation/ReactRouterLayout.d.ts +46 -46
  76. package/dist/react/components/navigation/ReactRouterLayout.js +132 -132
  77. package/dist/react/components/navigation/customRouting/Router.d.ts +12 -12
  78. package/dist/react/components/navigation/customRouting/Router.js +45 -45
  79. package/dist/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
  80. package/dist/react/components/navigation/customRouting/RouterLayout.js +61 -61
  81. package/dist/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
  82. package/dist/react/components/resolvable/configurationForm/ConfigurationForm.js +95 -95
  83. package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
  84. package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +88 -88
  85. package/dist/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
  86. package/dist/react/components/resolvable/configurationForm/getSectionDefault.js +99 -99
  87. package/dist/react/hooks/useFin5BinUrl.d.ts +6 -6
  88. package/dist/react/hooks/useFin5BinUrl.js +15 -15
  89. package/dist/react/hooks/useFin5ColorScheme.d.ts +2 -2
  90. package/dist/react/hooks/useFin5ColorScheme.js +56 -56
  91. package/dist/react/hooks/useScreenSize.d.ts +7 -7
  92. package/dist/react/hooks/useScreenSize.js +31 -31
  93. package/dist_es/fantomProps/createFin5Props/index.d.ts +12 -12
  94. package/dist_es/fantomProps/createFin5Props/index.js +140 -140
  95. package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
  96. package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.js +15 -15
  97. package/dist_es/fantomProps/fantomPropsToObject.d.ts +8 -8
  98. package/dist_es/fantomProps/fantomPropsToObject.js +178 -178
  99. package/dist_es/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
  100. package/dist_es/fantomProps/generateJsonFromFantomPropsFile.js +12 -12
  101. package/dist_es/fantomProps/localePropsToJson.d.ts +1 -1
  102. package/dist_es/fantomProps/localePropsToJson.js +21 -21
  103. package/dist_es/fantomProps/readFantomPropsFile.d.ts +5 -5
  104. package/dist_es/fantomProps/readFantomPropsFile.js +39 -39
  105. package/dist_es/fin5Top/fin5FileUpload.d.ts +24 -24
  106. package/dist_es/fin5Top/fin5FileUpload.js +47 -47
  107. package/dist_es/fin5Top/fin5Top.d.ts +165 -124
  108. package/dist_es/fin5Top/fin5Top.js +57 -49
  109. package/dist_es/fin5Top/fin5Top.js.map +1 -1
  110. package/dist_es/fin5Top/finEdge2Cloud.d.ts +6 -6
  111. package/dist_es/fin5Top/finEdge2Cloud.js +11 -11
  112. package/dist_es/fin5Top/getFin5BinUrl.d.ts +2 -2
  113. package/dist_es/fin5Top/getFin5BinUrl.js +5 -5
  114. package/dist_es/fin5Top/openFin5Alarm.d.ts +22 -22
  115. package/dist_es/fin5Top/openFin5Alarm.js +19 -19
  116. package/dist_es/fin5Top/openFin5Historian.d.ts +3 -3
  117. package/dist_es/fin5Top/openFin5Historian.js +15 -15
  118. package/dist_es/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
  119. package/dist_es/fin5Top/useFin5AppURLHashParameter.js +124 -124
  120. package/dist_es/index.d.ts +35 -35
  121. package/dist_es/index.js +53 -53
  122. package/dist_es/jobs/jobUtils.d.ts +14 -14
  123. package/dist_es/jobs/jobUtils.js +9 -9
  124. package/dist_es/react/app/Fin5AppContainer.d.ts +36 -36
  125. package/dist_es/react/app/Fin5AppContainer.js +116 -132
  126. package/dist_es/react/app/Fin5AppContainer.js.map +1 -1
  127. package/dist_es/react/app/Fin5AppContainer.jsx +82 -0
  128. package/dist_es/react/app/Fin5AppContainer.jsx.map +1 -0
  129. package/dist_es/react/app/Fin5AppRootStore.d.ts +40 -42
  130. package/dist_es/react/app/Fin5AppRootStore.js +86 -110
  131. package/dist_es/react/app/Fin5AppRootStore.js.map +1 -1
  132. package/dist_es/react/components/ErrorBoundary.d.ts +57 -57
  133. package/dist_es/react/components/ErrorBoundary.js +123 -123
  134. package/dist_es/react/components/ErrorBoundary.jsx +150 -0
  135. package/dist_es/react/components/ErrorBoundary.jsx.map +1 -0
  136. package/dist_es/react/components/ErrorDisplayer.d.ts +19 -19
  137. package/dist_es/react/components/ErrorDisplayer.js +28 -28
  138. package/dist_es/react/components/ErrorDisplayer.jsx +36 -0
  139. package/dist_es/react/components/ErrorDisplayer.jsx.map +1 -0
  140. package/dist_es/react/components/Loader.d.ts +9 -9
  141. package/dist_es/react/components/Loader.js +12 -12
  142. package/dist_es/react/components/Loader.jsx +13 -0
  143. package/dist_es/react/components/Loader.jsx.map +1 -0
  144. package/dist_es/react/components/LoadingSpinner.d.ts +2 -2
  145. package/dist_es/react/components/LoadingSpinner.js +20 -20
  146. package/dist_es/react/components/LoadingSpinner.jsx +22 -0
  147. package/dist_es/react/components/LoadingSpinner.jsx.map +1 -0
  148. package/dist_es/react/components/RecordImage.d.ts +20 -20
  149. package/dist_es/react/components/RecordImage.js +24 -24
  150. package/dist_es/react/components/charts/QRCode.d.ts +25 -25
  151. package/dist_es/react/components/charts/QRCode.js +52 -52
  152. package/dist_es/react/components/charts/line-bar/Chart.d.ts +166 -166
  153. package/dist_es/react/components/charts/line-bar/Chart.js +415 -415
  154. package/dist_es/react/components/charts/line-bar/HGridChart.d.ts +58 -58
  155. package/dist_es/react/components/charts/line-bar/HGridChart.js +250 -250
  156. package/dist_es/react/components/charts/line-bar/ZincGridChart.d.ts +12 -0
  157. package/dist_es/react/components/charts/line-bar/ZincGridChart.js +17 -0
  158. package/dist_es/react/components/charts/line-bar/ZincGridChart.js.map +1 -0
  159. package/dist_es/react/components/charts/pie/PieChart.d.ts +94 -94
  160. package/dist_es/react/components/charts/pie/PieChart.js +177 -177
  161. package/dist_es/react/components/charts/pie/SimplePieChart.d.ts +21 -21
  162. package/dist_es/react/components/charts/pie/SimplePieChart.js +25 -25
  163. package/dist_es/react/components/graphics/GraphicViewer.d.ts +10 -10
  164. package/dist_es/react/components/graphics/GraphicViewer.js +22 -22
  165. package/dist_es/react/components/graphics/GraphicViewer.jsx +23 -0
  166. package/dist_es/react/components/graphics/GraphicViewer.jsx.map +1 -0
  167. package/dist_es/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
  168. package/dist_es/react/components/graphics/GraphicsTabViewer.js +60 -60
  169. package/dist_es/react/components/graphics/GraphicsTabViewer.jsx +63 -0
  170. package/dist_es/react/components/graphics/GraphicsTabViewer.jsx.map +1 -0
  171. package/dist_es/react/components/makeCustomElement.d.ts +16 -16
  172. package/dist_es/react/components/makeCustomElement.js +142 -142
  173. package/dist_es/react/components/navigation/BasicLayout.d.ts +41 -41
  174. package/dist_es/react/components/navigation/BasicLayout.js +124 -124
  175. package/dist_es/react/components/navigation/BasicLayout.jsx +133 -0
  176. package/dist_es/react/components/navigation/BasicLayout.jsx.map +1 -0
  177. package/dist_es/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
  178. package/dist_es/react/components/navigation/HeaderSiderLayout.js +80 -80
  179. package/dist_es/react/components/navigation/MenuPage.d.ts +37 -37
  180. package/dist_es/react/components/navigation/MenuPage.js +30 -30
  181. package/dist_es/react/components/navigation/MenuPage.jsx +31 -0
  182. package/dist_es/react/components/navigation/MenuPage.jsx.map +1 -0
  183. package/dist_es/react/components/navigation/MenuTrigger.d.ts +9 -9
  184. package/dist_es/react/components/navigation/MenuTrigger.js +28 -28
  185. package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
  186. package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.js +18 -18
  187. package/dist_es/react/components/navigation/ReactRouterLayout.d.ts +46 -46
  188. package/dist_es/react/components/navigation/ReactRouterLayout.js +99 -99
  189. package/dist_es/react/components/navigation/Router.d.ts +12 -0
  190. package/dist_es/react/components/navigation/Router.js +19 -0
  191. package/dist_es/react/components/navigation/Router.js.map +1 -0
  192. package/dist_es/react/components/navigation/Router.jsx +19 -0
  193. package/dist_es/react/components/navigation/Router.jsx.map +1 -0
  194. package/dist_es/react/components/navigation/customRouting/Router.d.ts +12 -12
  195. package/dist_es/react/components/navigation/customRouting/Router.js +18 -18
  196. package/dist_es/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
  197. package/dist_es/react/components/navigation/customRouting/RouterLayout.js +34 -34
  198. package/dist_es/react/components/navigation/react-router/BasicLayout.d.ts +23 -0
  199. package/dist_es/react/components/navigation/react-router/BasicLayout.js +82 -0
  200. package/dist_es/react/components/navigation/react-router/BasicLayout.js.map +1 -0
  201. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.d.ts +24 -0
  202. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js +82 -0
  203. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js.map +1 -0
  204. package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
  205. package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.js +64 -64
  206. package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
  207. package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +58 -58
  208. package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
  209. package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.js +94 -94
  210. package/dist_es/react/hooks/useFin5BinUrl.d.ts +6 -6
  211. package/dist_es/react/hooks/useFin5BinUrl.js +11 -11
  212. package/dist_es/react/hooks/useFin5ColorScheme.d.ts +2 -2
  213. package/dist_es/react/hooks/useFin5ColorScheme.js +52 -52
  214. package/dist_es/react/hooks/useScreenSize.d.ts +7 -7
  215. package/dist_es/react/hooks/useScreenSize.js +27 -27
  216. package/package.json +1 -1
@@ -1,81 +1,81 @@
1
- /*
2
- * Copyright (c) 2024, J2 Innovations. All Rights Reserved
3
- */
4
- import { Container, Layout, Menu } from '@j2inn/ui';
5
- import classNames from 'classnames';
6
- import React, { useMemo, useState } from 'react';
7
- import { createUseStyles } from 'react-jss';
8
- import { DEFAULT_HEADER_HEIGHT, getMenuPages, } from './BasicLayout';
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
- headerContent: {
20
- height: '100%',
21
- },
22
- sider: ({ headerHeight }) => ({
23
- overflow: 'auto',
24
- height: '100vh',
25
- position: 'fixed',
26
- left: 0,
27
- top: 0,
28
- bottom: 0,
29
- zIndex: 999,
30
- paddingTop: headerHeight,
31
- }),
32
- content: ({ isMobile, compactSider, siderWidth = 200, headerHeight, }) => ({
33
- paddingLeft: isMobile ? 0 : compactSider ? 45 : siderWidth,
34
- paddingTop: headerHeight,
35
- }),
36
- });
37
- // Workaround j2inn/ui exporting problem
38
- const Header = Layout.Header;
39
- const Sider = Layout.Sider;
40
- const Content = Layout.Content;
41
- /**
42
- * Layout with header and sider. Sider is collapsed on mobile.
43
- * Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
44
- */
45
- export function HeaderSiderLayout({ pages = [], defaultPage, selectedPages = [], onSelect, compactSider, layoutProps, header, headerProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight = DEFAULT_HEADER_HEIGHT, children, }) {
46
- const [isMobile, setIsMobile] = useState(false);
47
- const [hiddenSider, setHiddenSider] = useState(false);
48
- const siderWidth = siderProps?.width;
49
- const classes = useStyles({
50
- isMobile,
51
- compactSider: compactSider?.isCompact,
52
- siderWidth,
53
- headerHeight,
54
- });
55
- const menuPages = useMemo(() => getMenuPages(pages), [pages]);
56
- return (React.createElement(Layout, { hasSider: true, ...layoutProps },
57
- React.createElement(Header, { ...headerProps, className: classNames(classes.header, headerProps?.className) },
58
- React.createElement(Container, { horizontal: true, middle: true, className: classes.headerContent },
59
- isMobile && (React.createElement(MenuTrigger, { hiddenSider: hiddenSider, headerHeight: headerHeight, className: menuTriggerClassName, onClick: () => {
60
- setHiddenSider(!hiddenSider);
61
- } })),
62
- header)),
63
- React.createElement(Sider, { ...siderProps, className: classNames(classes.sider, siderProps?.className), breakpoint: 'md', onBreakpoint: (broken) => {
64
- setIsMobile(broken);
65
- setHiddenSider(true);
66
- }, collapsed: (isMobile && hiddenSider) || compactSider?.isCompact, collapsedWidth: isMobile && hiddenSider
67
- ? 0
68
- : compactSider
69
- ? headerHeight
70
- : 0, trigger: null },
71
- menuBefore,
72
- React.createElement(Menu, { ...menuProps, defaultSelectedKeys: defaultPage ? [defaultPage] : undefined, items: menuPages, selectedKeys: selectedPages, onSelect: ({ key }) => {
73
- if (!hiddenSider) {
74
- setHiddenSider(true);
75
- }
76
- onSelect?.(key);
77
- } }),
78
- menuAfter),
79
- React.createElement(Content, { ...contentProps, className: classNames(classes.content, contentProps?.className) }, children)));
80
- }
1
+ /*
2
+ * Copyright (c) 2024, J2 Innovations. All Rights Reserved
3
+ */
4
+ import { Container, Layout, Menu } from '@j2inn/ui';
5
+ import classNames from 'classnames';
6
+ import React, { useMemo, useState } from 'react';
7
+ import { createUseStyles } from 'react-jss';
8
+ import { DEFAULT_HEADER_HEIGHT, getMenuPages, } from './BasicLayout';
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
+ headerContent: {
20
+ height: '100%',
21
+ },
22
+ sider: ({ headerHeight }) => ({
23
+ overflow: 'auto',
24
+ height: '100vh',
25
+ position: 'fixed',
26
+ left: 0,
27
+ top: 0,
28
+ bottom: 0,
29
+ zIndex: 999,
30
+ paddingTop: headerHeight,
31
+ }),
32
+ content: ({ isMobile, compactSider, siderWidth = 200, headerHeight, }) => ({
33
+ paddingLeft: isMobile ? 0 : compactSider ? 45 : siderWidth,
34
+ paddingTop: headerHeight,
35
+ }),
36
+ });
37
+ // Workaround j2inn/ui exporting problem
38
+ const Header = Layout.Header;
39
+ const Sider = Layout.Sider;
40
+ const Content = Layout.Content;
41
+ /**
42
+ * Layout with header and sider. Sider is collapsed on mobile.
43
+ * Routing management can be plugged in, for examples @see ReactRouterLayout @see RouterLayout
44
+ */
45
+ export function HeaderSiderLayout({ pages = [], defaultPage, selectedPages = [], onSelect, compactSider, layoutProps, header, headerProps, siderProps, contentProps, menuProps, menuBefore, menuAfter, menuTriggerClassName, headerHeight = DEFAULT_HEADER_HEIGHT, children, }) {
46
+ const [isMobile, setIsMobile] = useState(false);
47
+ const [hiddenSider, setHiddenSider] = useState(false);
48
+ const siderWidth = siderProps?.width;
49
+ const classes = useStyles({
50
+ isMobile,
51
+ compactSider: compactSider?.isCompact,
52
+ siderWidth,
53
+ headerHeight,
54
+ });
55
+ const menuPages = useMemo(() => getMenuPages(pages), [pages]);
56
+ return (React.createElement(Layout, { hasSider: true, ...layoutProps },
57
+ React.createElement(Header, { ...headerProps, className: classNames(classes.header, headerProps?.className) },
58
+ React.createElement(Container, { horizontal: true, middle: true, className: classes.headerContent },
59
+ isMobile && (React.createElement(MenuTrigger, { hiddenSider: hiddenSider, headerHeight: headerHeight, className: menuTriggerClassName, onClick: () => {
60
+ setHiddenSider(!hiddenSider);
61
+ } })),
62
+ header)),
63
+ React.createElement(Sider, { ...siderProps, className: classNames(classes.sider, siderProps?.className), breakpoint: 'md', onBreakpoint: (broken) => {
64
+ setIsMobile(broken);
65
+ setHiddenSider(true);
66
+ }, collapsed: (isMobile && hiddenSider) || compactSider?.isCompact, collapsedWidth: isMobile && hiddenSider
67
+ ? 0
68
+ : compactSider
69
+ ? headerHeight
70
+ : 0, trigger: null },
71
+ menuBefore,
72
+ React.createElement(Menu, { ...menuProps, defaultSelectedKeys: defaultPage ? [defaultPage] : undefined, items: menuPages, selectedKeys: selectedPages, onSelect: ({ key }) => {
73
+ if (!hiddenSider) {
74
+ setHiddenSider(true);
75
+ }
76
+ onSelect?.(key);
77
+ } }),
78
+ menuAfter),
79
+ React.createElement(Content, { ...contentProps, className: classNames(classes.content, contentProps?.className) }, children)));
80
+ }
81
81
  //# sourceMappingURL=HeaderSiderLayout.js.map
@@ -1,37 +1,37 @@
1
- import { ItemType } from 'antd/lib/menu/hooks/useItems';
2
- import React, { PropsWithChildren } from 'react';
3
- /**
4
- * Menu page has both the data required by the menu and the data required to actually render the page.
5
- */
6
- export type MenuPage<T = Record<string, unknown>> = ItemType & Page<T>;
7
- /**
8
- * Menu Item that represents an application page
9
- */
10
- interface Page<T = Record<string, unknown>> {
11
- key: string;
12
- component?: React.LazyExoticComponent<React.FC<T>>;
13
- props?: PropsWithChildren<T>;
14
- children?: MenuPage<T>[];
15
- disabled?: boolean;
16
- /**
17
- * Set it to false to avoid showing the page in the menu. It is just used for routing purposes.
18
- */
19
- showInMenu?: boolean;
20
- }
21
- /**
22
- * Retrieve a specific page or subPage from a root page list
23
- * @param name the name of the searched page
24
- * @param pages the list of root pages
25
- */
26
- export declare function findPageByName<T extends MenuPage>(pages: T[], name?: string): T | undefined;
27
- /**
28
- * Expands the list of pages to include all the subpages
29
- */
30
- export declare function pageTreeToPageList<T extends MenuPage>(pages: T[]): T[];
31
- /**
32
- * Recursively get all the subPages of a root page
33
- * @param page root page
34
- * @returns the whole tree of subPages as a list
35
- */
36
- export declare function getAllSubPages<T extends MenuPage>(page: T): T[];
37
- export {};
1
+ import { ItemType } from 'antd/lib/menu/hooks/useItems';
2
+ import React, { PropsWithChildren } from 'react';
3
+ /**
4
+ * Menu page has both the data required by the menu and the data required to actually render the page.
5
+ */
6
+ export declare type MenuPage<T = Record<string, unknown>> = ItemType & Page<T>;
7
+ /**
8
+ * Menu Item that represents an application page
9
+ */
10
+ interface Page<T = Record<string, unknown>> {
11
+ key: string;
12
+ component?: React.LazyExoticComponent<React.FC<T>>;
13
+ props?: PropsWithChildren<T>;
14
+ children?: MenuPage<T>[];
15
+ disabled?: boolean;
16
+ /**
17
+ * Set it to false to avoid showing the page in the menu. It is just used for routing purposes.
18
+ */
19
+ showInMenu?: boolean;
20
+ }
21
+ /**
22
+ * Retrieve a specific page or subPage from a root page list
23
+ * @param name the name of the searched page
24
+ * @param pages the list of root pages
25
+ */
26
+ export declare function findPageByName<T extends MenuPage>(pages: T[], name?: string): T | undefined;
27
+ /**
28
+ * Expands the list of pages to include all the subpages
29
+ */
30
+ export declare function pageTreeToPageList<T extends MenuPage>(pages: T[]): T[];
31
+ /**
32
+ * Recursively get all the subPages of a root page
33
+ * @param page root page
34
+ * @returns the whole tree of subPages as a list
35
+ */
36
+ export declare function getAllSubPages<T extends MenuPage>(page: T): T[];
37
+ export {};
@@ -1,31 +1,31 @@
1
- /*
2
- * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
- */
4
- /**
5
- * Retrieve a specific page or subPage from a root page list
6
- * @param name the name of the searched page
7
- * @param pages the list of root pages
8
- */
9
- export function findPageByName(pages, name) {
10
- return pageTreeToPageList(pages).find((page) => page.key === name && !page.disabled);
11
- }
12
- /**
13
- * Expands the list of pages to include all the subpages
14
- */
15
- export function pageTreeToPageList(pages) {
16
- return pages.flatMap((page) => getAllSubPages(page));
17
- }
18
- /**
19
- * Recursively get all the subPages of a root page
20
- * @param page root page
21
- * @returns the whole tree of subPages as a list
22
- */
23
- export function getAllSubPages(page) {
24
- if (page.children) {
25
- return [page].concat(...page.children.map((subPage) => getAllSubPages(subPage)));
26
- }
27
- else {
28
- return [page];
29
- }
30
- }
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ /**
5
+ * Retrieve a specific page or subPage from a root page list
6
+ * @param name the name of the searched page
7
+ * @param pages the list of root pages
8
+ */
9
+ export function findPageByName(pages, name) {
10
+ return pageTreeToPageList(pages).find((page) => page.key === name && !page.disabled);
11
+ }
12
+ /**
13
+ * Expands the list of pages to include all the subpages
14
+ */
15
+ export function pageTreeToPageList(pages) {
16
+ return pages.flatMap((page) => getAllSubPages(page));
17
+ }
18
+ /**
19
+ * Recursively get all the subPages of a root page
20
+ * @param page root page
21
+ * @returns the whole tree of subPages as a list
22
+ */
23
+ export function getAllSubPages(page) {
24
+ if (page.children) {
25
+ return [page].concat(...page.children.map((subPage) => getAllSubPages(subPage)));
26
+ }
27
+ else {
28
+ return [page];
29
+ }
30
+ }
31
31
  //# sourceMappingURL=MenuPage.js.map
@@ -0,0 +1,31 @@
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ /**
5
+ * Retrieve a specific page or subPage from a root page list
6
+ * @param name the name of the searched page
7
+ * @param pages the list of root pages
8
+ */
9
+ export function findPageByName(pages, name) {
10
+ return pageTreeToPageList(pages).find((page) => page.key === name && !page.disabled);
11
+ }
12
+ /**
13
+ * Expands the list of pages to include all the subpages
14
+ */
15
+ export function pageTreeToPageList(pages) {
16
+ return pages.flatMap((page) => getAllSubPages(page));
17
+ }
18
+ /**
19
+ * Recursively get all the subPages of a root page
20
+ * @param page root page
21
+ * @returns the whole tree of subPages as a list
22
+ */
23
+ export function getAllSubPages(page) {
24
+ if (page.children) {
25
+ return [page].concat(...page.children.map((subPage) => getAllSubPages(subPage)));
26
+ }
27
+ else {
28
+ return [page];
29
+ }
30
+ }
31
+ //# sourceMappingURL=MenuPage.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MenuPage.jsx","sourceRoot":"","sources":["../../../../src/react/components/navigation/MenuPage.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAyBH;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAC7B,KAAU,EACV,IAAa;IAEb,OAAO,kBAAkB,CAAC,KAAK,CAAC,CAAC,IAAI,CACpC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,KAAK,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAC7C,CAAA;AACF,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,kBAAkB,CAAqB,KAAU;IAChE,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,cAAc,CAAC,IAAS,CAAC,CAAC,CAAA;AAC1D,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAqB,IAAO;IACzD,IAAI,IAAI,CAAC,QAAQ,EAAE;QAClB,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,CACnB,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,cAAc,CAAC,OAAY,CAAC,CAAC,CAC/D,CAAA;KACD;SAAM;QACN,OAAO,CAAC,IAAI,CAAC,CAAA;KACb;AACF,CAAC"}
@@ -1,9 +1,9 @@
1
- import React from 'react';
2
- interface MenuTriggerProps {
3
- hiddenSider: boolean;
4
- headerHeight?: number;
5
- className?: string;
6
- onClick: () => void;
7
- }
8
- declare const MenuTrigger: React.FC<MenuTriggerProps>;
9
- export default MenuTrigger;
1
+ import React from 'react';
2
+ interface MenuTriggerProps {
3
+ hiddenSider: boolean;
4
+ headerHeight?: number;
5
+ className?: string;
6
+ onClick: () => void;
7
+ }
8
+ declare const MenuTrigger: React.FC<MenuTriggerProps>;
9
+ export default MenuTrigger;
@@ -1,29 +1,29 @@
1
- /*
2
- * Copyright (c) 2024, J2 Innovations. All Rights Reserved
3
- */
4
- import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
5
- import classNames from 'classnames';
6
- import React from 'react';
7
- import { createUseStyles } from 'react-jss';
8
- const useStyles = createUseStyles((theme) => ({
9
- menuTrigger: ({ headerHeight }) => ({
10
- width: headerHeight,
11
- height: '100%',
12
- textAlign: 'center',
13
- fontSize: 18,
14
- cursor: 'pointer',
15
- transition: 'color 0.3s ease-in-out',
16
- backgroundColor: 'transparent',
17
- color: theme.linkColor,
18
- padding: '0 0.5rem',
19
- '&:hover': {
20
- color: theme.linkActiveColor,
21
- },
22
- }),
23
- }));
24
- const MenuTrigger = ({ hiddenSider, headerHeight = 45, onClick, className, }) => {
25
- const classes = useStyles({ headerHeight });
26
- return hiddenSider ? (React.createElement(MenuUnfoldOutlined, { className: classNames(classes.menuTrigger, className), onClick: onClick })) : (React.createElement(MenuFoldOutlined, { className: classNames(classes.menuTrigger, className), onClick: onClick }));
27
- };
28
- export default MenuTrigger;
1
+ /*
2
+ * Copyright (c) 2024, J2 Innovations. All Rights Reserved
3
+ */
4
+ import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
5
+ import classNames from 'classnames';
6
+ import React from 'react';
7
+ import { createUseStyles } from 'react-jss';
8
+ const useStyles = createUseStyles((theme) => ({
9
+ menuTrigger: ({ headerHeight }) => ({
10
+ width: headerHeight,
11
+ height: '100%',
12
+ textAlign: 'center',
13
+ fontSize: 18,
14
+ cursor: 'pointer',
15
+ transition: 'color 0.3s ease-in-out',
16
+ backgroundColor: 'transparent',
17
+ color: theme.linkColor,
18
+ padding: '0 0.5rem',
19
+ '&:hover': {
20
+ color: theme.linkActiveColor,
21
+ },
22
+ }),
23
+ }));
24
+ const MenuTrigger = ({ hiddenSider, headerHeight = 45, onClick, className, }) => {
25
+ const classes = useStyles({ headerHeight });
26
+ return hiddenSider ? (React.createElement(MenuUnfoldOutlined, { className: classNames(classes.menuTrigger, className), onClick: onClick })) : (React.createElement(MenuFoldOutlined, { className: classNames(classes.menuTrigger, className), onClick: onClick }));
27
+ };
28
+ export default MenuTrigger;
29
29
  //# sourceMappingURL=MenuTrigger.js.map
@@ -1,11 +1,11 @@
1
- import type { Location } from '@remix-run/router';
2
- import React from 'react';
3
- import { HeaderSiderLayoutProps } from './HeaderSiderLayout';
4
- import { ReactRouterMenuPage } from './ReactRouterLayout';
5
- export interface ReactRouterHeaderSiderLayoutProps extends HeaderSiderLayoutProps<ReactRouterMenuPage> {
6
- isSelectedRoute?: (page: ReactRouterMenuPage, location: Location) => boolean;
7
- }
8
- /**
9
- * Header/Sider layout that uses React Router.
10
- */
11
- export declare const ReactRouterHeaderSiderLayout: React.FC<ReactRouterHeaderSiderLayoutProps>;
1
+ import type { Location } from '@remix-run/router';
2
+ import React from 'react';
3
+ import { HeaderSiderLayoutProps } from './HeaderSiderLayout';
4
+ import { ReactRouterMenuPage } from './ReactRouterLayout';
5
+ export interface ReactRouterHeaderSiderLayoutProps extends HeaderSiderLayoutProps<ReactRouterMenuPage> {
6
+ isSelectedRoute?: (page: ReactRouterMenuPage, location: Location) => boolean;
7
+ }
8
+ /**
9
+ * Header/Sider layout that uses React Router.
10
+ */
11
+ export declare const ReactRouterHeaderSiderLayout: React.FC<ReactRouterHeaderSiderLayoutProps>;
@@ -1,19 +1,19 @@
1
- /*
2
- * Copyright (c) 2024, J2 Innovations. All Rights Reserved
3
- */
4
- import React from 'react';
5
- import { Outlet, useNavigate } from 'react-router';
6
- import { HeaderSiderLayout } from './HeaderSiderLayout';
7
- import { useDefaultOnSelect, useGetPageKeyRouteMap, useSelectedRoutes, } from './ReactRouterLayout';
8
- /**
9
- * Header/Sider layout that uses React Router.
10
- */
11
- export const ReactRouterHeaderSiderLayout = ({ isSelectedRoute, pages = [], onSelect, ...otherProps }) => {
12
- const navigate = useNavigate();
13
- const selectedRoutes = useSelectedRoutes(pages, isSelectedRoute);
14
- const pageKeyRouteMap = useGetPageKeyRouteMap(pages);
15
- const defaultOnSelect = useDefaultOnSelect(navigate, pageKeyRouteMap, pages);
16
- return (React.createElement(HeaderSiderLayout, { ...otherProps, pages: pages, onSelect: onSelect ?? defaultOnSelect, selectedPages: selectedRoutes },
17
- React.createElement(Outlet, null)));
18
- };
1
+ /*
2
+ * Copyright (c) 2024, J2 Innovations. All Rights Reserved
3
+ */
4
+ import React from 'react';
5
+ import { Outlet, useNavigate } from 'react-router';
6
+ import { HeaderSiderLayout } from './HeaderSiderLayout';
7
+ import { useDefaultOnSelect, useGetPageKeyRouteMap, useSelectedRoutes, } from './ReactRouterLayout';
8
+ /**
9
+ * Header/Sider layout that uses React Router.
10
+ */
11
+ export const ReactRouterHeaderSiderLayout = ({ isSelectedRoute, pages = [], onSelect, ...otherProps }) => {
12
+ const navigate = useNavigate();
13
+ const selectedRoutes = useSelectedRoutes(pages, isSelectedRoute);
14
+ const pageKeyRouteMap = useGetPageKeyRouteMap(pages);
15
+ const defaultOnSelect = useDefaultOnSelect(navigate, pageKeyRouteMap, pages);
16
+ return (React.createElement(HeaderSiderLayout, { ...otherProps, pages: pages, onSelect: onSelect ?? defaultOnSelect, selectedPages: selectedRoutes },
17
+ React.createElement(Outlet, null)));
18
+ };
19
19
  //# sourceMappingURL=ReactRouterHeaderSiderLayout.js.map
@@ -1,46 +1,46 @@
1
- import type { Location } from '@remix-run/router';
2
- import React from 'react';
3
- import { NavigateFunction } from 'react-router';
4
- import { BasicLayoutProps } from './BasicLayout';
5
- import { MenuPage } from './MenuPage';
6
- export type ReactRouterMenuPage = MenuPage & {
7
- route: string;
8
- };
9
- export interface ReactRouterLayoutProps extends BasicLayoutProps<ReactRouterMenuPage> {
10
- isSelectedRoute?: (page: ReactRouterMenuPage, location: Location) => boolean;
11
- }
12
- /**
13
- * This hook can be used with react-router/BasicLayout,
14
- * to ensure FIN5 URL is aligned with the internal frame URL.
15
- * This does not skip the hash update and should be used only with
16
- * FIN >= 5.1.7.92, otherwise FIN will reload the entire page.
17
- */
18
- export declare const useLocationUpdate: () => void;
19
- /**
20
- * This hook can be used with react-router/BasicLayout,
21
- * to ensure FIN5 URL is aligned with the internal frame URL.
22
- * This skips the hash update and should be used only with
23
- * FIN < 5.1.7.92.
24
- * @deprecated use only with FIN < 5.1.7.92
25
- * @see {@link useLocationUpdate} for FIN >= 5.1.7.92
26
- */
27
- export declare const useLocationUpdateSkippingHash: () => void;
28
- export declare const useSelectedRoutes: (pages: ReactRouterMenuPage[], isSelectedRoute?: (page: ReactRouterMenuPage, location: Location) => boolean) => string[];
29
- /**
30
- * If we are inside a frame (FIN5), the route is left as is.
31
- * If we are outside FIN5 frame, the route needs to be prefixed with a segment containing the project name.
32
- * @param route
33
- * @returns the correct route for the environment
34
- */
35
- export declare const getRoute: (route: string) => string;
36
- /**
37
- * Create a map that holds the page key and its related route.
38
- * @param pages
39
- * @returns the map page key - route
40
- */
41
- export declare const useGetPageKeyRouteMap: (pages: ReactRouterMenuPage[]) => Map<string, string>;
42
- export declare const useDefaultOnSelect: (navigate: NavigateFunction, pageKeyRouteMap: Map<string, string>, pages: ReactRouterMenuPage[]) => (key: string) => void;
43
- /**
44
- * Basic layout that uses React Router.
45
- */
46
- export declare const ReactRouterLayout: React.FC<ReactRouterLayoutProps>;
1
+ import type { Location } from '@remix-run/router';
2
+ import React from 'react';
3
+ import { NavigateFunction } from 'react-router';
4
+ import { BasicLayoutProps } from './BasicLayout';
5
+ import { MenuPage } from './MenuPage';
6
+ export declare type ReactRouterMenuPage = MenuPage & {
7
+ route: string;
8
+ };
9
+ export interface ReactRouterLayoutProps extends BasicLayoutProps<ReactRouterMenuPage> {
10
+ isSelectedRoute?: (page: ReactRouterMenuPage, location: Location) => boolean;
11
+ }
12
+ /**
13
+ * This hook can be used with react-router/BasicLayout,
14
+ * to ensure FIN5 URL is aligned with the internal frame URL.
15
+ * This does not skip the hash update and should be used only with
16
+ * FIN >= 5.1.7.92, otherwise FIN will reload the entire page.
17
+ */
18
+ export declare const useLocationUpdate: () => void;
19
+ /**
20
+ * This hook can be used with react-router/BasicLayout,
21
+ * to ensure FIN5 URL is aligned with the internal frame URL.
22
+ * This skips the hash update and should be used only with
23
+ * FIN < 5.1.7.92.
24
+ * @deprecated use only with FIN < 5.1.7.92
25
+ * @see {@link useLocationUpdate} for FIN >= 5.1.7.92
26
+ */
27
+ export declare const useLocationUpdateSkippingHash: () => void;
28
+ export declare const useSelectedRoutes: (pages: ReactRouterMenuPage[], isSelectedRoute?: (page: ReactRouterMenuPage, location: Location) => boolean) => string[];
29
+ /**
30
+ * If we are inside a frame (FIN5), the route is left as is.
31
+ * If we are outside FIN5 frame, the route needs to be prefixed with a segment containing the project name.
32
+ * @param route
33
+ * @returns the correct route for the environment
34
+ */
35
+ export declare const getRoute: (route: string) => string;
36
+ /**
37
+ * Create a map that holds the page key and its related route.
38
+ * @param pages
39
+ * @returns the map page key - route
40
+ */
41
+ export declare const useGetPageKeyRouteMap: (pages: ReactRouterMenuPage[]) => Map<string, string>;
42
+ export declare const useDefaultOnSelect: (navigate: NavigateFunction, pageKeyRouteMap: Map<string, string>, pages: ReactRouterMenuPage[]) => (key: string) => void;
43
+ /**
44
+ * Basic layout that uses React Router.
45
+ */
46
+ export declare const ReactRouterLayout: React.FC<ReactRouterLayoutProps>;