@j2inn/fin5-ui-utils 5.2.2-beta.9 → 6.0.1

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 (223) 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 +16 -16
  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 +61 -61
  14. package/dist/fin5Top/fin5FileUpload.d.ts +24 -24
  15. package/dist/fin5Top/fin5FileUpload.js +51 -51
  16. package/dist/fin5Top/fin5Top.d.ts +124 -124
  17. package/dist/fin5Top/fin5Top.js +58 -58
  18. package/dist/fin5Top/finEdge2Cloud.d.ts +6 -6
  19. package/dist/fin5Top/finEdge2Cloud.js +15 -15
  20. package/dist/fin5Top/getFin5BinUrl.d.ts +2 -2
  21. package/dist/fin5Top/getFin5BinUrl.js +9 -9
  22. package/dist/fin5Top/openFin5Alarm.d.ts +22 -22
  23. package/dist/fin5Top/openFin5Alarm.js +23 -23
  24. package/dist/fin5Top/openFin5Historian.d.ts +3 -3
  25. package/dist/fin5Top/openFin5Historian.js +19 -19
  26. package/dist/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
  27. package/dist/fin5Top/useFin5AppURLHashParameter.js +133 -133
  28. package/dist/index.d.ts +35 -36
  29. package/dist/index.js +69 -70
  30. package/dist/index.js.map +1 -1
  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 +102 -102
  35. package/dist/react/app/Fin5AppRootStore.d.ts +38 -39
  36. package/dist/react/app/Fin5AppRootStore.js +68 -69
  37. package/dist/react/app/Fin5AppRootStore.js.map +1 -1
  38. package/dist/react/components/ErrorBoundary.d.ts +57 -57
  39. package/dist/react/components/ErrorBoundary.js +150 -150
  40. package/dist/react/components/ErrorDisplayer.d.ts +19 -19
  41. package/dist/react/components/ErrorDisplayer.js +36 -36
  42. package/dist/react/components/Loader.d.ts +9 -9
  43. package/dist/react/components/Loader.js +17 -17
  44. package/dist/react/components/LoadingSpinner.d.ts +2 -2
  45. package/dist/react/components/LoadingSpinner.js +27 -27
  46. package/dist/react/components/RecordImage.d.ts +20 -20
  47. package/dist/react/components/RecordImage.js +51 -51
  48. package/dist/react/components/charts/QRCode.d.ts +25 -25
  49. package/dist/react/components/charts/QRCode.js +82 -82
  50. package/dist/react/components/charts/line-bar/Chart.d.ts +166 -166
  51. package/dist/react/components/charts/line-bar/Chart.js +442 -442
  52. package/dist/react/components/charts/line-bar/HGridChart.d.ts +58 -58
  53. package/dist/react/components/charts/line-bar/HGridChart.js +285 -288
  54. package/dist/react/components/charts/line-bar/HGridChart.js.map +1 -1
  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 -12
  64. package/dist/react/components/makeCustomElement.js +150 -139
  65. package/dist/react/components/makeCustomElement.js.map +1 -1
  66. package/dist/react/components/navigation/BasicLayout.d.ts +41 -41
  67. package/dist/react/components/navigation/BasicLayout.js +155 -155
  68. package/dist/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
  69. package/dist/react/components/navigation/HeaderSiderLayout.js +110 -110
  70. package/dist/react/components/navigation/MenuPage.d.ts +37 -37
  71. package/dist/react/components/navigation/MenuPage.js +36 -36
  72. package/dist/react/components/navigation/MenuTrigger.d.ts +9 -9
  73. package/dist/react/components/navigation/MenuTrigger.js +33 -33
  74. package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
  75. package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.js +25 -25
  76. package/dist/react/components/navigation/ReactRouterLayout.d.ts +46 -46
  77. package/dist/react/components/navigation/ReactRouterLayout.js +132 -132
  78. package/dist/react/components/navigation/customRouting/Router.d.ts +12 -12
  79. package/dist/react/components/navigation/customRouting/Router.js +45 -45
  80. package/dist/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
  81. package/dist/react/components/navigation/customRouting/RouterLayout.js +61 -61
  82. package/dist/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
  83. package/dist/react/components/resolvable/configurationForm/ConfigurationForm.js +95 -95
  84. package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
  85. package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +88 -88
  86. package/dist/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
  87. package/dist/react/components/resolvable/configurationForm/getSectionDefault.js +99 -99
  88. package/dist/react/hooks/useFin5BinUrl.d.ts +6 -6
  89. package/dist/react/hooks/useFin5BinUrl.js +15 -15
  90. package/dist/react/hooks/useFin5ColorScheme.d.ts +2 -2
  91. package/dist/react/hooks/useFin5ColorScheme.js +42 -42
  92. package/dist/react/hooks/useScreenSize.d.ts +7 -8
  93. package/dist/react/hooks/useScreenSize.js +31 -30
  94. package/dist/react/hooks/useScreenSize.js.map +1 -1
  95. package/dist_es/fantomProps/createFin5Props/index.d.ts +12 -12
  96. package/dist_es/fantomProps/createFin5Props/index.js +140 -140
  97. package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
  98. package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.js +11 -11
  99. package/dist_es/fantomProps/fantomPropsToObject.d.ts +8 -8
  100. package/dist_es/fantomProps/fantomPropsToObject.js +178 -178
  101. package/dist_es/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
  102. package/dist_es/fantomProps/generateJsonFromFantomPropsFile.js +12 -12
  103. package/dist_es/fantomProps/localePropsToJson.d.ts +1 -1
  104. package/dist_es/fantomProps/localePropsToJson.js +21 -21
  105. package/dist_es/fantomProps/readFantomPropsFile.d.ts +5 -5
  106. package/dist_es/fantomProps/readFantomPropsFile.js +35 -35
  107. package/dist_es/fin5Top/fin5FileUpload.d.ts +24 -24
  108. package/dist_es/fin5Top/fin5FileUpload.js +47 -47
  109. package/dist_es/fin5Top/fin5Top.d.ts +124 -124
  110. package/dist_es/fin5Top/fin5Top.js +54 -54
  111. package/dist_es/fin5Top/finEdge2Cloud.d.ts +6 -6
  112. package/dist_es/fin5Top/finEdge2Cloud.js +11 -11
  113. package/dist_es/fin5Top/getFin5BinUrl.d.ts +2 -2
  114. package/dist_es/fin5Top/getFin5BinUrl.js +5 -5
  115. package/dist_es/fin5Top/openFin5Alarm.d.ts +22 -22
  116. package/dist_es/fin5Top/openFin5Alarm.js +19 -19
  117. package/dist_es/fin5Top/openFin5Historian.d.ts +3 -3
  118. package/dist_es/fin5Top/openFin5Historian.js +15 -15
  119. package/dist_es/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
  120. package/dist_es/fin5Top/useFin5AppURLHashParameter.js +124 -124
  121. package/dist_es/index.d.ts +35 -36
  122. package/dist_es/index.js +53 -54
  123. package/dist_es/index.js.map +1 -1
  124. package/dist_es/jobs/jobUtils.d.ts +14 -14
  125. package/dist_es/jobs/jobUtils.js +9 -9
  126. package/dist_es/react/app/Fin5AppContainer.d.ts +36 -36
  127. package/dist_es/react/app/Fin5AppContainer.js +73 -73
  128. package/dist_es/react/app/Fin5AppRootStore.d.ts +38 -39
  129. package/dist_es/react/app/Fin5AppRootStore.js +64 -65
  130. package/dist_es/react/app/Fin5AppRootStore.js.map +1 -1
  131. package/dist_es/react/components/ErrorBoundary.d.ts +57 -57
  132. package/dist_es/react/components/ErrorBoundary.js +123 -123
  133. package/dist_es/react/components/ErrorDisplayer.d.ts +19 -19
  134. package/dist_es/react/components/ErrorDisplayer.js +28 -28
  135. package/dist_es/react/components/Loader.d.ts +9 -9
  136. package/dist_es/react/components/Loader.js +12 -12
  137. package/dist_es/react/components/LoadingSpinner.d.ts +2 -2
  138. package/dist_es/react/components/LoadingSpinner.js +20 -20
  139. package/dist_es/react/components/RecordImage.d.ts +20 -20
  140. package/dist_es/react/components/RecordImage.js +24 -24
  141. package/dist_es/react/components/charts/QRCode.d.ts +25 -25
  142. package/dist_es/react/components/charts/QRCode.js +52 -52
  143. package/dist_es/react/components/charts/line-bar/Chart.d.ts +166 -166
  144. package/dist_es/react/components/charts/line-bar/Chart.js +415 -415
  145. package/dist_es/react/components/charts/line-bar/HGridChart.d.ts +58 -58
  146. package/dist_es/react/components/charts/line-bar/HGridChart.js +250 -250
  147. package/dist_es/react/components/charts/line-bar/HGridChart.js.map +1 -1
  148. package/dist_es/react/components/charts/pie/PieChart.d.ts +94 -94
  149. package/dist_es/react/components/charts/pie/PieChart.js +177 -177
  150. package/dist_es/react/components/charts/pie/SimplePieChart.d.ts +21 -21
  151. package/dist_es/react/components/charts/pie/SimplePieChart.js +25 -25
  152. package/dist_es/react/components/graphics/GraphicViewer.d.ts +10 -10
  153. package/dist_es/react/components/graphics/GraphicViewer.js +22 -22
  154. package/dist_es/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
  155. package/dist_es/react/components/graphics/GraphicsTabViewer.js +60 -60
  156. package/dist_es/react/components/makeCustomElement.d.ts +16 -12
  157. package/dist_es/react/components/makeCustomElement.js +142 -131
  158. package/dist_es/react/components/makeCustomElement.js.map +1 -1
  159. package/dist_es/react/components/navigation/BasicLayout.d.ts +41 -41
  160. package/dist_es/react/components/navigation/BasicLayout.js +124 -124
  161. package/dist_es/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
  162. package/dist_es/react/components/navigation/HeaderSiderLayout.js +80 -80
  163. package/dist_es/react/components/navigation/MenuPage.d.ts +37 -37
  164. package/dist_es/react/components/navigation/MenuPage.js +30 -30
  165. package/dist_es/react/components/navigation/MenuTrigger.d.ts +9 -9
  166. package/dist_es/react/components/navigation/MenuTrigger.js +28 -28
  167. package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
  168. package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.js +18 -18
  169. package/dist_es/react/components/navigation/ReactRouterLayout.d.ts +46 -46
  170. package/dist_es/react/components/navigation/ReactRouterLayout.js +99 -99
  171. package/dist_es/react/components/navigation/customRouting/Router.d.ts +12 -12
  172. package/dist_es/react/components/navigation/customRouting/Router.js +18 -18
  173. package/dist_es/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
  174. package/dist_es/react/components/navigation/customRouting/RouterLayout.js +34 -34
  175. package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
  176. package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.js +64 -64
  177. package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
  178. package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +58 -58
  179. package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
  180. package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.js +94 -94
  181. package/dist_es/react/hooks/useFin5BinUrl.d.ts +6 -6
  182. package/dist_es/react/hooks/useFin5BinUrl.js +11 -11
  183. package/dist_es/react/hooks/useFin5ColorScheme.d.ts +2 -2
  184. package/dist_es/react/hooks/useFin5ColorScheme.js +38 -38
  185. package/dist_es/react/hooks/useScreenSize.d.ts +7 -8
  186. package/dist_es/react/hooks/useScreenSize.js +27 -28
  187. package/dist_es/react/hooks/useScreenSize.js.map +1 -1
  188. package/package.json +7 -7
  189. package/dist/react/components/charts/line-bar/ZincGridChart.d.ts +0 -12
  190. package/dist/react/components/charts/line-bar/ZincGridChart.js +0 -24
  191. package/dist/react/components/charts/line-bar/ZincGridChart.js.map +0 -1
  192. package/dist_es/react/app/Fin5AppContainer.jsx +0 -82
  193. package/dist_es/react/app/Fin5AppContainer.jsx.map +0 -1
  194. package/dist_es/react/components/ErrorBoundary.jsx +0 -150
  195. package/dist_es/react/components/ErrorBoundary.jsx.map +0 -1
  196. package/dist_es/react/components/ErrorDisplayer.jsx +0 -36
  197. package/dist_es/react/components/ErrorDisplayer.jsx.map +0 -1
  198. package/dist_es/react/components/Loader.jsx +0 -13
  199. package/dist_es/react/components/Loader.jsx.map +0 -1
  200. package/dist_es/react/components/LoadingSpinner.jsx +0 -22
  201. package/dist_es/react/components/LoadingSpinner.jsx.map +0 -1
  202. package/dist_es/react/components/charts/line-bar/ZincGridChart.d.ts +0 -12
  203. package/dist_es/react/components/charts/line-bar/ZincGridChart.js +0 -17
  204. package/dist_es/react/components/charts/line-bar/ZincGridChart.js.map +0 -1
  205. package/dist_es/react/components/graphics/GraphicViewer.jsx +0 -23
  206. package/dist_es/react/components/graphics/GraphicViewer.jsx.map +0 -1
  207. package/dist_es/react/components/graphics/GraphicsTabViewer.jsx +0 -63
  208. package/dist_es/react/components/graphics/GraphicsTabViewer.jsx.map +0 -1
  209. package/dist_es/react/components/navigation/BasicLayout.jsx +0 -133
  210. package/dist_es/react/components/navigation/BasicLayout.jsx.map +0 -1
  211. package/dist_es/react/components/navigation/MenuPage.jsx +0 -31
  212. package/dist_es/react/components/navigation/MenuPage.jsx.map +0 -1
  213. package/dist_es/react/components/navigation/Router.d.ts +0 -12
  214. package/dist_es/react/components/navigation/Router.js +0 -19
  215. package/dist_es/react/components/navigation/Router.js.map +0 -1
  216. package/dist_es/react/components/navigation/Router.jsx +0 -19
  217. package/dist_es/react/components/navigation/Router.jsx.map +0 -1
  218. package/dist_es/react/components/navigation/react-router/BasicLayout.d.ts +0 -23
  219. package/dist_es/react/components/navigation/react-router/BasicLayout.js +0 -82
  220. package/dist_es/react/components/navigation/react-router/BasicLayout.js.map +0 -1
  221. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.d.ts +0 -24
  222. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js +0 -82
  223. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js.map +0 -1
@@ -1,35 +1,35 @@
1
- /*
2
- * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
- */
4
- import { Button } from '@j2inn/ui';
5
- import React, { useCallback, useEffect, useState } from 'react';
6
- import { ErrorDisplayer } from '../../ErrorDisplayer';
7
- import { BasicLayout } from '../BasicLayout';
8
- import { findPageByName } from '../MenuPage';
9
- import { Router } from './Router';
10
- /**
11
- * Basic layout that uses a custom router.
12
- */
13
- export const RouterLayout = ({ pages = [], defaultPage = pages?.[0].key ?? '', onPageChange, page, ...otherProps }) => {
14
- const [currentPage, setCurrentPage] = useState(page ?? defaultPage);
15
- useEffect(() => {
16
- if (page) {
17
- setCurrentPage(page);
18
- }
19
- }, [page]);
20
- // Fire onChange
21
- useEffect(() => {
22
- onPageChange?.(currentPage);
23
- }, [currentPage]);
24
- const onSelect = useCallback((key) => {
25
- const page = findPageByName(pages, key);
26
- if (page?.component) {
27
- setCurrentPage(key);
28
- }
29
- }, [pages]);
30
- return (React.createElement(BasicLayout, { ...otherProps, pages: pages, defaultPage: defaultPage, onSelect: onSelect, selectedPages: [currentPage] },
31
- React.createElement(Router, { pages: pages, currentPage: currentPage, fallbackComponent: React.createElement(ErrorDisplayer, { error: new Error('Page Not Found'), extra: [
32
- React.createElement(Button, { type: 'primary', key: 'refresh', onClick: () => setCurrentPage(defaultPage) }, "Go Home"),
33
- ] }) })));
34
- };
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ import { Button } from '@j2inn/ui';
5
+ import React, { useCallback, useEffect, useState } from 'react';
6
+ import { ErrorDisplayer } from '../../ErrorDisplayer';
7
+ import { BasicLayout } from '../BasicLayout';
8
+ import { findPageByName } from '../MenuPage';
9
+ import { Router } from './Router';
10
+ /**
11
+ * Basic layout that uses a custom router.
12
+ */
13
+ export const RouterLayout = ({ pages = [], defaultPage = pages?.[0].key ?? '', onPageChange, page, ...otherProps }) => {
14
+ const [currentPage, setCurrentPage] = useState(page ?? defaultPage);
15
+ useEffect(() => {
16
+ if (page) {
17
+ setCurrentPage(page);
18
+ }
19
+ }, [page]);
20
+ // Fire onChange
21
+ useEffect(() => {
22
+ onPageChange?.(currentPage);
23
+ }, [currentPage]);
24
+ const onSelect = useCallback((key) => {
25
+ const page = findPageByName(pages, key);
26
+ if (page?.component) {
27
+ setCurrentPage(key);
28
+ }
29
+ }, [pages]);
30
+ return (React.createElement(BasicLayout, { ...otherProps, pages: pages, defaultPage: defaultPage, onSelect: onSelect, selectedPages: [currentPage] },
31
+ React.createElement(Router, { pages: pages, currentPage: currentPage, fallbackComponent: React.createElement(ErrorDisplayer, { error: new Error('Page Not Found'), extra: [
32
+ React.createElement(Button, { type: 'primary', key: 'refresh', onClick: () => setCurrentPage(defaultPage) }, "Go Home"),
33
+ ] }) })));
34
+ };
35
35
  //# sourceMappingURL=RouterLayout.js.map
@@ -1,27 +1,27 @@
1
- /// <reference types="react" />
2
- import { ParametersOfSection, UiElementData } from '@j2inn/resolvable-ui-elements';
3
- import { HDict } from 'haystack-core';
4
- declare type Layout = 'horizontal' | 'vertical';
5
- interface ConfigurationFormProps<T extends UiElementData> {
6
- section: T;
7
- params: ParametersOfSection<T>;
8
- readOnlySection?: UiElementData;
9
- onSave: (config: HDict) => void | Promise<unknown>;
10
- saveText?: string;
11
- formatKey?: (key: string) => string;
12
- options?: HDict;
13
- layout?: Layout;
14
- className?: string;
15
- entryClassName?: string;
16
- saveBtnClassName?: string;
17
- animateSaveButton?: boolean;
18
- }
19
- export declare const ConfigurationForm: <T extends UiElementData<import("@j2inn/resolvable-ui-elements/dist/resolvableElements/elements/UiElement").UiElementMeta>>({ section, params, readOnlySection, onSave, formatKey, saveText, options, layout, className, entryClassName, saveBtnClassName, animateSaveButton, }: ConfigurationFormProps<T>) => JSX.Element;
20
- interface ConfigurationFormReadOnlyEntriesProps<T extends UiElementData> {
21
- params: ParametersOfSection<T>;
22
- readOnlySection: T;
23
- formatKey?: (key: string) => string;
24
- className?: string;
25
- }
26
- export declare const ConfigurationFormReadOnlyEntries: <T extends UiElementData<import("@j2inn/resolvable-ui-elements/dist/resolvableElements/elements/UiElement").UiElementMeta>>({ readOnlySection, params, formatKey, className, }: ConfigurationFormReadOnlyEntriesProps<T>) => JSX.Element;
27
- export {};
1
+ /// <reference types="react" />
2
+ import { ParametersOfSection, UiElementData } from '@j2inn/resolvable-ui-elements';
3
+ import { HDict } from 'haystack-core';
4
+ declare type Layout = 'horizontal' | 'vertical';
5
+ interface ConfigurationFormProps<T extends UiElementData> {
6
+ section: T;
7
+ params: ParametersOfSection<T>;
8
+ readOnlySection?: UiElementData;
9
+ onSave: (config: HDict) => void | Promise<unknown>;
10
+ saveText?: string;
11
+ formatKey?: (key: string) => string;
12
+ options?: HDict;
13
+ layout?: Layout;
14
+ className?: string;
15
+ entryClassName?: string;
16
+ saveBtnClassName?: string;
17
+ animateSaveButton?: boolean;
18
+ }
19
+ export declare const ConfigurationForm: <T extends UiElementData<import("@j2inn/resolvable-ui-elements/dist/resolvableElements/elements/UiElement").UiElementMeta>>({ section, params, readOnlySection, onSave, formatKey, saveText, options, layout, className, entryClassName, saveBtnClassName, animateSaveButton, }: ConfigurationFormProps<T>) => JSX.Element;
20
+ interface ConfigurationFormReadOnlyEntriesProps<T extends UiElementData> {
21
+ params: ParametersOfSection<T>;
22
+ readOnlySection: T;
23
+ formatKey?: (key: string) => string;
24
+ className?: string;
25
+ }
26
+ export declare const ConfigurationFormReadOnlyEntries: <T extends UiElementData<import("@j2inn/resolvable-ui-elements/dist/resolvableElements/elements/UiElement").UiElementMeta>>({ readOnlySection, params, formatKey, className, }: ConfigurationFormReadOnlyEntriesProps<T>) => JSX.Element;
27
+ export {};
@@ -1,65 +1,65 @@
1
- /*
2
- * Copyright (c) 2023, J2 Innovations. All Rights Reserved
3
- */
4
- import { useResolveSection, } from '@j2inn/resolvable-ui-elements';
5
- import { Button } from '@j2inn/ui';
6
- import cn from 'classnames';
7
- import { HDict } from 'haystack-core';
8
- import React, { useMemo, useState } from 'react';
9
- import { createUseStyles } from 'react-jss';
10
- import { ConfigurationFormEntry, } from './ConfigurationFormEntry';
11
- import { getSectionDefault } from './getSectionDefault';
12
- const useStyles = createUseStyles({
13
- formGrid: ({ layout }) => ({
14
- display: 'grid',
15
- gridTemplateColumns: layout === 'horizontal' ? '1fr 1fr' : '1fr',
16
- gap: '0.5em 2em',
17
- }),
18
- saveButtonRow: ({ layout }) => ({
19
- gridColumn: layout === 'horizontal' ? 'span 2' : 'span 1',
20
- transition: 'transform 0.75s, max-height 0.75s, opacity 0.75s',
21
- maxHeight: 200,
22
- transform: 'scaleY(1)',
23
- marginTop: '1em',
24
- }),
25
- saveButtonRowNotVisible: {
26
- transform: 'scaleY(0)',
27
- maxHeight: 0,
28
- opacity: 0,
29
- },
30
- saveButton: {
31
- transition: 'all 0.75s',
32
- width: 120,
33
- float: 'right',
34
- },
35
- });
36
- export const ConfigurationForm = ({ section, params, readOnlySection, onSave, formatKey, saveText, options, layout = 'horizontal', className, entryClassName, saveBtnClassName, animateSaveButton = true, }) => {
37
- const classes = useStyles({ layout });
38
- const [resolvedSection] = useResolveSection(section, params);
39
- const entries = useMemo(() => getSectionDefault(section), [section]);
40
- const [changes, setChanges] = useState();
41
- const [canSave, setCanSave] = useState(false);
42
- const [isSaving, setIsSaving] = useState(false);
43
- return (React.createElement("div", { className: cn(classes.formGrid, className) },
44
- Object.entries(entries).map(([key, defaultValue]) => (React.createElement(ConfigurationFormEntry, { key: key, options: options?.get(key), name: formatKey ? formatKey(key) : key, value: resolvedSection[key] ?? defaultValue, onChange: (val) => {
45
- setChanges({ ...changes, [key]: val });
46
- setCanSave(true);
47
- }, className: entryClassName }))),
48
- readOnlySection && (React.createElement(ConfigurationFormReadOnlyEntries, { readOnlySection: readOnlySection, formatKey: formatKey, params: params, className: entryClassName })),
49
- React.createElement("div", { className: cn(classes.saveButtonRow, {
50
- [classes.saveButtonRowNotVisible]: animateSaveButton && !canSave,
51
- }) },
52
- React.createElement(Button, { disabled: !canSave, className: cn(classes.saveButton, saveBtnClassName), type: 'primary', loading: isSaving, onClick: async () => {
53
- setIsSaving(true);
54
- await onSave(HDict.make(changes));
55
- setChanges(undefined); // Reset changes dict
56
- setIsSaving(false);
57
- setCanSave(false);
58
- } }, saveText ?? 'Save'))));
59
- };
60
- export const ConfigurationFormReadOnlyEntries = ({ readOnlySection, params, formatKey, className, }) => {
61
- const [resolvedReadOnlySection] = useResolveSection(readOnlySection, params);
62
- return (React.createElement(React.Fragment, null, resolvedReadOnlySection &&
63
- Object.entries(resolvedReadOnlySection).map(([key, value]) => (React.createElement(ConfigurationFormEntry, { key: key, name: formatKey ? formatKey(key) : key, disabled: true, value: value, className: className })))));
64
- };
1
+ /*
2
+ * Copyright (c) 2023, J2 Innovations. All Rights Reserved
3
+ */
4
+ import { useResolveSection, } from '@j2inn/resolvable-ui-elements';
5
+ import { Button } from '@j2inn/ui';
6
+ import cn from 'classnames';
7
+ import { HDict } from 'haystack-core';
8
+ import React, { useMemo, useState } from 'react';
9
+ import { createUseStyles } from 'react-jss';
10
+ import { ConfigurationFormEntry, } from './ConfigurationFormEntry';
11
+ import { getSectionDefault } from './getSectionDefault';
12
+ const useStyles = createUseStyles({
13
+ formGrid: ({ layout }) => ({
14
+ display: 'grid',
15
+ gridTemplateColumns: layout === 'horizontal' ? '1fr 1fr' : '1fr',
16
+ gap: '0.5em 2em',
17
+ }),
18
+ saveButtonRow: ({ layout }) => ({
19
+ gridColumn: layout === 'horizontal' ? 'span 2' : 'span 1',
20
+ transition: 'transform 0.75s, max-height 0.75s, opacity 0.75s',
21
+ maxHeight: 200,
22
+ transform: 'scaleY(1)',
23
+ marginTop: '1em',
24
+ }),
25
+ saveButtonRowNotVisible: {
26
+ transform: 'scaleY(0)',
27
+ maxHeight: 0,
28
+ opacity: 0,
29
+ },
30
+ saveButton: {
31
+ transition: 'all 0.75s',
32
+ width: 120,
33
+ float: 'right',
34
+ },
35
+ });
36
+ export const ConfigurationForm = ({ section, params, readOnlySection, onSave, formatKey, saveText, options, layout = 'horizontal', className, entryClassName, saveBtnClassName, animateSaveButton = true, }) => {
37
+ const classes = useStyles({ layout });
38
+ const [resolvedSection] = useResolveSection(section, params);
39
+ const entries = useMemo(() => getSectionDefault(section), [section]);
40
+ const [changes, setChanges] = useState();
41
+ const [canSave, setCanSave] = useState(false);
42
+ const [isSaving, setIsSaving] = useState(false);
43
+ return (React.createElement("div", { className: cn(classes.formGrid, className) },
44
+ Object.entries(entries).map(([key, defaultValue]) => (React.createElement(ConfigurationFormEntry, { key: key, options: options?.get(key), name: formatKey ? formatKey(key) : key, value: resolvedSection[key] ?? defaultValue, onChange: (val) => {
45
+ setChanges({ ...changes, [key]: val });
46
+ setCanSave(true);
47
+ }, className: entryClassName }))),
48
+ readOnlySection && (React.createElement(ConfigurationFormReadOnlyEntries, { readOnlySection: readOnlySection, formatKey: formatKey, params: params, className: entryClassName })),
49
+ React.createElement("div", { className: cn(classes.saveButtonRow, {
50
+ [classes.saveButtonRowNotVisible]: animateSaveButton && !canSave,
51
+ }) },
52
+ React.createElement(Button, { disabled: !canSave, className: cn(classes.saveButton, saveBtnClassName), type: 'primary', loading: isSaving, onClick: async () => {
53
+ setIsSaving(true);
54
+ await onSave(HDict.make(changes));
55
+ setChanges(undefined); // Reset changes dict
56
+ setIsSaving(false);
57
+ setCanSave(false);
58
+ } }, saveText ?? 'Save'))));
59
+ };
60
+ export const ConfigurationFormReadOnlyEntries = ({ readOnlySection, params, formatKey, className, }) => {
61
+ const [resolvedReadOnlySection] = useResolveSection(readOnlySection, params);
62
+ return (React.createElement(React.Fragment, null, resolvedReadOnlySection &&
63
+ Object.entries(resolvedReadOnlySection).map(([key, value]) => (React.createElement(ConfigurationFormEntry, { key: key, name: formatKey ? formatKey(key) : key, disabled: true, value: value, className: className })))));
64
+ };
65
65
  //# sourceMappingURL=ConfigurationForm.js.map
@@ -1,16 +1,16 @@
1
- /// <reference types="react" />
2
- import { HDict, HGrid, HNum, HRef, HStr, HVal } from 'haystack-core';
3
- export interface ConfigurationFormEntryOption extends HDict {
4
- value: HStr | HNum | HRef;
5
- label: HStr;
6
- }
7
- interface ConfigurationFormEntryProps {
8
- name: string;
9
- value: HVal | unknown;
10
- onChange?: (val: HVal) => void;
11
- disabled?: boolean;
12
- options?: HGrid<ConfigurationFormEntryOption>;
13
- className?: string;
14
- }
15
- export declare const ConfigurationFormEntry: ({ name, value, onChange, disabled, options, className, }: ConfigurationFormEntryProps) => JSX.Element;
16
- export {};
1
+ /// <reference types="react" />
2
+ import { HDict, HGrid, HNum, HRef, HStr, HVal } from 'haystack-core';
3
+ export interface ConfigurationFormEntryOption extends HDict {
4
+ value: HStr | HNum | HRef;
5
+ label: HStr;
6
+ }
7
+ interface ConfigurationFormEntryProps {
8
+ name: string;
9
+ value: HVal | unknown;
10
+ onChange?: (val: HVal) => void;
11
+ disabled?: boolean;
12
+ options?: HGrid<ConfigurationFormEntryOption>;
13
+ className?: string;
14
+ }
15
+ export declare const ConfigurationFormEntry: ({ name, value, onChange, disabled, options, className, }: ConfigurationFormEntryProps) => JSX.Element;
16
+ export {};
@@ -1,59 +1,59 @@
1
- /*
2
- * Copyright (c) 2023, J2 Innovations. All Rights Reserved
3
- */
4
- import { ant_prefix, HInput, Input, Select } from '@j2inn/ui';
5
- import cn from 'classnames';
6
- import { HNum, HRef, HStr, isHVal, Kind, valueIsKind, } from 'haystack-core';
7
- import React, { useCallback, useEffect, useMemo, useState } from 'react';
8
- import { createUseStyles } from 'react-jss';
9
- const useStyles = createUseStyles((theme) => ({
10
- formEntry: {
11
- [`& .${ant_prefix}-input`]: {
12
- height: 32,
13
- },
14
- },
15
- entryTitle: {
16
- fontWeight: 600,
17
- fontSize: '1em',
18
- color: theme.textColorSecondary,
19
- },
20
- select: {
21
- width: '100%',
22
- },
23
- }));
24
- const getHValFromSelectValue = (selectValue, initialHVal) => {
25
- if (valueIsKind(initialHVal, Kind.Number)) {
26
- return HNum.make(selectValue, initialHVal.unit);
27
- }
28
- else if (valueIsKind(initialHVal, Kind.Ref)) {
29
- return HRef.make(selectValue);
30
- }
31
- return HStr.make(selectValue);
32
- };
33
- export const ConfigurationFormEntry = ({ name, value, onChange, disabled, options, className, }) => {
34
- const classes = useStyles();
35
- if (!isHVal(value)) {
36
- return React.createElement(React.Fragment, null, `${name} = ${value}`);
37
- }
38
- const [showedVal, setShowedVal] = useState(value);
39
- useEffect(() => {
40
- setShowedVal(value);
41
- }, [value]);
42
- const selectOptions = useMemo(() => options?.getRows().map((cfeOpt) => ({
43
- value: cfeOpt.value.value,
44
- label: cfeOpt.label.value,
45
- })), [options]);
46
- const onInputChange = useCallback((val) => {
47
- setShowedVal(val);
48
- onChange?.(val);
49
- }, [onChange]);
50
- return (React.createElement("div", { className: cn(classes.formEntry, className) },
51
- React.createElement("div", { className: classes.entryTitle }, name),
52
- selectOptions ? (React.createElement(Select, { showSearch: true, className: classes.select, value: showedVal.value, options: selectOptions, disabled: disabled, onChange: (val) => {
53
- if (val != null) {
54
- const newVal = getHValFromSelectValue(val, value);
55
- onInputChange(newVal);
56
- }
57
- } })) : !disabled ? (React.createElement(HInput, { value: showedVal, editable: true, onChange: onInputChange })) : (React.createElement(Input, { disabled: true, value: showedVal.toString() }))));
58
- };
1
+ /*
2
+ * Copyright (c) 2023, J2 Innovations. All Rights Reserved
3
+ */
4
+ import { ant_prefix, HInput, Input, Select } from '@j2inn/ui';
5
+ import cn from 'classnames';
6
+ import { HNum, HRef, HStr, isHVal, Kind, valueIsKind, } from 'haystack-core';
7
+ import React, { useCallback, useEffect, useMemo, useState } from 'react';
8
+ import { createUseStyles } from 'react-jss';
9
+ const useStyles = createUseStyles((theme) => ({
10
+ formEntry: {
11
+ [`& .${ant_prefix}-input`]: {
12
+ height: 32,
13
+ },
14
+ },
15
+ entryTitle: {
16
+ fontWeight: 600,
17
+ fontSize: '1em',
18
+ color: theme.textColorSecondary,
19
+ },
20
+ select: {
21
+ width: '100%',
22
+ },
23
+ }));
24
+ const getHValFromSelectValue = (selectValue, initialHVal) => {
25
+ if (valueIsKind(initialHVal, Kind.Number)) {
26
+ return HNum.make(selectValue, initialHVal.unit);
27
+ }
28
+ else if (valueIsKind(initialHVal, Kind.Ref)) {
29
+ return HRef.make(selectValue);
30
+ }
31
+ return HStr.make(selectValue);
32
+ };
33
+ export const ConfigurationFormEntry = ({ name, value, onChange, disabled, options, className, }) => {
34
+ const classes = useStyles();
35
+ if (!isHVal(value)) {
36
+ return React.createElement(React.Fragment, null, `${name} = ${value}`);
37
+ }
38
+ const [showedVal, setShowedVal] = useState(value);
39
+ useEffect(() => {
40
+ setShowedVal(value);
41
+ }, [value]);
42
+ const selectOptions = useMemo(() => options?.getRows().map((cfeOpt) => ({
43
+ value: cfeOpt.value.value,
44
+ label: cfeOpt.label.value,
45
+ })), [options]);
46
+ const onInputChange = useCallback((val) => {
47
+ setShowedVal(val);
48
+ onChange?.(val);
49
+ }, [onChange]);
50
+ return (React.createElement("div", { className: cn(classes.formEntry, className) },
51
+ React.createElement("div", { className: classes.entryTitle }, name),
52
+ selectOptions ? (React.createElement(Select, { showSearch: true, className: classes.select, value: showedVal.value, options: selectOptions, disabled: disabled, onChange: (val) => {
53
+ if (val != null) {
54
+ const newVal = getHValFromSelectValue(val, value);
55
+ onInputChange(newVal);
56
+ }
57
+ } })) : !disabled ? (React.createElement(HInput, { value: showedVal, editable: true, onChange: onInputChange })) : (React.createElement(Input, { disabled: true, value: showedVal.toString() }))));
58
+ };
59
59
  //# sourceMappingURL=ConfigurationFormEntry.js.map
@@ -1,16 +1,16 @@
1
- import { UiElementData } from '@j2inn/resolvable-ui-elements';
2
- import { HVal } from 'haystack-core';
3
- /**
4
- * Get default values for all elements that should resolve into an HVal.
5
- * @param section a section element
6
- * @returns an object containing as key the section element name and as value the default HVal.
7
- */
8
- export declare const getSectionDefault: (section: UiElementData) => {
9
- [key: string]: HVal;
10
- };
11
- /**
12
- * Get a default for a specific kind of HVal.
13
- * @param kind can be expressed as new or old Hayson, or alternatively the haystack-core type name
14
- * @returns
15
- */
16
- export declare const getDefaultHVal: (kind?: string) => HVal | undefined;
1
+ import { UiElementData } from '@j2inn/resolvable-ui-elements';
2
+ import { HVal } from 'haystack-core';
3
+ /**
4
+ * Get default values for all elements that should resolve into an HVal.
5
+ * @param section a section element
6
+ * @returns an object containing as key the section element name and as value the default HVal.
7
+ */
8
+ export declare const getSectionDefault: (section: UiElementData) => {
9
+ [key: string]: HVal;
10
+ };
11
+ /**
12
+ * Get a default for a specific kind of HVal.
13
+ * @param kind can be expressed as new or old Hayson, or alternatively the haystack-core type name
14
+ * @returns
15
+ */
16
+ export declare const getDefaultHVal: (kind?: string) => HVal | undefined;
@@ -1,95 +1,95 @@
1
- /*
2
- * Copyright (c) 2023, J2 Innovations. All Rights Reserved
3
- */
4
- import { HBool, HCoord, HDate, HDateTime, HDict, HGrid, HMarker, HNa, HNum, HRef, HRemove, HStr, HSymbol, HTime, HUri, HXStr, Kind, } from 'haystack-core';
5
- /**
6
- * Get default values for all elements that should resolve into an HVal.
7
- * @param section a section element
8
- * @returns an object containing as key the section element name and as value the default HVal.
9
- */
10
- export const getSectionDefault = (section) => {
11
- const result = {};
12
- Object.entries(section).forEach(([key, element]) => {
13
- const elementData = element;
14
- const defaultValue = getDefaultHVal(elementData?._meta?.resolvedType);
15
- if (defaultValue) {
16
- result[key] = defaultValue;
17
- }
18
- });
19
- return result;
20
- };
21
- /**
22
- * Get a default for a specific kind of HVal.
23
- * @param kind can be expressed as new or old Hayson, or alternatively the haystack-core type name
24
- * @returns
25
- */
26
- export const getDefaultHVal = (kind) => {
27
- switch (kind) {
28
- case Kind.Marker:
29
- case 'Marker':
30
- case 'HMarker':
31
- return HMarker.make();
32
- case Kind.Remove:
33
- case 'Remove':
34
- case 'HRemove':
35
- return HRemove.make();
36
- case Kind.NA:
37
- case 'NA':
38
- case 'HNa':
39
- return HNa.make();
40
- case Kind.Coord:
41
- case 'Coord':
42
- case 'HCoord':
43
- return HCoord.make({ latitude: 0, longitude: 0 });
44
- case Kind.XStr:
45
- case 'XStr':
46
- case 'HXStr':
47
- return HXStr.make('');
48
- case Kind.Date:
49
- case 'Date':
50
- case 'HDate':
51
- return HDate.make(new Date());
52
- case Kind.DateTime:
53
- case 'DateTime':
54
- case 'HDateTime':
55
- return HDateTime.make(new Date());
56
- case Kind.Number:
57
- case 'Number':
58
- case 'HNum':
59
- return HNum.make(0);
60
- case Kind.Bool:
61
- case 'Bool':
62
- case 'HBool':
63
- return HBool.make(false);
64
- case 'Str':
65
- case 'HStr':
66
- return HStr.make('');
67
- case Kind.Ref:
68
- case 'Ref':
69
- case 'HRef':
70
- return HRef.make('');
71
- case Kind.Symbol:
72
- case 'Symbol':
73
- case 'HSymbol':
74
- return HSymbol.make('');
75
- case Kind.Time:
76
- case 'Time':
77
- case 'HTime':
78
- return HTime.make(new Date());
79
- case Kind.Uri:
80
- case 'Uri':
81
- case 'HUri':
82
- return HUri.make('');
83
- case Kind.Dict:
84
- case 'Dict':
85
- case 'HDict':
86
- return HDict.make();
87
- case Kind.Grid:
88
- case 'Grid':
89
- case 'HGrid':
90
- return HGrid.make();
91
- default:
92
- return undefined;
93
- }
94
- };
1
+ /*
2
+ * Copyright (c) 2023, J2 Innovations. All Rights Reserved
3
+ */
4
+ import { HBool, HCoord, HDate, HDateTime, HDict, HGrid, HMarker, HNa, HNum, HRef, HRemove, HStr, HSymbol, HTime, HUri, HXStr, Kind, } from 'haystack-core';
5
+ /**
6
+ * Get default values for all elements that should resolve into an HVal.
7
+ * @param section a section element
8
+ * @returns an object containing as key the section element name and as value the default HVal.
9
+ */
10
+ export const getSectionDefault = (section) => {
11
+ const result = {};
12
+ Object.entries(section).forEach(([key, element]) => {
13
+ const elementData = element;
14
+ const defaultValue = getDefaultHVal(elementData?._meta?.resolvedType);
15
+ if (defaultValue) {
16
+ result[key] = defaultValue;
17
+ }
18
+ });
19
+ return result;
20
+ };
21
+ /**
22
+ * Get a default for a specific kind of HVal.
23
+ * @param kind can be expressed as new or old Hayson, or alternatively the haystack-core type name
24
+ * @returns
25
+ */
26
+ export const getDefaultHVal = (kind) => {
27
+ switch (kind) {
28
+ case Kind.Marker:
29
+ case 'Marker':
30
+ case 'HMarker':
31
+ return HMarker.make();
32
+ case Kind.Remove:
33
+ case 'Remove':
34
+ case 'HRemove':
35
+ return HRemove.make();
36
+ case Kind.NA:
37
+ case 'NA':
38
+ case 'HNa':
39
+ return HNa.make();
40
+ case Kind.Coord:
41
+ case 'Coord':
42
+ case 'HCoord':
43
+ return HCoord.make({ latitude: 0, longitude: 0 });
44
+ case Kind.XStr:
45
+ case 'XStr':
46
+ case 'HXStr':
47
+ return HXStr.make('');
48
+ case Kind.Date:
49
+ case 'Date':
50
+ case 'HDate':
51
+ return HDate.make(new Date());
52
+ case Kind.DateTime:
53
+ case 'DateTime':
54
+ case 'HDateTime':
55
+ return HDateTime.make(new Date());
56
+ case Kind.Number:
57
+ case 'Number':
58
+ case 'HNum':
59
+ return HNum.make(0);
60
+ case Kind.Bool:
61
+ case 'Bool':
62
+ case 'HBool':
63
+ return HBool.make(false);
64
+ case 'Str':
65
+ case 'HStr':
66
+ return HStr.make('');
67
+ case Kind.Ref:
68
+ case 'Ref':
69
+ case 'HRef':
70
+ return HRef.make('');
71
+ case Kind.Symbol:
72
+ case 'Symbol':
73
+ case 'HSymbol':
74
+ return HSymbol.make('');
75
+ case Kind.Time:
76
+ case 'Time':
77
+ case 'HTime':
78
+ return HTime.make(new Date());
79
+ case Kind.Uri:
80
+ case 'Uri':
81
+ case 'HUri':
82
+ return HUri.make('');
83
+ case Kind.Dict:
84
+ case 'Dict':
85
+ case 'HDict':
86
+ return HDict.make();
87
+ case Kind.Grid:
88
+ case 'Grid':
89
+ case 'HGrid':
90
+ return HGrid.make();
91
+ default:
92
+ return undefined;
93
+ }
94
+ };
95
95
  //# sourceMappingURL=getSectionDefault.js.map
@@ -1,6 +1,6 @@
1
- import { HRef } from 'haystack-core';
2
- /**
3
- * Retrieves the url of a Fin 5 bin based on the file record id, or undefined if the url couldn't be retrieved.
4
- * Uses haystack-nclient to retrieve the projectName from context.
5
- */
6
- export declare const useFin5BinUrl: (fileId?: HRef) => string | undefined;
1
+ import { HRef } from 'haystack-core';
2
+ /**
3
+ * Retrieves the url of a Fin 5 bin based on the file record id, or undefined if the url couldn't be retrieved.
4
+ * Uses haystack-nclient to retrieve the projectName from context.
5
+ */
6
+ export declare const useFin5BinUrl: (fileId?: HRef) => string | undefined;