npm - @oneblink/apps-react - Versions diffs - 4.4.0 → 4.5.0-beta.2 - Mend

@oneblink/apps-react 4.4.0 → 4.5.0-beta.2

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 (105) hide show

package/dist/form-elements/FormElementAutocomplete.js CHANGED Viewed

@@ -75,7 +75,9 @@ const AutocompleteFetch = React.memo(function AutocompleteFetch({ id, element, v
 });
 function FormElementAutocomplete({ conditionallyShownOptionsElement, onChange, ...props }) {
     const handleChange = React.useCallback((newValue) => {
-        onChange(props.element, newValue);
+        onChange(props.element, {
+            value: newValue,
+        });
     }, [onChange, props.element]);
     if (props.element.optionsType === 'SEARCH' && props.element.searchUrl) {
         return (React.createElement(AutocompleteFetch, { ...props, onChange: handleChange, searchUrl: props.element.searchUrl, searchQuerystringParameter: props.element.searchQuerystringParameter || 'value' }));

package/dist/form-elements/FormElementAutocomplete.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementAutocomplete.js","sourceRoot":"","sources":["../../src/form-elements/FormElementAutocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport { generateHeaders } from '@oneblink/apps/dist/services/fetch'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport AutocompleteDropdown from '../components/renderer/AutocompleteDropdown'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormTypes } from '@oneblink/types'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\n\ntype _BaseProps = {\n id: string\n element: FormTypes.AutoCompleteElement\n value: unknown \| undefined\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\ntype _AutocompleteChangeHandlerProps = _BaseProps & {\n onChange: (newValue: unknown \| undefined) => void\n}\n\ntype _AutocompleteConditionallyShowOptionProps = {\n conditionallyShownOptionsElement:\n \| FormElementConditionallyShownElement\n \| undefined\n}\n\ntype AutocompleteFilterProps = _AutocompleteChangeHandlerProps &\n _AutocompleteConditionallyShowOptionProps\n\ntype AutocompleteFetchProps = _AutocompleteChangeHandlerProps & {\n searchUrl: string\n searchQuerystringParameter: string\n}\n\ntype Props = _BaseProps &\n _AutocompleteConditionallyShowOptionProps & {\n onChange: FormElementValueChangeHandler<string>\n }\n\nconst AutocompleteFilter = React.memo(function AutocompleteFilter({\n id,\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n validationMessage,\n displayValidationMessage,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: AutocompleteFilterProps) {\n const [label, setLabel] = React.useState('')\n\n const onFilter = React.useCallback(\n (option: FormTypes.ChoiceElementOption) => {\n // If the user has typed nothing in, display all options\n if (!label) {\n return true\n }\n\n const lowerCase = label.toLowerCase()\n\n return option.label.toLowerCase().includes(lowerCase)\n },\n [label],\n )\n\n const handleChange = React.useCallback(\n //useFormElementOptions expects the first arg to be the element\n (element: FormTypes.FormElement, newValue: unknown) => onChange(newValue),\n [onChange],\n )\n\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange: handleChange,\n conditionallyShownOptionsElement,\n onFilter,\n onUpdateFormElements,\n })\n\n const handleSearch = React.useCallback(async () => {\n return filteredOptions\n }, [filteredOptions])\n\n // Ensure the label matches the value selected\n React.useEffect(() => {\n if (!Array.isArray(element.options)) {\n return\n }\n\n const option = element.options.find((option) => option.value === value)\n if (option && label !== option.label) {\n setLabel(option.label)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [element.options, value])\n\n return (\n <div className=\"cypress-autocomplete-filter-element\">\n <FormElementLabelContainer\n className=\"ob-autocomplete\"\n element={element}\n id={id}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n <AutocompleteDropdown\n id={id}\n label={label}\n disabled={element.readOnly}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={onChange}\n onChangeLabel={setLabel}\n onSearch={handleSearch}\n searchDebounceMs={0}\n searchMinCharacters={0}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementOptions>\n </FormElementLabelContainer>\n </div>\n )\n})\n\nconst AutocompleteFetch = React.memo(function AutocompleteFetch({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n searchUrl,\n searchQuerystringParameter,\n isDirty,\n setIsDirty,\n}: AutocompleteFetchProps) {\n const [label, setLabel] = React.useState('')\n\n const handleSearch = React.useCallback(\n async (search: string, abortSignal: AbortSignal) => {\n const headers = await generateHeaders()\n const url = new URL(searchUrl)\n url.searchParams.append(searchQuerystringParameter, search)\n const response = await fetch(url.href, {\n headers,\n signal: abortSignal,\n })\n\n if (!response.ok) {\n const text = await response.text()\n throw new Error(text)\n }\n\n const data = await response.json()\n return formElementsService.parseDynamicFormElementOptions(data)\n },\n [searchQuerystringParameter, searchUrl],\n )\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (!label && typeof value === 'string') {\n setLabel(value)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-autocomplete-search-element\">\n <FormElementLabelContainer\n className=\"ob-autocomplete\"\n element={element}\n id={id}\n required={element.required}\n >\n <AutocompleteDropdown\n id={id}\n label={label}\n disabled={element.readOnly}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={onChange}\n onChangeLabel={setLabel}\n searchDebounceMs={750}\n searchMinCharacters={1}\n onSearch={handleSearch}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementLabelContainer>\n </div>\n )\n})\n\nfunction FormElementAutocomplete({\n conditionallyShownOptionsElement,\n onChange,\n ...props\n}: Props) {\n const handleChange = React.useCallback(\n (newValue: unknown) => {\n onChange(props.element, newValue as string \| undefined)\n },\n [onChange, props.element],\n )\n if (props.element.optionsType === 'SEARCH' && props.element.searchUrl) {\n return (\n <AutocompleteFetch\n {...props}\n onChange={handleChange}\n searchUrl={props.element.searchUrl}\n searchQuerystringParameter={\n props.element.searchQuerystringParameter \|\| 'value'\n }\n />\n )\n }\n\n return (\n <AutocompleteFilter\n {...props}\n onChange={handleChange}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n />\n )\n}\n\nexport default React.memo(FormElementAutocomplete)\n"]}
1	+ {"version":3,"file":"FormElementAutocomplete.js","sourceRoot":"","sources":["../../src/form-elements/FormElementAutocomplete.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport { generateHeaders } from '@oneblink/apps/dist/services/fetch'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport AutocompleteDropdown from '../components/renderer/AutocompleteDropdown'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormTypes } from '@oneblink/types'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\n\ntype _BaseProps = {\n id: string\n element: FormTypes.AutoCompleteElement\n value: unknown \| undefined\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\ntype _AutocompleteChangeHandlerProps = _BaseProps & {\n onChange: (newValue: unknown \| undefined) => void\n}\n\ntype _AutocompleteConditionallyShowOptionProps = {\n conditionallyShownOptionsElement:\n \| FormElementConditionallyShownElement\n \| undefined\n}\n\ntype AutocompleteFilterProps = _AutocompleteChangeHandlerProps &\n _AutocompleteConditionallyShowOptionProps\n\ntype AutocompleteFetchProps = _AutocompleteChangeHandlerProps & {\n searchUrl: string\n searchQuerystringParameter: string\n}\n\ntype Props = _BaseProps &\n _AutocompleteConditionallyShowOptionProps & {\n onChange: FormElementValueChangeHandler<string>\n }\n\nconst AutocompleteFilter = React.memo(function AutocompleteFilter({\n id,\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n validationMessage,\n displayValidationMessage,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: AutocompleteFilterProps) {\n const [label, setLabel] = React.useState('')\n\n const onFilter = React.useCallback(\n (option: FormTypes.ChoiceElementOption) => {\n // If the user has typed nothing in, display all options\n if (!label) {\n return true\n }\n\n const lowerCase = label.toLowerCase()\n\n return option.label.toLowerCase().includes(lowerCase)\n },\n [label],\n )\n\n const handleChange = React.useCallback(\n //useFormElementOptions expects the first arg to be the element\n (element: FormTypes.FormElement, newValue: unknown) => onChange(newValue),\n [onChange],\n )\n\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange: handleChange,\n conditionallyShownOptionsElement,\n onFilter,\n onUpdateFormElements,\n })\n\n const handleSearch = React.useCallback(async () => {\n return filteredOptions\n }, [filteredOptions])\n\n // Ensure the label matches the value selected\n React.useEffect(() => {\n if (!Array.isArray(element.options)) {\n return\n }\n\n const option = element.options.find((option) => option.value === value)\n if (option && label !== option.label) {\n setLabel(option.label)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [element.options, value])\n\n return (\n <div className=\"cypress-autocomplete-filter-element\">\n <FormElementLabelContainer\n className=\"ob-autocomplete\"\n element={element}\n id={id}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n <AutocompleteDropdown\n id={id}\n label={label}\n disabled={element.readOnly}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={onChange}\n onChangeLabel={setLabel}\n onSearch={handleSearch}\n searchDebounceMs={0}\n searchMinCharacters={0}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementOptions>\n </FormElementLabelContainer>\n </div>\n )\n})\n\nconst AutocompleteFetch = React.memo(function AutocompleteFetch({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n searchUrl,\n searchQuerystringParameter,\n isDirty,\n setIsDirty,\n}: AutocompleteFetchProps) {\n const [label, setLabel] = React.useState('')\n\n const handleSearch = React.useCallback(\n async (search: string, abortSignal: AbortSignal) => {\n const headers = await generateHeaders()\n const url = new URL(searchUrl)\n url.searchParams.append(searchQuerystringParameter, search)\n const response = await fetch(url.href, {\n headers,\n signal: abortSignal,\n })\n\n if (!response.ok) {\n const text = await response.text()\n throw new Error(text)\n }\n\n const data = await response.json()\n return formElementsService.parseDynamicFormElementOptions(data)\n },\n [searchQuerystringParameter, searchUrl],\n )\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (!label && typeof value === 'string') {\n setLabel(value)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-autocomplete-search-element\">\n <FormElementLabelContainer\n className=\"ob-autocomplete\"\n element={element}\n id={id}\n required={element.required}\n >\n <AutocompleteDropdown\n id={id}\n label={label}\n disabled={element.readOnly}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={onChange}\n onChangeLabel={setLabel}\n searchDebounceMs={750}\n searchMinCharacters={1}\n onSearch={handleSearch}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementLabelContainer>\n </div>\n )\n})\n\nfunction FormElementAutocomplete({\n conditionallyShownOptionsElement,\n onChange,\n ...props\n}: Props) {\n const handleChange = React.useCallback(\n (newValue: unknown) => {\n onChange(props.element, {\n value: newValue as string \| undefined,\n })\n },\n [onChange, props.element],\n )\n if (props.element.optionsType === 'SEARCH' && props.element.searchUrl) {\n return (\n <AutocompleteFetch\n {...props}\n onChange={handleChange}\n searchUrl={props.element.searchUrl}\n searchQuerystringParameter={\n props.element.searchQuerystringParameter \|\| 'value'\n }\n />\n )\n }\n\n return (\n <AutocompleteFilter\n {...props}\n onChange={handleChange}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n />\n )\n}\n\nexport default React.memo(FormElementAutocomplete)\n"]}

package/dist/form-elements/FormElementBSB.js CHANGED Viewed

@@ -15,7 +15,9 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
     });
     React.useEffect(() => {
         if (bsbRecord) {
-            onChange(element, bsbRecord.bsb);
+            onChange(element, {
+                value: bsbRecord.bsb,
+            });
         }
     }, [bsbRecord, element, onChange, value]);
     React.useEffect(() => {
@@ -37,7 +39,9 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
         });
         const abortController = new AbortController();
         const getBSBRecord = async () => {
-            onChange(element, { isValidating: true, isInvalid: false });
+            onChange(element, {
+                value: { isValidating: true, isInvalid: false },
+            });
             try {
                 const bsbRecord = await formService.getBSBRecord(formId, text, abortController.signal);
                 if (!abortController.signal.aborted) {
@@ -51,7 +55,9 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
             catch (error) {
                 console.warn('Error validating BSB number', error);
                 if (!abortController.signal.aborted) {
-                    onChange(element, { isInvalid: true, isValidating: false });
+                    onChange(element, {
+                        value: { isInvalid: true, isValidating: false },
+                    });
                     setState({
                         isLoading: false,
                         errorMessage: `The BSB number "${text}" does not exist`,
@@ -75,7 +81,9 @@ function FormElementBSB({ id, formId, element, value, onChange, validationMessag
                             setText(e.target.value);
                         }, required: element.required, disabled: element.readOnly, onBlur: () => {
                             if (text === 'xxx-xxx') {
-                                onChange(element, undefined);
+                                onChange(element, {
+                                    value: undefined,
+                                });
                             }
                             setIsDirty();
                         } })),

package/dist/form-elements/FormElementBSB.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementBSB.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBSB.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,SAAS,MAAM,kBAAkB,CAAA;AACxC,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAc5C,SAAS,cAAc,CAAC,EACtB,EAAE,EACF,MAAM,EACN,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;IAC9E,MAAM,aAAa,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAE9C,MAAM,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAItE;QACD,SAAS,EAAE,KAAK;QAChB,YAAY,EAAE,IAAI;QAClB,SAAS,EAAE,IAAI;KAChB,CAAC,CAAA;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,SAAS,EAAE;YACb,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;~~SACjC~~;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAEzC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,IAAI,KAAK,EAAE,EAAE;YACf,OAAM;SACP;QAED,IAAI,CAAC,aAAa,EAAE;YAClB,QAAQ,CAAC;gBACP,SAAS,EAAE,KAAK;gBAChB,YAAY,EAAE,IAAI;gBAClB,SAAS,EAAE,IAAI;aAChB,CAAC,CAAA;YACF,OAAM;SACP;QAED,QAAQ,CAAC;YACP,SAAS,EAAE,IAAI;YACf,YAAY,EAAE,IAAI;YAClB,SAAS,EAAE,IAAI;SAChB,CAAC,CAAA;QAEF,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAAA;QAC7C,MAAM,YAAY,GAAG,KAAK,IAAI,EAAE;YAC9B,QAAQ,CAAC,OAAO,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAA;~~YAC3D~~,IAAI;gBACF,MAAM,SAAS,GAAG,MAAM,WAAW,CAAC,YAAY,CAC9C,MAAM,EACN,IAAI,EACJ,eAAe,CAAC,MAAM,CACvB,CAAA;gBACD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,OAAO,EAAE;oBACnC,QAAQ,CAAC;wBACP,SAAS,EAAE,KAAK;wBAChB,YAAY,EAAE,IAAI;wBAClB,SAAS;qBACV,CAAC,CAAA;iBACH;aACF;YAAC,OAAO,KAAK,EAAE;gBACd,OAAO,CAAC,IAAI,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAA;gBAClD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,OAAO,EAAE;oBACnC,QAAQ,CAAC,OAAO,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAA;~~oBAC3D~~,QAAQ,CAAC;wBACP,SAAS,EAAE,KAAK;wBAChB,YAAY,EAAE,mBAAmB,IAAI,kBAAkB;wBACvD,SAAS,EAAE,IAAI;qBAChB,CAAC,CAAA;iBACH;aACF;QACH,CAAC,CAAA;QAED,YAAY,EAAE,CAAA;QAEd,OAAO,GAAG,EAAE;YACV,eAAe,CAAC,KAAK,EAAE,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAA;IAEpD,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB;QAClC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,QAAQ,EAClB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BACE,SAAS,EAAE,IAAI,CAAC,qBAAqB,EAAE;wBACrC,YAAY,EAAE,SAAS;qBACxB,CAAC;oBAEF,oBAAC,SAAS,IACR,IAAI,EAAC,SAAS,EACd,QAAQ,EAAC,GAAG,EACZ,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,oCAAoC,EAC9C,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;4BACd,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;wBACzB,CAAC,EACD,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,GAAG,EAAE;4BACX,IAAI,IAAI,KAAK,SAAS,EAAE;gCACtB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;~~6BAC7B~~;4BACD,UAAU,EAAE,CAAA;wBACd,CAAC,GACD,CACE;gBACL,SAAS,IAAI,CACZ,6BAAK,SAAS,EAAC,gCAAgC;oBAC7C,2BAAG,SAAS,EAAC,wCAAwC;wBAClD,SAAS,CAAC,4BAA4B;;wBAAK,SAAS,CAAC,IAAI,CACxD,CACA,CACP;gBACA,CAAC,CAAC,OAAO,CAAC,QAAQ,IAAI,CAAC,CAAC,KAAK,IAAI,CAChC,6BAAK,SAAS,EAAC,SAAS;oBACtB,oBAAC,qBAAqB,IACpB,SAAS,EAAC,oEAAoE,EAC9E,IAAI,EAAE,IAAI,GACV,CACE,CACP;gBACD,oBAAC,YAAY,IACX,aAAa,QACb,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,OAAO,CAAC,YAAY,GACxC,CACE;YACL,CAAC,CAAC,CAAC,OAAO,IAAI,wBAAwB,CAAC;gBACtC,CAAC,CAAC,iBAAiB;gBACnB,CAAC,SAAS,CAAC;gBACX,YAAY,CAAC,IAAI,CACjB,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;gBAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,YAAY,IAAI,iBAAiB,CAC9B,CACF,CACP,CACyB,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport InputMask from 'react-input-mask'\nimport clsx from 'clsx'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { formService } from '@oneblink/apps'\n\ntype Props = {\n id: string\n formId: number\n element: FormTypes.BSBElement\n value: unknown\n onChange: FormElementValueChangeHandler<\n string \| { isInvalid: boolean; isValidating: boolean }\n >\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementBSB({\n id,\n formId,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [text, setText] = React.useState(typeof value === 'string' ? value : '')\n const isValidFormat = /\\d{3}-\\d{3}/.test(text)\n\n const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState<{\n isLoading: boolean\n errorMessage: string \| null\n bsbRecord: MiscTypes.BSBRecord \| null\n }>({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n\n React.useEffect(() => {\n if (bsbRecord) {\n onChange(element, bsbRecord.bsb)\n }\n }, [bsbRecord, element, onChange, value])\n\n React.useEffect(() => {\n if (text === '') {\n return\n }\n\n if (!isValidFormat) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n return\n }\n\n setState({\n isLoading: true,\n errorMessage: null,\n bsbRecord: null,\n })\n\n const abortController = new AbortController()\n const getBSBRecord = async () => {\n onChange(element, { isValidating: true, isInvalid: false })\n try {\n const bsbRecord = await formService.getBSBRecord(\n formId,\n text,\n abortController.signal,\n )\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord,\n })\n }\n } catch (error) {\n console.warn('Error validating BSB number', error)\n if (!abortController.signal.aborted) {\n onChange(element, { isInvalid: true, isValidating: false })\n setState({\n isLoading: false,\n errorMessage: `The BSB number \"${text}\" does not exist`,\n bsbRecord: null,\n })\n }\n }\n }\n\n getBSBRecord()\n\n return () => {\n abortController.abort()\n }\n }, [formId, isValidFormat, text, onChange, element])\n\n return (\n <div className=\"cypress-bsb-element\">\n <FormElementLabelContainer\n className=\"ob-bsb\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask=\"999-999\"\n maskChar=\"x\"\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-bsb-control\"\n value={text}\n onChange={(e) => {\n setText(e.target.value)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n if (text === 'xxx-xxx') {\n onChange(element, undefined)\n }\n setIsDirty()\n }}\n />\n </div>\n {bsbRecord && (\n <div className=\"control ob-bsb__record-control\">\n <a className=\"button is-static ob-bsb__record-button\">\n {bsbRecord.financialInstitutionMnemonic} - {bsbRecord.name}\n </a>\n </div>\n )}\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {(((isDirty \|\| displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) \|\|\n errorMessage) && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {errorMessage \|\| validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBSB)\n"]}
1	+ {"version":3,"file":"FormElementBSB.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBSB.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport InputMask from 'react-input-mask'\nimport clsx from 'clsx'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes, MiscTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport { formService } from '@oneblink/apps'\n\ntype Props = {\n id: string\n formId: number\n element: FormTypes.BSBElement\n value: unknown\n onChange: FormElementValueChangeHandler<\n string \| { isInvalid: boolean; isValidating: boolean }\n >\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementBSB({\n id,\n formId,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [text, setText] = React.useState(typeof value === 'string' ? value : '')\n const isValidFormat = /\\d{3}-\\d{3}/.test(text)\n\n const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState<{\n isLoading: boolean\n errorMessage: string \| null\n bsbRecord: MiscTypes.BSBRecord \| null\n }>({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n\n React.useEffect(() => {\n if (bsbRecord) {\n onChange(element, {\n value: bsbRecord.bsb,\n })\n }\n }, [bsbRecord, element, onChange, value])\n\n React.useEffect(() => {\n if (text === '') {\n return\n }\n\n if (!isValidFormat) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord: null,\n })\n return\n }\n\n setState({\n isLoading: true,\n errorMessage: null,\n bsbRecord: null,\n })\n\n const abortController = new AbortController()\n const getBSBRecord = async () => {\n onChange(element, {\n value: { isValidating: true, isInvalid: false },\n })\n try {\n const bsbRecord = await formService.getBSBRecord(\n formId,\n text,\n abortController.signal,\n )\n if (!abortController.signal.aborted) {\n setState({\n isLoading: false,\n errorMessage: null,\n bsbRecord,\n })\n }\n } catch (error) {\n console.warn('Error validating BSB number', error)\n if (!abortController.signal.aborted) {\n onChange(element, {\n value: { isInvalid: true, isValidating: false },\n })\n setState({\n isLoading: false,\n errorMessage: `The BSB number \"${text}\" does not exist`,\n bsbRecord: null,\n })\n }\n }\n }\n\n getBSBRecord()\n\n return () => {\n abortController.abort()\n }\n }, [formId, isValidFormat, text, onChange, element])\n\n return (\n <div className=\"cypress-bsb-element\">\n <FormElementLabelContainer\n className=\"ob-bsb\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div\n className={clsx('control is-expanded', {\n 'is-loading': isLoading,\n })}\n >\n <InputMask\n mask=\"999-999\"\n maskChar=\"x\"\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-bsb-control\"\n value={text}\n onChange={(e) => {\n setText(e.target.value)\n }}\n required={element.required}\n disabled={element.readOnly}\n onBlur={() => {\n if (text === 'xxx-xxx') {\n onChange(element, {\n value: undefined,\n })\n }\n setIsDirty()\n }}\n />\n </div>\n {bsbRecord && (\n <div className=\"control ob-bsb__record-control\">\n <a className=\"button is-static ob-bsb__record-button\">\n {bsbRecord.financialInstitutionMnemonic} - {bsbRecord.name}\n </a>\n </div>\n )}\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n {(((isDirty \|\| displayValidationMessage) &&\n !!validationMessage &&\n !isLoading) \|\|\n errorMessage) && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {errorMessage \|\| validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBSB)\n"]}

package/dist/form-elements/FormElementBarcodeScanner.js CHANGED Viewed

@@ -19,7 +19,9 @@ function FormElementBarcodeScanner({ id, element, value, onChange, validationMes
     const { onLookup } = useLookupNotification(value);
     const handleScan = React.useCallback((newValue) => {
         setIsDirty();
-        onChange(element, newValue);
+        onChange(element, {
+            value: newValue,
+        });
         stopBarcodeScanner();
         onLookup();
     }, [element, onChange, onLookup, setIsDirty, stopBarcodeScanner]);
@@ -57,7 +59,9 @@ function FormElementBarcodeScanner({ id, element, value, onChange, validationMes
             isCameraOpen ? (React.createElement(BarcodeScanner, { element: element, onScan: handleScan, onClose: stopBarcodeScanner })) : (React.createElement("div", null,
                 React.createElement("div", { className: "field has-addons" },
                     React.createElement("div", { className: "control is-expanded has-icons-right" },
-                        React.createElement("input", { type: "text", placeholder: element.placeholderValue, id: id, name: element.name, className: "input ob-input cypress-barcode-scanner-control has-margin-bottom-8", value: text, onChange: (e) => onChange(element, e.target.value || undefined), required: element.required, disabled: element.readOnly, onBlur: setIsDirty }),
+                        React.createElement("input", { type: "text", placeholder: element.placeholderValue, id: id, name: element.name, className: "input ob-input cypress-barcode-scanner-control has-margin-bottom-8", value: text, onChange: (e) => onChange(element, {
+                                value: e.target.value || undefined,
+                            }), required: element.required, disabled: element.readOnly, onBlur: setIsDirty }),
                         React.createElement("span", { className: "ob-input-icon icon is-small is-right" },
                             React.createElement("i", { className: "material-icons is-size-5" }, "document_scanner"))),
                     !!element.readOnly && !!value && (React.createElement("div", { className: "control" },

package/dist/form-elements/FormElementBarcodeScanner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementBarcodeScanner.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBarcodeScanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport jsQR from 'jsqr'\n\nimport OnLoading from '../components/renderer/OnLoading'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport quaggaReader from '../services/barcode-readers/quagger.js'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Sentry } from '@oneblink/apps'\nimport useLookupNotification from '../hooks/useLookupNotification'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\nconst MS_BETWEEN_IMAGE_PROCESSING = 10\nconst fadedSquareWidthInPixels = 200\nconst fadedSquareHeightInPixels = 150\nconst redLineHeightInPixels = 1\n\ntype Props = {\n id: string\n element: FormTypes.BarcodeScannerElement\n value: unknown \| undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementBarcodeScanner({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [isCameraOpen, startBarcodeScanner, stopBarcodeScanner] =\n useBooleanState(false)\n const [error, setError] = React.useState<Error \| null>(null)\n\n const { onLookup } = useLookupNotification(value)\n const handleScan = React.useCallback(\n (newValue: string \| undefined) => {\n setIsDirty()\n onChange(element, newValue)\n stopBarcodeScanner()\n onLookup()\n },\n [element, onChange, onLookup, setIsDirty, stopBarcodeScanner],\n )\n\n const openBarcodeScanner = React.useCallback(() => {\n if (window.cordova) {\n setError(null)\n // @ts-expect-error ???\n window.cordova.plugins.barcodeScanner.scan(\n // @ts-expect-error ???\n (result) => {\n if (!result.cancelled) {\n handleScan(result.text)\n }\n },\n // @ts-expect-error ???\n (error) => {\n setError(\n new Error(\n `An error has occurred: \"${error}\". Please click \"Cancel\" below to try again. If the problem persists, please contact support.`,\n ),\n )\n },\n {\n showFlipCameraButton: true,\n showTorchButton: true,\n },\n )\n } else {\n startBarcodeScanner()\n }\n }, [handleScan, startBarcodeScanner])\n\n const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-barcode-scanner-element\">\n <FormElementLabelContainer\n className=\"ob-barcode-scanner\"\n element={element}\n id={id}\n required={element.required}\n >\n {error && (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <div>\n <h4 className=\"title is-4\">Whoops...</h4>\n <p>{error.message}</p>\n </div>\n </div>\n </figure>\n )}\n\n {isCameraOpen ? (\n <BarcodeScanner\n element={element}\n onScan={handleScan}\n onClose={stopBarcodeScanner}\n />\n ) : (\n <div>\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-barcode-scanner-control has-margin-bottom-8\"\n value={text}\n onChange={(e) =>\n onChange(element, e.target.value \|\| undefined)\n }\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5\">document_scanner</i>\n </span>\n </div>\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-start-scan-barcode-button\"\n disabled={element.readOnly}\n onClick={openBarcodeScanner}\n >\n Scan Barcode\n </button>\n </div>\n )}\n\n {(isDirty \|\| displayValidationMessage) && !!validationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBarcodeScanner)\n\ntype BarcodeScannerProps = {\n element: FormTypes.BarcodeScannerElement\n onScan: (barcode: string \| undefined) => void\n onClose: () => void\n}\n\nfunction BarcodeScanner({ element, onScan, onClose }: BarcodeScannerProps) {\n const videoElementRef = React.useRef<HTMLVideoElement>(null)\n const figureElementRef = React.useRef<HTMLDivElement>(null)\n\n const [{ isLoading = false, selectedDeviceId, error }, setState] =\n React.useState<{\n isLoading: boolean\n selectedDeviceId: string \| undefined\n error: Error \| undefined\n }>({\n isLoading: true,\n selectedDeviceId: undefined,\n error: undefined,\n })\n const [camera, setCamera] = React.useState<HTML5Camera \| null>(null)\n\n const setError = React.useCallback((error: Error) => {\n setState({\n error,\n isLoading: false,\n selectedDeviceId: undefined,\n })\n }, [])\n\n // Create timeout using $timeout outside of the scan function so\n // so that we can cancel it when navigating away from screen\n const scanImageForBarcode = React.useCallback(\n (\n videoElement: HTMLVideoElement,\n waitInMS: number,\n options: {\n sourceX: number\n sourceY: number\n sourceWidth: number\n sourceHeight: number\n },\n checkStop: () => boolean,\n ) => {\n const restrictedBarcodeTypes = element.restrictedBarcodeTypes \|\| []\n // Using $timeout here instead of $interval as we dont know\n // exactly how long each processing of the image will take.\n setTimeout(async () => {\n if (checkStop()) return\n const canvasElement = document.createElement('canvas')\n\n canvasElement.width = options.sourceWidth\n canvasElement.height = options.sourceHeight\n\n const canvasContext = canvasElement.getContext('2d')\n if (canvasContext) {\n canvasContext.drawImage(\n videoElement,\n options.sourceX,\n options.sourceY,\n canvasElement.width,\n canvasElement.height,\n 0,\n 0,\n canvasElement.width,\n canvasElement.height,\n )\n\n if (\n !element.restrictBarcodeTypes \|\|\n (element.restrictedBarcodeTypes \|\| []).indexOf('qr_reader') > -1\n ) {\n const imageData = canvasContext.getImageData(\n 0,\n 0,\n canvasElement.width,\n canvasElement.height,\n )\n\n const code = jsQR(\n imageData.data,\n imageData.width,\n imageData.height,\n {\n inversionAttempts: 'dontInvert',\n },\n )\n\n if (code) {\n return onScan(code.data)\n }\n }\n }\n\n if (\n !element.restrictBarcodeTypes \|\|\n !(\n restrictedBarcodeTypes.length === 1 &&\n restrictedBarcodeTypes[0] === 'qr_reader'\n )\n ) {\n const base64Image = canvasElement.toDataURL('image/png')\n const quaggaResult = await quaggaReader(\n base64Image,\n restrictedBarcodeTypes,\n )\n if (quaggaResult) {\n return onScan(quaggaResult)\n }\n }\n\n if (checkStop()) return\n\n scanImageForBarcode(\n videoElement,\n MS_BETWEEN_IMAGE_PROCESSING,\n options,\n checkStop,\n )\n }, waitInMS)\n },\n [element.restrictBarcodeTypes, element.restrictedBarcodeTypes, onScan],\n )\n\n const switchCamera = React.useCallback(() => {\n if (!camera) {\n return\n }\n\n // We will just be rotating between the available camera.\n const nextDeviceIndex =\n camera.availableDevices.findIndex(\n (mediaDeviceInfo) => mediaDeviceInfo.deviceId === camera.activeDeviceId,\n ) + 1\n const nextDevice =\n camera.availableDevices[nextDeviceIndex] \|\| camera.availableDevices[0]\n setState({\n error: undefined,\n isLoading: true,\n selectedDeviceId: nextDevice.deviceId,\n })\n }, [camera])\n\n React.useEffect(() => {\n if (!videoElementRef.current) {\n return\n }\n\n const newCamera = new HTML5Camera(videoElementRef.current)\n setCamera(newCamera)\n\n return () => {\n newCamera.close()\n }\n }, [])\n\n React.useEffect(() => {\n if (\n !camera \|\|\n error \|\|\n // If attempting to open the device that is currently open,\n // we will not attempt to open again.\n (selectedDeviceId && camera.activeDeviceId === selectedDeviceId)\n ) {\n return\n }\n\n let ignore = false\n\n ;(async () => {\n try {\n const videoElement = videoElementRef.current\n const figureElement = figureElementRef.current\n if (!videoElement \|\| !figureElement) {\n return\n }\n\n console.log('Opening camera with:', selectedDeviceId \|\| 'UNKNOWN')\n await camera.open(selectedDeviceId)\n\n if (ignore) {\n return\n }\n\n setState({\n error: undefined,\n isLoading: false,\n selectedDeviceId,\n })\n\n // @ts-expect-error ???\n const fadedSquareElement: HTMLDivElement =\n figureElement.getElementsByClassName('ob-barcode-scanner__square')[0]\n // @ts-expect-error ???\n const redLineElement: HTMLDivElement =\n figureElement.getElementsByClassName('ob-barcode-scanner__line')[0]\n console.log('videoElement Width pixels', videoElement.clientWidth)\n console.log('videoElement Height pixels', videoElement.clientHeight)\n console.log('videoElement Width', videoElement.videoWidth)\n console.log('videoElement Height', videoElement.videoHeight)\n\n // Faded Square needs its values set in pixels\n const fadedSquareLeftInPixels =\n (videoElement.clientWidth - fadedSquareWidthInPixels) / 2\n console.log('fadedSquareLeftInPixels', fadedSquareLeftInPixels)\n const fadedSquareTopInPixels =\n (videoElement.clientHeight - fadedSquareHeightInPixels) / 2\n console.log('fadedSquareTopInPixels', fadedSquareTopInPixels)\n\n fadedSquareElement.style.borderBottom = `${fadedSquareTopInPixels}px`\n fadedSquareElement.style.borderTop = `${fadedSquareTopInPixels}px`\n fadedSquareElement.style.borderLeft = `${fadedSquareLeftInPixels}px`\n fadedSquareElement.style.borderRight = `${fadedSquareLeftInPixels}px`\n fadedSquareElement.style.borderColor = 'rgba(0, 0, 0, 0.25)'\n fadedSquareElement.style.borderStyle = 'solid'\n\n redLineElement.style.height = `${redLineHeightInPixels}px`\n redLineElement.style.top = `${\n (videoElement.clientHeight - redLineHeightInPixels) / 2\n }px`\n redLineElement.style.left = `${fadedSquareLeftInPixels}px`\n redLineElement.style.right = `${fadedSquareLeftInPixels}px`\n\n // Need to calculate the actual width, which is not in pixels\n const ratio = videoElement.videoWidth / videoElement.clientWidth\n console.log('pixel to video Ratio', ratio)\n\n const left = ratio * fadedSquareLeftInPixels\n console.log('left in video measurement', left)\n const top = ratio * fadedSquareTopInPixels\n console.log('top in video measurement', top)\n\n const fadedSquareWidth = fadedSquareWidthInPixels * ratio\n console.log('red square in video measurement', fadedSquareWidth)\n\n // Wait a little before scanning the first image\n // to prevent image processing staring before\n // camera is ready.\n scanImageForBarcode(\n videoElement,\n 250,\n {\n sourceX: left,\n sourceY: top,\n sourceWidth: fadedSquareWidth,\n sourceHeight: fadedSquareWidth,\n },\n () => ignore,\n )\n } catch (error) {\n if (ignore) {\n return\n }\n console.warn('Error while attempting to open camera', error)\n Sentry.captureException(error)\n switch ((error as Error).name) {\n case 'NotSupportedError': {\n setError(\n new Error(\n 'Your browser does not support accessing your camera. Please click \"Cancel\" below and type in the barcode value manually.',\n ),\n )\n break\n }\n case 'NotAllowedError': {\n setError(\n new Error(\n 'Cannot scan for barcodes without granting the application access to the camera. Please click \"Cancel\" below to try again.',\n ),\n )\n break\n }\n default: {\n setError(\n new Error(\n 'An unknown error has occurred, please click \"Cancel\" below to try again. If the problem persists, please contact support.',\n ),\n )\n }\n }\n }\n })()\n\n return () => {\n ignore = true\n }\n }, [camera, error, scanImageForBarcode, selectedDeviceId, setError])\n\n return (\n <div>\n <figure className=\"ob-figure\" ref={figureElementRef}>\n <div className=\"figure-content has-text-centered\">\n {isLoading && <OnLoading small />}\n\n {!!error && (\n <div>\n <h4 className=\"title is-4\">Whoops...</h4>\n <p>{error.message}</p>\n </div>\n )}\n\n <div\n className={clsx('is-relative', {\n 'is-hidden': isLoading \|\| error,\n })}\n >\n <div className=\"ob-barcode-scanner__square\"></div>\n <div className=\"ob-barcode-scanner__line\"></div>\n <video\n ref={videoElementRef}\n autoPlay\n playsInline\n className=\"ob-barcode-scanner__video\"\n />\n </div>\n </div>\n </figure>\n\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button ob-button__cancel is-light cypress-cancel-scan-barcode-button\"\n onClick={onClose}\n >\n Cancel\n </button>\n {(camera?.availableDevices.length \|\| 1) > 1 && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__switch-camera is-primary cypress-switch-camera-button\"\n onClick={switchCamera}\n >\n Switch Camera\n </button>\n )}\n </div>\n </div>\n )\n}\n\nclass HTML5Camera {\n availableDevices: MediaDeviceInfo[]\n htmlVideoElement: HTMLVideoElement\n mediaStream: MediaStream \| undefined\n\n constructor(htmlVideoElement: HTMLVideoElement) {\n this.htmlVideoElement = htmlVideoElement\n this.availableDevices = []\n this.mediaStream = undefined\n }\n\n get activeDeviceId(): string \| undefined {\n if (this.mediaStream) {\n const [activeMediaStreamTrack] = this.mediaStream.getTracks()\n return activeMediaStreamTrack?.getSettings()?.deviceId\n }\n }\n\n async open(deviceId?: string) {\n if (!navigator.mediaDevices \|\| !navigator.mediaDevices.getUserMedia) {\n const error = new Error()\n error.name = 'NotSupportedError'\n throw error\n }\n\n this.close()\n\n const constraints = {\n video: {\n facingMode: deviceId ? undefined : 'environment',\n deviceId: deviceId ? { exact: deviceId } : undefined,\n },\n }\n const mediaStream = await navigator.mediaDevices.getUserMedia(constraints)\n this.mediaStream = mediaStream\n this.htmlVideoElement.srcObject = mediaStream\n\n if (!this.availableDevices.length) {\n const availableDevices = await navigator.mediaDevices.enumerateDevices()\n this.availableDevices = availableDevices.filter(\n (mediaDeviceInfo) =>\n mediaDeviceInfo.kind === 'videoinput' && !!mediaDeviceInfo.deviceId,\n )\n }\n\n await new Promise((resolve) =>\n this.htmlVideoElement.addEventListener('canplay', resolve, {\n once: true,\n }),\n )\n }\n\n close() {\n if (this.mediaStream) {\n this.mediaStream.getTracks().forEach((track) => {\n track.stop()\n })\n this.mediaStream = undefined\n }\n }\n}\n"]}
1	+ {"version":3,"file":"FormElementBarcodeScanner.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBarcodeScanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport jsQR from 'jsqr'\n\nimport OnLoading from '../components/renderer/OnLoading'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport quaggaReader from '../services/barcode-readers/quagger.js'\nimport useBooleanState from '../hooks/useBooleanState'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Sentry } from '@oneblink/apps'\nimport useLookupNotification from '../hooks/useLookupNotification'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\nconst MS_BETWEEN_IMAGE_PROCESSING = 10\nconst fadedSquareWidthInPixels = 200\nconst fadedSquareHeightInPixels = 150\nconst redLineHeightInPixels = 1\n\ntype Props = {\n id: string\n element: FormTypes.BarcodeScannerElement\n value: unknown \| undefined\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementBarcodeScanner({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [isCameraOpen, startBarcodeScanner, stopBarcodeScanner] =\n useBooleanState(false)\n const [error, setError] = React.useState<Error \| null>(null)\n\n const { onLookup } = useLookupNotification(value)\n const handleScan = React.useCallback(\n (newValue: string \| undefined) => {\n setIsDirty()\n onChange(element, {\n value: newValue,\n })\n stopBarcodeScanner()\n onLookup()\n },\n [element, onChange, onLookup, setIsDirty, stopBarcodeScanner],\n )\n\n const openBarcodeScanner = React.useCallback(() => {\n if (window.cordova) {\n setError(null)\n // @ts-expect-error ???\n window.cordova.plugins.barcodeScanner.scan(\n // @ts-expect-error ???\n (result) => {\n if (!result.cancelled) {\n handleScan(result.text)\n }\n },\n // @ts-expect-error ???\n (error) => {\n setError(\n new Error(\n `An error has occurred: \"${error}\". Please click \"Cancel\" below to try again. If the problem persists, please contact support.`,\n ),\n )\n },\n {\n showFlipCameraButton: true,\n showTorchButton: true,\n },\n )\n } else {\n startBarcodeScanner()\n }\n }, [handleScan, startBarcodeScanner])\n\n const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-barcode-scanner-element\">\n <FormElementLabelContainer\n className=\"ob-barcode-scanner\"\n element={element}\n id={id}\n required={element.required}\n >\n {error && (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <div>\n <h4 className=\"title is-4\">Whoops...</h4>\n <p>{error.message}</p>\n </div>\n </div>\n </figure>\n )}\n\n {isCameraOpen ? (\n <BarcodeScanner\n element={element}\n onScan={handleScan}\n onClose={stopBarcodeScanner}\n />\n ) : (\n <div>\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"text\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-barcode-scanner-control has-margin-bottom-8\"\n value={text}\n onChange={(e) =>\n onChange(element, {\n value: e.target.value \|\| undefined,\n })\n }\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5\">document_scanner</i>\n </span>\n </div>\n {!!element.readOnly && !!value && (\n <div className=\"control\">\n <CopyToClipboardButton\n className=\"button is-input-addon copy-button cypress-copy-to-clipboard-button\"\n text={text}\n />\n </div>\n )}\n <LookupButton\n isInputButton\n value={value}\n validationMessage={validationMessage}\n lookupButtonConfig={element.lookupButton}\n />\n </div>\n\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-start-scan-barcode-button\"\n disabled={element.readOnly}\n onClick={openBarcodeScanner}\n >\n Scan Barcode\n </button>\n </div>\n )}\n\n {(isDirty \|\| displayValidationMessage) && !!validationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBarcodeScanner)\n\ntype BarcodeScannerProps = {\n element: FormTypes.BarcodeScannerElement\n onScan: (barcode: string \| undefined) => void\n onClose: () => void\n}\n\nfunction BarcodeScanner({ element, onScan, onClose }: BarcodeScannerProps) {\n const videoElementRef = React.useRef<HTMLVideoElement>(null)\n const figureElementRef = React.useRef<HTMLDivElement>(null)\n\n const [{ isLoading = false, selectedDeviceId, error }, setState] =\n React.useState<{\n isLoading: boolean\n selectedDeviceId: string \| undefined\n error: Error \| undefined\n }>({\n isLoading: true,\n selectedDeviceId: undefined,\n error: undefined,\n })\n const [camera, setCamera] = React.useState<HTML5Camera \| null>(null)\n\n const setError = React.useCallback((error: Error) => {\n setState({\n error,\n isLoading: false,\n selectedDeviceId: undefined,\n })\n }, [])\n\n // Create timeout using $timeout outside of the scan function so\n // so that we can cancel it when navigating away from screen\n const scanImageForBarcode = React.useCallback(\n (\n videoElement: HTMLVideoElement,\n waitInMS: number,\n options: {\n sourceX: number\n sourceY: number\n sourceWidth: number\n sourceHeight: number\n },\n checkStop: () => boolean,\n ) => {\n const restrictedBarcodeTypes = element.restrictedBarcodeTypes \|\| []\n // Using $timeout here instead of $interval as we dont know\n // exactly how long each processing of the image will take.\n setTimeout(async () => {\n if (checkStop()) return\n const canvasElement = document.createElement('canvas')\n\n canvasElement.width = options.sourceWidth\n canvasElement.height = options.sourceHeight\n\n const canvasContext = canvasElement.getContext('2d')\n if (canvasContext) {\n canvasContext.drawImage(\n videoElement,\n options.sourceX,\n options.sourceY,\n canvasElement.width,\n canvasElement.height,\n 0,\n 0,\n canvasElement.width,\n canvasElement.height,\n )\n\n if (\n !element.restrictBarcodeTypes \|\|\n (element.restrictedBarcodeTypes \|\| []).indexOf('qr_reader') > -1\n ) {\n const imageData = canvasContext.getImageData(\n 0,\n 0,\n canvasElement.width,\n canvasElement.height,\n )\n\n const code = jsQR(\n imageData.data,\n imageData.width,\n imageData.height,\n {\n inversionAttempts: 'dontInvert',\n },\n )\n\n if (code) {\n return onScan(code.data)\n }\n }\n }\n\n if (\n !element.restrictBarcodeTypes \|\|\n !(\n restrictedBarcodeTypes.length === 1 &&\n restrictedBarcodeTypes[0] === 'qr_reader'\n )\n ) {\n const base64Image = canvasElement.toDataURL('image/png')\n const quaggaResult = await quaggaReader(\n base64Image,\n restrictedBarcodeTypes,\n )\n if (quaggaResult) {\n return onScan(quaggaResult)\n }\n }\n\n if (checkStop()) return\n\n scanImageForBarcode(\n videoElement,\n MS_BETWEEN_IMAGE_PROCESSING,\n options,\n checkStop,\n )\n }, waitInMS)\n },\n [element.restrictBarcodeTypes, element.restrictedBarcodeTypes, onScan],\n )\n\n const switchCamera = React.useCallback(() => {\n if (!camera) {\n return\n }\n\n // We will just be rotating between the available camera.\n const nextDeviceIndex =\n camera.availableDevices.findIndex(\n (mediaDeviceInfo) => mediaDeviceInfo.deviceId === camera.activeDeviceId,\n ) + 1\n const nextDevice =\n camera.availableDevices[nextDeviceIndex] \|\| camera.availableDevices[0]\n setState({\n error: undefined,\n isLoading: true,\n selectedDeviceId: nextDevice.deviceId,\n })\n }, [camera])\n\n React.useEffect(() => {\n if (!videoElementRef.current) {\n return\n }\n\n const newCamera = new HTML5Camera(videoElementRef.current)\n setCamera(newCamera)\n\n return () => {\n newCamera.close()\n }\n }, [])\n\n React.useEffect(() => {\n if (\n !camera \|\|\n error \|\|\n // If attempting to open the device that is currently open,\n // we will not attempt to open again.\n (selectedDeviceId && camera.activeDeviceId === selectedDeviceId)\n ) {\n return\n }\n\n let ignore = false\n\n ;(async () => {\n try {\n const videoElement = videoElementRef.current\n const figureElement = figureElementRef.current\n if (!videoElement \|\| !figureElement) {\n return\n }\n\n console.log('Opening camera with:', selectedDeviceId \|\| 'UNKNOWN')\n await camera.open(selectedDeviceId)\n\n if (ignore) {\n return\n }\n\n setState({\n error: undefined,\n isLoading: false,\n selectedDeviceId,\n })\n\n // @ts-expect-error ???\n const fadedSquareElement: HTMLDivElement =\n figureElement.getElementsByClassName('ob-barcode-scanner__square')[0]\n // @ts-expect-error ???\n const redLineElement: HTMLDivElement =\n figureElement.getElementsByClassName('ob-barcode-scanner__line')[0]\n console.log('videoElement Width pixels', videoElement.clientWidth)\n console.log('videoElement Height pixels', videoElement.clientHeight)\n console.log('videoElement Width', videoElement.videoWidth)\n console.log('videoElement Height', videoElement.videoHeight)\n\n // Faded Square needs its values set in pixels\n const fadedSquareLeftInPixels =\n (videoElement.clientWidth - fadedSquareWidthInPixels) / 2\n console.log('fadedSquareLeftInPixels', fadedSquareLeftInPixels)\n const fadedSquareTopInPixels =\n (videoElement.clientHeight - fadedSquareHeightInPixels) / 2\n console.log('fadedSquareTopInPixels', fadedSquareTopInPixels)\n\n fadedSquareElement.style.borderBottom = `${fadedSquareTopInPixels}px`\n fadedSquareElement.style.borderTop = `${fadedSquareTopInPixels}px`\n fadedSquareElement.style.borderLeft = `${fadedSquareLeftInPixels}px`\n fadedSquareElement.style.borderRight = `${fadedSquareLeftInPixels}px`\n fadedSquareElement.style.borderColor = 'rgba(0, 0, 0, 0.25)'\n fadedSquareElement.style.borderStyle = 'solid'\n\n redLineElement.style.height = `${redLineHeightInPixels}px`\n redLineElement.style.top = `${\n (videoElement.clientHeight - redLineHeightInPixels) / 2\n }px`\n redLineElement.style.left = `${fadedSquareLeftInPixels}px`\n redLineElement.style.right = `${fadedSquareLeftInPixels}px`\n\n // Need to calculate the actual width, which is not in pixels\n const ratio = videoElement.videoWidth / videoElement.clientWidth\n console.log('pixel to video Ratio', ratio)\n\n const left = ratio * fadedSquareLeftInPixels\n console.log('left in video measurement', left)\n const top = ratio * fadedSquareTopInPixels\n console.log('top in video measurement', top)\n\n const fadedSquareWidth = fadedSquareWidthInPixels * ratio\n console.log('red square in video measurement', fadedSquareWidth)\n\n // Wait a little before scanning the first image\n // to prevent image processing staring before\n // camera is ready.\n scanImageForBarcode(\n videoElement,\n 250,\n {\n sourceX: left,\n sourceY: top,\n sourceWidth: fadedSquareWidth,\n sourceHeight: fadedSquareWidth,\n },\n () => ignore,\n )\n } catch (error) {\n if (ignore) {\n return\n }\n console.warn('Error while attempting to open camera', error)\n Sentry.captureException(error)\n switch ((error as Error).name) {\n case 'NotSupportedError': {\n setError(\n new Error(\n 'Your browser does not support accessing your camera. Please click \"Cancel\" below and type in the barcode value manually.',\n ),\n )\n break\n }\n case 'NotAllowedError': {\n setError(\n new Error(\n 'Cannot scan for barcodes without granting the application access to the camera. Please click \"Cancel\" below to try again.',\n ),\n )\n break\n }\n default: {\n setError(\n new Error(\n 'An unknown error has occurred, please click \"Cancel\" below to try again. If the problem persists, please contact support.',\n ),\n )\n }\n }\n }\n })()\n\n return () => {\n ignore = true\n }\n }, [camera, error, scanImageForBarcode, selectedDeviceId, setError])\n\n return (\n <div>\n <figure className=\"ob-figure\" ref={figureElementRef}>\n <div className=\"figure-content has-text-centered\">\n {isLoading && <OnLoading small />}\n\n {!!error && (\n <div>\n <h4 className=\"title is-4\">Whoops...</h4>\n <p>{error.message}</p>\n </div>\n )}\n\n <div\n className={clsx('is-relative', {\n 'is-hidden': isLoading \|\| error,\n })}\n >\n <div className=\"ob-barcode-scanner__square\"></div>\n <div className=\"ob-barcode-scanner__line\"></div>\n <video\n ref={videoElementRef}\n autoPlay\n playsInline\n className=\"ob-barcode-scanner__video\"\n />\n </div>\n </div>\n </figure>\n\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button ob-button__cancel is-light cypress-cancel-scan-barcode-button\"\n onClick={onClose}\n >\n Cancel\n </button>\n {(camera?.availableDevices.length \|\| 1) > 1 && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__switch-camera is-primary cypress-switch-camera-button\"\n onClick={switchCamera}\n >\n Switch Camera\n </button>\n )}\n </div>\n </div>\n )\n}\n\nclass HTML5Camera {\n availableDevices: MediaDeviceInfo[]\n htmlVideoElement: HTMLVideoElement\n mediaStream: MediaStream \| undefined\n\n constructor(htmlVideoElement: HTMLVideoElement) {\n this.htmlVideoElement = htmlVideoElement\n this.availableDevices = []\n this.mediaStream = undefined\n }\n\n get activeDeviceId(): string \| undefined {\n if (this.mediaStream) {\n const [activeMediaStreamTrack] = this.mediaStream.getTracks()\n return activeMediaStreamTrack?.getSettings()?.deviceId\n }\n }\n\n async open(deviceId?: string) {\n if (!navigator.mediaDevices \|\| !navigator.mediaDevices.getUserMedia) {\n const error = new Error()\n error.name = 'NotSupportedError'\n throw error\n }\n\n this.close()\n\n const constraints = {\n video: {\n facingMode: deviceId ? undefined : 'environment',\n deviceId: deviceId ? { exact: deviceId } : undefined,\n },\n }\n const mediaStream = await navigator.mediaDevices.getUserMedia(constraints)\n this.mediaStream = mediaStream\n this.htmlVideoElement.srcObject = mediaStream\n\n if (!this.availableDevices.length) {\n const availableDevices = await navigator.mediaDevices.enumerateDevices()\n this.availableDevices = availableDevices.filter(\n (mediaDeviceInfo) =>\n mediaDeviceInfo.kind === 'videoinput' && !!mediaDeviceInfo.deviceId,\n )\n }\n\n await new Promise((resolve) =>\n this.htmlVideoElement.addEventListener('canplay', resolve, {\n once: true,\n }),\n )\n }\n\n close() {\n if (this.mediaStream) {\n this.mediaStream.getTracks().forEach((track) => {\n track.stop()\n })\n this.mediaStream = undefined\n }\n }\n}\n"]}

package/dist/form-elements/FormElementBoolean.js CHANGED Viewed

@@ -7,7 +7,9 @@ function FormElementBoolean({ id, element, value, onChange, validationMessage, d
                     checked: 'ob-boolean__input-checked',
                 }, checked: !!value, disabled: element.readOnly, onChange: (e) => {
                     setIsDirty();
-                    onChange(element, e.target.checked);
+                    onChange(element, {
+                        value: e.target.checked,
+                    });
                 }, disableRipple: true }) }, (isDirty || displayValidationMessage) && !!validationMessage && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
             React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, validationMessage))))));
 }

package/dist/form-elements/FormElementBoolean.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementBoolean.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBoolean.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAYtC,SAAS,kBAAkB,CAAC,EAC1B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,OAAO,CACL,6BAAK,SAAS,EAAC,yBAAyB;QACtC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,YAAY,EACtB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,OAAO,EACL,oBAAC,MAAM,IACL,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,2CAA2C,EACrD,OAAO,EAAE;oBACP,OAAO,EAAE,2BAA2B;iBACrC,EACD,OAAO,EAAE,CAAC,CAAC,KAAK,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,UAAU,EAAE,CAAA;oBACZ,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;~~gBACrC~~,CAAC,EACD,aAAa,SACb,IAGH,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAC/D,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;YAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACyB,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Switch } from '@mui/material'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.BooleanElement\n value: unknown\n onChange: FormElementValueChangeHandler<boolean>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementBoolean({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n return (\n <div className=\"cypress-boolean-element\">\n <FormElementLabelContainer\n className=\"ob-boolean\"\n id={id}\n element={element}\n required={element.required}\n leading={\n <Switch\n id={id}\n name={element.name}\n color=\"primary\"\n edge=\"start\"\n className=\"ob-boolean__input cypress-boolean-control\"\n classes={{\n checked: 'ob-boolean__input-checked',\n }}\n checked={!!value}\n disabled={element.readOnly}\n onChange={(e) => {\n setIsDirty()\n onChange(element, e.target.checked)\n }}\n disableRipple\n />\n }\n >\n {(isDirty \|\| displayValidationMessage) && !!validationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBoolean)\n"]}
1	+ {"version":3,"file":"FormElementBoolean.js","sourceRoot":"","sources":["../../src/form-elements/FormElementBoolean.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAYtC,SAAS,kBAAkB,CAAC,EAC1B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,OAAO,CACL,6BAAK,SAAS,EAAC,yBAAyB;QACtC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,YAAY,EACtB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,OAAO,EACL,oBAAC,MAAM,IACL,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,2CAA2C,EACrD,OAAO,EAAE;oBACP,OAAO,EAAE,2BAA2B;iBACrC,EACD,OAAO,EAAE,CAAC,CAAC,KAAK,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oBACd,UAAU,EAAE,CAAA;oBACZ,QAAQ,CAAC,OAAO,EAAE;wBAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO;qBACxB,CAAC,CAAA;gBACJ,CAAC,EACD,aAAa,SACb,IAGH,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAC/D,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;YAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACyB,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Switch } from '@mui/material'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.BooleanElement\n value: unknown\n onChange: FormElementValueChangeHandler<boolean>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementBoolean({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n return (\n <div className=\"cypress-boolean-element\">\n <FormElementLabelContainer\n className=\"ob-boolean\"\n id={id}\n element={element}\n required={element.required}\n leading={\n <Switch\n id={id}\n name={element.name}\n color=\"primary\"\n edge=\"start\"\n className=\"ob-boolean__input cypress-boolean-control\"\n classes={{\n checked: 'ob-boolean__input-checked',\n }}\n checked={!!value}\n disabled={element.readOnly}\n onChange={(e) => {\n setIsDirty()\n onChange(element, {\n value: e.target.checked,\n })\n }}\n disableRipple\n />\n }\n >\n {(isDirty \|\| displayValidationMessage) && !!validationMessage && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n {validationMessage}\n </div>\n </div>\n )}\n </FormElementLabelContainer>\n </div>\n )\n}\n\nexport default React.memo(FormElementBoolean)\n"]}

package/dist/form-elements/FormElementCalculation.js CHANGED Viewed

@@ -157,10 +157,14 @@ function FormElementCalculation({ element, onChange, value }) {
             return;
         }
         if (!isNaN(newValue)) {
-            onChange(element, newValue);
+            onChange(element, {
+                value: newValue,
+            });
         }
         else {
-            onChange(element, undefined);
+            onChange(element, {
+                value: undefined,
+            });
         }
     }, [calculation, element, formSubmissionModel, onChange, value]);
     return (React.createElement("div", { className: "cypress-calculation-element" },

package/dist/form-elements/FormElementCalculation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementCalculation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCalculation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport ExpressionParser from 'morph-expressions'\nimport escapeString from 'escape-string-regexp'\nimport useFormSubmissionModel from '../hooks/useFormSubmissionModelContext'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport { localisationService } from '@oneblink/apps'\nimport { FormElementValueChangeHandler } from '../types/form'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport QuillHTML from '../components/QuillHTML'\ntype Props = {\n element: FormTypes.CalculationElement\n onChange: FormElementValueChangeHandler<number>\n value: unknown \| undefined\n}\n\nconst isUnenteredValue = (value: unknown \| undefined) => {\n return !value && value !== 0\n}\n\nconst isObjectWithValue = (obj: unknown): obj is { value: unknown } => {\n return typeof obj === 'object' && obj !== null && 'value' in obj\n}\n\nfunction FormElementCalculation({ element, onChange, value }: Props) {\n const { formSubmissionModel } = useFormSubmissionModel()\n\n const htmlValue = React.useMemo(() => {\n let htmlTemplate\n\n if (!isNaN(value as number)) {\n htmlTemplate = element.defaultValue\n } else {\n console.log(\n '[Calculation] Was not a number... setting pre-calculation display',\n )\n htmlTemplate = element.preCalculationDisplay\n }\n\n const numberValue = typeof value === 'number' ? value : 0\n return (htmlTemplate \|\| '').replace(\n /{result}/gi,\n element.displayAsCurrency\n ? localisationService.formatCurrency(numberValue)\n : localisationService.formatNumber(numberValue),\n )\n }, [element, value])\n\n const registerProperty = React.useCallback(\n (\n exprParser: typeof ExpressionParser,\n {\n replacement,\n nestedElementNames,\n }: {\n replacement: string\n nestedElementNames: string[]\n },\n ) => {\n exprParser.registerProperty(\n replacement,\n (submission: SubmissionTypes.S3SubmissionData['submission']) => {\n const defaultAccumulator = submission[nestedElementNames[0]]\n\n return nestedElementNames.reduce(\n (\n elementValue: unknown \| undefined,\n elementName: string,\n index: number,\n ) => {\n // Numbers can just be returned as is\n if (typeof elementValue === 'number') {\n return elementValue\n }\n\n // attempt to get a number from the element value as a string.\n // NaN is accounted for is the calculation\n // so we can return that from here\n if (typeof elementValue === 'string') {\n return parseFloat(elementValue)\n }\n\n if (Array.isArray(elementValue)) {\n // If there are no entries, we can return null\n // to prevent the calculation from running.\n if (!elementValue.length) {\n return NaN\n }\n\n // An array could be an element that allows multiple\n // values e.g. checkboxes. If thats that case, we just\n // add them all together and move on\n const elementValues = elementValue.map((entry) =>\n parseFloat(entry),\n )\n if (elementValues.every((entry) => !Number.isNaN(entry))) {\n return elementValues.reduce(\n (number, entry) => number + entry,\n 0,\n )\n }\n\n // Other wise attempt to process it as a repeatable set\n // If we found another repeatable set to process,\n // pass it to the next element name to\n // iterate over the entries\n\n // If we are processing the entries in a repeatable set,\n // we can sum the numbers elements in the entries\n const nextElementName = nestedElementNames[index + 1]\n\n let isNestedRepeatableSet = false\n const nestedElementValues = elementValue.reduce(\n (nestedElementValues, entry) => {\n if (entry) {\n const nextElementValue = entry[nextElementName]\n if (Array.isArray(nextElementValue)) {\n if (nextElementValue.length) {\n nestedElementValues.push(...nextElementValue)\n isNestedRepeatableSet = true\n }\n } else {\n nestedElementValues.push(nextElementValue)\n }\n }\n return nestedElementValues\n },\n [],\n )\n\n // If the nested element values are all arrays, we can pass them on to the next iteration\n if (isNestedRepeatableSet) {\n return nestedElementValues\n }\n\n return nestedElementValues.reduce(\n (total: number, nestedElementValue: unknown \| undefined) => {\n if (Number.isNaN(total)) {\n return NaN\n }\n const value = parseFloat(nestedElementValue as string)\n if (Number.isNaN(value)) {\n return NaN\n }\n return total + value\n },\n 0,\n )\n }\n\n // \"compliance\" form element has an object value with a \"value\" property.\n if (\n isObjectWithValue(elementValue) &&\n typeof elementValue.value === 'string'\n ) {\n return parseFloat(elementValue.value)\n }\n\n // We did not find a number value from the known elements,\n // we will assume we are at the end of the line.\n return NaN\n },\n defaultAccumulator,\n )\n },\n )\n },\n [],\n )\n\n const { calculation, hasError } = React.useMemo(() => {\n const exprParser = new ExpressionParser()\n exprParser.registerFunction('ROUND', (value: number, precision: number) => {\n if (!Number.isNaN(value) && Number.isFinite(value)) {\n return parseFloat(value.toFixed(precision))\n }\n return null\n })\n exprParser.registerFunction(\n 'ISNULL',\n (value: unknown \| undefined, defaultValue: number) => {\n if (isUnenteredValue(value)) {\n return defaultValue \|\| 0\n }\n return value\n },\n )\n\n try {\n if (!element.calculation) throw new Error('Element has no calculation.')\n const elementNames: string[] = []\n formElementsService.matchElementsTagRegex(\n element.calculation,\n ({ elementName }) => {\n elementNames.push(elementName)\n },\n )\n\n const code = elementNames.reduce((code, elementName, index) => {\n const regex = new RegExp(escapeString(`{ELEMENT:${elementName}}`), 'g')\n const replacement = `a${index}`\n registerProperty(exprParser, {\n replacement,\n nestedElementNames: elementName.split('\|'),\n })\n return code.replace(regex, replacement)\n }, element.calculation \|\| '')\n\n return {\n calculation: exprParser.parse(code.trim()),\n hasError: false,\n }\n } catch (e) {\n console.warn(\n 'Error while setting up parsing for calculation element',\n element,\n e,\n )\n Sentry.captureException(e)\n return {\n calculation: null,\n hasError: true,\n }\n }\n }, [element, registerProperty])\n\n // MODEL LISTENER\n React.useEffect(() => {\n if (!calculation) return\n const newValue = calculation.eval(formSubmissionModel)\n if (value === newValue \|\| (value === undefined && isNaN(newValue))) {\n return\n }\n if (!isNaN(newValue)) {\n onChange(element, newValue)\n } else {\n onChange(element, undefined)\n }\n }, [calculation, element, formSubmissionModel, onChange, value])\n\n return (\n <div className=\"cypress-calculation-element\">\n <div className=\"ob-form__element ob-calculation\">\n <QuillHTML\n html={htmlValue}\n className=\"cypress-calculation-result ob-calculation__content\"\n />\n {hasError && (\n <div\n className=\"notification cypress-calculation-is-invalid\"\n role=\"alert\"\n >\n <div className=\"columns is-vcentered\">\n <div className=\"column is-narrow\">\n <i className=\"material-icons has-text-warning\">error</i>\n </div>\n <div className=\"column\">\n <p>There is an error in the calculation for this element.</p>\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n )\n}\n\nexport default React.memo(FormElementCalculation)\n"]}
1	+ {"version":3,"file":"FormElementCalculation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCalculation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport ExpressionParser from 'morph-expressions'\nimport escapeString from 'escape-string-regexp'\nimport useFormSubmissionModel from '../hooks/useFormSubmissionModelContext'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport { localisationService } from '@oneblink/apps'\nimport { FormElementValueChangeHandler } from '../types/form'\nimport { formElementsService } from '@oneblink/sdk-core'\nimport QuillHTML from '../components/QuillHTML'\ntype Props = {\n element: FormTypes.CalculationElement\n onChange: FormElementValueChangeHandler<number>\n value: unknown \| undefined\n}\n\nconst isUnenteredValue = (value: unknown \| undefined) => {\n return !value && value !== 0\n}\n\nconst isObjectWithValue = (obj: unknown): obj is { value: unknown } => {\n return typeof obj === 'object' && obj !== null && 'value' in obj\n}\n\nfunction FormElementCalculation({ element, onChange, value }: Props) {\n const { formSubmissionModel } = useFormSubmissionModel()\n\n const htmlValue = React.useMemo(() => {\n let htmlTemplate\n\n if (!isNaN(value as number)) {\n htmlTemplate = element.defaultValue\n } else {\n console.log(\n '[Calculation] Was not a number... setting pre-calculation display',\n )\n htmlTemplate = element.preCalculationDisplay\n }\n\n const numberValue = typeof value === 'number' ? value : 0\n return (htmlTemplate \|\| '').replace(\n /{result}/gi,\n element.displayAsCurrency\n ? localisationService.formatCurrency(numberValue)\n : localisationService.formatNumber(numberValue),\n )\n }, [element, value])\n\n const registerProperty = React.useCallback(\n (\n exprParser: typeof ExpressionParser,\n {\n replacement,\n nestedElementNames,\n }: {\n replacement: string\n nestedElementNames: string[]\n },\n ) => {\n exprParser.registerProperty(\n replacement,\n (submission: SubmissionTypes.S3SubmissionData['submission']) => {\n const defaultAccumulator = submission[nestedElementNames[0]]\n\n return nestedElementNames.reduce(\n (\n elementValue: unknown \| undefined,\n elementName: string,\n index: number,\n ) => {\n // Numbers can just be returned as is\n if (typeof elementValue === 'number') {\n return elementValue\n }\n\n // attempt to get a number from the element value as a string.\n // NaN is accounted for is the calculation\n // so we can return that from here\n if (typeof elementValue === 'string') {\n return parseFloat(elementValue)\n }\n\n if (Array.isArray(elementValue)) {\n // If there are no entries, we can return null\n // to prevent the calculation from running.\n if (!elementValue.length) {\n return NaN\n }\n\n // An array could be an element that allows multiple\n // values e.g. checkboxes. If thats that case, we just\n // add them all together and move on\n const elementValues = elementValue.map((entry) =>\n parseFloat(entry),\n )\n if (elementValues.every((entry) => !Number.isNaN(entry))) {\n return elementValues.reduce(\n (number, entry) => number + entry,\n 0,\n )\n }\n\n // Other wise attempt to process it as a repeatable set\n // If we found another repeatable set to process,\n // pass it to the next element name to\n // iterate over the entries\n\n // If we are processing the entries in a repeatable set,\n // we can sum the numbers elements in the entries\n const nextElementName = nestedElementNames[index + 1]\n\n let isNestedRepeatableSet = false\n const nestedElementValues = elementValue.reduce(\n (nestedElementValues, entry) => {\n if (entry) {\n const nextElementValue = entry[nextElementName]\n if (Array.isArray(nextElementValue)) {\n if (nextElementValue.length) {\n nestedElementValues.push(...nextElementValue)\n isNestedRepeatableSet = true\n }\n } else {\n nestedElementValues.push(nextElementValue)\n }\n }\n return nestedElementValues\n },\n [],\n )\n\n // If the nested element values are all arrays, we can pass them on to the next iteration\n if (isNestedRepeatableSet) {\n return nestedElementValues\n }\n\n return nestedElementValues.reduce(\n (total: number, nestedElementValue: unknown \| undefined) => {\n if (Number.isNaN(total)) {\n return NaN\n }\n const value = parseFloat(nestedElementValue as string)\n if (Number.isNaN(value)) {\n return NaN\n }\n return total + value\n },\n 0,\n )\n }\n\n // \"compliance\" form element has an object value with a \"value\" property.\n if (\n isObjectWithValue(elementValue) &&\n typeof elementValue.value === 'string'\n ) {\n return parseFloat(elementValue.value)\n }\n\n // We did not find a number value from the known elements,\n // we will assume we are at the end of the line.\n return NaN\n },\n defaultAccumulator,\n )\n },\n )\n },\n [],\n )\n\n const { calculation, hasError } = React.useMemo(() => {\n const exprParser = new ExpressionParser()\n exprParser.registerFunction('ROUND', (value: number, precision: number) => {\n if (!Number.isNaN(value) && Number.isFinite(value)) {\n return parseFloat(value.toFixed(precision))\n }\n return null\n })\n exprParser.registerFunction(\n 'ISNULL',\n (value: unknown \| undefined, defaultValue: number) => {\n if (isUnenteredValue(value)) {\n return defaultValue \|\| 0\n }\n return value\n },\n )\n\n try {\n if (!element.calculation) throw new Error('Element has no calculation.')\n const elementNames: string[] = []\n formElementsService.matchElementsTagRegex(\n element.calculation,\n ({ elementName }) => {\n elementNames.push(elementName)\n },\n )\n\n const code = elementNames.reduce((code, elementName, index) => {\n const regex = new RegExp(escapeString(`{ELEMENT:${elementName}}`), 'g')\n const replacement = `a${index}`\n registerProperty(exprParser, {\n replacement,\n nestedElementNames: elementName.split('\|'),\n })\n return code.replace(regex, replacement)\n }, element.calculation \|\| '')\n\n return {\n calculation: exprParser.parse(code.trim()),\n hasError: false,\n }\n } catch (e) {\n console.warn(\n 'Error while setting up parsing for calculation element',\n element,\n e,\n )\n Sentry.captureException(e)\n return {\n calculation: null,\n hasError: true,\n }\n }\n }, [element, registerProperty])\n\n // MODEL LISTENER\n React.useEffect(() => {\n if (!calculation) return\n const newValue = calculation.eval(formSubmissionModel)\n if (value === newValue \|\| (value === undefined && isNaN(newValue))) {\n return\n }\n if (!isNaN(newValue)) {\n onChange(element, {\n value: newValue,\n })\n } else {\n onChange(element, {\n value: undefined,\n })\n }\n }, [calculation, element, formSubmissionModel, onChange, value])\n\n return (\n <div className=\"cypress-calculation-element\">\n <div className=\"ob-form__element ob-calculation\">\n <QuillHTML\n html={htmlValue}\n className=\"cypress-calculation-result ob-calculation__content\"\n />\n {hasError && (\n <div\n className=\"notification cypress-calculation-is-invalid\"\n role=\"alert\"\n >\n <div className=\"columns is-vcentered\">\n <div className=\"column is-narrow\">\n <i className=\"material-icons has-text-warning\">error</i>\n </div>\n <div className=\"column\">\n <p>There is an error in the calculation for this element.</p>\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n )\n}\n\nexport default React.memo(FormElementCalculation)\n"]}

package/dist/form-elements/FormElementCamera.js CHANGED Viewed

@@ -19,7 +19,9 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
     const [isAnnotating, setIsAnnotating, clearIsAnnotating] = useBooleanState(false);
     const fileInputRef = React.useRef(null);
     const clearImage = React.useCallback(() => {
-        onChange(element, undefined);
+        onChange(element, {
+            value: undefined,
+        });
     }, [element, onChange]);
     const fileChange = React.useCallback(async (changeEvent) => {
         if (!changeEvent.target || !changeEvent.target.files) {
@@ -39,11 +41,15 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
             }
             const result = await correctFileOrientation(file, element.includeTimestampWatermark ? drawTimestampOnCanvas : undefined);
             if (result instanceof Blob) {
-                onChange(element, prepareNewAttachment(result, file.name, element));
+                onChange(element, {
+                    value: prepareNewAttachment(result, file.name, element),
+                });
             }
             else {
                 const blob = await canvasToBlob(result);
-                onChange(element, prepareNewAttachment(blob, file.name, element));
+                onChange(element, {
+                    value: prepareNewAttachment(blob, file.name, element),
+                });
             }
             setIsDirty();
             setState({
@@ -65,7 +71,9 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
             navigator.camera.getPicture((base64Data) => {
                 urlToBlobAsync(`data:image/jpeg;base64,${base64Data}`)
                     .then((blob) => {
-                    onChange(element, prepareNewAttachment(blob, 'photo.jpeg', element));
+                    onChange(element, {
+                        value: prepareNewAttachment(blob, 'photo.jpeg', element),
+                    });
                     setState({
                         isLoading: false,
                     });
@@ -104,7 +112,9 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
         }
     }, [element, onChange]);
     const { isUploading, uploadErrorMessage, isLoadingImageUrl, imageUrl, loadImageUrlError, canDownload, progress, } = useAttachment(value, element, React.useCallback((id, attachment) => {
-        onChange(element, attachment);
+        onChange(element, {
+            value: attachment,
+        });
     }, [element, onChange]));
     const handleRetry = React.useMemo(() => {
         if (!value || typeof value !== 'object')
@@ -112,11 +122,13 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
         if (value.type === 'ERROR' && value.data) {
             return () => {
                 onChange(element, {
-                    type: 'NEW',
-                    _id: value._id,
-                    data: value.data,
-                    fileName: value.fileName,
-                    isPrivate: value.isPrivate,
+                    value: {
+                        type: 'NEW',
+                        _id: value._id,
+                        data: value.data,
+                        fileName: value.fileName,
+                        isPrivate: value.isPrivate,
+                    },
                 });
             };
         }
@@ -154,7 +166,9 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
                     canvasToBlob(canvas)
                         .then((blob) => {
                         const attachment = prepareNewAttachment(blob, 'photo.png', element);
-                        onChange(element, attachment);
+                        onChange(element, {
+                            value: attachment,
+                        });
                         setState({
                             isLoading: false,
                         });