@j2inn/fin5-ui-utils 8.1.1-beta.4 → 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.
- package/README.md +5 -5
- package/dist/fantomProps/createFin5Props/index.d.ts +12 -12
- package/dist/fantomProps/createFin5Props/index.js +146 -146
- package/dist/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
- package/dist/fantomProps/createFin5Props/runCreateFin5Props.js +20 -20
- package/dist/fantomProps/fantomPropsToObject.d.ts +8 -8
- package/dist/fantomProps/fantomPropsToObject.js +183 -183
- package/dist/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
- package/dist/fantomProps/generateJsonFromFantomPropsFile.js +41 -41
- package/dist/fantomProps/localePropsToJson.d.ts +1 -1
- package/dist/fantomProps/localePropsToJson.js +50 -50
- package/dist/fantomProps/readFantomPropsFile.d.ts +5 -5
- package/dist/fantomProps/readFantomPropsFile.js +65 -65
- package/dist/fin5Top/fin5FileUpload.d.ts +24 -24
- package/dist/fin5Top/fin5FileUpload.js +51 -51
- package/dist/fin5Top/fin5Top.d.ts +165 -124
- package/dist/fin5Top/fin5Top.js +61 -53
- package/dist/fin5Top/fin5Top.js.map +1 -1
- package/dist/fin5Top/finEdge2Cloud.d.ts +6 -6
- package/dist/fin5Top/finEdge2Cloud.js +15 -15
- package/dist/fin5Top/getFin5BinUrl.d.ts +2 -2
- package/dist/fin5Top/getFin5BinUrl.js +9 -9
- package/dist/fin5Top/openFin5Alarm.d.ts +22 -22
- package/dist/fin5Top/openFin5Alarm.js +23 -23
- package/dist/fin5Top/openFin5Historian.d.ts +3 -3
- package/dist/fin5Top/openFin5Historian.js +19 -19
- package/dist/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
- package/dist/fin5Top/useFin5AppURLHashParameter.js +133 -133
- package/dist/index.d.ts +35 -35
- package/dist/index.js +69 -69
- package/dist/jobs/jobUtils.d.ts +14 -14
- package/dist/jobs/jobUtils.js +15 -15
- package/dist/react/app/Fin5AppContainer.d.ts +36 -36
- package/dist/react/app/Fin5AppContainer.js +145 -168
- package/dist/react/app/Fin5AppContainer.js.map +1 -1
- package/dist/react/app/Fin5AppRootStore.d.ts +40 -42
- package/dist/react/app/Fin5AppRootStore.js +90 -114
- package/dist/react/app/Fin5AppRootStore.js.map +1 -1
- package/dist/react/components/ErrorBoundary.d.ts +57 -57
- package/dist/react/components/ErrorBoundary.js +150 -150
- package/dist/react/components/ErrorDisplayer.d.ts +19 -19
- package/dist/react/components/ErrorDisplayer.js +36 -36
- package/dist/react/components/Loader.d.ts +9 -9
- package/dist/react/components/Loader.js +17 -17
- package/dist/react/components/LoadingSpinner.d.ts +2 -2
- package/dist/react/components/LoadingSpinner.js +27 -27
- package/dist/react/components/RecordImage.d.ts +20 -20
- package/dist/react/components/RecordImage.js +51 -51
- package/dist/react/components/charts/QRCode.d.ts +25 -25
- package/dist/react/components/charts/QRCode.js +82 -82
- package/dist/react/components/charts/line-bar/Chart.d.ts +166 -166
- package/dist/react/components/charts/line-bar/Chart.js +442 -442
- package/dist/react/components/charts/line-bar/HGridChart.d.ts +58 -58
- package/dist/react/components/charts/line-bar/HGridChart.js +285 -285
- package/dist/react/components/charts/pie/PieChart.d.ts +94 -94
- package/dist/react/components/charts/pie/PieChart.js +204 -204
- package/dist/react/components/charts/pie/SimplePieChart.d.ts +21 -21
- package/dist/react/components/charts/pie/SimplePieChart.js +55 -55
- package/dist/react/components/graphics/GraphicViewer.d.ts +10 -10
- package/dist/react/components/graphics/GraphicViewer.js +29 -29
- package/dist/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
- package/dist/react/components/graphics/GraphicsTabViewer.js +90 -90
- package/dist/react/components/makeCustomElement.d.ts +16 -16
- package/dist/react/components/makeCustomElement.js +150 -150
- package/dist/react/components/navigation/BasicLayout.d.ts +41 -41
- package/dist/react/components/navigation/BasicLayout.js +155 -155
- package/dist/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
- package/dist/react/components/navigation/HeaderSiderLayout.js +110 -110
- package/dist/react/components/navigation/MenuPage.d.ts +37 -37
- package/dist/react/components/navigation/MenuPage.js +36 -36
- package/dist/react/components/navigation/MenuTrigger.d.ts +9 -9
- package/dist/react/components/navigation/MenuTrigger.js +33 -33
- package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
- package/dist/react/components/navigation/ReactRouterHeaderSiderLayout.js +25 -25
- package/dist/react/components/navigation/ReactRouterLayout.d.ts +46 -46
- package/dist/react/components/navigation/ReactRouterLayout.js +132 -132
- package/dist/react/components/navigation/customRouting/Router.d.ts +12 -12
- package/dist/react/components/navigation/customRouting/Router.js +45 -45
- package/dist/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
- package/dist/react/components/navigation/customRouting/RouterLayout.js +61 -61
- package/dist/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
- package/dist/react/components/resolvable/configurationForm/ConfigurationForm.js +95 -95
- package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
- package/dist/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +88 -88
- package/dist/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
- package/dist/react/components/resolvable/configurationForm/getSectionDefault.js +99 -99
- package/dist/react/hooks/useFin5BinUrl.d.ts +6 -6
- package/dist/react/hooks/useFin5BinUrl.js +15 -15
- package/dist/react/hooks/useFin5ColorScheme.d.ts +2 -2
- package/dist/react/hooks/useFin5ColorScheme.js +56 -56
- package/dist/react/hooks/useScreenSize.d.ts +7 -7
- package/dist/react/hooks/useScreenSize.js +31 -31
- package/dist_es/fantomProps/createFin5Props/index.d.ts +12 -12
- package/dist_es/fantomProps/createFin5Props/index.js +140 -140
- package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.d.ts +2 -2
- package/dist_es/fantomProps/createFin5Props/runCreateFin5Props.js +15 -15
- package/dist_es/fantomProps/fantomPropsToObject.d.ts +8 -8
- package/dist_es/fantomProps/fantomPropsToObject.js +178 -178
- package/dist_es/fantomProps/generateJsonFromFantomPropsFile.d.ts +4 -4
- package/dist_es/fantomProps/generateJsonFromFantomPropsFile.js +12 -12
- package/dist_es/fantomProps/localePropsToJson.d.ts +1 -1
- package/dist_es/fantomProps/localePropsToJson.js +21 -21
- package/dist_es/fantomProps/readFantomPropsFile.d.ts +5 -5
- package/dist_es/fantomProps/readFantomPropsFile.js +39 -39
- package/dist_es/fin5Top/fin5FileUpload.d.ts +24 -24
- package/dist_es/fin5Top/fin5FileUpload.js +47 -47
- package/dist_es/fin5Top/fin5Top.d.ts +165 -124
- package/dist_es/fin5Top/fin5Top.js +57 -49
- package/dist_es/fin5Top/fin5Top.js.map +1 -1
- package/dist_es/fin5Top/finEdge2Cloud.d.ts +6 -6
- package/dist_es/fin5Top/finEdge2Cloud.js +11 -11
- package/dist_es/fin5Top/getFin5BinUrl.d.ts +2 -2
- package/dist_es/fin5Top/getFin5BinUrl.js +5 -5
- package/dist_es/fin5Top/openFin5Alarm.d.ts +22 -22
- package/dist_es/fin5Top/openFin5Alarm.js +19 -19
- package/dist_es/fin5Top/openFin5Historian.d.ts +3 -3
- package/dist_es/fin5Top/openFin5Historian.js +15 -15
- package/dist_es/fin5Top/useFin5AppURLHashParameter.d.ts +18 -18
- package/dist_es/fin5Top/useFin5AppURLHashParameter.js +124 -124
- package/dist_es/index.d.ts +35 -35
- package/dist_es/index.js +53 -53
- package/dist_es/jobs/jobUtils.d.ts +14 -14
- package/dist_es/jobs/jobUtils.js +9 -9
- package/dist_es/react/app/Fin5AppContainer.d.ts +36 -36
- package/dist_es/react/app/Fin5AppContainer.js +116 -139
- package/dist_es/react/app/Fin5AppContainer.js.map +1 -1
- package/dist_es/react/app/Fin5AppContainer.jsx +82 -0
- package/dist_es/react/app/Fin5AppContainer.jsx.map +1 -0
- package/dist_es/react/app/Fin5AppRootStore.d.ts +40 -42
- package/dist_es/react/app/Fin5AppRootStore.js +86 -110
- package/dist_es/react/app/Fin5AppRootStore.js.map +1 -1
- package/dist_es/react/components/ErrorBoundary.d.ts +57 -57
- package/dist_es/react/components/ErrorBoundary.js +123 -123
- package/dist_es/react/components/ErrorBoundary.jsx +150 -0
- package/dist_es/react/components/ErrorBoundary.jsx.map +1 -0
- package/dist_es/react/components/ErrorDisplayer.d.ts +19 -19
- package/dist_es/react/components/ErrorDisplayer.js +28 -28
- package/dist_es/react/components/ErrorDisplayer.jsx +36 -0
- package/dist_es/react/components/ErrorDisplayer.jsx.map +1 -0
- package/dist_es/react/components/Loader.d.ts +9 -9
- package/dist_es/react/components/Loader.js +12 -12
- package/dist_es/react/components/Loader.jsx +13 -0
- package/dist_es/react/components/Loader.jsx.map +1 -0
- package/dist_es/react/components/LoadingSpinner.d.ts +2 -2
- package/dist_es/react/components/LoadingSpinner.js +20 -20
- package/dist_es/react/components/LoadingSpinner.jsx +22 -0
- package/dist_es/react/components/LoadingSpinner.jsx.map +1 -0
- package/dist_es/react/components/RecordImage.d.ts +20 -20
- package/dist_es/react/components/RecordImage.js +24 -24
- package/dist_es/react/components/charts/QRCode.d.ts +25 -25
- package/dist_es/react/components/charts/QRCode.js +52 -52
- package/dist_es/react/components/charts/line-bar/Chart.d.ts +166 -166
- package/dist_es/react/components/charts/line-bar/Chart.js +415 -415
- package/dist_es/react/components/charts/line-bar/HGridChart.d.ts +58 -58
- package/dist_es/react/components/charts/line-bar/HGridChart.js +250 -250
- package/dist_es/react/components/charts/line-bar/ZincGridChart.d.ts +12 -0
- package/dist_es/react/components/charts/line-bar/ZincGridChart.js +17 -0
- package/dist_es/react/components/charts/line-bar/ZincGridChart.js.map +1 -0
- package/dist_es/react/components/charts/pie/PieChart.d.ts +94 -94
- package/dist_es/react/components/charts/pie/PieChart.js +177 -177
- package/dist_es/react/components/charts/pie/SimplePieChart.d.ts +21 -21
- package/dist_es/react/components/charts/pie/SimplePieChart.js +25 -25
- package/dist_es/react/components/graphics/GraphicViewer.d.ts +10 -10
- package/dist_es/react/components/graphics/GraphicViewer.js +22 -22
- package/dist_es/react/components/graphics/GraphicViewer.jsx +23 -0
- package/dist_es/react/components/graphics/GraphicViewer.jsx.map +1 -0
- package/dist_es/react/components/graphics/GraphicsTabViewer.d.ts +17 -17
- package/dist_es/react/components/graphics/GraphicsTabViewer.js +60 -60
- package/dist_es/react/components/graphics/GraphicsTabViewer.jsx +63 -0
- package/dist_es/react/components/graphics/GraphicsTabViewer.jsx.map +1 -0
- package/dist_es/react/components/makeCustomElement.d.ts +16 -16
- package/dist_es/react/components/makeCustomElement.js +142 -142
- package/dist_es/react/components/navigation/BasicLayout.d.ts +41 -41
- package/dist_es/react/components/navigation/BasicLayout.js +124 -124
- package/dist_es/react/components/navigation/BasicLayout.jsx +133 -0
- package/dist_es/react/components/navigation/BasicLayout.jsx.map +1 -0
- package/dist_es/react/components/navigation/HeaderSiderLayout.d.ts +13 -13
- package/dist_es/react/components/navigation/HeaderSiderLayout.js +80 -80
- package/dist_es/react/components/navigation/MenuPage.d.ts +37 -37
- package/dist_es/react/components/navigation/MenuPage.js +30 -30
- package/dist_es/react/components/navigation/MenuPage.jsx +31 -0
- package/dist_es/react/components/navigation/MenuPage.jsx.map +1 -0
- package/dist_es/react/components/navigation/MenuTrigger.d.ts +9 -9
- package/dist_es/react/components/navigation/MenuTrigger.js +28 -28
- package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.d.ts +11 -11
- package/dist_es/react/components/navigation/ReactRouterHeaderSiderLayout.js +18 -18
- package/dist_es/react/components/navigation/ReactRouterLayout.d.ts +46 -46
- package/dist_es/react/components/navigation/ReactRouterLayout.js +99 -99
- package/dist_es/react/components/navigation/Router.d.ts +12 -0
- package/dist_es/react/components/navigation/Router.js +19 -0
- package/dist_es/react/components/navigation/Router.js.map +1 -0
- package/dist_es/react/components/navigation/Router.jsx +19 -0
- package/dist_es/react/components/navigation/Router.jsx.map +1 -0
- package/dist_es/react/components/navigation/customRouting/Router.d.ts +12 -12
- package/dist_es/react/components/navigation/customRouting/Router.js +18 -18
- package/dist_es/react/components/navigation/customRouting/RouterLayout.d.ts +11 -11
- package/dist_es/react/components/navigation/customRouting/RouterLayout.js +34 -34
- package/dist_es/react/components/navigation/react-router/BasicLayout.d.ts +23 -0
- package/dist_es/react/components/navigation/react-router/BasicLayout.js +82 -0
- package/dist_es/react/components/navigation/react-router/BasicLayout.js.map +1 -0
- package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.d.ts +24 -0
- package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js +82 -0
- package/dist_es/react/components/navigation/react-router/ReactRouterBasicLayout.js.map +1 -0
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.d.ts +27 -27
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationForm.js +64 -64
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.d.ts +16 -16
- package/dist_es/react/components/resolvable/configurationForm/ConfigurationFormEntry.js +58 -58
- package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.d.ts +16 -16
- package/dist_es/react/components/resolvable/configurationForm/getSectionDefault.js +94 -94
- package/dist_es/react/hooks/useFin5BinUrl.d.ts +6 -6
- package/dist_es/react/hooks/useFin5BinUrl.js +11 -11
- package/dist_es/react/hooks/useFin5ColorScheme.d.ts +2 -2
- package/dist_es/react/hooks/useFin5ColorScheme.js +52 -52
- package/dist_es/react/hooks/useScreenSize.d.ts +7 -7
- package/dist_es/react/hooks/useScreenSize.js +27 -27
- package/package.json +1 -1
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
/*
|
|
3
|
-
* Copyright (c) 2022, J2 Innovations. All Rights Reserved
|
|
4
|
-
*/
|
|
5
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
6
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
7
|
-
};
|
|
8
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
9
|
-
exports.LoadingSpinner = void 0;
|
|
10
|
-
const ui_1 = require("@j2inn/ui");
|
|
11
|
-
const react_1 = __importDefault(require("react"));
|
|
12
|
-
const react_jss_1 = require("react-jss");
|
|
13
|
-
const useStyles = (0, react_jss_1.createUseStyles)({
|
|
14
|
-
container: {
|
|
15
|
-
display: 'flex',
|
|
16
|
-
alignItems: 'center',
|
|
17
|
-
justifyContent: 'center',
|
|
18
|
-
height: '100%',
|
|
19
|
-
width: '100%',
|
|
20
|
-
},
|
|
21
|
-
});
|
|
22
|
-
const LoadingSpinner = () => {
|
|
23
|
-
const classes = useStyles();
|
|
24
|
-
return (react_1.default.createElement("div", { className: classes.container },
|
|
25
|
-
react_1.default.createElement(ui_1.Spin, { size: 'large' })));
|
|
26
|
-
};
|
|
27
|
-
exports.LoadingSpinner = LoadingSpinner;
|
|
1
|
+
"use strict";
|
|
2
|
+
/*
|
|
3
|
+
* Copyright (c) 2022, J2 Innovations. All Rights Reserved
|
|
4
|
+
*/
|
|
5
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
6
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
7
|
+
};
|
|
8
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
9
|
+
exports.LoadingSpinner = void 0;
|
|
10
|
+
const ui_1 = require("@j2inn/ui");
|
|
11
|
+
const react_1 = __importDefault(require("react"));
|
|
12
|
+
const react_jss_1 = require("react-jss");
|
|
13
|
+
const useStyles = (0, react_jss_1.createUseStyles)({
|
|
14
|
+
container: {
|
|
15
|
+
display: 'flex',
|
|
16
|
+
alignItems: 'center',
|
|
17
|
+
justifyContent: 'center',
|
|
18
|
+
height: '100%',
|
|
19
|
+
width: '100%',
|
|
20
|
+
},
|
|
21
|
+
});
|
|
22
|
+
const LoadingSpinner = () => {
|
|
23
|
+
const classes = useStyles();
|
|
24
|
+
return (react_1.default.createElement("div", { className: classes.container },
|
|
25
|
+
react_1.default.createElement(ui_1.Spin, { size: 'large' })));
|
|
26
|
+
};
|
|
27
|
+
exports.LoadingSpinner = LoadingSpinner;
|
|
28
28
|
//# sourceMappingURL=LoadingSpinner.js.map
|
|
@@ -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) =>
|
|
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
|