@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,20 +1,20 @@
1
- import { HRef } from 'haystack-core';
2
- import React from 'react';
3
- export interface RecordImageProps {
4
- /**
5
- * Ref of the image bin record.
6
- */
7
- imageRef?: HRef;
8
- /**
9
- * Fallback component to be displayed if the imageRef is not valid or the image is not found.
10
- */
11
- fallbackComponent?: React.ReactElement;
12
- /**
13
- * Props for img customization
14
- */
15
- imgProps?: Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, 'src'>;
16
- }
17
- /**
18
- * Displays an image from a bin record or a fallback if the given imageRef is not valid or if the image can't be found.
19
- */
20
- export declare const RecordImage: ({ imageRef, fallbackComponent, imgProps, }: RecordImageProps) => React.JSX.Element;
1
+ import { HRef } from 'haystack-core';
2
+ import React from 'react';
3
+ export interface RecordImageProps {
4
+ /**
5
+ * Ref of the image bin record.
6
+ */
7
+ imageRef?: HRef;
8
+ /**
9
+ * Fallback component to be displayed if the imageRef is not valid or the image is not found.
10
+ */
11
+ fallbackComponent?: React.ReactElement;
12
+ /**
13
+ * Props for img customization
14
+ */
15
+ imgProps?: Omit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, 'src'>;
16
+ }
17
+ /**
18
+ * Displays an image from a bin record or a fallback if the given imageRef is not valid or if the image can't be found.
19
+ */
20
+ export declare const RecordImage: ({ imageRef, fallbackComponent, imgProps, }: RecordImageProps) => JSX.Element;
@@ -1,52 +1,52 @@
1
- "use strict";
2
- /*
3
- * Copyright (c) 2023, J2 Innovations. All Rights Reserved
4
- */
5
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
6
- if (k2 === undefined) k2 = k;
7
- var desc = Object.getOwnPropertyDescriptor(m, k);
8
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
9
- desc = { enumerable: true, get: function() { return m[k]; } };
10
- }
11
- Object.defineProperty(o, k2, desc);
12
- }) : (function(o, m, k, k2) {
13
- if (k2 === undefined) k2 = k;
14
- o[k2] = m[k];
15
- }));
16
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
17
- Object.defineProperty(o, "default", { enumerable: true, value: v });
18
- }) : function(o, v) {
19
- o["default"] = v;
20
- });
21
- var __importStar = (this && this.__importStar) || function (mod) {
22
- if (mod && mod.__esModule) return mod;
23
- var result = {};
24
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
25
- __setModuleDefault(result, mod);
26
- return result;
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- exports.RecordImage = void 0;
30
- const react_1 = __importStar(require("react"));
31
- const useFin5BinUrl_1 = require("../hooks/useFin5BinUrl");
32
- /**
33
- * Displays an image from a bin record or a fallback if the given imageRef is not valid or if the image can't be found.
34
- */
35
- const RecordImage = ({ imageRef, fallbackComponent, imgProps, }) => {
36
- const imgUrl = (0, useFin5BinUrl_1.useFin5BinUrl)(imageRef);
37
- // State used to identify whether there is an error in loading the image, to display the fallback component if necessary
38
- const [hasImage, setHasImage] = (0, react_1.useState)(true);
39
- const shouldDisplayFallback = !!fallbackComponent && (!hasImage || !imgUrl);
40
- if (shouldDisplayFallback) {
41
- return fallbackComponent;
42
- }
43
- else {
44
- return (react_1.default.createElement("img", { ...imgProps, onError: (event) => {
45
- // This will happen if the resource is not found for some reason
46
- setHasImage(false);
47
- imgProps?.onError?.(event);
48
- }, src: imgUrl }));
49
- }
50
- };
51
- exports.RecordImage = RecordImage;
1
+ "use strict";
2
+ /*
3
+ * Copyright (c) 2023, J2 Innovations. All Rights Reserved
4
+ */
5
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ var desc = Object.getOwnPropertyDescriptor(m, k);
8
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
9
+ desc = { enumerable: true, get: function() { return m[k]; } };
10
+ }
11
+ Object.defineProperty(o, k2, desc);
12
+ }) : (function(o, m, k, k2) {
13
+ if (k2 === undefined) k2 = k;
14
+ o[k2] = m[k];
15
+ }));
16
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
17
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
18
+ }) : function(o, v) {
19
+ o["default"] = v;
20
+ });
21
+ var __importStar = (this && this.__importStar) || function (mod) {
22
+ if (mod && mod.__esModule) return mod;
23
+ var result = {};
24
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
25
+ __setModuleDefault(result, mod);
26
+ return result;
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ exports.RecordImage = void 0;
30
+ const react_1 = __importStar(require("react"));
31
+ const useFin5BinUrl_1 = require("../hooks/useFin5BinUrl");
32
+ /**
33
+ * Displays an image from a bin record or a fallback if the given imageRef is not valid or if the image can't be found.
34
+ */
35
+ const RecordImage = ({ imageRef, fallbackComponent, imgProps, }) => {
36
+ const imgUrl = (0, useFin5BinUrl_1.useFin5BinUrl)(imageRef);
37
+ // State used to identify whether there is an error in loading the image, to display the fallback component if necessary
38
+ const [hasImage, setHasImage] = (0, react_1.useState)(true);
39
+ const shouldDisplayFallback = !!fallbackComponent && (!hasImage || !imgUrl);
40
+ if (shouldDisplayFallback) {
41
+ return fallbackComponent;
42
+ }
43
+ else {
44
+ return (react_1.default.createElement("img", { ...imgProps, onError: (event) => {
45
+ // This will happen if the resource is not found for some reason
46
+ setHasImage(false);
47
+ imgProps?.onError?.(event);
48
+ }, src: imgUrl }));
49
+ }
50
+ };
51
+ exports.RecordImage = RecordImage;
52
52
  //# sourceMappingURL=RecordImage.js.map
@@ -1,25 +1,25 @@
1
- import React from 'react';
2
- interface QRCodeProps {
3
- /**
4
- * The value the QR code holds (can be an URI or a plain string)
5
- */
6
- value: string;
7
- /**
8
- * True to show a link to copy QR code to clipboard, false otherwise.
9
- * @default true
10
- */
11
- copyable?: boolean;
12
- /**
13
- * The text of the link to copy the QR code to clipboard.
14
- * @default 'Copy QR code to clipboard'
15
- */
16
- copyText?: string;
17
- /**
18
- * The size of the QR code in pixels.
19
- * @default 350
20
- */
21
- size?: number;
22
- className?: string;
23
- }
24
- export declare const QRCode: React.FC<QRCodeProps>;
25
- export {};
1
+ import React from 'react';
2
+ interface QRCodeProps {
3
+ /**
4
+ * The value the QR code holds (can be an URI or a plain string)
5
+ */
6
+ value: string;
7
+ /**
8
+ * True to show a link to copy QR code to clipboard, false otherwise.
9
+ * @default true
10
+ */
11
+ copyable?: boolean;
12
+ /**
13
+ * The text of the link to copy the QR code to clipboard.
14
+ * @default 'Copy QR code to clipboard'
15
+ */
16
+ copyText?: string;
17
+ /**
18
+ * The size of the QR code in pixels.
19
+ * @default 350
20
+ */
21
+ size?: number;
22
+ className?: string;
23
+ }
24
+ export declare const QRCode: React.FC<QRCodeProps>;
25
+ export {};
@@ -1,83 +1,83 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- var __importDefault = (this && this.__importDefault) || function (mod) {
26
- return (mod && mod.__esModule) ? mod : { "default": mod };
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- exports.QRCode = void 0;
30
- const ui_1 = require("@j2inn/ui");
31
- const classnames_1 = __importDefault(require("classnames"));
32
- const qrious_1 = __importDefault(require("qrious"));
33
- const react_1 = __importStar(require("react"));
34
- const react_jss_1 = require("react-jss");
35
- const useStyles = (0, react_jss_1.createUseStyles)({
36
- qrCode: {
37
- display: 'flex',
38
- flexDirection: 'column',
39
- [`& .${ui_1.ant_prefix}-typography`]: {
40
- textAlign: 'center',
41
- paddingBottom: '0.5em',
42
- },
43
- },
44
- });
45
- const QRCode = ({ value, size = 350, copyable = true, copyText = 'Copy QR code to clipboard', className, }) => {
46
- const classes = useStyles();
47
- const canvasRef = (0, react_1.useRef)(null);
48
- const [qrCode, setQrCode] = (0, react_1.useState)();
49
- (0, react_1.useLayoutEffect)(() => {
50
- if (canvasRef.current) {
51
- setQrCode(new qrious_1.default({
52
- element: canvasRef.current,
53
- value,
54
- size,
55
- }));
56
- }
57
- }, [value, canvasRef.current]);
58
- (0, react_1.useEffect)(() => {
59
- if (qrCode && qrCode.size !== size) {
60
- qrCode.size = size;
61
- }
62
- }, [size]);
63
- const copyQrCodeToClipboard = (0, react_1.useCallback)(async () => {
64
- if (canvasRef.current) {
65
- await canvasRef.current.toBlob((blob) => {
66
- if (blob) {
67
- navigator.clipboard.write([
68
- new ClipboardItem({
69
- 'image/png': blob,
70
- }),
71
- ]);
72
- }
73
- });
74
- }
75
- }, [canvasRef.current]);
76
- return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, classes.qrCode) },
77
- copyable && (react_1.default.createElement(ui_1.Typography.Text, { copyable: {
78
- onCopy: () => copyQrCodeToClipboard(),
79
- } }, copyText)),
80
- react_1.default.createElement("canvas", { ref: canvasRef })));
81
- };
82
- exports.QRCode = QRCode;
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ exports.QRCode = void 0;
30
+ const ui_1 = require("@j2inn/ui");
31
+ const classnames_1 = __importDefault(require("classnames"));
32
+ const qrious_1 = __importDefault(require("qrious"));
33
+ const react_1 = __importStar(require("react"));
34
+ const react_jss_1 = require("react-jss");
35
+ const useStyles = (0, react_jss_1.createUseStyles)({
36
+ qrCode: {
37
+ display: 'flex',
38
+ flexDirection: 'column',
39
+ [`& .${ui_1.ant_prefix}-typography`]: {
40
+ textAlign: 'center',
41
+ paddingBottom: '0.5em',
42
+ },
43
+ },
44
+ });
45
+ const QRCode = ({ value, size = 350, copyable = true, copyText = 'Copy QR code to clipboard', className, }) => {
46
+ const classes = useStyles();
47
+ const canvasRef = (0, react_1.useRef)(null);
48
+ const [qrCode, setQrCode] = (0, react_1.useState)();
49
+ (0, react_1.useLayoutEffect)(() => {
50
+ if (canvasRef.current) {
51
+ setQrCode(new qrious_1.default({
52
+ element: canvasRef.current,
53
+ value,
54
+ size,
55
+ }));
56
+ }
57
+ }, [value, canvasRef.current]);
58
+ (0, react_1.useEffect)(() => {
59
+ if (qrCode && qrCode.size !== size) {
60
+ qrCode.size = size;
61
+ }
62
+ }, [size]);
63
+ const copyQrCodeToClipboard = (0, react_1.useCallback)(async () => {
64
+ if (canvasRef.current) {
65
+ await canvasRef.current.toBlob((blob) => {
66
+ if (blob) {
67
+ navigator.clipboard.write([
68
+ new ClipboardItem({
69
+ 'image/png': blob,
70
+ }),
71
+ ]);
72
+ }
73
+ });
74
+ }
75
+ }, [canvasRef.current]);
76
+ return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, classes.qrCode) },
77
+ copyable && (react_1.default.createElement(ui_1.Typography.Text, { copyable: {
78
+ onCopy: () => copyQrCodeToClipboard(),
79
+ } }, copyText)),
80
+ react_1.default.createElement("canvas", { ref: canvasRef })));
81
+ };
82
+ exports.QRCode = QRCode;
83
83
  //# sourceMappingURL=QRCode.js.map