@j2inn/fin5-ui-utils 6.0.4 → 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.
Files changed (212) 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 +66 -61
  14. package/dist/fantomProps/readFantomPropsFile.js.map +1 -1
  15. package/dist/fin5Top/fin5FileUpload.d.ts +24 -24
  16. package/dist/fin5Top/fin5FileUpload.js +51 -51
  17. package/dist/fin5Top/fin5Top.d.ts +124 -124
  18. package/dist/fin5Top/fin5Top.js +53 -53
  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 +102 -102
  35. package/dist/react/app/Fin5AppRootStore.d.ts +40 -40
  36. package/dist/react/app/Fin5AppRootStore.js +69 -69
  37. package/dist/react/components/ErrorBoundary.d.ts +57 -57
  38. package/dist/react/components/ErrorBoundary.js +150 -150
  39. package/dist/react/components/ErrorDisplayer.d.ts +19 -19
  40. package/dist/react/components/ErrorDisplayer.js +36 -36
  41. package/dist/react/components/Loader.d.ts +9 -9
  42. package/dist/react/components/Loader.js +17 -17
  43. package/dist/react/components/LoadingSpinner.d.ts +2 -2
  44. package/dist/react/components/LoadingSpinner.js +27 -27
  45. package/dist/react/components/RecordImage.d.ts +20 -20
  46. package/dist/react/components/RecordImage.js +51 -51
  47. package/dist/react/components/charts/QRCode.d.ts +25 -25
  48. package/dist/react/components/charts/QRCode.js +82 -82
  49. package/dist/react/components/charts/line-bar/Chart.d.ts +166 -166
  50. package/dist/react/components/charts/line-bar/Chart.js +442 -442
  51. package/dist/react/components/charts/line-bar/HGridChart.d.ts +58 -58
  52. package/dist/react/components/charts/line-bar/HGridChart.js +285 -285
  53. package/dist/react/components/charts/pie/PieChart.d.ts +94 -94
  54. package/dist/react/components/charts/pie/PieChart.js +204 -204
  55. package/dist/react/components/charts/pie/SimplePieChart.d.ts +21 -21
  56. package/dist/react/components/charts/pie/SimplePieChart.js +55 -55
  57. package/dist/react/components/graphics/GraphicViewer.d.ts +10 -10
  58. package/dist/react/components/graphics/GraphicViewer.js +29 -29
  59. package/dist/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
  60. package/dist/react/components/graphics/GraphicsTabViewer.js +90 -90
  61. package/dist/react/components/makeCustomElement.d.ts +16 -16
  62. package/dist/react/components/makeCustomElement.js +150 -150
  63. package/dist/react/components/navigation/BasicLayout.d.ts +41 -41
  64. package/dist/react/components/navigation/BasicLayout.js +155 -155
  65. package/dist/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
  66. package/dist/react/components/navigation/HeaderSiderLayout.js +110 -110
  67. package/dist/react/components/navigation/MenuPage.d.ts +37 -37
  68. package/dist/react/components/navigation/MenuPage.js +36 -36
  69. package/dist/react/components/navigation/MenuTrigger.d.ts +9 -9
  70. package/dist/react/components/navigation/MenuTrigger.js +33 -33
  71. package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
  72. package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.js +25 -25
  73. package/dist/react/components/navigation/ReactRouterLayout.d.ts +46 -46
  74. package/dist/react/components/navigation/ReactRouterLayout.js +132 -132
  75. package/dist/react/components/navigation/customRouting/Router.d.ts +12 -12
  76. package/dist/react/components/navigation/customRouting/Router.js +45 -45
  77. package/dist/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
  78. package/dist/react/components/navigation/customRouting/RouterLayout.js +61 -61
  79. package/dist/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
  80. package/dist/react/components/resolvable/configurationForm/ConfigurationForm.js +95 -95
  81. package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
  82. package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +88 -88
  83. package/dist/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
  84. package/dist/react/components/resolvable/configurationForm/getSectionDefault.js +99 -99
  85. package/dist/react/hooks/useFin5BinUrl.d.ts +6 -6
  86. package/dist/react/hooks/useFin5BinUrl.js +15 -15
  87. package/dist/react/hooks/useFin5ColorScheme.d.ts +2 -2
  88. package/dist/react/hooks/useFin5ColorScheme.js +49 -49
  89. package/dist/react/hooks/useScreenSize.d.ts +7 -7
  90. package/dist/react/hooks/useScreenSize.js +31 -31
  91. package/dist_es/fantomProps/createFin5Props/index.d.ts +12 -12
  92. package/dist_es/fantomProps/createFin5Props/index.js +140 -140
  93. package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
  94. package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.js +11 -11
  95. package/dist_es/fantomProps/fantomPropsToObject.d.ts +8 -8
  96. package/dist_es/fantomProps/fantomPropsToObject.js +178 -178
  97. package/dist_es/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
  98. package/dist_es/fantomProps/generateJsonFromFantomPropsFile.js +12 -12
  99. package/dist_es/fantomProps/localePropsToJson.d.ts +1 -1
  100. package/dist_es/fantomProps/localePropsToJson.js +21 -21
  101. package/dist_es/fantomProps/readFantomPropsFile.d.ts +5 -5
  102. package/dist_es/fantomProps/readFantomPropsFile.js +40 -35
  103. package/dist_es/fantomProps/readFantomPropsFile.js.map +1 -1
  104. package/dist_es/fin5Top/fin5FileUpload.d.ts +24 -24
  105. package/dist_es/fin5Top/fin5FileUpload.js +47 -47
  106. package/dist_es/fin5Top/fin5Top.d.ts +124 -124
  107. package/dist_es/fin5Top/fin5Top.js +49 -49
  108. package/dist_es/fin5Top/finEdge2Cloud.d.ts +6 -6
  109. package/dist_es/fin5Top/finEdge2Cloud.js +11 -11
  110. package/dist_es/fin5Top/getFin5BinUrl.d.ts +2 -2
  111. package/dist_es/fin5Top/getFin5BinUrl.js +5 -5
  112. package/dist_es/fin5Top/openFin5Alarm.d.ts +22 -22
  113. package/dist_es/fin5Top/openFin5Alarm.js +19 -19
  114. package/dist_es/fin5Top/openFin5Historian.d.ts +3 -3
  115. package/dist_es/fin5Top/openFin5Historian.js +15 -15
  116. package/dist_es/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
  117. package/dist_es/fin5Top/useFin5AppURLHashParameter.js +124 -124
  118. package/dist_es/index.d.ts +35 -35
  119. package/dist_es/index.js +53 -53
  120. package/dist_es/jobs/jobUtils.d.ts +14 -14
  121. package/dist_es/jobs/jobUtils.js +9 -9
  122. package/dist_es/react/app/Fin5AppContainer.d.ts +36 -36
  123. package/dist_es/react/app/Fin5AppContainer.js +73 -73
  124. package/dist_es/react/app/Fin5AppContainer.jsx +82 -0
  125. package/dist_es/react/app/Fin5AppContainer.jsx.map +1 -0
  126. package/dist_es/react/app/Fin5AppRootStore.d.ts +40 -40
  127. package/dist_es/react/app/Fin5AppRootStore.js +65 -65
  128. package/dist_es/react/components/ErrorBoundary.d.ts +57 -57
  129. package/dist_es/react/components/ErrorBoundary.js +123 -123
  130. package/dist_es/react/components/ErrorBoundary.jsx +150 -0
  131. package/dist_es/react/components/ErrorBoundary.jsx.map +1 -0
  132. package/dist_es/react/components/ErrorDisplayer.d.ts +19 -19
  133. package/dist_es/react/components/ErrorDisplayer.js +28 -28
  134. package/dist_es/react/components/ErrorDisplayer.jsx +36 -0
  135. package/dist_es/react/components/ErrorDisplayer.jsx.map +1 -0
  136. package/dist_es/react/components/Loader.d.ts +9 -9
  137. package/dist_es/react/components/Loader.js +12 -12
  138. package/dist_es/react/components/Loader.jsx +13 -0
  139. package/dist_es/react/components/Loader.jsx.map +1 -0
  140. package/dist_es/react/components/LoadingSpinner.d.ts +2 -2
  141. package/dist_es/react/components/LoadingSpinner.js +20 -20
  142. package/dist_es/react/components/LoadingSpinner.jsx +22 -0
  143. package/dist_es/react/components/LoadingSpinner.jsx.map +1 -0
  144. package/dist_es/react/components/RecordImage.d.ts +20 -20
  145. package/dist_es/react/components/RecordImage.js +24 -24
  146. package/dist_es/react/components/charts/QRCode.d.ts +25 -25
  147. package/dist_es/react/components/charts/QRCode.js +52 -52
  148. package/dist_es/react/components/charts/line-bar/Chart.d.ts +166 -166
  149. package/dist_es/react/components/charts/line-bar/Chart.js +415 -415
  150. package/dist_es/react/components/charts/line-bar/HGridChart.d.ts +58 -58
  151. package/dist_es/react/components/charts/line-bar/HGridChart.js +250 -250
  152. package/dist_es/react/components/charts/line-bar/ZincGridChart.d.ts +12 -0
  153. package/dist_es/react/components/charts/line-bar/ZincGridChart.js +17 -0
  154. package/dist_es/react/components/charts/line-bar/ZincGridChart.js.map +1 -0
  155. package/dist_es/react/components/charts/pie/PieChart.d.ts +94 -94
  156. package/dist_es/react/components/charts/pie/PieChart.js +177 -177
  157. package/dist_es/react/components/charts/pie/SimplePieChart.d.ts +21 -21
  158. package/dist_es/react/components/charts/pie/SimplePieChart.js +25 -25
  159. package/dist_es/react/components/graphics/GraphicViewer.d.ts +10 -10
  160. package/dist_es/react/components/graphics/GraphicViewer.js +22 -22
  161. package/dist_es/react/components/graphics/GraphicViewer.jsx +23 -0
  162. package/dist_es/react/components/graphics/GraphicViewer.jsx.map +1 -0
  163. package/dist_es/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
  164. package/dist_es/react/components/graphics/GraphicsTabViewer.js +60 -60
  165. package/dist_es/react/components/graphics/GraphicsTabViewer.jsx +63 -0
  166. package/dist_es/react/components/graphics/GraphicsTabViewer.jsx.map +1 -0
  167. package/dist_es/react/components/makeCustomElement.d.ts +16 -16
  168. package/dist_es/react/components/makeCustomElement.js +142 -142
  169. package/dist_es/react/components/navigation/BasicLayout.d.ts +41 -41
  170. package/dist_es/react/components/navigation/BasicLayout.js +124 -124
  171. package/dist_es/react/components/navigation/BasicLayout.jsx +133 -0
  172. package/dist_es/react/components/navigation/BasicLayout.jsx.map +1 -0
  173. package/dist_es/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
  174. package/dist_es/react/components/navigation/HeaderSiderLayout.js +80 -80
  175. package/dist_es/react/components/navigation/MenuPage.d.ts +37 -37
  176. package/dist_es/react/components/navigation/MenuPage.js +30 -30
  177. package/dist_es/react/components/navigation/MenuPage.jsx +31 -0
  178. package/dist_es/react/components/navigation/MenuPage.jsx.map +1 -0
  179. package/dist_es/react/components/navigation/MenuTrigger.d.ts +9 -9
  180. package/dist_es/react/components/navigation/MenuTrigger.js +28 -28
  181. package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
  182. package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.js +18 -18
  183. package/dist_es/react/components/navigation/ReactRouterLayout.d.ts +46 -46
  184. package/dist_es/react/components/navigation/ReactRouterLayout.js +99 -99
  185. package/dist_es/react/components/navigation/Router.d.ts +12 -0
  186. package/dist_es/react/components/navigation/Router.js +19 -0
  187. package/dist_es/react/components/navigation/Router.js.map +1 -0
  188. package/dist_es/react/components/navigation/Router.jsx +19 -0
  189. package/dist_es/react/components/navigation/Router.jsx.map +1 -0
  190. package/dist_es/react/components/navigation/customRouting/Router.d.ts +12 -12
  191. package/dist_es/react/components/navigation/customRouting/Router.js +18 -18
  192. package/dist_es/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
  193. package/dist_es/react/components/navigation/customRouting/RouterLayout.js +34 -34
  194. package/dist_es/react/components/navigation/react-router/BasicLayout.d.ts +23 -0
  195. package/dist_es/react/components/navigation/react-router/BasicLayout.js +82 -0
  196. package/dist_es/react/components/navigation/react-router/BasicLayout.js.map +1 -0
  197. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.d.ts +24 -0
  198. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js +82 -0
  199. package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js.map +1 -0
  200. package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
  201. package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.js +64 -64
  202. package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
  203. package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +58 -58
  204. package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
  205. package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.js +94 -94
  206. package/dist_es/react/hooks/useFin5BinUrl.d.ts +6 -6
  207. package/dist_es/react/hooks/useFin5BinUrl.js +11 -11
  208. package/dist_es/react/hooks/useFin5ColorScheme.d.ts +2 -2
  209. package/dist_es/react/hooks/useFin5ColorScheme.js +45 -45
  210. package/dist_es/react/hooks/useScreenSize.d.ts +7 -7
  211. package/dist_es/react/hooks/useScreenSize.js +27 -27
  212. package/package.json +1 -1
@@ -1,124 +1,124 @@
1
- /*
2
- * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
- */
4
- import React, { useState } from 'react';
5
- import { Button, Checkbox, Divider, Message, Container, ColorVals, } from '@j2inn/ui';
6
- import { usei18n } from '@j2inn/utils';
7
- import { createUseStyles, useTheme } from 'react-jss';
8
- const boundryStyles = createUseStyles((theme) => ({
9
- errorBoundry: {
10
- backgroundColor: theme.bodyBg,
11
- flex: `1 1 auto`,
12
- },
13
- boundryContainer: {
14
- margin: '0 auto',
15
- flex: `1 1 auto`,
16
- padding: `2rem`,
17
- maxWidth: 1024,
18
- backgroundColor: theme.bgColor,
19
- [`& h1, & h3`]: {
20
- paddingBottom: `1rem`,
21
- },
22
- },
23
- errorDetails: {
24
- [`& pre`]: {
25
- overflow: 'auto',
26
- marginTop: '1rem',
27
- backgroundColor: ColorVals.Black,
28
- color: ColorVals.White,
29
- padding: '0.3rem',
30
- },
31
- },
32
- }));
33
- function get(i18n, key, fallback) {
34
- return i18n.has(key) ? i18n.get(key) : fallback;
35
- }
36
- /**
37
- * Format an error message into something more useful for the clipboard.
38
- */
39
- function formatErrorMessage(error, appId) {
40
- return JSON.stringify({
41
- timestamp: new Date().toISOString(),
42
- appId: appId ?? '',
43
- location: location.href,
44
- navigator: {
45
- cookieEnabled: navigator.cookieEnabled,
46
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
47
- deviceMemory: navigator.deviceMemory,
48
- language: navigator.language,
49
- languages: navigator.languages,
50
- onLine: navigator.onLine,
51
- userAgent: navigator.userAgent,
52
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
53
- userAgentData: navigator.userAgentData,
54
- vendor: navigator.vendor,
55
- },
56
- error: String(error.stack),
57
- }, null, 2);
58
- }
59
- /**
60
- * Shows the internal error details to a user.
61
- */
62
- const ErrorDetails = ({ showDetails, setShowDetails, error, appId, }) => {
63
- const i18n = usei18n();
64
- const classes = boundryStyles();
65
- const theme = useTheme();
66
- const copyToClipboard = () => {
67
- navigator.clipboard.writeText(formatErrorMessage(error, appId));
68
- Message.success(theme, get(i18n, 'finUi.errorBoundary.copiedErrorToClipboard', 'Copied error to clipboard'));
69
- };
70
- return (React.createElement("div", { className: classes.errorDetails },
71
- React.createElement(Checkbox, { onChange: (e) => {
72
- setShowDetails(e.target.checked);
73
- }, defaultChecked: showDetails, value: showDetails }, get(i18n, 'finUi.errorBoundary.showDetails', 'Show details')),
74
- showDetails && (React.createElement(React.Fragment, null,
75
- React.createElement("pre", null, error.stack),
76
- React.createElement(Container, { horizontal: true, middle: true, right: true },
77
- React.createElement(Button, { onClick: copyToClipboard }, get(i18n, 'finUi.errorBoundary.copyToClipboard', 'Copy to clipboard')))))));
78
- };
79
- /**
80
- * The inner error boundary component. This is required so
81
- * we can use hooks that can't be used in a normal class component.
82
- */
83
- const ErrorBoundaryInner = ({ error, mode, appId, showReportDialog, }) => {
84
- const i18n = usei18n();
85
- const [showDetails, setShowDetails] = useState(true);
86
- const classes = boundryStyles();
87
- const title = `finUi.errorBoundary.${mode}.title`;
88
- const appName = `${appId}.name`;
89
- const header = get(i18n, title, mode === 'global' ? 'Error' : 'Application error') +
90
- (appId ? `: ${get(i18n, appName, appName)}` : '');
91
- const continueMsg = get(i18n, `finUi.errorBoundary.${mode}.continue`, mode === 'global'
92
- ? 'To continue, please reload or navigate to the home page.'
93
- : 'To continue, please reload, navigate to the home page or another application.');
94
- return (React.createElement(Container, { vertical: true, top: true, center: true, className: classes.errorBoundry },
95
- React.createElement("div", { className: classes.boundryContainer, style: { gap: `1rem` } },
96
- React.createElement("h1", null, header),
97
- React.createElement("h3", null, get(i18n, 'finUi.errorBoundary.description', 'The application has encountered an error when trying to display some content.')),
98
- React.createElement("p", null, continueMsg),
99
- React.createElement("div", null,
100
- React.createElement(ErrorDetails, { showDetails: showDetails, setShowDetails: setShowDetails, error: error, appId: appId })),
101
- React.createElement(Divider, null),
102
- React.createElement(Container, { horizontal: true, middle: true, left: true, style: { gap: `1rem` } },
103
- React.createElement(Button, { onClick: () => window.location.reload(), type: 'primary' }, get(i18n, 'finUi.common.reload', 'Reload')),
104
- React.createElement(Button, { onClick: () => window.location.assign('/') }, get(i18n, 'finUi.common.home', 'Home'))),
105
- showReportDialog && (React.createElement("div", { style: { marginTop: `0.5rem` } },
106
- React.createElement("small", { onClick: showReportDialog }, get(i18n, 'finUi.errorBoundary.additionalDetails', 'If you’d like, click here to include an additional error report to our team. Any details you provide will be helpful.')))))));
107
- };
108
- /**
109
- * A common error boundary used to capture errors.
110
- */
111
- export class ErrorBoundary extends React.Component {
112
- state = {};
113
- componentDidCatch(error, info) {
114
- this.props.onError?.(error);
115
- console.error(error, info);
116
- }
117
- static getDerivedStateFromError(error) {
118
- return { error };
119
- }
120
- render() {
121
- return this.state.error ? (React.createElement(ErrorBoundaryInner, { error: this.state.error, mode: this.props.mode, appId: this.props.appId, showReportDialog: this.props.showReportDialog })) : (this.props.children);
122
- }
123
- }
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ import React, { useState } from 'react';
5
+ import { Button, Checkbox, Divider, Message, Container, ColorVals, } from '@j2inn/ui';
6
+ import { usei18n } from '@j2inn/utils';
7
+ import { createUseStyles, useTheme } from 'react-jss';
8
+ const boundryStyles = createUseStyles((theme) => ({
9
+ errorBoundry: {
10
+ backgroundColor: theme.bodyBg,
11
+ flex: `1 1 auto`,
12
+ },
13
+ boundryContainer: {
14
+ margin: '0 auto',
15
+ flex: `1 1 auto`,
16
+ padding: `2rem`,
17
+ maxWidth: 1024,
18
+ backgroundColor: theme.bgColor,
19
+ [`& h1, & h3`]: {
20
+ paddingBottom: `1rem`,
21
+ },
22
+ },
23
+ errorDetails: {
24
+ [`& pre`]: {
25
+ overflow: 'auto',
26
+ marginTop: '1rem',
27
+ backgroundColor: ColorVals.Black,
28
+ color: ColorVals.White,
29
+ padding: '0.3rem',
30
+ },
31
+ },
32
+ }));
33
+ function get(i18n, key, fallback) {
34
+ return i18n.has(key) ? i18n.get(key) : fallback;
35
+ }
36
+ /**
37
+ * Format an error message into something more useful for the clipboard.
38
+ */
39
+ function formatErrorMessage(error, appId) {
40
+ return JSON.stringify({
41
+ timestamp: new Date().toISOString(),
42
+ appId: appId ?? '',
43
+ location: location.href,
44
+ navigator: {
45
+ cookieEnabled: navigator.cookieEnabled,
46
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
47
+ deviceMemory: navigator.deviceMemory,
48
+ language: navigator.language,
49
+ languages: navigator.languages,
50
+ onLine: navigator.onLine,
51
+ userAgent: navigator.userAgent,
52
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
53
+ userAgentData: navigator.userAgentData,
54
+ vendor: navigator.vendor,
55
+ },
56
+ error: String(error.stack),
57
+ }, null, 2);
58
+ }
59
+ /**
60
+ * Shows the internal error details to a user.
61
+ */
62
+ const ErrorDetails = ({ showDetails, setShowDetails, error, appId, }) => {
63
+ const i18n = usei18n();
64
+ const classes = boundryStyles();
65
+ const theme = useTheme();
66
+ const copyToClipboard = () => {
67
+ navigator.clipboard.writeText(formatErrorMessage(error, appId));
68
+ Message.success(theme, get(i18n, 'finUi.errorBoundary.copiedErrorToClipboard', 'Copied error to clipboard'));
69
+ };
70
+ return (React.createElement("div", { className: classes.errorDetails },
71
+ React.createElement(Checkbox, { onChange: (e) => {
72
+ setShowDetails(e.target.checked);
73
+ }, defaultChecked: showDetails, value: showDetails }, get(i18n, 'finUi.errorBoundary.showDetails', 'Show details')),
74
+ showDetails && (React.createElement(React.Fragment, null,
75
+ React.createElement("pre", null, error.stack),
76
+ React.createElement(Container, { horizontal: true, middle: true, right: true },
77
+ React.createElement(Button, { onClick: copyToClipboard }, get(i18n, 'finUi.errorBoundary.copyToClipboard', 'Copy to clipboard')))))));
78
+ };
79
+ /**
80
+ * The inner error boundary component. This is required so
81
+ * we can use hooks that can't be used in a normal class component.
82
+ */
83
+ const ErrorBoundaryInner = ({ error, mode, appId, showReportDialog, }) => {
84
+ const i18n = usei18n();
85
+ const [showDetails, setShowDetails] = useState(true);
86
+ const classes = boundryStyles();
87
+ const title = `finUi.errorBoundary.${mode}.title`;
88
+ const appName = `${appId}.name`;
89
+ const header = get(i18n, title, mode === 'global' ? 'Error' : 'Application error') +
90
+ (appId ? `: ${get(i18n, appName, appName)}` : '');
91
+ const continueMsg = get(i18n, `finUi.errorBoundary.${mode}.continue`, mode === 'global'
92
+ ? 'To continue, please reload or navigate to the home page.'
93
+ : 'To continue, please reload, navigate to the home page or another application.');
94
+ return (React.createElement(Container, { vertical: true, top: true, center: true, className: classes.errorBoundry },
95
+ React.createElement("div", { className: classes.boundryContainer, style: { gap: `1rem` } },
96
+ React.createElement("h1", null, header),
97
+ React.createElement("h3", null, get(i18n, 'finUi.errorBoundary.description', 'The application has encountered an error when trying to display some content.')),
98
+ React.createElement("p", null, continueMsg),
99
+ React.createElement("div", null,
100
+ React.createElement(ErrorDetails, { showDetails: showDetails, setShowDetails: setShowDetails, error: error, appId: appId })),
101
+ React.createElement(Divider, null),
102
+ React.createElement(Container, { horizontal: true, middle: true, left: true, style: { gap: `1rem` } },
103
+ React.createElement(Button, { onClick: () => window.location.reload(), type: 'primary' }, get(i18n, 'finUi.common.reload', 'Reload')),
104
+ React.createElement(Button, { onClick: () => window.location.assign('/') }, get(i18n, 'finUi.common.home', 'Home'))),
105
+ showReportDialog && (React.createElement("div", { style: { marginTop: `0.5rem` } },
106
+ React.createElement("small", { onClick: showReportDialog }, get(i18n, 'finUi.errorBoundary.additionalDetails', 'If you’d like, click here to include an additional error report to our team. Any details you provide will be helpful.')))))));
107
+ };
108
+ /**
109
+ * A common error boundary used to capture errors.
110
+ */
111
+ export class ErrorBoundary extends React.Component {
112
+ state = {};
113
+ componentDidCatch(error, info) {
114
+ this.props.onError?.(error);
115
+ console.error(error, info);
116
+ }
117
+ static getDerivedStateFromError(error) {
118
+ return { error };
119
+ }
120
+ render() {
121
+ return this.state.error ? (React.createElement(ErrorBoundaryInner, { error: this.state.error, mode: this.props.mode, appId: this.props.appId, showReportDialog: this.props.showReportDialog })) : (this.props.children);
122
+ }
123
+ }
124
124
  //# sourceMappingURL=ErrorBoundary.js.map
@@ -0,0 +1,150 @@
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ import React, { useState } from 'react';
5
+ import { Button, Checkbox, Divider, Message, Container, ColorVals, } from '@j2inn/ui';
6
+ import { usei18n } from '@j2inn/utils';
7
+ import { createUseStyles, useTheme } from 'react-jss';
8
+ const boundryStyles = createUseStyles((theme) => ({
9
+ errorBoundry: {
10
+ backgroundColor: theme.bodyBg,
11
+ flex: `1 1 auto`,
12
+ },
13
+ boundryContainer: {
14
+ margin: '0 auto',
15
+ flex: `1 1 auto`,
16
+ padding: `2rem`,
17
+ maxWidth: 1024,
18
+ backgroundColor: theme.bgColor,
19
+ [`& h1, & h3`]: {
20
+ paddingBottom: `1rem`,
21
+ },
22
+ },
23
+ errorDetails: {
24
+ [`& pre`]: {
25
+ overflow: 'auto',
26
+ marginTop: '1rem',
27
+ backgroundColor: ColorVals.Black,
28
+ color: ColorVals.White,
29
+ padding: '0.3rem',
30
+ },
31
+ },
32
+ }));
33
+ function get(i18n, key, fallback) {
34
+ return i18n.has(key) ? i18n.get(key) : fallback;
35
+ }
36
+ /**
37
+ * Format an error message into something more useful for the clipboard.
38
+ */
39
+ function formatErrorMessage(error, appId) {
40
+ return JSON.stringify({
41
+ timestamp: new Date().toISOString(),
42
+ appId: appId ?? '',
43
+ location: location.href,
44
+ navigator: {
45
+ cookieEnabled: navigator.cookieEnabled,
46
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
47
+ deviceMemory: navigator.deviceMemory,
48
+ language: navigator.language,
49
+ languages: navigator.languages,
50
+ onLine: navigator.onLine,
51
+ userAgent: navigator.userAgent,
52
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
53
+ userAgentData: navigator.userAgentData,
54
+ vendor: navigator.vendor,
55
+ },
56
+ error: String(error.stack),
57
+ }, null, 2);
58
+ }
59
+ /**
60
+ * Shows the internal error details to a user.
61
+ */
62
+ const ErrorDetails = ({ showDetails, setShowDetails, error, appId, }) => {
63
+ const i18n = usei18n();
64
+ const classes = boundryStyles();
65
+ const theme = useTheme();
66
+ const copyToClipboard = () => {
67
+ navigator.clipboard.writeText(formatErrorMessage(error, appId));
68
+ Message.success(theme, get(i18n, 'finUi.errorBoundary.copiedErrorToClipboard', 'Copied error to clipboard'));
69
+ };
70
+ return (<div className={classes.errorDetails}>
71
+ <Checkbox onChange={(e) => {
72
+ setShowDetails(e.target.checked);
73
+ }} defaultChecked={showDetails} value={showDetails}>
74
+ {get(i18n, 'finUi.errorBoundary.showDetails', 'Show details')}
75
+ </Checkbox>
76
+ {showDetails && (<>
77
+ <pre>{error.stack}</pre>
78
+ <Container horizontal middle right>
79
+ <Button onClick={copyToClipboard}>
80
+ {get(i18n, 'finUi.errorBoundary.copyToClipboard', 'Copy to clipboard')}
81
+ </Button>
82
+ </Container>
83
+ </>)}
84
+ </div>);
85
+ };
86
+ /**
87
+ * The inner error boundary component. This is required so
88
+ * we can use hooks that can't be used in a normal class component.
89
+ */
90
+ const ErrorBoundaryInner = ({ error, mode, appId, showReportDialog, }) => {
91
+ const i18n = usei18n();
92
+ const [showDetails, setShowDetails] = useState(true);
93
+ const classes = boundryStyles();
94
+ const title = `finUi.errorBoundary.${mode}.title`;
95
+ const appName = `${appId}.name`;
96
+ const header = get(i18n, title, mode === 'global' ? 'Error' : 'Application error') +
97
+ (appId ? `: ${get(i18n, appName, appName)}` : '');
98
+ const continueMsg = get(i18n, `finUi.errorBoundary.${mode}.continue`, mode === 'global'
99
+ ? 'To continue, please reload or navigate to the home page.'
100
+ : 'To continue, please reload, navigate to the home page or another application.');
101
+ return (<Container vertical top center className={classes.errorBoundry}>
102
+ <div className={classes.boundryContainer} style={{ gap: `1rem` }}>
103
+ <h1>{header}</h1>
104
+
105
+ <h3>
106
+ {get(i18n, 'finUi.errorBoundary.description', 'The application has encountered an error when trying to display some content.')}
107
+ </h3>
108
+
109
+ <p>{continueMsg}</p>
110
+
111
+ <div>
112
+ <ErrorDetails showDetails={showDetails} setShowDetails={setShowDetails} error={error} appId={appId}/>
113
+ </div>
114
+
115
+ <Divider />
116
+
117
+ <Container horizontal middle left style={{ gap: `1rem` }}>
118
+ <Button onClick={() => window.location.reload()} type='primary'>
119
+ {get(i18n, 'finUi.common.reload', 'Reload')}
120
+ </Button>
121
+ <Button onClick={() => window.location.assign('/')}>
122
+ {get(i18n, 'finUi.common.home', 'Home')}
123
+ </Button>
124
+ </Container>
125
+
126
+ {showReportDialog && (<div style={{ marginTop: `0.5rem` }}>
127
+ <small onClick={showReportDialog}>
128
+ {get(i18n, 'finUi.errorBoundary.additionalDetails', 'If you’d like, click here to include an additional error report to our team. Any details you provide will be helpful.')}
129
+ </small>
130
+ </div>)}
131
+ </div>
132
+ </Container>);
133
+ };
134
+ /**
135
+ * A common error boundary used to capture errors.
136
+ */
137
+ export class ErrorBoundary extends React.Component {
138
+ state = {};
139
+ componentDidCatch(error, info) {
140
+ this.props.onError?.(error);
141
+ console.error(error, info);
142
+ }
143
+ static getDerivedStateFromError(error) {
144
+ return { error };
145
+ }
146
+ render() {
147
+ return this.state.error ? (<ErrorBoundaryInner error={this.state.error} mode={this.props.mode} appId={this.props.appId} showReportDialog={this.props.showReportDialog}/>) : (this.props.children);
148
+ }
149
+ }
150
+ //# sourceMappingURL=ErrorBoundary.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ErrorBoundary.jsx","sourceRoot":"","sources":["../../../src/react/components/ErrorBoundary.tsx"],"names":[],"mappings":"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"}
@@ -1,19 +1,19 @@
1
- import React, { ErrorInfo, ReactNode } from 'react';
2
- interface ErrorBoundaryState {
3
- error?: Error;
4
- }
5
- interface ErrorBoundaryProps {
6
- children: ReactNode;
7
- }
8
- export declare class DefaultErrorBoundary extends React.Component<ErrorBoundaryProps> {
9
- state: ErrorBoundaryState;
10
- static getDerivedStateFromError(error: Error): ErrorBoundaryState;
11
- componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
12
- render(): ReactNode;
13
- }
14
- export interface ErrorDisplayerProps {
15
- error: Error;
16
- extra: React.ReactNode;
17
- }
18
- export declare const ErrorDisplayer: React.FC<ErrorDisplayerProps>;
19
- export {};
1
+ import React, { ErrorInfo, ReactNode } from 'react';
2
+ interface ErrorBoundaryState {
3
+ error?: Error;
4
+ }
5
+ interface ErrorBoundaryProps {
6
+ children: ReactNode;
7
+ }
8
+ export declare class DefaultErrorBoundary extends React.Component<ErrorBoundaryProps> {
9
+ state: ErrorBoundaryState;
10
+ static getDerivedStateFromError(error: Error): ErrorBoundaryState;
11
+ componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
12
+ render(): ReactNode;
13
+ }
14
+ export interface ErrorDisplayerProps {
15
+ error: Error;
16
+ extra: React.ReactNode;
17
+ }
18
+ export declare const ErrorDisplayer: React.FC<ErrorDisplayerProps>;
19
+ export {};
@@ -1,29 +1,29 @@
1
- import { Button, Collapse, Container, Result, Typography } from '@j2inn/ui';
2
- import React from 'react';
3
- export class DefaultErrorBoundary extends React.Component {
4
- state = {};
5
- static getDerivedStateFromError(error) {
6
- // Update state so the next render will show the fallback UI.
7
- return { error: error };
8
- }
9
- componentDidCatch(error, errorInfo) {
10
- // You can also log the error to an error reporting service
11
- console.error(error, errorInfo);
12
- }
13
- render() {
14
- if (this.state.error) {
15
- // You can render any custom fallback UI
16
- return (React.createElement(ErrorDisplayer, { error: this.state.error, extra: [
17
- React.createElement(Button, { type: 'primary', key: 'refresh', onClick: () => window.location.reload() }, "Refresh The Page"),
18
- ] }));
19
- }
20
- return this.props.children;
21
- }
22
- }
23
- export const ErrorDisplayer = ({ error, extra, }) => {
24
- return (React.createElement(Result, { status: 'error', title: 'Ouch... Something Went Wrong', subTitle: React.createElement(Container, { center: true },
25
- React.createElement(Collapse, { style: { width: 600, textAlign: 'left' } },
26
- React.createElement(Collapse.Panel, { header: `${error.toString()}`, key: '1' },
27
- React.createElement(Typography.Text, { style: { width: 400 } }, error.stack)))), extra: extra }));
28
- };
1
+ import { Button, Collapse, Container, Result, Typography } from '@j2inn/ui';
2
+ import React from 'react';
3
+ export class DefaultErrorBoundary extends React.Component {
4
+ state = {};
5
+ static getDerivedStateFromError(error) {
6
+ // Update state so the next render will show the fallback UI.
7
+ return { error: error };
8
+ }
9
+ componentDidCatch(error, errorInfo) {
10
+ // You can also log the error to an error reporting service
11
+ console.error(error, errorInfo);
12
+ }
13
+ render() {
14
+ if (this.state.error) {
15
+ // You can render any custom fallback UI
16
+ return (React.createElement(ErrorDisplayer, { error: this.state.error, extra: [
17
+ React.createElement(Button, { type: 'primary', key: 'refresh', onClick: () => window.location.reload() }, "Refresh The Page"),
18
+ ] }));
19
+ }
20
+ return this.props.children;
21
+ }
22
+ }
23
+ export const ErrorDisplayer = ({ error, extra, }) => {
24
+ return (React.createElement(Result, { status: 'error', title: 'Ouch... Something Went Wrong', subTitle: React.createElement(Container, { center: true },
25
+ React.createElement(Collapse, { style: { width: 600, textAlign: 'left' } },
26
+ React.createElement(Collapse.Panel, { header: `${error.toString()}`, key: '1' },
27
+ React.createElement(Typography.Text, { style: { width: 400 } }, error.stack)))), extra: extra }));
28
+ };
29
29
  //# sourceMappingURL=ErrorDisplayer.js.map
@@ -0,0 +1,36 @@
1
+ import { Button, Collapse, Container, Result, Typography } from '@j2inn/ui';
2
+ import React from 'react';
3
+ export class DefaultErrorBoundary extends React.Component {
4
+ state = {};
5
+ static getDerivedStateFromError(error) {
6
+ // Update state so the next render will show the fallback UI.
7
+ return { error: error };
8
+ }
9
+ componentDidCatch(error, errorInfo) {
10
+ // You can also log the error to an error reporting service
11
+ console.error(error, errorInfo);
12
+ }
13
+ render() {
14
+ if (this.state.error) {
15
+ // You can render any custom fallback UI
16
+ return (<ErrorDisplayer error={this.state.error} extra={[
17
+ <Button type='primary' key='refresh' onClick={() => window.location.reload()}>
18
+ Refresh The Page
19
+ </Button>,
20
+ ]}/>);
21
+ }
22
+ return this.props.children;
23
+ }
24
+ }
25
+ export const ErrorDisplayer = ({ error, extra, }) => {
26
+ return (<Result status='error' title='Ouch... Something Went Wrong' subTitle={<Container center>
27
+ <Collapse style={{ width: 600, textAlign: 'left' }}>
28
+ <Collapse.Panel header={`${error.toString()}`} key='1'>
29
+ <Typography.Text style={{ width: 400 }}>
30
+ {error.stack}
31
+ </Typography.Text>
32
+ </Collapse.Panel>
33
+ </Collapse>
34
+ </Container>} extra={extra}/>);
35
+ };
36
+ //# sourceMappingURL=ErrorDisplayer.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ErrorDisplayer.jsx","sourceRoot":"","sources":["../../../src/react/components/ErrorDisplayer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AAC3E,OAAO,KAA+B,MAAM,OAAO,CAAA;AAUnD,MAAM,OAAO,oBAAqB,SAAQ,KAAK,CAAC,SAA6B;IACnE,KAAK,GAAuB,EAAE,CAAA;IAEvC,MAAM,CAAC,wBAAwB,CAAC,KAAY;QAC3C,6DAA6D;QAC7D,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,CAAA;IACxB,CAAC;IAEQ,iBAAiB,CAAC,KAAY,EAAE,SAAoB;QAC5D,2DAA2D;QAC3D,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,CAAA;IAChC,CAAC;IAEQ,MAAM;QACd,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;YACrB,wCAAwC;YACxC,OAAO,CACN,CAAC,cAAc,CACd,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CACxB,KAAK,CAAC,CAAC;oBACN,CAAC,MAAM,CACN,IAAI,CAAC,SAAS,CACd,GAAG,CAAC,SAAS,CACb,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CACxC;;MACD,EAAE,MAAM,CAAC;iBACT,CAAC,EACD,CACF,CAAA;SACD;QACD,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAA;IAC3B,CAAC;CACD;AAOD,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC7D,KAAK,EACL,KAAK,GACL,EAAE,EAAE;IACJ,OAAO,CACN,CAAC,MAAM,CACN,MAAM,CAAC,OAAO,CACd,KAAK,CAAC,8BAA8B,CACpC,QAAQ,CAAC,CACR,CAAC,SAAS,CAAC,MAAM,CAChB;KAAA,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC,CAClD;MAAA,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CACrD;OAAA,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CACtC;QAAA,CAAC,KAAK,CAAC,KAAK,CACb;OAAA,EAAE,UAAU,CAAC,IAAI,CAClB;MAAA,EAAE,QAAQ,CAAC,KAAK,CACjB;KAAA,EAAE,QAAQ,CACX;IAAA,EAAE,SAAS,CAAC,CACZ,CACD,KAAK,CAAC,CAAC,KAAK,CAAC,EACZ,CACF,CAAA;AACF,CAAC,CAAA"}
@@ -1,9 +1,9 @@
1
- import React from 'react';
2
- /**
3
- * A simple UI loader.
4
- */
5
- declare const Loader: ({ loading, children, }: {
6
- loading: boolean;
7
- children?: React.ReactNode;
8
- }) => JSX.Element;
9
- export default Loader;
1
+ import React from 'react';
2
+ /**
3
+ * A simple UI loader.
4
+ */
5
+ declare const Loader: ({ loading, children, }: {
6
+ loading: boolean;
7
+ children?: React.ReactNode;
8
+ }) => JSX.Element;
9
+ export default Loader;
@@ -1,13 +1,13 @@
1
- /*
2
- * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
- */
4
- import React from 'react';
5
- import { LoadingSpinner } from './LoadingSpinner';
6
- /**
7
- * A simple UI loader.
8
- */
9
- const Loader = ({ loading, children, }) => {
10
- return loading ? React.createElement(LoadingSpinner, null) : React.createElement(React.Fragment, null, children);
11
- };
12
- export default Loader;
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ import React from 'react';
5
+ import { LoadingSpinner } from './LoadingSpinner';
6
+ /**
7
+ * A simple UI loader.
8
+ */
9
+ const Loader = ({ loading, children, }) => {
10
+ return loading ? React.createElement(LoadingSpinner, null) : React.createElement(React.Fragment, null, children);
11
+ };
12
+ export default Loader;
13
13
  //# sourceMappingURL=Loader.js.map
@@ -0,0 +1,13 @@
1
+ /*
2
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
3
+ */
4
+ import React from 'react';
5
+ import { LoadingSpinner } from './LoadingSpinner';
6
+ /**
7
+ * A simple UI loader.
8
+ */
9
+ const Loader = ({ loading, children, }) => {
10
+ return loading ? <LoadingSpinner /> : <>{children}</>;
11
+ };
12
+ export default Loader;
13
+ //# sourceMappingURL=Loader.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Loader.jsx","sourceRoot":"","sources":["../../../src/react/components/Loader.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD;;GAEG;AACH,MAAM,MAAM,GAAG,CAAC,EACf,OAAO,EACP,QAAQ,GAIR,EAAe,EAAE;IACjB,OAAO,OAAO,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,AAAD,EAAG,CAAC,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAA;AACtD,CAAC,CAAA;AAED,eAAe,MAAM,CAAA"}
@@ -1,2 +1,2 @@
1
- import React from 'react';
2
- export declare const LoadingSpinner: React.FC;
1
+ import React from 'react';
2
+ export declare const LoadingSpinner: React.FC;