npm - @oneblink/apps-react - Versions diffs - 1.1.0-beta.2 → 1.1.1-beta.2 - Mend

@oneblink/apps-react 1.1.0-beta.2 → 1.1.1-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 (7) hide show

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

@@ -8,6 +8,9 @@ import { localisationService } from '@oneblink/apps';
 const isUnenteredValue = (value) => {
     return !value && value !== 0;
 };
+const isObjectWithValue = (obj) => {
+    return typeof obj === 'object' && obj !== null && 'value' in obj;
+};
 function FormElementCalculation({ element, onChange, value }) {
     const { formSubmissionModel } = useFormSubmissionModel();
     const htmlValue = React.useMemo(() => {
@@ -89,6 +92,11 @@ function FormElementCalculation({ element, onChange, value }) {
                         return total + value;
                     }, 0);
                 }
+                // "compliance" form element has an object value with a "value" property.
+                if (isObjectWithValue(elementValue) &&
+                    typeof elementValue.value === 'string') {
+                    return parseFloat(elementValue.value);
+                }
                 // We did not find a number value from the known elements,
                 // we will assume we are at the end of the line.
                 return NaN;

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 sanitizeHtmlStandard from '../services/sanitize-html'\nimport useFormSubmissionModel from '../hooks/useFormSubmissionModelContext'\nimport { FormTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport { localisationService } from '@oneblink/apps'\nimport {\n FormElementValueChangeHandler,\n FormSubmissionModel,\n} from '../types/form'\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\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 sanitizeHtmlStandard(\n (htmlTemplate \|\| '').replace(\n /{result}/gi,\n element.displayAsCurrency\n ? localisationService.formatCurrency(numberValue)\n : localisationService.formatNumber(numberValue),\n ),\n )\n }, [element, value])\n\n const registerProperty = React.useCallback(\n (\n exprParser,\n {\n replacement,\n nestedElementNames,\n }: {\n replacement: string\n nestedElementNames: string[]\n },\n ) => {\n exprParser.registerProperty(\n replacement,\n (submission: FormSubmissionModel) => {\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 // 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 let matches\n const elementNames = []\n const re = /({ELEMENT:)([^}]+)(})/g\n\n while ((matches = re.exec(element.calculation)) !== null) {\n if (matches) {\n elementNames.push(matches[2])\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 <div\n className=\"cypress-calculation-result ob-calculation__content ql-editor\"\n dangerouslySetInnerHTML={{ __html: htmlValue }}\n ></div>\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":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,gBAAgB,MAAM,mBAAmB,CAAA;AAChD,OAAO,YAAY,MAAM,sBAAsB,CAAA;AAC/C,OAAO,oBAAoB,MAAM,2BAA2B,CAAA;AAC5D,OAAO,sBAAsB,MAAM,wCAAwC,CAAA;AAE3E,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAWpD,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,EAAE;IACtD,OAAO,CAAC,KAAK,IAAI,KAAK,KAAK,CAAC,CAAA;AAC9B,CAAC,CAAA;AAED,MAAM,iBAAiB,GAAG,CAAC,GAAY,EAA6B,EAAE;IACpE,OAAO,OAAO,GAAG,KAAK,QAAQ,IAAI,GAAG,KAAK,IAAI,IAAI,OAAO,IAAI,GAAG,CAAA;AAClE,CAAC,CAAA;AAED,SAAS,sBAAsB,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAS;IACjE,MAAM,EAAE,mBAAmB,EAAE,GAAG,sBAAsB,EAAE,CAAA;IAExD,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnC,IAAI,YAAY,CAAA;QAEhB,IAAI,CAAC,KAAK,CAAC,KAAe,CAAC,EAAE;YAC3B,YAAY,GAAG,OAAO,CAAC,YAAY,CAAA;SACpC;aAAM;YACL,OAAO,CAAC,GAAG,CACT,mEAAmE,CACpE,CAAA;YACD,YAAY,GAAG,OAAO,CAAC,qBAAqB,CAAA;SAC7C;QAED,MAAM,WAAW,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;QACzD,OAAO,oBAAoB,CACzB,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC,OAAO,CAC1B,YAAY,EACZ,OAAO,CAAC,iBAAiB;YACvB,CAAC,CAAC,mBAAmB,CAAC,cAAc,CAAC,WAAW,CAAC;YACjD,CAAC,CAAC,mBAAmB,CAAC,YAAY,CAAC,WAAW,CAAC,CAClD,CACF,CAAA;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAA;IAEpB,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAW,CACxC,CACE,UAAU,EACV,EACE,WAAW,EACX,kBAAkB,GAInB,EACD,EAAE;QACF,UAAU,CAAC,gBAAgB,CACzB,WAAW,EACX,CAAC,UAA+B,EAAE,EAAE;YAClC,MAAM,kBAAkB,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAA;YAE5D,OAAO,kBAAkB,CAAC,MAAM,CAC9B,CACE,YAAiC,EACjC,WAAmB,EACnB,KAAa,EACb,EAAE;gBACF,qCAAqC;gBACrC,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE;oBACpC,OAAO,YAAY,CAAA;iBACpB;gBAED,8DAA8D;gBAC9D,0CAA0C;gBAC1C,kCAAkC;gBAClC,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE;oBACpC,OAAO,UAAU,CAAC,YAAY,CAAC,CAAA;iBAChC;gBAED,IAAI,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE;oBAC/B,8CAA8C;oBAC9C,2CAA2C;oBAC3C,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE;wBACxB,OAAO,GAAG,CAAA;qBACX;oBAED,oDAAoD;oBACpD,sDAAsD;oBACtD,oCAAoC;oBACpC,MAAM,aAAa,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAC/C,UAAU,CAAC,KAAK,CAAC,CAClB,CAAA;oBACD,IAAI,aAAa,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE;wBACxD,OAAO,aAAa,CAAC,MAAM,CACzB,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,MAAM,GAAG,KAAK,EACjC,CAAC,CACF,CAAA;qBACF;oBAED,uDAAuD;oBACvD,iDAAiD;oBACjD,sCAAsC;oBACtC,2BAA2B;oBAE3B,wDAAwD;oBACxD,iDAAiD;oBACjD,MAAM,eAAe,GAAG,kBAAkB,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;oBAErD,IAAI,qBAAqB,GAAG,KAAK,CAAA;oBACjC,MAAM,mBAAmB,GAAG,YAAY,CAAC,MAAM,CAC7C,CAAC,mBAAmB,EAAE,KAAK,EAAE,EAAE;wBAC7B,IAAI,KAAK,EAAE;4BACT,MAAM,gBAAgB,GAAG,KAAK,CAAC,eAAe,CAAC,CAAA;4BAC/C,IAAI,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE;gCACnC,IAAI,gBAAgB,CAAC,MAAM,EAAE;oCAC3B,mBAAmB,CAAC,IAAI,CAAC,GAAG,gBAAgB,CAAC,CAAA;oCAC7C,qBAAqB,GAAG,IAAI,CAAA;iCAC7B;6BACF;iCAAM;gCACL,mBAAmB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;6BAC3C;yBACF;wBACD,OAAO,mBAAmB,CAAA;oBAC5B,CAAC,EACD,EAAE,CACH,CAAA;oBAED,yFAAyF;oBACzF,IAAI,qBAAqB,EAAE;wBACzB,OAAO,mBAAmB,CAAA;qBAC3B;oBAED,OAAO,mBAAmB,CAAC,MAAM,CAC/B,CAAC,KAAa,EAAE,kBAAuC,EAAE,EAAE;wBACzD,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;4BACvB,OAAO,GAAG,CAAA;yBACX;wBACD,MAAM,KAAK,GAAG,UAAU,CAAC,kBAA4B,CAAC,CAAA;wBACtD,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;4BACvB,OAAO,GAAG,CAAA;yBACX;wBACD,OAAO,KAAK,GAAG,KAAK,CAAA;oBACtB,CAAC,EACD,CAAC,CACF,CAAA;iBACF;gBAED,yEAAyE;gBACzE,IACE,iBAAiB,CAAC,YAAY,CAAC;oBAC/B,OAAO,YAAY,CAAC,KAAK,KAAK,QAAQ,EACtC;oBACA,OAAO,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,CAAA;iBACtC;gBAED,0DAA0D;gBAC1D,gDAAgD;gBAChD,OAAO,GAAG,CAAA;YACZ,CAAC,EACD,kBAAkB,CACnB,CAAA;QACH,CAAC,CACF,CAAA;IACH,CAAC,EACD,EAAE,CACH,CAAA;IAED,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnD,MAAM,UAAU,GAAG,IAAI,gBAAgB,EAAE,CAAA;QACzC,UAAU,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,KAAa,EAAE,SAAiB,EAAE,EAAE;YACxE,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;gBAClD,OAAO,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAA;aAC5C;YACD,OAAO,IAAI,CAAA;QACb,CAAC,CAAC,CAAA;QACF,UAAU,CAAC,gBAAgB,CACzB,QAAQ,EACR,CAAC,KAA0B,EAAE,YAAoB,EAAE,EAAE;YACnD,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE;gBAC3B,OAAO,YAAY,IAAI,CAAC,CAAA;aACzB;YACD,OAAO,KAAK,CAAA;QACd,CAAC,CACF,CAAA;QAED,IAAI;YACF,IAAI,CAAC,OAAO,CAAC,WAAW;gBAAE,MAAM,IAAI,KAAK,CAAC,6BAA6B,CAAC,CAAA;YACxE,IAAI,OAAO,CAAA;YACX,MAAM,YAAY,GAAG,EAAE,CAAA;YACvB,MAAM,EAAE,GAAG,wBAAwB,CAAA;YAEnC,OAAO,CAAC,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,KAAK,IAAI,EAAE;gBACxD,IAAI,OAAO,EAAE;oBACX,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAA;iBAC9B;aACF;YAED,MAAM,IAAI,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE;gBAC5D,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC,YAAY,WAAW,GAAG,CAAC,EAAE,GAAG,CAAC,CAAA;gBACvE,MAAM,WAAW,GAAG,IAAI,KAAK,EAAE,CAAA;gBAC/B,gBAAgB,CAAC,UAAU,EAAE;oBAC3B,WAAW;oBACX,kBAAkB,EAAE,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC;iBAC3C,CAAC,CAAA;gBACF,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,WAAW,CAAC,CAAA;YACzC,CAAC,EAAE,OAAO,CAAC,WAAW,IAAI,EAAE,CAAC,CAAA;YAE7B,OAAO;gBACL,WAAW,EAAE,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;gBAC1C,QAAQ,EAAE,KAAK;aAChB,CAAA;SACF;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,IAAI,CACV,wDAAwD,EACxD,OAAO,EACP,CAAC,CACF,CAAA;YACD,MAAM,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAA;YAC1B,OAAO;gBACL,WAAW,EAAE,IAAI;gBACjB,QAAQ,EAAE,IAAI;aACf,CAAA;SACF;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAA;IAE/B,iBAAiB;IACjB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,WAAW;YAAE,OAAM;QACxB,MAAM,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAA;QACtD,IAAI,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE;YAClE,OAAM;SACP;QACD,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE;YACpB,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAA;SAC5B;aAAM;YACL,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;SAC7B;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,EAAE,mBAAmB,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAEhE,OAAO,CACL,6BAAK,SAAS,EAAC,6BAA6B;QAC1C,6BAAK,SAAS,EAAC,iCAAiC;YAC9C,6BACE,SAAS,EAAC,8DAA8D,EACxE,uBAAuB,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,GACzC;YACN,QAAQ,IAAI,CACX,6BACE,SAAS,EAAC,6CAA6C,EACvD,IAAI,EAAC,OAAO;gBAEZ,6BAAK,SAAS,EAAC,sBAAsB;oBACnC,6BAAK,SAAS,EAAC,kBAAkB;wBAC/B,2BAAG,SAAS,EAAC,iCAAiC,YAAU,CACpD;oBACN,6BAAK,SAAS,EAAC,QAAQ;wBACrB,wFAA6D,CACzD,CACF,CACF,CACP,CACG,CACF,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport ExpressionParser from 'morph-expressions'\nimport escapeString from 'escape-string-regexp'\nimport sanitizeHtmlStandard from '../services/sanitize-html'\nimport useFormSubmissionModel from '../hooks/useFormSubmissionModelContext'\nimport { FormTypes } from '@oneblink/types'\nimport { Sentry } from '@oneblink/apps'\nimport { localisationService } from '@oneblink/apps'\nimport {\n FormElementValueChangeHandler,\n FormSubmissionModel,\n} from '../types/form'\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 sanitizeHtmlStandard(\n (htmlTemplate \|\| '').replace(\n /{result}/gi,\n element.displayAsCurrency\n ? localisationService.formatCurrency(numberValue)\n : localisationService.formatNumber(numberValue),\n ),\n )\n }, [element, value])\n\n const registerProperty = React.useCallback(\n (\n exprParser,\n {\n replacement,\n nestedElementNames,\n }: {\n replacement: string\n nestedElementNames: string[]\n },\n ) => {\n exprParser.registerProperty(\n replacement,\n (submission: FormSubmissionModel) => {\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 let matches\n const elementNames = []\n const re = /({ELEMENT:)([^}]+)(})/g\n\n while ((matches = re.exec(element.calculation)) !== null) {\n if (matches) {\n elementNames.push(matches[2])\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 <div\n className=\"cypress-calculation-result ob-calculation__content ql-editor\"\n dangerouslySetInnerHTML={{ __html: htmlValue }}\n ></div>\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

@@ -156,9 +156,18 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
             annotationImage.onload = function () {
                 ctx.drawImage(annotationImage, 0, 0, canvas.width, canvas.height);
                 try {
-                    const base64Data = canvas.toDataURL();
-                    setBase64DataUri(base64Data, 'photo.png')
-                        .then(() => {
+                    if (checkIsUsingLegacyStorage(element)) {
+                        const base64Data = canvas.toDataURL();
+                        onChange(element, base64Data);
+                        setState({
+                            isLoading: false,
+                        });
+                        return;
+                    }
+                    canvasToBlob(canvas)
+                        .then((blob) => {
+                        const attachment = prepareNewAttachment(blob, 'photo.png', element);
+                        onChange(element, attachment);
                         setState({
                             isLoading: false,
                         });
@@ -181,7 +190,7 @@ function FormElementCamera({ id, element, value, onChange, validationMessage, di
         };
         image.setAttribute('crossorigin', 'anonymous');
         image.src = imageUrl;
-    }, [clearIsAnnotating, imageUrl, setBase64DataUri]);
+    }, [clearIsAnnotating, element, imageUrl, onChange]);
     return (React.createElement(React.Fragment, null,
         React.createElement(FormElementLabelContainer, { className: "ob-camera", element: element, id: id, required: element.required },
             React.createElement("div", { className: "control" },

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementCamera.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCamera.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\n\nimport useBooleanState from '../hooks/useBooleanState'\nimport downloadAttachment, {\n downloadFileLegacy,\n} from '../services/download-file'\nimport OnLoading from '../components/renderer/OnLoading'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport drawTimestampOnCanvas from '../services/drawTimestampOnCanvas'\nimport { FormElementBinaryStorageValue } from '../types/attachments'\nimport useAttachment from '../hooks/attachments/useAttachment'\nimport AnnotationModal from '../components/renderer/AnnotationModal'\nimport Modal from '../components/renderer/Modal'\nimport {\n checkIfContentTypeIsImage,\n checkIsUsingLegacyStorage,\n prepareNewAttachment,\n correctFileOrientation,\n} from '../services/attachments'\nimport AttachmentStatus from '../components/renderer/attachments/AttachmentStatus'\nimport {\n blobToCanvas,\n canvasToBlob,\n urlToBlobAsync,\n} from '../services/blob-utils'\nimport ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable'\nimport { FormElementValueChangeHandler } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.CameraElement\n value: FormElementBinaryStorageValue\n onChange: FormElementValueChangeHandler<FormElementBinaryStorageValue>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n}\n\nfunction FormElementCamera({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n}: Props) {\n const [{ cameraError, isLoading }, setState] = React.useState<{\n isLoading: boolean\n cameraError?: Error\n }>({\n isLoading: false,\n })\n const [isDirty, setIsDirty] = useBooleanState(false)\n const [isAnnotating, setIsAnnotating, clearIsAnnotating] =\n useBooleanState(false)\n const fileInputRef = React.useRef<HTMLInputElement>(null)\n\n const setBase64DataUri = React.useCallback(\n async (dataUri: string, fileName: string) => {\n if (checkIsUsingLegacyStorage(element)) {\n onChange(element, dataUri)\n return\n }\n\n // Convert base64 data uri to blob and send it on its way\n const blob = await urlToBlobAsync(dataUri)\n onChange(element, prepareNewAttachment(blob, fileName, element))\n },\n [element, onChange],\n )\n\n const clearImage = React.useCallback(() => {\n onChange(element, undefined)\n }, [element, onChange])\n\n const fileChange = React.useCallback(\n async (changeEvent: React.ChangeEvent<HTMLInputElement>) => {\n if (!changeEvent.target \|\| !changeEvent.target.files) {\n return\n }\n\n const file = changeEvent.target.files[0]\n if (!file) {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n console.log('File selected event', file)\n try {\n if (!checkIfContentTypeIsImage(file.type)) {\n throw new Error(\n `Invalid file type \"${file.type}\". Please select an image.`,\n )\n }\n const result = await correctFileOrientation(\n file,\n element.includeTimestampWatermark ? drawTimestampOnCanvas : undefined,\n )\n\n const isUsingLegacyStorage = checkIsUsingLegacyStorage(element)\n if (result instanceof Blob) {\n if (isUsingLegacyStorage) {\n const canvas = await blobToCanvas(result)\n onChange(element, canvas.toDataURL())\n } else {\n onChange(element, prepareNewAttachment(result, file.name, element))\n }\n } else {\n if (isUsingLegacyStorage) {\n onChange(element, result.toDataURL())\n } else {\n const blob = await canvasToBlob(result)\n onChange(element, prepareNewAttachment(blob, file.name, element))\n }\n }\n\n setIsDirty()\n setState({\n isLoading: false,\n })\n } catch (error) {\n setState({\n isLoading: false,\n cameraError: error as Error,\n })\n }\n },\n [element, onChange, setIsDirty],\n )\n const openCamera = React.useCallback(() => {\n if (window.cordova && navigator.camera && navigator.camera.getPicture) {\n setState({\n isLoading: true,\n })\n navigator.camera.getPicture(\n (base64Data: string) => {\n setBase64DataUri(`data:image/jpeg;base64,${base64Data}`, 'photo.jpeg')\n .then(() => {\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n },\n (error: Error) => {\n console.warn(\n 'An error occurred while attempting to take a photo',\n error,\n )\n setState({\n isLoading: false,\n cameraError: error,\n })\n },\n {\n quality: 100,\n destinationType: window.Camera.DestinationType.DATA_URL,\n sourceType: window.Camera.PictureSourceType.CAMERA,\n allowEdit: false,\n encodingType: window.Camera.EncodingType.JPEG,\n mediaType: window.Camera.MediaType.PICTURE,\n correctOrientation: true,\n saveToPhotoAlbum: false,\n cameraDirection: window.Camera.Direction.BACK,\n },\n )\n } else if (fileInputRef.current) {\n // RESET HTML FILE INPUT VALUE SO FILES PREVIOUSLY ADDED AND REMOVED ARE RECOGNIZED\n fileInputRef.current.value = ''\n fileInputRef.current.click()\n } else {\n console.error(\n 'Could not find \"input\" element in Camera component template',\n )\n }\n }, [setBase64DataUri])\n\n const {\n isUploading,\n uploadErrorMessage,\n isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\n canDownload,\n } = useAttachment(\n value,\n element,\n React.useCallback(\n (id, attachment) => {\n onChange(element, attachment)\n },\n [element, onChange],\n ),\n )\n\n const handleDownload = React.useCallback(async () => {\n if (typeof value === 'string') {\n await downloadFileLegacy(value, id)\n } else if (value && value.type !== 'ERROR') {\n await downloadAttachment(value)\n }\n }, [value, id])\n\n const handleSaveAnnotation = React.useCallback(\n (annotationDataUri: string) => {\n clearIsAnnotating()\n\n if (typeof imageUrl !== 'string') {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n if (!ctx) {\n return\n }\n\n const image = new Image()\n image.onload = function () {\n canvas.width = image.width\n canvas.height = image.height\n\n ctx.drawImage(image, 0, 0)\n\n const annotationImage = new Image()\n annotationImage.onload = function () {\n ctx.drawImage(annotationImage, 0, 0, canvas.width, canvas.height)\n\n try {\n const base64Data = canvas.toDataURL()\n setBase64DataUri(base64Data, 'photo.png')\n .then(() => {\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n } catch (error) {\n setState({\n cameraError: error as Error,\n isLoading: false,\n })\n }\n }\n annotationImage.src = annotationDataUri\n }\n image.setAttribute('crossorigin', 'anonymous')\n image.src = imageUrl\n },\n [clearIsAnnotating, imageUrl, setBase64DataUri],\n )\n\n return (\n <>\n <FormElementLabelContainer\n className=\"ob-camera\"\n element={element}\n id={id}\n required={element.required}\n >\n <div className=\"control\">\n {(value \|\| isLoading) && (\n <figure className=\"ob-figure\">\n <DisplayImage\n isUploading={isUploading}\n uploadErrorMessage={uploadErrorMessage}\n isLoadingImageUrl={isLoadingImageUrl}\n imageUrl={imageUrl}\n loadImageUrlError={loadImageUrlError}\n isLoading={isLoading}\n element={element}\n onAnnotate={setIsAnnotating}\n canDownload={canDownload}\n />\n </figure>\n )}\n\n <input\n ref={fileInputRef}\n className=\"ob-input ob-camera__input-hidden cypress-camera-control\"\n type=\"file\"\n accept=\"image/*\"\n capture=\"environment\"\n id={id}\n name={element.name}\n required={element.required}\n disabled={element.readOnly}\n onChange={fileChange}\n />\n <div className=\"buttons ob-buttons\">\n {value ? (\n <>\n <button\n type=\"button\"\n className=\"button ob-button ob-button__clear is-light cypress-clear-camera\"\n onClick={clearImage}\n disabled={element.readOnly \|\| isLoading}\n >\n Clear\n </button>\n {canDownload && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__download is-primary cypress-download-file-button\"\n onClick={handleDownload}\n >\n <span className=\"icon\">\n <i className=\"material-icons\">cloud_download</i>\n </span>\n <span> Download</span>\n </button>\n )}\n </>\n ) : (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-open-camera\"\n onClick={openCamera}\n disabled={element.readOnly \|\| isLoading}\n >\n Open Camera\n </button>\n )}\n </div>\n </div>\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\n {isAnnotating && imageUrl && (\n <AnnotationModal\n imageSrc={imageUrl}\n onClose={clearIsAnnotating}\n onSave={handleSaveAnnotation}\n />\n )}\n\n {cameraError && (\n <Modal\n isOpen\n title=\"Whoops...\"\n className=\"cypress-error-modal\"\n titleClassName=\"cypress-error-title\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-close-error-button\"\n onClick={() => setState({ isLoading: false })}\n >\n Okay\n </button>\n }\n >\n <p>\n An error occurred while attempting to take a photo. Please click{' '}\n <b>Okay</b> below to try again. If the problem persists, please\n contact support.\n </p>\n\n <div className=\"content has-margin-top-6\">\n <blockquote>{cameraError.toString()}</blockquote>\n </div>\n </Modal>\n )}\n </>\n )\n}\n\nexport default React.memo(FormElementCamera)\n\nconst DisplayImage = React.memo(function DisplayImage({\n uploadErrorMessage,\n isUploading,\n isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\n isLoading,\n element,\n onAnnotate,\n}: ReturnType<typeof useAttachment> & {\n element: FormTypes.CameraElement\n isLoading: boolean\n onAnnotate: () => void\n}) {\n if (uploadErrorMessage) {\n return (\n <div className=\"figure-content\">\n <h3 className=\"title is-3\">Upload Failed</h3>\n <p>\n Your photo failed to upload, please press the <b>Clear</b> button and\n try again.\n </p>\n </div>\n )\n }\n\n if (loadImageUrlError) {\n return (\n <div className=\"figure-content\">\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadImageUrlError.message}</p>\n </div>\n )\n }\n\n if (isLoadingImageUrl \|\| isLoading) {\n return (\n <div className=\"figure-content has-text-centered cypress-camera-loading-image\">\n <OnLoading small />\n </div>\n )\n }\n\n if (imageUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n element={element}\n isLoadingImageUrl={isLoadingImageUrl}\n loadImageUrlError={loadImageUrlError}\n isUploading={isUploading}\n imageUrl={imageUrl}\n />\n </span>\n <img\n src={imageUrl}\n className=\"cypress-camera-image ob-camera__img\"\n crossOrigin=\"anonymous\"\n />\n <button\n type=\"button\"\n className=\"button is-primary ob-camera__annotate-button cypress-annotate-button\"\n onClick={onAnnotate}\n disabled={element.readOnly}\n >\n <span className=\"icon\">\n <i className=\"material-icons\">brush</i>\n </span>\n </button>\n </>\n )\n }\n\n return (\n <div className=\"figure-content\">\n <ImagePreviewUnavailable />\n </div>\n )\n})\n"]}
1	+ {"version":3,"file":"FormElementCamera.js","sourceRoot":"","sources":["../../src/form-elements/FormElementCamera.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,eAAe,MAAM,0BAA0B,CAAA;AACtD,OAAO,kBAAkB,EAAE,EACzB,kBAAkB,GACnB,MAAM,2BAA2B,CAAA;AAClC,OAAO,SAAS,MAAM,kCAAkC,CAAA;AAExD,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,qBAAqB,MAAM,mCAAmC,CAAA;AAErE,OAAO,aAAa,MAAM,oCAAoC,CAAA;AAC9D,OAAO,eAAe,MAAM,wCAAwC,CAAA;AACpE,OAAO,KAAK,MAAM,8BAA8B,CAAA;AAChD,OAAO,EACL,yBAAyB,EACzB,yBAAyB,EACzB,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,yBAAyB,CAAA;AAChC,OAAO,gBAAgB,MAAM,qDAAqD,CAAA;AAClF,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,cAAc,GACf,MAAM,wBAAwB,CAAA;AAC/B,OAAO,uBAAuB,MAAM,4DAA4D,CAAA;AAYhG,SAAS,iBAAiB,CAAC,EACzB,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,GAClB;IACN,MAAM,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAG1D;QACD,SAAS,EAAE,KAAK;KACjB,CAAC,CAAA;IACF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,eAAe,CAAC,KAAK,CAAC,CAAA;IACpD,MAAM,CAAC,YAAY,EAAE,eAAe,EAAE,iBAAiB,CAAC,GACtD,eAAe,CAAC,KAAK,CAAC,CAAA;IACxB,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAEzD,MAAM,gBAAgB,GAAG,KAAK,CAAC,WAAW,CACxC,KAAK,EAAE,OAAe,EAAE,QAAgB,EAAE,EAAE;QAC1C,IAAI,yBAAyB,CAAC,OAAO,CAAC,EAAE;YACtC,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC,CAAA;YAC1B,OAAM;SACP;QAED,yDAAyD;QACzD,MAAM,IAAI,GAAG,MAAM,cAAc,CAAC,OAAO,CAAC,CAAA;QAC1C,QAAQ,CAAC,OAAO,EAAE,oBAAoB,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAA;IAClE,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CAAA;IAED,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;IAC9B,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEvB,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAClC,KAAK,EAAE,WAAgD,EAAE,EAAE;QACzD,IAAI,CAAC,WAAW,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,EAAE;YACpD,OAAM;SACP;QAED,MAAM,IAAI,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;QACxC,IAAI,CAAC,IAAI,EAAE;YACT,OAAM;SACP;QAED,QAAQ,CAAC;YACP,SAAS,EAAE,IAAI;SAChB,CAAC,CAAA;QAEF,OAAO,CAAC,GAAG,CAAC,qBAAqB,EAAE,IAAI,CAAC,CAAA;QACxC,IAAI;YACF,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;gBACzC,MAAM,IAAI,KAAK,CACb,sBAAsB,IAAI,CAAC,IAAI,4BAA4B,CAC5D,CAAA;aACF;YACD,MAAM,MAAM,GAAG,MAAM,sBAAsB,CACzC,IAAI,EACJ,OAAO,CAAC,yBAAyB,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,CACtE,CAAA;YAED,MAAM,oBAAoB,GAAG,yBAAyB,CAAC,OAAO,CAAC,CAAA;YAC/D,IAAI,MAAM,YAAY,IAAI,EAAE;gBAC1B,IAAI,oBAAoB,EAAE;oBACxB,MAAM,MAAM,GAAG,MAAM,YAAY,CAAC,MAAM,CAAC,CAAA;oBACzC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,EAAE,CAAC,CAAA;iBACtC;qBAAM;oBACL,QAAQ,CAAC,OAAO,EAAE,oBAAoB,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAA;iBACpE;aACF;iBAAM;gBACL,IAAI,oBAAoB,EAAE;oBACxB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,SAAS,EAAE,CAAC,CAAA;iBACtC;qBAAM;oBACL,MAAM,IAAI,GAAG,MAAM,YAAY,CAAC,MAAM,CAAC,CAAA;oBACvC,QAAQ,CAAC,OAAO,EAAE,oBAAoB,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAA;iBAClE;aACF;YAED,UAAU,EAAE,CAAA;YACZ,QAAQ,CAAC;gBACP,SAAS,EAAE,KAAK;aACjB,CAAC,CAAA;SACH;QAAC,OAAO,KAAK,EAAE;YACd,QAAQ,CAAC;gBACP,SAAS,EAAE,KAAK;gBAChB,WAAW,EAAE,KAAc;aAC5B,CAAC,CAAA;SACH;IACH,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC,CAChC,CAAA;IACD,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,MAAM,CAAC,OAAO,IAAI,SAAS,CAAC,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC,UAAU,EAAE;YACrE,QAAQ,CAAC;gBACP,SAAS,EAAE,IAAI;aAChB,CAAC,CAAA;YACF,SAAS,CAAC,MAAM,CAAC,UAAU,CACzB,CAAC,UAAkB,EAAE,EAAE;gBACrB,gBAAgB,CAAC,0BAA0B,UAAU,EAAE,EAAE,YAAY,CAAC;qBACnE,IAAI,CAAC,GAAG,EAAE;oBACT,QAAQ,CAAC;wBACP,SAAS,EAAE,KAAK;qBACjB,CAAC,CAAA;gBACJ,CAAC,CAAC;qBACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;oBACf,QAAQ,CAAC;wBACP,WAAW,EAAE,KAAK;wBAClB,SAAS,EAAE,KAAK;qBACjB,CAAC,CAAA;gBACJ,CAAC,CAAC,CAAA;YACN,CAAC,EACD,CAAC,KAAY,EAAE,EAAE;gBACf,OAAO,CAAC,IAAI,CACV,oDAAoD,EACpD,KAAK,CACN,CAAA;gBACD,QAAQ,CAAC;oBACP,SAAS,EAAE,KAAK;oBAChB,WAAW,EAAE,KAAK;iBACnB,CAAC,CAAA;YACJ,CAAC,EACD;gBACE,OAAO,EAAE,GAAG;gBACZ,eAAe,EAAE,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,QAAQ;gBACvD,UAAU,EAAE,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC,MAAM;gBAClD,SAAS,EAAE,KAAK;gBAChB,YAAY,EAAE,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI;gBAC7C,SAAS,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO;gBAC1C,kBAAkB,EAAE,IAAI;gBACxB,gBAAgB,EAAE,KAAK;gBACvB,eAAe,EAAE,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI;aAC9C,CACF,CAAA;SACF;aAAM,IAAI,YAAY,CAAC,OAAO,EAAE;YAC/B,mFAAmF;YACnF,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAA;YAC/B,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;SAC7B;aAAM;YACL,OAAO,CAAC,KAAK,CACX,6DAA6D,CAC9D,CAAA;SACF;IACH,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAEtB,MAAM,EACJ,WAAW,EACX,kBAAkB,EAClB,iBAAiB,EACjB,QAAQ,EACR,iBAAiB,EACjB,WAAW,GACZ,GAAG,aAAa,CACf,KAAK,EACL,OAAO,EACP,KAAK,CAAC,WAAW,CACf,CAAC,EAAE,EAAE,UAAU,EAAE,EAAE;QACjB,QAAQ,CAAC,OAAO,EAAE,UAAU,CAAC,CAAA;IAC/B,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CACF,CAAA;IAED,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAClD,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;YAC7B,MAAM,kBAAkB,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;SACpC;aAAM,IAAI,KAAK,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAC1C,MAAM,kBAAkB,CAAC,KAAK,CAAC,CAAA;SAChC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAA;IAEf,MAAM,oBAAoB,GAAG,KAAK,CAAC,WAAW,CAC5C,CAAC,iBAAyB,EAAE,EAAE;QAC5B,iBAAiB,EAAE,CAAA;QAEnB,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;YAChC,OAAM;SACP;QAED,QAAQ,CAAC;YACP,SAAS,EAAE,IAAI;SAChB,CAAC,CAAA;QAEF,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;QAC/C,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;QACnC,IAAI,CAAC,GAAG,EAAE;YACR,OAAM;SACP;QAED,MAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAA;QACzB,KAAK,CAAC,MAAM,GAAG;YACb,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAA;YAC1B,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;YAE5B,GAAG,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;YAE1B,MAAM,eAAe,GAAG,IAAI,KAAK,EAAE,CAAA;YACnC,eAAe,CAAC,MAAM,GAAG;gBACvB,GAAG,CAAC,SAAS,CAAC,eAAe,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAA;gBAEjE,IAAI;oBACF,IAAI,yBAAyB,CAAC,OAAO,CAAC,EAAE;wBACtC,MAAM,UAAU,GAAG,MAAM,CAAC,SAAS,EAAE,CAAA;wBACrC,QAAQ,CAAC,OAAO,EAAE,UAAU,CAAC,CAAA;wBAC7B,QAAQ,CAAC;4BACP,SAAS,EAAE,KAAK;yBACjB,CAAC,CAAA;wBACF,OAAM;qBACP;oBACD,YAAY,CAAC,MAAM,CAAC;yBACjB,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;wBACb,MAAM,UAAU,GAAG,oBAAoB,CACrC,IAAI,EACJ,WAAW,EACX,OAAO,CACR,CAAA;wBACD,QAAQ,CAAC,OAAO,EAAE,UAAU,CAAC,CAAA;wBAC7B,QAAQ,CAAC;4BACP,SAAS,EAAE,KAAK;yBACjB,CAAC,CAAA;oBACJ,CAAC,CAAC;yBACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;wBACf,QAAQ,CAAC;4BACP,WAAW,EAAE,KAAK;4BAClB,SAAS,EAAE,KAAK;yBACjB,CAAC,CAAA;oBACJ,CAAC,CAAC,CAAA;iBACL;gBAAC,OAAO,KAAK,EAAE;oBACd,QAAQ,CAAC;wBACP,WAAW,EAAE,KAAc;wBAC3B,SAAS,EAAE,KAAK;qBACjB,CAAC,CAAA;iBACH;YACH,CAAC,CAAA;YACD,eAAe,CAAC,GAAG,GAAG,iBAAiB,CAAA;QACzC,CAAC,CAAA;QACD,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,WAAW,CAAC,CAAA;QAC9C,KAAK,CAAC,GAAG,GAAG,QAAQ,CAAA;IACtB,CAAC,EACD,CAAC,iBAAiB,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,CACjD,CAAA;IAED,OAAO,CACL;QACE,oBAAC,yBAAyB,IACxB,SAAS,EAAC,WAAW,EACrB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,SAAS;gBACrB,CAAC,KAAK,IAAI,SAAS,CAAC,IAAI,CACvB,gCAAQ,SAAS,EAAC,WAAW;oBAC3B,oBAAC,YAAY,IACX,WAAW,EAAE,WAAW,EACxB,kBAAkB,EAAE,kBAAkB,EACtC,iBAAiB,EAAE,iBAAiB,EACpC,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,eAAe,EAC3B,WAAW,EAAE,WAAW,GACxB,CACK,CACV;gBAED,+BACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAC,yDAAyD,EACnE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,aAAa,EACrB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,UAAU,GACpB;gBACF,6BAAK,SAAS,EAAC,oBAAoB,IAChC,KAAK,CAAC,CAAC,CAAC,CACP;oBACE,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,iEAAiE,EAC3E,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,SAAS,YAGhC;oBACR,WAAW,IAAI,CACd,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,8EAA8E,EACxF,OAAO,EAAE,cAAc;wBAEvB,8BAAM,SAAS,EAAC,MAAM;4BACpB,2BAAG,SAAS,EAAC,gBAAgB,qBAAmB,CAC3C;wBACP,mDAA2B,CACpB,CACV,CACA,CACJ,CAAC,CAAC,CAAC,CACF,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,iEAAiE,EAC3E,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,SAAS,kBAGhC,CACV,CACG,CACF;YACL,CAAC,OAAO,IAAI,wBAAwB,CAAC,IAAI,CAAC,CAAC,iBAAiB,IAAI,CAC/D,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;gBAC5C,6BAAK,SAAS,EAAC,2DAA2D,IACvE,iBAAiB,CACd,CACF,CACP,CACyB;QAE3B,YAAY,IAAI,QAAQ,IAAI,CAC3B,oBAAC,eAAe,IACd,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,iBAAiB,EAC1B,MAAM,EAAE,oBAAoB,GAC5B,CACH;QAEA,WAAW,IAAI,CACd,oBAAC,KAAK,IACJ,MAAM,QACN,KAAK,EAAC,WAAW,EACjB,SAAS,EAAC,qBAAqB,EAC/B,cAAc,EAAC,qBAAqB,EACpC,OAAO,EACL,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,wDAAwD,EAClE,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,WAGtC;YAGX;;gBACmE,GAAG;gBACpE,sCAAW;wFAET;YAEJ,6BAAK,SAAS,EAAC,0BAA0B;gBACvC,wCAAa,WAAW,CAAC,QAAQ,EAAE,CAAc,CAC7C,CACA,CACT,CACA,CACJ,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;AAE5C,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,YAAY,CAAC,EACpD,kBAAkB,EAClB,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,UAAU,GAKX;IACC,IAAI,kBAAkB,EAAE;QACtB,OAAO,CACL,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,4BAAI,SAAS,EAAC,YAAY,oBAAmB;YAC7C;;gBACgD,uCAAY;yCAExD,CACA,CACP,CAAA;KACF;IAED,IAAI,iBAAiB,EAAE;QACrB,OAAO,CACL,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,4BAAI,SAAS,EAAC,YAAY,qBAAoB;YAC9C,+BAAI,iBAAiB,CAAC,OAAO,CAAK,CAC9B,CACP,CAAA;KACF;IAED,IAAI,iBAAiB,IAAI,SAAS,EAAE;QAClC,OAAO,CACL,6BAAK,SAAS,EAAC,+DAA+D;YAC5E,oBAAC,SAAS,IAAC,KAAK,SAAG,CACf,CACP,CAAA;KACF;IAED,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL;YACE,8BAAM,SAAS,EAAC,mBAAmB;gBACjC,oBAAC,gBAAgB,IACf,OAAO,EAAE,OAAO,EAChB,iBAAiB,EAAE,iBAAiB,EACpC,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,GAClB,CACG;YACP,6BACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAC,qCAAqC,EAC/C,WAAW,EAAC,WAAW,GACvB;YACF,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,sEAAsE,EAChF,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,OAAO,CAAC,QAAQ;gBAE1B,8BAAM,SAAS,EAAC,MAAM;oBACpB,2BAAG,SAAS,EAAC,gBAAgB,YAAU,CAClC,CACA,CACR,CACJ,CAAA;KACF;IAED,OAAO,CACL,6BAAK,SAAS,EAAC,gBAAgB;QAC7B,oBAAC,uBAAuB,OAAG,CACvB,CACP,CAAA;AACH,CAAC,CAAC,CAAA","sourcesContent":["import * as React from 'react'\n\nimport useBooleanState from '../hooks/useBooleanState'\nimport downloadAttachment, {\n downloadFileLegacy,\n} from '../services/download-file'\nimport OnLoading from '../components/renderer/OnLoading'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport drawTimestampOnCanvas from '../services/drawTimestampOnCanvas'\nimport { FormElementBinaryStorageValue } from '../types/attachments'\nimport useAttachment from '../hooks/attachments/useAttachment'\nimport AnnotationModal from '../components/renderer/AnnotationModal'\nimport Modal from '../components/renderer/Modal'\nimport {\n checkIfContentTypeIsImage,\n checkIsUsingLegacyStorage,\n prepareNewAttachment,\n correctFileOrientation,\n} from '../services/attachments'\nimport AttachmentStatus from '../components/renderer/attachments/AttachmentStatus'\nimport {\n blobToCanvas,\n canvasToBlob,\n urlToBlobAsync,\n} from '../services/blob-utils'\nimport ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable'\nimport { FormElementValueChangeHandler } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.CameraElement\n value: FormElementBinaryStorageValue\n onChange: FormElementValueChangeHandler<FormElementBinaryStorageValue>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n}\n\nfunction FormElementCamera({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n}: Props) {\n const [{ cameraError, isLoading }, setState] = React.useState<{\n isLoading: boolean\n cameraError?: Error\n }>({\n isLoading: false,\n })\n const [isDirty, setIsDirty] = useBooleanState(false)\n const [isAnnotating, setIsAnnotating, clearIsAnnotating] =\n useBooleanState(false)\n const fileInputRef = React.useRef<HTMLInputElement>(null)\n\n const setBase64DataUri = React.useCallback(\n async (dataUri: string, fileName: string) => {\n if (checkIsUsingLegacyStorage(element)) {\n onChange(element, dataUri)\n return\n }\n\n // Convert base64 data uri to blob and send it on its way\n const blob = await urlToBlobAsync(dataUri)\n onChange(element, prepareNewAttachment(blob, fileName, element))\n },\n [element, onChange],\n )\n\n const clearImage = React.useCallback(() => {\n onChange(element, undefined)\n }, [element, onChange])\n\n const fileChange = React.useCallback(\n async (changeEvent: React.ChangeEvent<HTMLInputElement>) => {\n if (!changeEvent.target \|\| !changeEvent.target.files) {\n return\n }\n\n const file = changeEvent.target.files[0]\n if (!file) {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n console.log('File selected event', file)\n try {\n if (!checkIfContentTypeIsImage(file.type)) {\n throw new Error(\n `Invalid file type \"${file.type}\". Please select an image.`,\n )\n }\n const result = await correctFileOrientation(\n file,\n element.includeTimestampWatermark ? drawTimestampOnCanvas : undefined,\n )\n\n const isUsingLegacyStorage = checkIsUsingLegacyStorage(element)\n if (result instanceof Blob) {\n if (isUsingLegacyStorage) {\n const canvas = await blobToCanvas(result)\n onChange(element, canvas.toDataURL())\n } else {\n onChange(element, prepareNewAttachment(result, file.name, element))\n }\n } else {\n if (isUsingLegacyStorage) {\n onChange(element, result.toDataURL())\n } else {\n const blob = await canvasToBlob(result)\n onChange(element, prepareNewAttachment(blob, file.name, element))\n }\n }\n\n setIsDirty()\n setState({\n isLoading: false,\n })\n } catch (error) {\n setState({\n isLoading: false,\n cameraError: error as Error,\n })\n }\n },\n [element, onChange, setIsDirty],\n )\n const openCamera = React.useCallback(() => {\n if (window.cordova && navigator.camera && navigator.camera.getPicture) {\n setState({\n isLoading: true,\n })\n navigator.camera.getPicture(\n (base64Data: string) => {\n setBase64DataUri(`data:image/jpeg;base64,${base64Data}`, 'photo.jpeg')\n .then(() => {\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n },\n (error: Error) => {\n console.warn(\n 'An error occurred while attempting to take a photo',\n error,\n )\n setState({\n isLoading: false,\n cameraError: error,\n })\n },\n {\n quality: 100,\n destinationType: window.Camera.DestinationType.DATA_URL,\n sourceType: window.Camera.PictureSourceType.CAMERA,\n allowEdit: false,\n encodingType: window.Camera.EncodingType.JPEG,\n mediaType: window.Camera.MediaType.PICTURE,\n correctOrientation: true,\n saveToPhotoAlbum: false,\n cameraDirection: window.Camera.Direction.BACK,\n },\n )\n } else if (fileInputRef.current) {\n // RESET HTML FILE INPUT VALUE SO FILES PREVIOUSLY ADDED AND REMOVED ARE RECOGNIZED\n fileInputRef.current.value = ''\n fileInputRef.current.click()\n } else {\n console.error(\n 'Could not find \"input\" element in Camera component template',\n )\n }\n }, [setBase64DataUri])\n\n const {\n isUploading,\n uploadErrorMessage,\n isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\n canDownload,\n } = useAttachment(\n value,\n element,\n React.useCallback(\n (id, attachment) => {\n onChange(element, attachment)\n },\n [element, onChange],\n ),\n )\n\n const handleDownload = React.useCallback(async () => {\n if (typeof value === 'string') {\n await downloadFileLegacy(value, id)\n } else if (value && value.type !== 'ERROR') {\n await downloadAttachment(value)\n }\n }, [value, id])\n\n const handleSaveAnnotation = React.useCallback(\n (annotationDataUri: string) => {\n clearIsAnnotating()\n\n if (typeof imageUrl !== 'string') {\n return\n }\n\n setState({\n isLoading: true,\n })\n\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n if (!ctx) {\n return\n }\n\n const image = new Image()\n image.onload = function () {\n canvas.width = image.width\n canvas.height = image.height\n\n ctx.drawImage(image, 0, 0)\n\n const annotationImage = new Image()\n annotationImage.onload = function () {\n ctx.drawImage(annotationImage, 0, 0, canvas.width, canvas.height)\n\n try {\n if (checkIsUsingLegacyStorage(element)) {\n const base64Data = canvas.toDataURL()\n onChange(element, base64Data)\n setState({\n isLoading: false,\n })\n return\n }\n canvasToBlob(canvas)\n .then((blob) => {\n const attachment = prepareNewAttachment(\n blob,\n 'photo.png',\n element,\n )\n onChange(element, attachment)\n setState({\n isLoading: false,\n })\n })\n .catch((error) => {\n setState({\n cameraError: error,\n isLoading: false,\n })\n })\n } catch (error) {\n setState({\n cameraError: error as Error,\n isLoading: false,\n })\n }\n }\n annotationImage.src = annotationDataUri\n }\n image.setAttribute('crossorigin', 'anonymous')\n image.src = imageUrl\n },\n [clearIsAnnotating, element, imageUrl, onChange],\n )\n\n return (\n <>\n <FormElementLabelContainer\n className=\"ob-camera\"\n element={element}\n id={id}\n required={element.required}\n >\n <div className=\"control\">\n {(value \|\| isLoading) && (\n <figure className=\"ob-figure\">\n <DisplayImage\n isUploading={isUploading}\n uploadErrorMessage={uploadErrorMessage}\n isLoadingImageUrl={isLoadingImageUrl}\n imageUrl={imageUrl}\n loadImageUrlError={loadImageUrlError}\n isLoading={isLoading}\n element={element}\n onAnnotate={setIsAnnotating}\n canDownload={canDownload}\n />\n </figure>\n )}\n\n <input\n ref={fileInputRef}\n className=\"ob-input ob-camera__input-hidden cypress-camera-control\"\n type=\"file\"\n accept=\"image/*\"\n capture=\"environment\"\n id={id}\n name={element.name}\n required={element.required}\n disabled={element.readOnly}\n onChange={fileChange}\n />\n <div className=\"buttons ob-buttons\">\n {value ? (\n <>\n <button\n type=\"button\"\n className=\"button ob-button ob-button__clear is-light cypress-clear-camera\"\n onClick={clearImage}\n disabled={element.readOnly \|\| isLoading}\n >\n Clear\n </button>\n {canDownload && (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__download is-primary cypress-download-file-button\"\n onClick={handleDownload}\n >\n <span className=\"icon\">\n <i className=\"material-icons\">cloud_download</i>\n </span>\n <span> Download</span>\n </button>\n )}\n </>\n ) : (\n <button\n type=\"button\"\n className=\"button ob-button ob-button__open is-primary cypress-open-camera\"\n onClick={openCamera}\n disabled={element.readOnly \|\| isLoading}\n >\n Open Camera\n </button>\n )}\n </div>\n </div>\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\n {isAnnotating && imageUrl && (\n <AnnotationModal\n imageSrc={imageUrl}\n onClose={clearIsAnnotating}\n onSave={handleSaveAnnotation}\n />\n )}\n\n {cameraError && (\n <Modal\n isOpen\n title=\"Whoops...\"\n className=\"cypress-error-modal\"\n titleClassName=\"cypress-error-title\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-close-error-button\"\n onClick={() => setState({ isLoading: false })}\n >\n Okay\n </button>\n }\n >\n <p>\n An error occurred while attempting to take a photo. Please click{' '}\n <b>Okay</b> below to try again. If the problem persists, please\n contact support.\n </p>\n\n <div className=\"content has-margin-top-6\">\n <blockquote>{cameraError.toString()}</blockquote>\n </div>\n </Modal>\n )}\n </>\n )\n}\n\nexport default React.memo(FormElementCamera)\n\nconst DisplayImage = React.memo(function DisplayImage({\n uploadErrorMessage,\n isUploading,\n isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\n isLoading,\n element,\n onAnnotate,\n}: ReturnType<typeof useAttachment> & {\n element: FormTypes.CameraElement\n isLoading: boolean\n onAnnotate: () => void\n}) {\n if (uploadErrorMessage) {\n return (\n <div className=\"figure-content\">\n <h3 className=\"title is-3\">Upload Failed</h3>\n <p>\n Your photo failed to upload, please press the <b>Clear</b> button and\n try again.\n </p>\n </div>\n )\n }\n\n if (loadImageUrlError) {\n return (\n <div className=\"figure-content\">\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadImageUrlError.message}</p>\n </div>\n )\n }\n\n if (isLoadingImageUrl \|\| isLoading) {\n return (\n <div className=\"figure-content has-text-centered cypress-camera-loading-image\">\n <OnLoading small />\n </div>\n )\n }\n\n if (imageUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n element={element}\n isLoadingImageUrl={isLoadingImageUrl}\n loadImageUrlError={loadImageUrlError}\n isUploading={isUploading}\n imageUrl={imageUrl}\n />\n </span>\n <img\n src={imageUrl}\n className=\"cypress-camera-image ob-camera__img\"\n crossOrigin=\"anonymous\"\n />\n <button\n type=\"button\"\n className=\"button is-primary ob-camera__annotate-button cypress-annotate-button\"\n onClick={onAnnotate}\n disabled={element.readOnly}\n >\n <span className=\"icon\">\n <i className=\"material-icons\">brush</i>\n </span>\n </button>\n </>\n )\n }\n\n return (\n <div className=\"figure-content\">\n <ImagePreviewUnavailable />\n </div>\n )\n})\n"]}

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

@@ -7,7 +7,7 @@ import useAttachment from '../hooks/attachments/useAttachment';
 import { checkIsUsingLegacyStorage, prepareNewAttachment, } from '../services/attachments';
 import AttachmentStatus from '../components/renderer/attachments/AttachmentStatus';
 import useBooleanState from '../hooks/useBooleanState';
-import { urlToBlobAsync } from '../services/blob-utils';
+import { canvasToBlob } from '../services/blob-utils';
 import ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable';
 import useIsPageVisible from '../hooks/useIsPageVisible';
 function FormElementSignature({ id, element, value, onChange, validationMessage, displayValidationMessage, }) {
@@ -38,13 +38,14 @@ const SignatureDrawing = React.memo(function SignatureDrawing({ element, onChang
     const handleDone = React.useCallback(async () => {
         if (!canvasRef.current)
             return;
-        const value = canvasRef.current.getTrimmedCanvas().toDataURL();
+        const trimmedCanvas = canvasRef.current.getTrimmedCanvas();
         if (checkIsUsingLegacyStorage(element)) {
+            const value = trimmedCanvas.toDataURL();
             onChange(element, value);
             return;
         }
         // Convert base64 data uri to blob and send it on its way
-        const blob = await urlToBlobAsync(value);
+        const blob = await canvasToBlob(trimmedCanvas);
         onChange(element, prepareNewAttachment(blob, 'signature.png', element));
     }, [element, onChange]);
     // HANDLING CANVAS CHANGE

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementSignature.js","sourceRoot":"","sources":["../../src/form-elements/FormElementSignature.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport SignatureCanvas from 'react-signature-canvas'\nimport { FormTypes } from '@oneblink/types'\n\nimport scrollingService from '../services/scrolling-service'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport OnLoading from '../components/renderer/OnLoading'\nimport useAttachment from '../hooks/attachments/useAttachment'\nimport { FormElementBinaryStorageValue } from '../types/attachments'\nimport {\n checkIsUsingLegacyStorage,\n prepareNewAttachment,\n} from '../services/attachments'\nimport AttachmentStatus from '../components/renderer/attachments/AttachmentStatus'\nimport useBooleanState from '../hooks/useBooleanState'\nimport { urlToBlobAsync } from '../services/blob-utils'\nimport ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable'\nimport { FormElementValueChangeHandler } from '../types/form'\nimport useIsPageVisible from '../hooks/useIsPageVisible'\n\ntype Props = {\n id: string\n element: FormTypes.DrawElement\n value: FormElementBinaryStorageValue\n onChange: FormElementValueChangeHandler<FormElementBinaryStorageValue>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n}\n\nfunction FormElementSignature({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n}: Props) {\n const [isDirty, setIsDirty] = useBooleanState(false)\n const isPageVisible = useIsPageVisible()\n\n const handleChange = React.useCallback(\n (formElement, newValue) => {\n setIsDirty()\n onChange(formElement, newValue)\n },\n [onChange, setIsDirty],\n )\n\n return (\n <div className=\"cypress-signature-element\">\n <FormElementLabelContainer\n className=\"ob-signature\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"control\">\n {value ? (\n <SignatureDisplay\n element={element}\n value={value}\n onChange={handleChange}\n />\n ) : isPageVisible ? (\n <SignatureDrawing element={element} onChange={handleChange} />\n ) : null}\n </div>\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(FormElementSignature)\n\nconst SignatureDrawing = React.memo(function SignatureDrawing({\n element,\n onChange,\n}: {\n element: Props['element']\n onChange: Props['onChange']\n}) {\n const canvasRef = React.useRef<SignatureCanvas>(null)\n\n const [isEmpty, setIsEmpty] = React.useState(true)\n const [canvasDimensions, setCanvasDimensions] = React.useState({})\n\n const handleClear = React.useCallback(() => {\n if (canvasRef.current) {\n console.log('Clearing signature...')\n canvasRef.current.clear()\n }\n setIsEmpty(true)\n }, [])\n\n const handleDone = React.useCallback(async () => {\n if (!canvasRef.current) return\n const value = canvasRef.current.getTrimmedCanvas().toDataURL()\n\n if (checkIsUsingLegacyStorage(element)) {\n onChange(element, value)\n return\n }\n\n // Convert base64 data uri to blob and send it on its way\n const blob = await urlToBlobAsync(value)\n onChange(element, prepareNewAttachment(blob, 'signature.png', element))\n }, [element, onChange])\n\n // HANDLING CANVAS CHANGE\n const handleEndDraw = React.useCallback(() => {\n if (window.cordova) {\n scrollingService.enableScrolling()\n }\n if (isEmpty) {\n setIsEmpty(false)\n }\n }, [isEmpty])\n\n // HANDLE RESIZE\n React.useEffect(() => {\n const signatureCanvas = canvasRef.current\n if (!signatureCanvas) return\n const resize = () => {\n const parentDiv = signatureCanvas.getCanvas().parentNode\n if (parentDiv) {\n setCanvasDimensions({\n // @ts-expect-error ???\n width: parentDiv.clientWidth,\n // @ts-expect-error ???\n height: parentDiv.clientHeight,\n })\n }\n }\n window.addEventListener('resize', resize)\n resize()\n\n return () => {\n window.removeEventListener('resize', resize)\n }\n }, [canvasRef])\n\n // REACTIVE DISABLING OF CANVAS\n React.useEffect(() => {\n if (!canvasRef.current) return\n if (element.readOnly) {\n canvasRef.current.off()\n } else {\n canvasRef.current.on()\n }\n }, [canvasRef, element.readOnly])\n\n return (\n <>\n <div>\n <SignatureCanvas\n ref={canvasRef}\n canvasProps={{\n ...canvasDimensions,\n className:\n 'input ob-signature__control cypress-signature-control signature-pad',\n // @ts-expect-error ???\n disabled: element.readOnly,\n }}\n onEnd={handleEndDraw}\n onBegin={\n window.cordova ? scrollingService.disableScrolling : undefined\n }\n />\n </div>\n\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button is-light ob-button__clear cypress-clear-signature\"\n onClick={handleClear}\n disabled={element.readOnly \|\| isEmpty}\n >\n Clear\n </button>\n <button\n type=\"button\"\n className=\"button ob-button ob-button__done is-primary cypress-done-signature-button\"\n onClick={handleDone}\n disabled={element.readOnly \|\| isEmpty}\n >\n Done\n </button>\n </div>\n </>\n )\n})\n\nconst SignatureDisplay = React.memo(function SignatureDisplay({\n element,\n value,\n onChange,\n}: {\n element: Props['element']\n value: Props['value']\n onChange: Props['onChange']\n}) {\n const result = useAttachment(\n value,\n element,\n React.useCallback(\n (id, attachment) => {\n onChange(element, attachment)\n },\n [element, onChange],\n ),\n )\n\n return (\n <>\n <figure className=\"ob-figure\">\n <div className=\"figure-content\">\n <DisplayImage element={element} {...result} />\n </div>\n </figure>\n\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button is-light ob-button__clear cypress-clear-signature\"\n onClick={() => onChange(element, undefined)}\n disabled={element.readOnly}\n >\n Clear\n </button>\n </div>\n </>\n )\n})\n\nconst DisplayImage = React.memo(function DisplayImage({\n element,\n uploadErrorMessage,\n isUploading,\n isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\n}: ReturnType<typeof useAttachment> & {\n element: FormTypes.DrawElement\n}) {\n if (uploadErrorMessage) {\n return (\n <>\n <h3 className=\"title is-3\">Upload Failed</h3>\n <p>\n Your signature failed to upload, please press the <b>Clear</b> button\n and try again.\n </p>\n </>\n )\n }\n\n if (loadImageUrlError) {\n return (\n <>\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadImageUrlError.message}</p>\n </>\n )\n }\n\n if (isLoadingImageUrl) {\n return <OnLoading small className=\"cypress-signature-loading-image\" />\n }\n\n if (imageUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n element={element}\n isLoadingImageUrl={isLoadingImageUrl}\n loadImageUrlError={loadImageUrlError}\n isUploading={isUploading}\n imageUrl={imageUrl}\n />\n </span>\n <img\n src={imageUrl}\n className=\"cypress-signature-image ob-signature__img\"\n />\n </>\n )\n }\n\n return <ImagePreviewUnavailable />\n})\n"]}
1	+ {"version":3,"file":"FormElementSignature.js","sourceRoot":"","sources":["../../src/form-elements/FormElementSignature.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport SignatureCanvas from 'react-signature-canvas'\nimport { FormTypes } from '@oneblink/types'\n\nimport scrollingService from '../services/scrolling-service'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport OnLoading from '../components/renderer/OnLoading'\nimport useAttachment from '../hooks/attachments/useAttachment'\nimport { FormElementBinaryStorageValue } from '../types/attachments'\nimport {\n checkIsUsingLegacyStorage,\n prepareNewAttachment,\n} from '../services/attachments'\nimport AttachmentStatus from '../components/renderer/attachments/AttachmentStatus'\nimport useBooleanState from '../hooks/useBooleanState'\nimport { canvasToBlob } from '../services/blob-utils'\nimport ImagePreviewUnavailable from '../components/renderer/attachments/ImagePreviewUnavailable'\nimport { FormElementValueChangeHandler } from '../types/form'\nimport useIsPageVisible from '../hooks/useIsPageVisible'\n\ntype Props = {\n id: string\n element: FormTypes.DrawElement\n value: FormElementBinaryStorageValue\n onChange: FormElementValueChangeHandler<FormElementBinaryStorageValue>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n}\n\nfunction FormElementSignature({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n}: Props) {\n const [isDirty, setIsDirty] = useBooleanState(false)\n const isPageVisible = useIsPageVisible()\n\n const handleChange = React.useCallback(\n (formElement, newValue) => {\n setIsDirty()\n onChange(formElement, newValue)\n },\n [onChange, setIsDirty],\n )\n\n return (\n <div className=\"cypress-signature-element\">\n <FormElementLabelContainer\n className=\"ob-signature\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"control\">\n {value ? (\n <SignatureDisplay\n element={element}\n value={value}\n onChange={handleChange}\n />\n ) : isPageVisible ? (\n <SignatureDrawing element={element} onChange={handleChange} />\n ) : null}\n </div>\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(FormElementSignature)\n\nconst SignatureDrawing = React.memo(function SignatureDrawing({\n element,\n onChange,\n}: {\n element: Props['element']\n onChange: Props['onChange']\n}) {\n const canvasRef = React.useRef<SignatureCanvas>(null)\n\n const [isEmpty, setIsEmpty] = React.useState(true)\n const [canvasDimensions, setCanvasDimensions] = React.useState({})\n\n const handleClear = React.useCallback(() => {\n if (canvasRef.current) {\n console.log('Clearing signature...')\n canvasRef.current.clear()\n }\n setIsEmpty(true)\n }, [])\n\n const handleDone = React.useCallback(async () => {\n if (!canvasRef.current) return\n const trimmedCanvas = canvasRef.current.getTrimmedCanvas()\n\n if (checkIsUsingLegacyStorage(element)) {\n const value = trimmedCanvas.toDataURL()\n onChange(element, value)\n return\n }\n\n // Convert base64 data uri to blob and send it on its way\n const blob = await canvasToBlob(trimmedCanvas)\n onChange(element, prepareNewAttachment(blob, 'signature.png', element))\n }, [element, onChange])\n\n // HANDLING CANVAS CHANGE\n const handleEndDraw = React.useCallback(() => {\n if (window.cordova) {\n scrollingService.enableScrolling()\n }\n if (isEmpty) {\n setIsEmpty(false)\n }\n }, [isEmpty])\n\n // HANDLE RESIZE\n React.useEffect(() => {\n const signatureCanvas = canvasRef.current\n if (!signatureCanvas) return\n const resize = () => {\n const parentDiv = signatureCanvas.getCanvas().parentNode\n if (parentDiv) {\n setCanvasDimensions({\n // @ts-expect-error ???\n width: parentDiv.clientWidth,\n // @ts-expect-error ???\n height: parentDiv.clientHeight,\n })\n }\n }\n window.addEventListener('resize', resize)\n resize()\n\n return () => {\n window.removeEventListener('resize', resize)\n }\n }, [canvasRef])\n\n // REACTIVE DISABLING OF CANVAS\n React.useEffect(() => {\n if (!canvasRef.current) return\n if (element.readOnly) {\n canvasRef.current.off()\n } else {\n canvasRef.current.on()\n }\n }, [canvasRef, element.readOnly])\n\n return (\n <>\n <div>\n <SignatureCanvas\n ref={canvasRef}\n canvasProps={{\n ...canvasDimensions,\n className:\n 'input ob-signature__control cypress-signature-control signature-pad',\n // @ts-expect-error ???\n disabled: element.readOnly,\n }}\n onEnd={handleEndDraw}\n onBegin={\n window.cordova ? scrollingService.disableScrolling : undefined\n }\n />\n </div>\n\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button is-light ob-button__clear cypress-clear-signature\"\n onClick={handleClear}\n disabled={element.readOnly \|\| isEmpty}\n >\n Clear\n </button>\n <button\n type=\"button\"\n className=\"button ob-button ob-button__done is-primary cypress-done-signature-button\"\n onClick={handleDone}\n disabled={element.readOnly \|\| isEmpty}\n >\n Done\n </button>\n </div>\n </>\n )\n})\n\nconst SignatureDisplay = React.memo(function SignatureDisplay({\n element,\n value,\n onChange,\n}: {\n element: Props['element']\n value: Props['value']\n onChange: Props['onChange']\n}) {\n const result = useAttachment(\n value,\n element,\n React.useCallback(\n (id, attachment) => {\n onChange(element, attachment)\n },\n [element, onChange],\n ),\n )\n\n return (\n <>\n <figure className=\"ob-figure\">\n <div className=\"figure-content\">\n <DisplayImage element={element} {...result} />\n </div>\n </figure>\n\n <div className=\"buttons ob-buttons\">\n <button\n type=\"button\"\n className=\"button ob-button is-light ob-button__clear cypress-clear-signature\"\n onClick={() => onChange(element, undefined)}\n disabled={element.readOnly}\n >\n Clear\n </button>\n </div>\n </>\n )\n})\n\nconst DisplayImage = React.memo(function DisplayImage({\n element,\n uploadErrorMessage,\n isUploading,\n isLoadingImageUrl,\n imageUrl,\n loadImageUrlError,\n}: ReturnType<typeof useAttachment> & {\n element: FormTypes.DrawElement\n}) {\n if (uploadErrorMessage) {\n return (\n <>\n <h3 className=\"title is-3\">Upload Failed</h3>\n <p>\n Your signature failed to upload, please press the <b>Clear</b> button\n and try again.\n </p>\n </>\n )\n }\n\n if (loadImageUrlError) {\n return (\n <>\n <h3 className=\"title is-3\">Preview Failed</h3>\n <p>{loadImageUrlError.message}</p>\n </>\n )\n }\n\n if (isLoadingImageUrl) {\n return <OnLoading small className=\"cypress-signature-loading-image\" />\n }\n\n if (imageUrl) {\n return (\n <>\n <span className=\"ob-figure__status\">\n <AttachmentStatus\n element={element}\n isLoadingImageUrl={isLoadingImageUrl}\n loadImageUrlError={loadImageUrlError}\n isUploading={isUploading}\n imageUrl={imageUrl}\n />\n </span>\n <img\n src={imageUrl}\n className=\"cypress-signature-image ob-signature__img\"\n />\n </>\n )\n }\n\n return <ImagePreviewUnavailable />\n})\n"]}

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@oneblink/apps-react",
   "description": "Helper functions for OneBlink apps in ReactJS.",
-  "version": "1.1.0-beta.2",
+  "version": "1.1.1-beta.2",
   "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
   "bugs": {
     "url": "https://github.com/oneblink/apps-react/issues"