@oneblink/apps-react 8.12.0-beta.3 → 8.12.0-beta.4
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/dist/components/ImageCropper/CropModal.js +12 -3
- package/dist/components/ImageCropper/CropModal.js.map +1 -1
- package/dist/components/ImageCropper/resource-components.d.ts +9 -0
- package/dist/components/ImageCropper/resource-components.js +95 -1
- package/dist/components/ImageCropper/resource-components.js.map +1 -1
- package/dist/hooks/useFormElementOptions.js +2 -1
- package/dist/hooks/useFormElementOptions.js.map +1 -1
- package/dist/services/injectableOptions.d.ts +3 -2
- package/dist/services/injectableOptions.js +11 -4
- package/dist/services/injectableOptions.js.map +1 -1
- package/dist/styles/modal.scss +2 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
@@ -1,6 +1,7 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import ImageCropper from '.';
|
2
|
+
import ImageCropper, { getAspectRatio } from '.';
|
3
3
|
import scrollingService from '../../services/scrolling-service';
|
4
|
+
import { AspectRatioButton, availableAspectRatios, } from './resource-components';
|
4
5
|
function CropModal({ imageSrc, onClose, onSave, }) {
|
5
6
|
const [croppedAreaPixels, setCroppedAreaPixels] = React.useState(null);
|
6
7
|
const handleSaveCrop = React.useCallback(async () => {
|
@@ -14,11 +15,19 @@ function CropModal({ imageSrc, onClose, onSave, }) {
|
|
14
15
|
scrollingService.enableScrolling();
|
15
16
|
};
|
16
17
|
}, []);
|
18
|
+
const [selectedAspectRatio, setSelectedAspectRatio] = React.useState(availableAspectRatios[0]);
|
19
|
+
const aspectRatio = React.useMemo(() => getAspectRatio({
|
20
|
+
width: selectedAspectRatio.width,
|
21
|
+
height: selectedAspectRatio.height,
|
22
|
+
}), [selectedAspectRatio]);
|
17
23
|
return (React.createElement("div", { className: "modal is-active" },
|
18
24
|
React.createElement("div", { className: "modal-background-faded" }),
|
19
25
|
React.createElement("div", { className: "ob-crop ob-border-radius" },
|
20
|
-
React.createElement("div", { className: "ob-crop__content ob-border-radius"
|
21
|
-
|
26
|
+
React.createElement("div", { className: "ob-crop__content ob-border-radius",
|
27
|
+
// TODO: Put in css file if Blake gives the ok for this implementation
|
28
|
+
style: { display: 'flex', flexDirection: 'column', gap: 8 } },
|
29
|
+
React.createElement(ImageCropper, { imgSrc: imageSrc, onCropComplete: setCroppedAreaPixels, outputAspectRatio: aspectRatio }),
|
30
|
+
React.createElement(AspectRatioButton, { onSelectAspectRatio: setSelectedAspectRatio, selectedAspectRatio: selectedAspectRatio })),
|
22
31
|
React.createElement("div", { className: "ob-annotation__buttons ob-annotation__buttons-actions" },
|
23
32
|
React.createElement("button", { type: "button", className: "button is-light ob-button ob-annotation__button ob-annotation__button-action cypress-crop-cancel-button", onClick: onClose }, "Cancel"),
|
24
33
|
React.createElement("button", { type: "button", className: "button is-primary ob-button ob-annotation__button ob-annotation__button-action cypress-crop-save-button", disabled: !croppedAreaPixels, onClick: handleSaveCrop }, "Save")))));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"CropModal.js","sourceRoot":"","sources":["../../../src/components/ImageCropper/CropModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,YAAY,MAAM,GAAG,CAAA;
|
1
|
+
{"version":3,"file":"CropModal.js","sourceRoot":"","sources":["../../../src/components/ImageCropper/CropModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,YAAY,EAAE,EAAE,cAAc,EAAE,MAAM,GAAG,CAAA;AAEhD,OAAO,gBAAgB,MAAM,kCAAkC,CAAA;AAC/D,OAAO,EACL,iBAAiB,EACjB,qBAAqB,GAEtB,MAAM,uBAAuB,CAAA;AAE9B,SAAS,SAAS,CAAC,EACjB,QAAQ,EACR,OAAO,EACP,MAAM,GAKP;IACC,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAC9D,IAAI,CACL,CAAA;IAED,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAClD,IAAI,CAAC,iBAAiB;YAAE,OAAM;QAE9B,MAAM,CAAC,iBAAiB,CAAC,CAAA;IAC3B,CAAC,EAAE,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC,CAAA;IAE/B,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,gBAAgB,CAAC,gBAAgB,EAAE,CAAA;QAEnC,OAAO,GAAG,EAAE;YACV,gBAAgB,CAAC,eAAe,EAAE,CAAA;QACpC,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GACjD,KAAK,CAAC,QAAQ,CAAc,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAA;IAEvD,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAC/B,GAAG,EAAE,CACH,cAAc,CAAC;QACb,KAAK,EAAE,mBAAmB,CAAC,KAAK;QAChC,MAAM,EAAE,mBAAmB,CAAC,MAAM;KACnC,CAAC,EACJ,CAAC,mBAAmB,CAAC,CACtB,CAAA;IACD,OAAO,CACL,6BAAK,SAAS,EAAC,iBAAiB;QAC9B,6BAAK,SAAS,EAAC,wBAAwB,GAAO;QAC9C,6BAAK,SAAS,EAAC,0BAA0B;YACvC,6BACE,SAAS,EAAC,mCAAmC;gBAC7C,sEAAsE;gBACtE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE;gBAE3D,oBAAC,YAAY,IACX,MAAM,EAAE,QAAQ,EAChB,cAAc,EAAE,oBAAoB,EACpC,iBAAiB,EAAE,WAAW,GAC9B;gBACF,oBAAC,iBAAiB,IAChB,mBAAmB,EAAE,sBAAsB,EAC3C,mBAAmB,EAAE,mBAAmB,GACxC,CACE;YACN,6BAAK,SAAS,EAAC,uDAAuD;gBACpE,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,yGAAyG,EACnH,OAAO,EAAE,OAAO,aAGT;gBACT,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,yGAAyG,EACnH,QAAQ,EAAE,CAAC,iBAAiB,EAC5B,OAAO,EAAE,cAAc,WAGhB,CACL,CACF,CACF,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport ImageCropper, { getAspectRatio } from '.'\nimport { Area } from 'react-easy-crop'\nimport scrollingService from '../../services/scrolling-service'\nimport {\n AspectRatioButton,\n availableAspectRatios,\n AspectRatio,\n} from './resource-components'\n\nfunction CropModal({\n imageSrc,\n onClose,\n onSave,\n}: {\n imageSrc: string\n onClose: () => void\n onSave: (imageArea: Area) => void\n}) {\n const [croppedAreaPixels, setCroppedAreaPixels] = React.useState<Area | null>(\n null,\n )\n\n const handleSaveCrop = React.useCallback(async () => {\n if (!croppedAreaPixels) return\n\n onSave(croppedAreaPixels)\n }, [croppedAreaPixels, onSave])\n\n React.useEffect(() => {\n scrollingService.disableScrolling()\n\n return () => {\n scrollingService.enableScrolling()\n }\n }, [])\n\n const [selectedAspectRatio, setSelectedAspectRatio] =\n React.useState<AspectRatio>(availableAspectRatios[0])\n\n const aspectRatio = React.useMemo(\n () =>\n getAspectRatio({\n width: selectedAspectRatio.width,\n height: selectedAspectRatio.height,\n }),\n [selectedAspectRatio],\n )\n return (\n <div className=\"modal is-active\">\n <div className=\"modal-background-faded\"></div>\n <div className=\"ob-crop ob-border-radius\">\n <div\n className=\"ob-crop__content ob-border-radius\"\n // TODO: Put in css file if Blake gives the ok for this implementation\n style={{ display: 'flex', flexDirection: 'column', gap: 8 }}\n >\n <ImageCropper\n imgSrc={imageSrc}\n onCropComplete={setCroppedAreaPixels}\n outputAspectRatio={aspectRatio}\n />\n <AspectRatioButton\n onSelectAspectRatio={setSelectedAspectRatio}\n selectedAspectRatio={selectedAspectRatio}\n />\n </div>\n <div className=\"ob-annotation__buttons ob-annotation__buttons-actions\">\n <button\n type=\"button\"\n className=\"button is-light ob-button ob-annotation__button ob-annotation__button-action cypress-crop-cancel-button\"\n onClick={onClose}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className=\"button is-primary ob-button ob-annotation__button ob-annotation__button-action cypress-crop-save-button\"\n disabled={!croppedAreaPixels}\n onClick={handleSaveCrop}\n >\n Save\n </button>\n </div>\n </div>\n </div>\n )\n}\n\nexport default React.memo(CropModal)\n"]}
|
@@ -8,3 +8,12 @@ export declare const ZoomSlider: ({ value, disabled, setValue, }: {
|
|
8
8
|
disabled?: boolean;
|
9
9
|
setValue: (value: number) => void;
|
10
10
|
}) => React.JSX.Element;
|
11
|
+
export interface AspectRatio {
|
12
|
+
width: number;
|
13
|
+
height: number;
|
14
|
+
}
|
15
|
+
export declare const availableAspectRatios: AspectRatio[];
|
16
|
+
export declare const AspectRatioButton: ({ selectedAspectRatio, onSelectAspectRatio, }: {
|
17
|
+
selectedAspectRatio: AspectRatio;
|
18
|
+
onSelectAspectRatio: (aspectRatio: AspectRatio) => void;
|
19
|
+
}) => React.JSX.Element;
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { styled, Stack, IconButton, Slider } from '@mui/material';
|
1
|
+
import { styled, Stack, IconButton, Slider, Box, Menu, MenuItem, Typography, } from '@mui/material';
|
2
2
|
import MaterialIcon from '../MaterialIcon';
|
3
3
|
import * as React from 'react';
|
4
4
|
export const CropContainer = styled('div', {
|
@@ -27,4 +27,98 @@ export const ZoomSlider = ({ value, disabled = false, setValue, }) => {
|
|
27
27
|
}, className: "ob-cropper__zoom-slider-plus-button" },
|
28
28
|
React.createElement(MaterialIcon, null, "add"))));
|
29
29
|
};
|
30
|
+
export const availableAspectRatios = [
|
31
|
+
{
|
32
|
+
width: 21,
|
33
|
+
height: 9,
|
34
|
+
},
|
35
|
+
{
|
36
|
+
width: 16,
|
37
|
+
height: 9,
|
38
|
+
},
|
39
|
+
{
|
40
|
+
width: 16,
|
41
|
+
height: 10,
|
42
|
+
},
|
43
|
+
{
|
44
|
+
width: 3,
|
45
|
+
height: 2,
|
46
|
+
},
|
47
|
+
{
|
48
|
+
width: 4,
|
49
|
+
height: 3,
|
50
|
+
},
|
51
|
+
{
|
52
|
+
width: 5,
|
53
|
+
height: 4,
|
54
|
+
},
|
55
|
+
{
|
56
|
+
width: 1,
|
57
|
+
height: 1,
|
58
|
+
},
|
59
|
+
{
|
60
|
+
width: 4,
|
61
|
+
height: 5,
|
62
|
+
},
|
63
|
+
{
|
64
|
+
width: 9,
|
65
|
+
height: 16,
|
66
|
+
},
|
67
|
+
];
|
68
|
+
export const AspectRatioButton = ({ selectedAspectRatio, onSelectAspectRatio, }) => {
|
69
|
+
const [anchorEl, setAnchorEl] = React.useState(null);
|
70
|
+
// TODO: Don't just use MUI for everything here if Blake gives the ok for this implementation
|
71
|
+
// TODO: Put styling in css files if Blake gives the ok for this implementation
|
72
|
+
return (React.createElement(Box, { display: "flex", alignItems: "center", gap: 1 },
|
73
|
+
React.createElement(Typography, { variant: "body1" }, "Aspect Ratio"),
|
74
|
+
React.createElement("button", { type: "button", className: "button ob-button is-outlined", onClick: (e) => setAnchorEl(e.currentTarget) },
|
75
|
+
React.createElement("span", { style: {
|
76
|
+
marginRight: 8,
|
77
|
+
} },
|
78
|
+
selectedAspectRatio.width,
|
79
|
+
":",
|
80
|
+
selectedAspectRatio.height),
|
81
|
+
React.createElement(DrawAspectRatio, { ...selectedAspectRatio })),
|
82
|
+
React.createElement(Menu, { open: !!anchorEl, anchorEl: anchorEl, onClose: () => {
|
83
|
+
setAnchorEl(null);
|
84
|
+
} }, availableAspectRatios.map((aspectRatio) => (React.createElement(MenuItem, { key: `${aspectRatio.width}:${aspectRatio.height}`, onClick: () => {
|
85
|
+
onSelectAspectRatio(aspectRatio);
|
86
|
+
setAnchorEl(null);
|
87
|
+
} },
|
88
|
+
aspectRatio.width,
|
89
|
+
":",
|
90
|
+
aspectRatio.height))))));
|
91
|
+
};
|
92
|
+
const DrawAspectRatio = ({ height, width }) => {
|
93
|
+
const { displayWidth, displayHeight, iconSize } = React.useMemo(() => {
|
94
|
+
const coefficient = 30 / height;
|
95
|
+
const iconSize = () => {
|
96
|
+
if (width === height) {
|
97
|
+
return 18;
|
98
|
+
}
|
99
|
+
if (width === 9 && height === 16) {
|
100
|
+
return 16;
|
101
|
+
}
|
102
|
+
if (width < height) {
|
103
|
+
return 16;
|
104
|
+
}
|
105
|
+
};
|
106
|
+
return {
|
107
|
+
displayWidth: width * coefficient,
|
108
|
+
displayHeight: 30,
|
109
|
+
iconSize: iconSize(),
|
110
|
+
};
|
111
|
+
}, [height, width]);
|
112
|
+
return (React.createElement(Box, { sx: (theme) => ({
|
113
|
+
transition: 'width 0.3s ease-in-out',
|
114
|
+
width: displayWidth,
|
115
|
+
height: displayHeight,
|
116
|
+
backgroundColor: theme.palette.grey[300],
|
117
|
+
borderRadius: 1,
|
118
|
+
}), display: "flex", alignItems: "center", justifyContent: "center" },
|
119
|
+
React.createElement(MaterialIcon, { sx: {
|
120
|
+
fontSize: iconSize,
|
121
|
+
rotate: width === 9 && height === 16 ? '90deg' : undefined,
|
122
|
+
} }, "aspect_ratio")));
|
123
|
+
};
|
30
124
|
//# sourceMappingURL=resource-components.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"resource-components.js","sourceRoot":"","sources":["../../../src/components/ImageCropper/resource-components.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AACjE,OAAO,YAAY,MAAM,iBAAiB,CAAA;AAC1C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,EAAE;IACzC,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,QAAQ;CAC/C,CAAC,CAAsB,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,MAAM;IACb,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC;CACvC,CAAC,CAAC,CAAA;AAEH,MAAM,0BAA0B,GAAG,KAAK,CAAA;AACxC,MAAM,gBAAgB,GAAG,CAAC,CAAA;AAC1B,MAAM,gBAAgB,GAAG,CAAC,CAAA;AAC1B,MAAM,4BAA4B,GAAG,0BAA0B,GAAG,EAAE,CAAA;AACpE,MAAM,CAAC,MAAM,2BAA2B,GAAG,0BAA0B,GAAG,CAAC,CAAA;AAEzE,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAKT,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,KAAK,IACJ,OAAO,EAAE,CAAC,EACV,SAAS,EAAC,KAAK,EACf,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,QAAQ,EACvB,EAAE,EAAE,CAAC;QAEL,oBAAC,UAAU,IACT,QAAQ,EAAE,KAAK,KAAK,gBAAgB,IAAI,QAAQ,EAChD,OAAO,EAAE,GAAG,EAAE;gBACZ,MAAM,QAAQ,GAAG,UAAU,CACzB,CAAC,KAAK,GAAG,4BAA4B,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAClD,CAAA;gBACD,QAAQ,CAAC,QAAQ,GAAG,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAA;YACrE,CAAC,EACD,SAAS,EAAC,sCAAsC;YAEhD,oBAAC,YAAY,iBAAsB,CACxB;QACb,oBAAC,MAAM,kBACM,YAAY,EACvB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,gBAAgB,EACrB,GAAG,EAAE,gBAAgB,EACrB,IAAI,EAAE,0BAA0B,EAChC,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,OAAO,KAAK,KAAK,QAAQ,IAAI,QAAQ,CAAC,KAAK,CAAC,EACpE,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAC,yBAAyB,GACnC;QACF,oBAAC,UAAU,IACT,QAAQ,EAAE,KAAK,KAAK,gBAAgB,IAAI,QAAQ,EAChD,OAAO,EAAE,GAAG,EAAE;gBACZ,MAAM,QAAQ,GAAG,UAAU,CACzB,CAAC,KAAK,GAAG,4BAA4B,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAClD,CAAA;gBACD,QAAQ,CAAC,QAAQ,GAAG,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAA;YACrE,CAAC,EACD,SAAS,EAAC,qCAAqC;YAE/C,oBAAC,YAAY,cAAmB,CACrB,CACP,CACT,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { styled, Stack, IconButton, Slider } from '@mui/material'\nimport MaterialIcon from '../MaterialIcon'\nimport * as React from 'react'\n\nexport const CropContainer = styled('div', {\n shouldForwardProp: (prop) => prop !== 'height',\n})<{ height?: number }>(({ height }) => ({\n position: 'relative',\n width: '100%',\n ...(height ? { height } : { flex: 1 }),\n}))\n\nconst SLIDER_STEP_INTERVAL_VALUE = 0.025\nconst SLIDER_MIN_VALUE = 1\nconst SLIDER_MAX_VALUE = 3\nconst SLIDER_BUTTON_INTERVAL_VALUE = SLIDER_STEP_INTERVAL_VALUE * 10\nexport const SLIDER_WHEEL_INTERVAL_VALUE = SLIDER_STEP_INTERVAL_VALUE * 6\n\nexport const ZoomSlider = ({\n value,\n disabled = false,\n setValue,\n}: {\n value: number\n disabled?: boolean\n setValue: (value: number) => void\n}) => {\n return (\n <Stack\n spacing={2}\n direction=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n pt={3}\n >\n <IconButton\n disabled={value === SLIDER_MIN_VALUE || disabled}\n onClick={() => {\n const newValue = parseFloat(\n (value - SLIDER_BUTTON_INTERVAL_VALUE).toFixed(3),\n )\n setValue(newValue < SLIDER_MIN_VALUE ? SLIDER_MIN_VALUE : newValue)\n }}\n className=\"ob-cropper__zoom-slider-minus-button\"\n >\n <MaterialIcon>remove</MaterialIcon>\n </IconButton>\n <Slider\n aria-label=\"Image Zoom\"\n value={value}\n min={SLIDER_MIN_VALUE}\n max={SLIDER_MAX_VALUE}\n step={SLIDER_STEP_INTERVAL_VALUE}\n onChange={(e, value) => typeof value === 'number' && setValue(value)}\n disabled={disabled}\n className=\"ob-cropper__zoom-slider\"\n />\n <IconButton\n disabled={value === SLIDER_MAX_VALUE || disabled}\n onClick={() => {\n const newValue = parseFloat(\n (value + SLIDER_BUTTON_INTERVAL_VALUE).toFixed(3),\n )\n setValue(newValue > SLIDER_MAX_VALUE ? SLIDER_MAX_VALUE : newValue)\n }}\n className=\"ob-cropper__zoom-slider-plus-button\"\n >\n <MaterialIcon>add</MaterialIcon>\n </IconButton>\n </Stack>\n )\n}\n"]}
|
1
|
+
{"version":3,"file":"resource-components.js","sourceRoot":"","sources":["../../../src/components/ImageCropper/resource-components.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n styled,\n Stack,\n IconButton,\n Slider,\n Box,\n Menu,\n MenuItem,\n Typography,\n} from '@mui/material'\nimport MaterialIcon from '../MaterialIcon'\nimport * as React from 'react'\n\nexport const CropContainer = styled('div', {\n shouldForwardProp: (prop) => prop !== 'height',\n})<{ height?: number }>(({ height }) => ({\n position: 'relative',\n width: '100%',\n ...(height ? { height } : { flex: 1 }),\n}))\n\nconst SLIDER_STEP_INTERVAL_VALUE = 0.025\nconst SLIDER_MIN_VALUE = 1\nconst SLIDER_MAX_VALUE = 3\nconst SLIDER_BUTTON_INTERVAL_VALUE = SLIDER_STEP_INTERVAL_VALUE * 10\nexport const SLIDER_WHEEL_INTERVAL_VALUE = SLIDER_STEP_INTERVAL_VALUE * 6\n\nexport const ZoomSlider = ({\n value,\n disabled = false,\n setValue,\n}: {\n value: number\n disabled?: boolean\n setValue: (value: number) => void\n}) => {\n return (\n <Stack\n spacing={2}\n direction=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n pt={3}\n >\n <IconButton\n disabled={value === SLIDER_MIN_VALUE || disabled}\n onClick={() => {\n const newValue = parseFloat(\n (value - SLIDER_BUTTON_INTERVAL_VALUE).toFixed(3),\n )\n setValue(newValue < SLIDER_MIN_VALUE ? SLIDER_MIN_VALUE : newValue)\n }}\n className=\"ob-cropper__zoom-slider-minus-button\"\n >\n <MaterialIcon>remove</MaterialIcon>\n </IconButton>\n <Slider\n aria-label=\"Image Zoom\"\n value={value}\n min={SLIDER_MIN_VALUE}\n max={SLIDER_MAX_VALUE}\n step={SLIDER_STEP_INTERVAL_VALUE}\n onChange={(e, value) => typeof value === 'number' && setValue(value)}\n disabled={disabled}\n className=\"ob-cropper__zoom-slider\"\n />\n <IconButton\n disabled={value === SLIDER_MAX_VALUE || disabled}\n onClick={() => {\n const newValue = parseFloat(\n (value + SLIDER_BUTTON_INTERVAL_VALUE).toFixed(3),\n )\n setValue(newValue > SLIDER_MAX_VALUE ? SLIDER_MAX_VALUE : newValue)\n }}\n className=\"ob-cropper__zoom-slider-plus-button\"\n >\n <MaterialIcon>add</MaterialIcon>\n </IconButton>\n </Stack>\n )\n}\n\nexport interface AspectRatio {\n width: number\n height: number\n}\nexport const availableAspectRatios: AspectRatio[] = [\n {\n width: 21,\n height: 9,\n },\n {\n width: 16,\n height: 9,\n },\n {\n width: 16,\n height: 10,\n },\n {\n width: 3,\n height: 2,\n },\n {\n width: 4,\n height: 3,\n },\n {\n width: 5,\n height: 4,\n },\n {\n width: 1,\n height: 1,\n },\n {\n width: 4,\n height: 5,\n },\n {\n width: 9,\n height: 16,\n },\n]\nexport const AspectRatioButton = ({\n selectedAspectRatio,\n onSelectAspectRatio,\n}: {\n selectedAspectRatio: AspectRatio\n onSelectAspectRatio: (aspectRatio: AspectRatio) => void\n}) => {\n const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null)\n\n // TODO: Don't just use MUI for everything here if Blake gives the ok for this implementation\n // TODO: Put styling in css files if Blake gives the ok for this implementation\n return (\n <Box display=\"flex\" alignItems=\"center\" gap={1}>\n <Typography variant=\"body1\">Aspect Ratio</Typography>\n <button\n type=\"button\"\n className=\"button ob-button is-outlined\"\n onClick={(e) => setAnchorEl(e.currentTarget)}\n >\n <span\n style={{\n marginRight: 8,\n }}\n >\n {selectedAspectRatio.width}:{selectedAspectRatio.height}\n </span>\n <DrawAspectRatio {...selectedAspectRatio} />\n </button>\n <Menu\n open={!!anchorEl}\n anchorEl={anchorEl}\n onClose={() => {\n setAnchorEl(null)\n }}\n >\n {availableAspectRatios.map((aspectRatio) => (\n <MenuItem\n key={`${aspectRatio.width}:${aspectRatio.height}`}\n onClick={() => {\n onSelectAspectRatio(aspectRatio)\n setAnchorEl(null)\n }}\n >\n {aspectRatio.width}:{aspectRatio.height}\n </MenuItem>\n ))}\n </Menu>\n </Box>\n )\n}\n\nconst DrawAspectRatio = ({ height, width }: AspectRatio) => {\n const { displayWidth, displayHeight, iconSize } = React.useMemo(() => {\n const coefficient = 30 / height\n\n const iconSize = () => {\n if (width === height) {\n return 18\n }\n if (width === 9 && height === 16) {\n return 16\n }\n if (width < height) {\n return 16\n }\n }\n\n return {\n displayWidth: width * coefficient,\n displayHeight: 30,\n iconSize: iconSize(),\n }\n }, [height, width])\n\n return (\n <Box\n sx={(theme) => ({\n transition: 'width 0.3s ease-in-out',\n width: displayWidth,\n height: displayHeight,\n backgroundColor: theme.palette.grey[300],\n borderRadius: 1,\n })}\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <MaterialIcon\n sx={{\n fontSize: iconSize,\n rotate: width === 9 && height === 16 ? '90deg' : undefined,\n }}\n >\n aspect_ratio\n </MaterialIcon>\n </Box>\n )\n}\n"]}
|
@@ -29,7 +29,8 @@ export default function useFormElementOptions({ element, value, onChange, condit
|
|
29
29
|
option,
|
30
30
|
submission: formSubmissionModel,
|
31
31
|
formElements: elements,
|
32
|
-
contextSubmission: parent === null || parent === void 0 ? void 0 : parent.formSubmissionModel,
|
32
|
+
contextSubmission: (parent === null || parent === void 0 ? void 0 : parent.formSubmissionModel) || {},
|
33
|
+
contextElements: (parent === null || parent === void 0 ? void 0 : parent.elements) || [],
|
33
34
|
taskContext,
|
34
35
|
userProfile: userProfileForInjectables,
|
35
36
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useFormElementOptions.js","sourceRoot":"","sources":["../../src/hooks/useFormElementOptions.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAA;AAC5E,OAAO,sBAAsB,MAAM,iCAAiC,CAAA;AACpE,OAAO,uBAAuB,MAAM,+BAA+B,CAAA;AACnE,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,4BAA4B,MAAM,gCAAgC,CAAA;AAEzE,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAI,EAC/C,OAAO,EACP,KAAK,EACL,QAAQ,EACR,gCAAgC,EAChC,QAAQ,EACR,oBAAoB,GAUrB;IACC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAA;IACpC,MAAM,yBAAyB,GAAG,4BAA4B,EAAE,CAAA;IAEhE,MAAM,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,sBAAsB,EAAE,CAAA;IAC1E,MAAM,yBAAyB,GAAG,gCAAgC,aAAhC,gCAAgC,uBAAhC,gCAAgC,CAAE,OAAO,CAAA;IAC3E,iDAAiD;IACjD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAkC,GAAG,EAAE;QACvE,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;YACrB,OAAO,EAAE,CAAA;QACX,CAAC;QACD,IAAI,CAAC,yBAAyB,IAAI,CAAC,QAAQ,EAAE,CAAC;YAC5C,OAAO,OAAO,CAAC,OAAO,CAAA;QACxB,CAAC;QACD,OAAO,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE;YACvC,OAAO,CACL,CAAC,yBAAyB;gBAC1B,yBAAyB,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,CAAC,CAC7D,CAAA;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,yBAAyB,EAAE,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAA;IAE1D,EAAE;IACF,MAAM,mBAAmB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC7C,OAAO,YAAY,CAAC,MAAM,CACxB,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE;YACf,MAAM,UAAU,GAAG,uBAAuB,CAAC;gBACzC,MAAM;gBACN,UAAU,EAAE,mBAAmB;gBAC/B,YAAY,EAAE,QAAQ;gBACtB,iBAAiB,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,mBAAmB;
|
1
|
+
{"version":3,"file":"useFormElementOptions.js","sourceRoot":"","sources":["../../src/hooks/useFormElementOptions.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n UpdateFormElementsHandler,\n} from '../types/form'\nimport { useLoadDynamicOptionsEffect } from './useDynamicOptionsLoaderState'\nimport useFormSubmissionModel from './useFormSubmissionModelContext'\nimport processInjectableOption from '../services/injectableOptions'\nimport useTaskContext from './useTaskContext'\nimport useUserProfileForInjectables from './useUserProfileForInjectables'\n\nexport default function useFormElementOptions<T>({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onFilter,\n onUpdateFormElements,\n}: {\n element: FormTypes.FormElementWithOptions\n value: unknown | undefined\n onChange: FormElementValueChangeHandler<T>\n conditionallyShownOptionsElement:\n | FormElementConditionallyShownElement\n | undefined\n onFilter?: (choiceElementOption: FormTypes.ChoiceElementOption) => boolean\n onUpdateFormElements: UpdateFormElementsHandler\n}) {\n const taskContext = useTaskContext()\n const userProfileForInjectables = useUserProfileForInjectables()\n\n const { formSubmissionModel, elements, parent } = useFormSubmissionModel()\n const conditionallyShownOptions = conditionallyShownOptionsElement?.options\n //options that are shown due to conditional logic\n const shownOptions = React.useMemo<FormTypes.ChoiceElementOption[]>(() => {\n if (!element.options) {\n return []\n }\n if (!conditionallyShownOptions && !onFilter) {\n return element.options\n }\n return element.options.filter((option) => {\n return (\n !conditionallyShownOptions ||\n conditionallyShownOptions.some(({ id }) => id === option.id)\n )\n })\n }, [conditionallyShownOptions, element.options, onFilter])\n\n //\n const withInjectedOptions = React.useMemo(() => {\n return shownOptions.reduce<FormTypes.ChoiceElementOption[]>(\n (memo, option) => {\n const newOptions = processInjectableOption({\n option,\n submission: formSubmissionModel,\n formElements: elements,\n contextSubmission: parent?.formSubmissionModel || {},\n contextElements: parent?.elements || [],\n taskContext,\n userProfile: userProfileForInjectables,\n })\n memo.push(...newOptions)\n\n return memo\n },\n [],\n )\n }, [\n elements,\n formSubmissionModel,\n parent,\n shownOptions,\n taskContext,\n userProfileForInjectables,\n ])\n\n //options that are shown based on conditional logic and user input\n const filteredOptions = React.useMemo<FormTypes.ChoiceElementOption[]>(() => {\n const reducedOptions = withInjectedOptions.filter(\n (option) => !onFilter || (onFilter(option) && !option.displayAlways),\n )\n if (element.type === 'autocomplete') {\n const alwaysShownOptions = withInjectedOptions.filter(\n (option) => option.displayAlways,\n )\n reducedOptions.push(...alwaysShownOptions)\n }\n return reducedOptions\n }, [withInjectedOptions, element.type, onFilter])\n\n React.useEffect(() => {\n if (\n !element.options ||\n conditionallyShownOptionsElement?.dependencyIsLoading\n ) {\n return\n }\n\n if (\n typeof value === 'string' &&\n !withInjectedOptions.some((option) => value === option.value)\n ) {\n onChange(element, {\n value: undefined,\n })\n return\n }\n\n if (Array.isArray(value)) {\n const newValue = value.filter((selectedValue) =>\n withInjectedOptions.some((option) => selectedValue === option.value),\n )\n if (newValue.length !== value.length) {\n const newValueArray = newValue.length ? newValue : undefined\n onChange(element, {\n value: newValueArray as T | undefined,\n })\n }\n }\n }, [\n element,\n shownOptions,\n onChange,\n value,\n conditionallyShownOptionsElement?.dependencyIsLoading,\n withInjectedOptions,\n ])\n\n useLoadDynamicOptionsEffect(element, onUpdateFormElements)\n\n return filteredOptions\n}\n"]}
|
@@ -1,11 +1,12 @@
|
|
1
1
|
import { FormTypes, SubmissionTypes } from '@oneblink/types';
|
2
2
|
import { MiscTypes } from '@oneblink/types';
|
3
3
|
import { TaskContext } from '../hooks/useTaskContext';
|
4
|
-
export default function processInjectableOption({ option, submission, formElements, contextSubmission, taskContext, userProfile, }: {
|
4
|
+
export default function processInjectableOption({ option, submission, formElements, contextElements, contextSubmission, taskContext, userProfile, }: {
|
5
5
|
option: FormTypes.ChoiceElementOption;
|
6
6
|
submission: SubmissionTypes.S3SubmissionData['submission'];
|
7
7
|
formElements: FormTypes.FormElement[];
|
8
|
-
|
8
|
+
contextElements: FormTypes.FormElement[];
|
9
|
+
contextSubmission: SubmissionTypes.S3SubmissionData['submission'];
|
9
10
|
taskContext: TaskContext;
|
10
11
|
userProfile: MiscTypes.UserProfile | undefined;
|
11
12
|
}): FormTypes.ChoiceElementOption[];
|
@@ -1,11 +1,11 @@
|
|
1
1
|
import { submissionService, typeCastService } from '@oneblink/sdk-core';
|
2
2
|
import { localisationService } from '@oneblink/apps';
|
3
3
|
import { v4 as uuidv4 } from 'uuid';
|
4
|
-
function processInjectableDynamicOption({ option: resource, submission: rootSubmission, formElements: rootFormElements, contextSubmission, ...params }) {
|
4
|
+
function processInjectableDynamicOption({ option: resource, submission: rootSubmission, formElements: rootFormElements, contextElements, contextSubmission, ...params }) {
|
5
5
|
return submissionService.processInjectablesInCustomResource({
|
6
6
|
resource,
|
7
7
|
submission: { ...rootSubmission, ...contextSubmission },
|
8
|
-
formElements: rootFormElements,
|
8
|
+
formElements: [...rootFormElements, ...contextElements],
|
9
9
|
replaceRootInjectables(option, submission, formElements) {
|
10
10
|
// Replace root level form element values
|
11
11
|
const replaceableParams = {
|
@@ -42,7 +42,7 @@ function processInjectableDynamicOption({ option: resource, submission: rootSubm
|
|
42
42
|
},
|
43
43
|
});
|
44
44
|
}
|
45
|
-
export default function processInjectableOption({ option, submission, formElements, contextSubmission, taskContext, userProfile, }) {
|
45
|
+
export default function processInjectableOption({ option, submission, formElements, contextElements, contextSubmission, taskContext, userProfile, }) {
|
46
46
|
const options = processInjectableDynamicOption({
|
47
47
|
option,
|
48
48
|
submission,
|
@@ -50,6 +50,7 @@ export default function processInjectableOption({ option, submission, formElemen
|
|
50
50
|
taskContext,
|
51
51
|
userProfile,
|
52
52
|
contextSubmission,
|
53
|
+
contextElements,
|
53
54
|
});
|
54
55
|
const generatedOptions = [];
|
55
56
|
options.forEach(({ label, value }) => {
|
@@ -62,7 +63,7 @@ export default function processInjectableOption({ option, submission, formElemen
|
|
62
63
|
});
|
63
64
|
return generatedOptions;
|
64
65
|
}
|
65
|
-
function injectOptionsAcrossEntriesElements({ contextElements, elements, entries, taskContext, userProfile, }) {
|
66
|
+
function injectOptionsAcrossEntriesElements({ contextElements, contextSubmission, elements, entries, taskContext, userProfile, }) {
|
66
67
|
return elements.map((e) => {
|
67
68
|
switch (e.type) {
|
68
69
|
case 'page':
|
@@ -72,6 +73,7 @@ function injectOptionsAcrossEntriesElements({ contextElements, elements, entries
|
|
72
73
|
elements: injectOptionsAcrossEntriesElements({
|
73
74
|
// info elements on other pages/sections will need the parent definition
|
74
75
|
contextElements,
|
76
|
+
contextSubmission,
|
75
77
|
elements: e.elements,
|
76
78
|
entries,
|
77
79
|
taskContext,
|
@@ -86,6 +88,7 @@ function injectOptionsAcrossEntriesElements({ contextElements, elements, entries
|
|
86
88
|
elements: injectOptionsAcrossEntriesElements({
|
87
89
|
// sub-forms do not have context of parent elements
|
88
90
|
contextElements: e.elements,
|
91
|
+
contextSubmission,
|
89
92
|
elements: e.elements,
|
90
93
|
entries: entries.reduce((memo, entry) => {
|
91
94
|
if (entry[e.name]) {
|
@@ -108,6 +111,7 @@ function injectOptionsAcrossEntriesElements({ contextElements, elements, entries
|
|
108
111
|
elements: injectOptionsAcrossEntriesElements({
|
109
112
|
// repeatable set entries may only know about elements within entry
|
110
113
|
contextElements,
|
114
|
+
contextSubmission,
|
111
115
|
elements: e.elements,
|
112
116
|
entries: entries.reduce((memo, entry) => {
|
113
117
|
const nestedEntries = entry[e.name];
|
@@ -132,7 +136,9 @@ function injectOptionsAcrossEntriesElements({ contextElements, elements, entries
|
|
132
136
|
const injected = processInjectableOption({
|
133
137
|
option: o,
|
134
138
|
submission,
|
139
|
+
contextSubmission,
|
135
140
|
formElements: elements,
|
141
|
+
contextElements,
|
136
142
|
taskContext,
|
137
143
|
userProfile,
|
138
144
|
});
|
@@ -157,6 +163,7 @@ export function injectOptionsAcrossAllElements({ submission, ...params }) {
|
|
157
163
|
// labels for each available option to display the submission.
|
158
164
|
return injectOptionsAcrossEntriesElements({
|
159
165
|
...params,
|
166
|
+
contextSubmission: submission,
|
160
167
|
entries: [submission],
|
161
168
|
});
|
162
169
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"injectableOptions.js","sourceRoot":"","sources":["../../src/services/injectableOptions.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { submissionService, typeCastService } from '@oneblink/sdk-core'\nimport { localisationService } from '@oneblink/apps'\nimport { v4 as uuidv4 } from 'uuid'\nimport { MiscTypes } from '@oneblink/types'\nimport { TaskContext } from '../hooks/useTaskContext'\ntype Option = Pick<FormTypes.ChoiceElementOption, 'value' | 'label'>\n\nfunction processInjectableDynamicOption({\n option: resource,\n submission: rootSubmission,\n formElements: rootFormElements,\n contextSubmission,\n ...params\n}: {\n option: Option\n submission: SubmissionTypes.S3SubmissionData['submission']\n formElements: FormTypes.FormElement[]\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n contextSubmission?: SubmissionTypes.S3SubmissionData['submission']\n}): Map<string, Option> {\n return submissionService.processInjectablesInCustomResource<Option>({\n resource,\n submission: { ...rootSubmission, ...contextSubmission },\n formElements: rootFormElements,\n replaceRootInjectables(option, submission, formElements) {\n // Replace root level form element values\n const replaceableParams: Parameters<\n typeof localisationService.replaceInjectablesWithElementValues\n >[1] = {\n ...params,\n submission,\n formElements,\n task: params.taskContext.task,\n taskGroup: params.taskContext.taskGroup,\n taskGroupInstance: params.taskContext.taskGroupInstance,\n excludeNestedElements: true,\n }\n const {\n text: label,\n hadAllInjectablesReplaced: hadAllInjectablesReplacedInLabel,\n } = localisationService.replaceInjectablesWithElementValues(\n option.label,\n replaceableParams,\n )\n if (!hadAllInjectablesReplacedInLabel) {\n return\n }\n\n const {\n text: value,\n hadAllInjectablesReplaced: hadAllInjectablesReplacedInValue,\n } = localisationService.replaceInjectablesWithElementValues(\n option.value,\n replaceableParams,\n )\n if (!hadAllInjectablesReplacedInValue) {\n return\n }\n\n return [\n label + ' ' + value,\n value,\n {\n value,\n label,\n },\n ]\n },\n prepareNestedInjectables(option, prepare) {\n return {\n value: prepare(option.value),\n label: prepare(option.label),\n }\n },\n })\n}\n\nexport default function processInjectableOption({\n option,\n submission,\n formElements,\n contextSubmission,\n taskContext,\n userProfile,\n}: {\n option: FormTypes.ChoiceElementOption\n submission: SubmissionTypes.S3SubmissionData['submission']\n formElements: FormTypes.FormElement[]\n contextSubmission?: SubmissionTypes.S3SubmissionData['submission']\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n}): FormTypes.ChoiceElementOption[] {\n const options = processInjectableDynamicOption({\n option,\n submission,\n formElements,\n taskContext,\n userProfile,\n contextSubmission,\n })\n\n const generatedOptions: FormTypes.ChoiceElementOption[] = []\n\n options.forEach(({ label, value }) => {\n generatedOptions.push({\n ...option,\n id: options.size === 1 ? option.id : uuidv4(),\n label,\n value,\n })\n })\n\n return generatedOptions\n}\n\nfunction injectOptionsAcrossEntriesElements({\n contextElements,\n elements,\n entries,\n taskContext,\n userProfile,\n}: {\n contextElements: FormTypes.FormElement[]\n elements: FormTypes.FormElement[]\n entries: SubmissionTypes.S3SubmissionData['submission'][]\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n}): FormTypes.FormElement[] {\n return elements.map<FormTypes.FormElement>((e) => {\n switch (e.type) {\n case 'page':\n case 'section': {\n return {\n ...e,\n elements: injectOptionsAcrossEntriesElements({\n // info elements on other pages/sections will need the parent definition\n contextElements,\n elements: e.elements,\n entries,\n taskContext,\n userProfile,\n }),\n }\n }\n case 'form': {\n if (Array.isArray(e.elements)) {\n return {\n ...e,\n elements: injectOptionsAcrossEntriesElements({\n // sub-forms do not have context of parent elements\n contextElements: e.elements,\n elements: e.elements,\n entries: entries.reduce<\n SubmissionTypes.S3SubmissionData['submission'][]\n >((memo, entry) => {\n if (entry[e.name]) {\n memo.push(\n entry[\n e.name\n ] as SubmissionTypes.S3SubmissionData['submission'],\n )\n }\n return memo\n }, []),\n taskContext,\n userProfile,\n }),\n }\n } else {\n return e\n }\n }\n case 'repeatableSet': {\n return {\n ...e,\n elements: injectOptionsAcrossEntriesElements({\n // repeatable set entries may only know about elements within entry\n contextElements,\n elements: e.elements,\n entries: entries.reduce<\n SubmissionTypes.S3SubmissionData['submission'][]\n >((memo, entry) => {\n const nestedEntries = entry[e.name]\n if (Array.isArray(nestedEntries)) {\n memo.push(\n ...(nestedEntries as SubmissionTypes.S3SubmissionData['submission'][]),\n )\n }\n return memo\n }, []),\n taskContext,\n userProfile,\n }),\n }\n }\n default: {\n const optionsElement = typeCastService.formElements.toOptionsElement(e)\n if (optionsElement) {\n return {\n ...optionsElement,\n options: entries.reduce<FormTypes.ChoiceElementOption[]>(\n (newOptions, submission) => {\n optionsElement.options?.forEach((o) => {\n const injected = processInjectableOption({\n option: o,\n submission,\n formElements: elements,\n taskContext,\n userProfile,\n })\n\n newOptions.push(\n ...injected.filter((generatedOption) => {\n return !newOptions.some(\n (addedOption) =>\n addedOption.value === generatedOption.value,\n )\n }),\n )\n })\n return newOptions\n },\n [],\n ),\n }\n }\n return e\n }\n }\n })\n}\n\nexport function injectOptionsAcrossAllElements({\n submission,\n ...params\n}: {\n elements: FormTypes.FormElement[]\n contextElements: FormTypes.FormElement[]\n submission: SubmissionTypes.S3SubmissionData['submission']\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n}): FormTypes.FormElement[] {\n // We iterate over entries as an array of submission objects because\n // child elements of a repeatable set that have injected options\n // need to include all of the injected options from the same elements\n // in sibling entries within the set. Otherwise we will not have the\n // labels for each available option to display the submission.\n return injectOptionsAcrossEntriesElements({\n ...params,\n entries: [submission],\n })\n}\n"]}
|
1
|
+
{"version":3,"file":"injectableOptions.js","sourceRoot":"","sources":["../../src/services/injectableOptions.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { submissionService, typeCastService } from '@oneblink/sdk-core'\nimport { localisationService } from '@oneblink/apps'\nimport { v4 as uuidv4 } from 'uuid'\nimport { MiscTypes } from '@oneblink/types'\nimport { TaskContext } from '../hooks/useTaskContext'\ntype Option = Pick<FormTypes.ChoiceElementOption, 'value' | 'label'>\n\nfunction processInjectableDynamicOption({\n option: resource,\n submission: rootSubmission,\n formElements: rootFormElements,\n contextElements,\n contextSubmission,\n ...params\n}: {\n option: Option\n submission: SubmissionTypes.S3SubmissionData['submission']\n formElements: FormTypes.FormElement[]\n contextElements: FormTypes.FormElement[]\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n contextSubmission?: SubmissionTypes.S3SubmissionData['submission']\n}): Map<string, Option> {\n return submissionService.processInjectablesInCustomResource<Option>({\n resource,\n submission: { ...rootSubmission, ...contextSubmission },\n formElements: [...rootFormElements, ...contextElements],\n replaceRootInjectables(option, submission, formElements) {\n // Replace root level form element values\n const replaceableParams: Parameters<\n typeof localisationService.replaceInjectablesWithElementValues\n >[1] = {\n ...params,\n submission,\n formElements,\n task: params.taskContext.task,\n taskGroup: params.taskContext.taskGroup,\n taskGroupInstance: params.taskContext.taskGroupInstance,\n excludeNestedElements: true,\n }\n const {\n text: label,\n hadAllInjectablesReplaced: hadAllInjectablesReplacedInLabel,\n } = localisationService.replaceInjectablesWithElementValues(\n option.label,\n replaceableParams,\n )\n if (!hadAllInjectablesReplacedInLabel) {\n return\n }\n\n const {\n text: value,\n hadAllInjectablesReplaced: hadAllInjectablesReplacedInValue,\n } = localisationService.replaceInjectablesWithElementValues(\n option.value,\n replaceableParams,\n )\n if (!hadAllInjectablesReplacedInValue) {\n return\n }\n\n return [\n label + ' ' + value,\n value,\n {\n value,\n label,\n },\n ]\n },\n prepareNestedInjectables(option, prepare) {\n return {\n value: prepare(option.value),\n label: prepare(option.label),\n }\n },\n })\n}\n\nexport default function processInjectableOption({\n option,\n submission,\n formElements,\n contextElements,\n contextSubmission,\n taskContext,\n userProfile,\n}: {\n option: FormTypes.ChoiceElementOption\n submission: SubmissionTypes.S3SubmissionData['submission']\n formElements: FormTypes.FormElement[]\n contextElements: FormTypes.FormElement[]\n contextSubmission: SubmissionTypes.S3SubmissionData['submission']\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n}): FormTypes.ChoiceElementOption[] {\n const options = processInjectableDynamicOption({\n option,\n submission,\n formElements,\n taskContext,\n userProfile,\n contextSubmission,\n contextElements,\n })\n\n const generatedOptions: FormTypes.ChoiceElementOption[] = []\n\n options.forEach(({ label, value }) => {\n generatedOptions.push({\n ...option,\n id: options.size === 1 ? option.id : uuidv4(),\n label,\n value,\n })\n })\n return generatedOptions\n}\n\nfunction injectOptionsAcrossEntriesElements({\n contextElements,\n contextSubmission,\n elements,\n entries,\n taskContext,\n userProfile,\n}: {\n contextElements: FormTypes.FormElement[]\n contextSubmission: SubmissionTypes.S3SubmissionData['submission']\n elements: FormTypes.FormElement[]\n entries: SubmissionTypes.S3SubmissionData['submission'][]\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n}): FormTypes.FormElement[] {\n return elements.map<FormTypes.FormElement>((e) => {\n switch (e.type) {\n case 'page':\n case 'section': {\n return {\n ...e,\n elements: injectOptionsAcrossEntriesElements({\n // info elements on other pages/sections will need the parent definition\n contextElements,\n contextSubmission,\n elements: e.elements,\n entries,\n taskContext,\n userProfile,\n }),\n }\n }\n case 'form': {\n if (Array.isArray(e.elements)) {\n return {\n ...e,\n elements: injectOptionsAcrossEntriesElements({\n // sub-forms do not have context of parent elements\n contextElements: e.elements,\n contextSubmission,\n elements: e.elements,\n entries: entries.reduce<\n SubmissionTypes.S3SubmissionData['submission'][]\n >((memo, entry) => {\n if (entry[e.name]) {\n memo.push(\n entry[\n e.name\n ] as SubmissionTypes.S3SubmissionData['submission'],\n )\n }\n return memo\n }, []),\n taskContext,\n userProfile,\n }),\n }\n } else {\n return e\n }\n }\n case 'repeatableSet': {\n return {\n ...e,\n elements: injectOptionsAcrossEntriesElements({\n // repeatable set entries may only know about elements within entry\n contextElements,\n contextSubmission,\n elements: e.elements,\n entries: entries.reduce<\n SubmissionTypes.S3SubmissionData['submission'][]\n >((memo, entry) => {\n const nestedEntries = entry[e.name]\n if (Array.isArray(nestedEntries)) {\n memo.push(\n ...(nestedEntries as SubmissionTypes.S3SubmissionData['submission'][]),\n )\n }\n return memo\n }, []),\n taskContext,\n userProfile,\n }),\n }\n }\n default: {\n const optionsElement = typeCastService.formElements.toOptionsElement(e)\n if (optionsElement) {\n return {\n ...optionsElement,\n options: entries.reduce<FormTypes.ChoiceElementOption[]>(\n (newOptions, submission) => {\n optionsElement.options?.forEach((o) => {\n const injected = processInjectableOption({\n option: o,\n submission,\n contextSubmission,\n formElements: elements,\n contextElements,\n taskContext,\n userProfile,\n })\n\n newOptions.push(\n ...injected.filter((generatedOption) => {\n return !newOptions.some(\n (addedOption) =>\n addedOption.value === generatedOption.value,\n )\n }),\n )\n })\n return newOptions\n },\n [],\n ),\n }\n }\n return e\n }\n }\n })\n}\n\nexport function injectOptionsAcrossAllElements({\n submission,\n ...params\n}: {\n elements: FormTypes.FormElement[]\n contextElements: FormTypes.FormElement[]\n submission: SubmissionTypes.S3SubmissionData['submission']\n taskContext: TaskContext\n userProfile: MiscTypes.UserProfile | undefined\n}): FormTypes.FormElement[] {\n // We iterate over entries as an array of submission objects because\n // child elements of a repeatable set that have injected options\n // need to include all of the injected options from the same elements\n // in sibling entries within the set. Otherwise we will not have the\n // labels for each available option to display the submission.\n return injectOptionsAcrossEntriesElements({\n ...params,\n contextSubmission: submission,\n entries: [submission],\n })\n}\n"]}
|
package/dist/styles/modal.scss
CHANGED
package/dist/styles.css
CHANGED
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@oneblink/apps-react",
|
3
3
|
"description": "Helper functions for OneBlink apps in ReactJS.",
|
4
|
-
"version": "8.12.0-beta.
|
4
|
+
"version": "8.12.0-beta.4",
|
5
5
|
"author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
|
6
6
|
"bugs": {
|
7
7
|
"url": "https://github.com/oneblink/apps-react/issues"
|