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

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

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/FormElementEmail.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementEmail.js","sourceRoot":"","sources":["../../src/form-elements/FormElementEmail.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAYxF,SAAS,gBAAgB,CAAC,EACxB,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,IAAI,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;IACnD,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,UAAU,EACpB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,qCAAqC;oBAClD,+BACE,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,sCAAsC,EAChD,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,~~CAAC~~,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,SAAS,CAAC,~~EAC/D~~,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU,GAClB;oBACF,8BAAM,SAAS,EAAC,sCAAsC;wBACpD,2BAAG,SAAS,EAAC,0BAA0B,YAAU,CAC5C,CACH;gBACL,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;YAEL,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,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.EmailElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementEmail({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-email-element\">\n <FormElementLabelContainer\n className=\"ob-email\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"email\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-email-control\"\n value={text}\n onChange={(e) => onChange(element, e.target.value \|\| undefined)}\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\">email</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 {(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(FormElementEmail)\n"]}
1	+ {"version":3,"file":"FormElementEmail.js","sourceRoot":"","sources":["../../src/form-elements/FormElementEmail.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAYxF,SAAS,gBAAgB,CAAC,EACxB,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,IAAI,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;IACnD,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,UAAU,EACpB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,qCAAqC;oBAClD,+BACE,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,sCAAsC,EAChD,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CACd,QAAQ,CAAC,OAAO,EAAE;4BAChB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,SAAS;yBACnC,CAAC,EAEJ,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU,GAClB;oBACF,8BAAM,SAAS,EAAC,sCAAsC;wBACpD,2BAAG,SAAS,EAAC,0BAA0B,YAAU,CAC5C,CACH;gBACL,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;YAEL,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,CACxB,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\n\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.EmailElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementEmail({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const text = typeof value === 'string' ? value : ''\n return (\n <div className=\"cypress-email-element\">\n <FormElementLabelContainer\n className=\"ob-email\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"email\"\n placeholder={element.placeholderValue}\n id={id}\n name={element.name}\n className=\"input ob-input cypress-email-control\"\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\">email</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 {(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(FormElementEmail)\n"]}

package/dist/form-elements/FormElementForm.d.ts CHANGED Viewed

@@ -1,12 +1,12 @@
 import { FormTypes, SubmissionTypes } from '@oneblink/types';
 import * as React from 'react';
-import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, FormElementValueChangeHandler, UpdateFormElementsHandler } from '../types/form';
+import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, NestedFormElementValueChangeHandler, UpdateFormElementsHandler } from '../types/form';
 export type Props = {
     formId: number;
     id: string;
     element: FormTypes.FormFormElement;
     value: SubmissionTypes.S3SubmissionData['submission'] | undefined;
-    onChange: FormElementValueChangeHandler<SubmissionTypes.S3SubmissionData['submission']>;
+    onChange: NestedFormElementValueChangeHandler<SubmissionTypes.S3SubmissionData['submission']>;
     onLookup: FormElementLookupHandler;
     formElementValidation: FormElementValidation | undefined;
     displayValidationMessages: boolean;

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

@@ -1,29 +1,47 @@
 import * as React from 'react';
 import OneBlinkFormElements from '../components/renderer/OneBlinkFormElements';
 function FormElementForm({ formId, element, value, id, formElementValidation, displayValidationMessages, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, }) {
-    const handleNestedChange = React.useCallback((nestedElement, nestedElementValue) => {
+    const handleNestedChange = React.useCallback((nestedElement, { value: nestedElementValue, executedLookups: nestedExecutedLookups, }) => {
         if (!('name' in nestedElement))
             return;
-        onChange(element, (existingValue) => ({
-            ...existingValue,
-            [nestedElement.name]: typeof nestedElementValue === 'function'
-                ? nestedElementValue(existingValue ? existingValue[nestedElement.name] : undefined)
-                : nestedElementValue,
-        }));
+        onChange(element, {
+            value: (existingValue) => ({
+                ...existingValue,
+                [nestedElement.name]: typeof nestedElementValue === 'function'
+                    ? nestedElementValue(existingValue ? existingValue[nestedElement.name] : undefined)
+                    : nestedElementValue,
+            }),
+            executedLookups: (existingExecutedLookups) => {
+                if (typeof existingExecutedLookups === 'boolean' ||
+                    Array.isArray(existingExecutedLookups)) {
+                    return {};
+                }
+                return {
+                    ...existingExecutedLookups,
+                    [nestedElement.name]: typeof nestedExecutedLookups === 'function'
+                        ? nestedExecutedLookups(existingExecutedLookups === null || existingExecutedLookups === void 0 ? void 0 : existingExecutedLookups[nestedElement.name])
+                        : nestedExecutedLookups,
+                };
+            },
+        });
     }, [element, onChange]);
     const handleLookup = React.useCallback((mergeLookupResults) => {
         onLookup((currentFormSubmission) => {
+            var _a;
             let model = currentFormSubmission.submission[element.name];
+            let newExecutedLookups = (_a = currentFormSubmission.executedLookups) === null || _a === void 0 ? void 0 : _a[element.name];
             const elements = currentFormSubmission.elements.map((formElement) => {
                 if (formElement.type === 'form' &&
                     formElement.name === element.name &&
                     Array.isArray(formElement.elements)) {
-                    const { elements, submission } = mergeLookupResults({
+                    const { elements, submission, executedLookups } = mergeLookupResults({
                         elements: formElement.elements,
                         submission: model,
                         lastElementUpdated: currentFormSubmission.lastElementUpdated,
+                        executedLookups: newExecutedLookups,
                     });
                     model = submission;
+                    newExecutedLookups = executedLookups;
                     return {
                         ...formElement,
                         elements,
@@ -39,6 +57,10 @@ function FormElementForm({ formId, element, value, id, formElementValidation, di
                 elements,
                 submission,
                 lastElementUpdated: currentFormSubmission.lastElementUpdated,
+                executedLookups: {
+                    ...currentFormSubmission.executedLookups,
+                    [element.name]: newExecutedLookups,
+                },
             };
         });
     }, [element.name, onLookup]);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementForm.js","sourceRoot":"","sources":["../../src/form-elements/FormElementForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport {\n FormElementConditionallyShown,\n FormElementLookupHandler,\n FormElementValidation,\n FormElementValueChangeHandler,\n UpdateFormElementsHandler,\n} from '../types/form'\n\nexport type Props = {\n formId: number\n id: string\n element: FormTypes.FormFormElement\n value: SubmissionTypes.S3SubmissionData['submission'] \| undefined\n onChange: FormElementValueChangeHandler<\n SubmissionTypes.S3SubmissionData['submission']\n >\n onLookup: FormElementLookupHandler\n formElementValidation: FormElementValidation \| undefined\n displayValidationMessages: boolean\n formElementConditionallyShown: FormElementConditionallyShown \| undefined\n onUpdateFormElements: UpdateFormElementsHandler\n}\n\nfunction FormElementForm({\n formId,\n element,\n value,\n id,\n formElementValidation,\n displayValidationMessages,\n formElementConditionallyShown,\n onChange,\n onLookup,\n onUpdateFormElements,\n}: Props) {\n const handleNestedChange = React.useCallback(\n (nestedElement: FormTypes.FormElement, nestedElementValue: unknown) => {\n if (!('name' in nestedElement)) return\n onChange(element, (existingValue) => ({\n ...existingValue,\n [nestedElement.name]:\n typeof nestedElementValue === 'function'\n ? nestedElementValue(\n existingValue ? existingValue[nestedElement.name] : undefined,\n )\n : nestedElementValue,\n }))\n },\n [element, onChange],\n )\n\n const handleLookup = React.useCallback<FormElementLookupHandler>(\n (mergeLookupResults) => {\n onLookup((currentFormSubmission) => {\n let model = currentFormSubmission.submission[\n element.name\n ] as SubmissionTypes.S3SubmissionData['submission']\n const elements = currentFormSubmission.elements.map((formElement) => {\n if (\n formElement.type === 'form' &&\n formElement.name === element.name &&\n Array.isArray(formElement.elements)\n ) {\n const { elements, submission } = mergeLookupResults({\n elements: formElement.elements,\n submission: model,\n lastElementUpdated: currentFormSubmission.lastElementUpdated,\n })\n model = submission\n return {\n ...formElement,\n elements,\n }\n }\n return formElement\n })\n\n const submission = {\n ...currentFormSubmission.submission,\n [element.name]: model,\n }\n\n return {\n elements,\n submission,\n lastElementUpdated: currentFormSubmission.lastElementUpdated,\n }\n })\n },\n [element.name, onLookup],\n )\n\n const validation = React.useMemo(() => {\n return !!formElementValidation &&\n typeof formElementValidation !== 'string' &&\n formElementValidation.type === 'formElements'\n ? formElementValidation.formElements\n : undefined\n }, [formElementValidation])\n\n const formElementsConditionallyShown = React.useMemo(() => {\n return formElementConditionallyShown &&\n formElementConditionallyShown.type === 'formElements'\n ? formElementConditionallyShown.formElements\n : undefined\n }, [formElementConditionallyShown])\n\n const parentElement = React.useMemo(() => {\n return {\n elements: Array.isArray(element.elements) ? element.elements : [],\n }\n }, [element.elements])\n\n const handleUpdateNestedFormElements =\n React.useCallback<UpdateFormElementsHandler>(\n (setter) => {\n onUpdateFormElements((formElements) => {\n return formElements.map((formElement) => {\n if (\n formElement.id === element.id &&\n formElement.type === 'form' &&\n Array.isArray(formElement.elements)\n ) {\n return {\n ...formElement,\n elements: setter(formElement.elements),\n }\n }\n return formElement\n })\n })\n },\n [element.id, onUpdateFormElements],\n )\n\n return (\n <OneBlinkFormElements\n formId={formId}\n formElementsValidation={validation}\n displayValidationMessages={displayValidationMessages}\n elements={parentElement.elements}\n onChange={handleNestedChange}\n onLookup={handleLookup}\n formElementsConditionallyShown={formElementsConditionallyShown}\n model={value \|\| {}}\n parentElement={parentElement}\n idPrefix={`${id}_`}\n onUpdateFormElements={handleUpdateNestedFormElements}\n />\n )\n}\n\nexport default React.memo(FormElementForm)\n"]}
1	+ {"version":3,"file":"FormElementForm.js","sourceRoot":"","sources":["../../src/form-elements/FormElementForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport {\n ExecutedLookups,\n FormElementConditionallyShown,\n FormElementLookupHandler,\n FormElementValidation,\n NestedFormElementValueChangeHandler,\n UpdateFormElementsHandler,\n} from '../types/form'\n\nexport type Props = {\n formId: number\n id: string\n element: FormTypes.FormFormElement\n value: SubmissionTypes.S3SubmissionData['submission'] \| undefined\n onChange: NestedFormElementValueChangeHandler<\n SubmissionTypes.S3SubmissionData['submission']\n >\n onLookup: FormElementLookupHandler\n formElementValidation: FormElementValidation \| undefined\n displayValidationMessages: boolean\n formElementConditionallyShown: FormElementConditionallyShown \| undefined\n onUpdateFormElements: UpdateFormElementsHandler\n}\n\nfunction FormElementForm({\n formId,\n element,\n value,\n id,\n formElementValidation,\n displayValidationMessages,\n formElementConditionallyShown,\n onChange,\n onLookup,\n onUpdateFormElements,\n}: Props) {\n const handleNestedChange = React.useCallback(\n (\n nestedElement: FormTypes.FormElement,\n {\n value: nestedElementValue,\n executedLookups: nestedExecutedLookups,\n }: Parameters<NestedFormElementValueChangeHandler>[1],\n ) => {\n if (!('name' in nestedElement)) return\n onChange(element, {\n value: (existingValue) => ({\n ...existingValue,\n [nestedElement.name]:\n typeof nestedElementValue === 'function'\n ? nestedElementValue(\n existingValue ? existingValue[nestedElement.name] : undefined,\n )\n : nestedElementValue,\n }),\n executedLookups: (existingExecutedLookups) => {\n if (\n typeof existingExecutedLookups === 'boolean' \|\|\n Array.isArray(existingExecutedLookups)\n ) {\n return {}\n }\n return {\n ...existingExecutedLookups,\n [nestedElement.name]:\n typeof nestedExecutedLookups === 'function'\n ? nestedExecutedLookups(\n existingExecutedLookups?.[\n nestedElement.name\n ] as ExecutedLookups,\n )\n : nestedExecutedLookups,\n }\n },\n })\n },\n [element, onChange],\n )\n\n const handleLookup = React.useCallback<FormElementLookupHandler>(\n (mergeLookupResults) => {\n onLookup((currentFormSubmission) => {\n let model = currentFormSubmission.submission[\n element.name\n ] as SubmissionTypes.S3SubmissionData['submission']\n let newExecutedLookups = currentFormSubmission.executedLookups?.[\n element.name\n ] as ExecutedLookups\n\n const elements = currentFormSubmission.elements.map((formElement) => {\n if (\n formElement.type === 'form' &&\n formElement.name === element.name &&\n Array.isArray(formElement.elements)\n ) {\n const { elements, submission, executedLookups } =\n mergeLookupResults({\n elements: formElement.elements,\n submission: model,\n lastElementUpdated: currentFormSubmission.lastElementUpdated,\n executedLookups: newExecutedLookups,\n })\n model = submission\n newExecutedLookups = executedLookups as ExecutedLookups\n return {\n ...formElement,\n elements,\n }\n }\n return formElement\n })\n\n const submission = {\n ...currentFormSubmission.submission,\n [element.name]: model,\n }\n\n return {\n elements,\n submission,\n lastElementUpdated: currentFormSubmission.lastElementUpdated,\n executedLookups: {\n ...currentFormSubmission.executedLookups,\n [element.name]: newExecutedLookups,\n },\n }\n })\n },\n [element.name, onLookup],\n )\n\n const validation = React.useMemo(() => {\n return !!formElementValidation &&\n typeof formElementValidation !== 'string' &&\n formElementValidation.type === 'formElements'\n ? formElementValidation.formElements\n : undefined\n }, [formElementValidation])\n\n const formElementsConditionallyShown = React.useMemo(() => {\n return formElementConditionallyShown &&\n formElementConditionallyShown.type === 'formElements'\n ? formElementConditionallyShown.formElements\n : undefined\n }, [formElementConditionallyShown])\n\n const parentElement = React.useMemo(() => {\n return {\n elements: Array.isArray(element.elements) ? element.elements : [],\n }\n }, [element.elements])\n\n const handleUpdateNestedFormElements =\n React.useCallback<UpdateFormElementsHandler>(\n (setter) => {\n onUpdateFormElements((formElements) => {\n return formElements.map((formElement) => {\n if (\n formElement.id === element.id &&\n formElement.type === 'form' &&\n Array.isArray(formElement.elements)\n ) {\n return {\n ...formElement,\n elements: setter(formElement.elements),\n }\n }\n return formElement\n })\n })\n },\n [element.id, onUpdateFormElements],\n )\n\n return (\n <OneBlinkFormElements\n formId={formId}\n formElementsValidation={validation}\n displayValidationMessages={displayValidationMessages}\n elements={parentElement.elements}\n onChange={handleNestedChange}\n onLookup={handleLookup}\n formElementsConditionallyShown={formElementsConditionallyShown}\n model={value \|\| {}}\n parentElement={parentElement}\n idPrefix={`${id}_`}\n onUpdateFormElements={handleUpdateNestedFormElements}\n />\n )\n}\n\nexport default React.memo(FormElementForm)\n"]}

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

@@ -25,13 +25,17 @@ function FormElementGeoscapeAddress({ formId, id, element, value, displayValidat
     }, [element.stateTerritoryFilter, formId]);
     const handleChange = React.useCallback(async (addressId) => {
         if (!addressId) {
-            onChange(element, undefined);
+            onChange(element, {
+                value: undefined,
+            });
             return;
         }
         setIsLoadingAddressDetails(true);
         try {
             const result = await formService.getGeoscapeAddress(formId, addressId);
-            onChange(element, result);
+            onChange(element, {
+                value: result,
+            });
         }
         catch (newError) {
             if (isMounted.current) {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementGeoscapeAddress.js","sourceRoot":"","sources":["../../src/form-elements/FormElementGeoscapeAddress.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,OAAO,oBAAoB,MAAM,6CAA6C,CAAA;AAC9E,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAahD,SAAS,0BAA0B,CAAC,EAClC,MAAM,EACN,EAAE,EACF,OAAO,EACP,KAAK,EACL,wBAAwB,EACxB,iBAAiB,EACjB,QAAQ,EACR,OAAO,EACP,UAAU,GACJ;IACN,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAChC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;IAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAqB,CAAA;IAC7D,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GACzD,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvB,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,KAAK,EAAE,KAAa,EAAE,WAAwB,EAAE,EAAE;QAChD,QAAQ,CAAC,SAAS,CAAC,CAAA;QAEnB,MAAM,MAAM,GAIR;YACF,KAAK;YACL,kBAAkB,EAAE,EAAE;SACvB,CAAA;QAED,IAAI,OAAO,CAAC,oBAAoB,EAAE;YAChC,MAAM,CAAC,cAAc,GAAG,OAAO,CAAC,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;SAC/D;QAED,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,uBAAuB,CACtD,MAAM,EACN,MAAM,EACN,WAAW,CACZ,CAAA;QAED,OAAO,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;YAChD,KAAK,EAAE,UAAU,CAAC,EAAE,IAAI,KAAK,CAAC,QAAQ,EAAE;YACxC,KAAK,EAAE,UAAU,CAAC,OAAO,IAAI,KAAK,CAAC,QAAQ,EAAE;SAC9C,CAAC,CAAC,CAAA;IACL,CAAC,EACD,CAAC,OAAO,CAAC,oBAAoB,EAAE,MAAM,CAAC,CACvC,CAAA;IAED,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,KAAK,EAAE,SAA6B,EAAE,EAAE;QACtC,IAAI,CAAC,SAAS,EAAE;YACd,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;~~YAC5B~~,OAAM;SACP;QAED,0BAA0B,CAAC,IAAI,CAAC,CAAA;QAChC,IAAI;YACF,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,kBAAkB,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;YACtE,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,CAAA;~~SAC1B~~;QAAC,OAAO,QAAQ,EAAE;YACjB,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,QAAQ,CAAC,QAAiB,CAAC,CAAA;aAC5B;SACF;QACD,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,0BAA0B,CAAC,KAAK,CAAC,CAAA;SAClC;IACH,CAAC,EACD,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC,CACvC,CAAA;IAED,wEAAwE;IACxE,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,IAAI,KAAK,EAAE;YACT,MAAM,QAAQ,GAAG,CAAA,MAAA,KAAK,CAAC,cAAc,0CAAE,gBAAgB,KAAI,KAAK,CAAC,SAAS,CAAA;YAC1E,IAAI,KAAK,KAAK,QAAQ,EAAE;gBACtB,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAA;aACzB;SACF;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,6BAAK,SAAS,EAAC,kCAAkC;QAC/C,oBAAC,yBAAyB,IACxB,SAAS,EAAC,qCAAqC,EAC/C,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,oBAAC,oBAAoB,IACnB,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,uBAAuB,EACrD,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,wBAAwB,EAAE,wBAAwB,EAClD,aAAa,EAAE,YAAY,EAC3B,SAAS,EAAE,uBAAuB,EAClC,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,aAAa,EAAE,QAAQ,EACvB,gBAAgB,EAAE,GAAG,EACrB,mBAAmB,EAAE,CAAC,EACtB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,GACtB,CACwB;QAE3B,KAAK,IAAI,CACR,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;YAC5C,6BAAK,SAAS,EAAC,+EAA+E,IAC3F,KAAK,CAAC,QAAQ,EAAE,CACb,CACF,CACP,CACG,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { formService } from '@oneblink/apps'\n\nimport AutocompleteDropdown from '../components/renderer/AutocompleteDropdown'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormTypes, GeoscapeTypes } from '@oneblink/types'\nimport useIsMounted from '../hooks/useIsMounted'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n formId: number\n id: string\n element: FormTypes.GeoscapeAddressElement\n value: GeoscapeTypes.GeoscapeAddress \| undefined\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n onChange: FormElementValueChangeHandler<GeoscapeTypes.GeoscapeAddress>\n} & IsDirtyProps\n\nfunction FormElementGeoscapeAddress({\n formId,\n id,\n element,\n value,\n displayValidationMessage,\n validationMessage,\n onChange,\n isDirty,\n setIsDirty,\n}: Props) {\n const isMounted = useIsMounted()\n const [label, setLabel] = React.useState('')\n const [error, setError] = React.useState<Error \| undefined>()\n const [isLoadingAddressDetails, setIsLoadingAddressDetails] =\n React.useState(false)\n\n const handleSearch = React.useCallback(\n async (query: string, abortSignal: AbortSignal) => {\n setError(undefined)\n\n const params: {\n query: string\n maxNumberOfResults?: number\n stateTerritory?: string\n } = {\n query,\n maxNumberOfResults: 10,\n }\n\n if (element.stateTerritoryFilter) {\n params.stateTerritory = element.stateTerritoryFilter.join(',')\n }\n\n const result = await formService.searchGeoscapeAddresses(\n formId,\n params,\n abortSignal,\n )\n\n return result.suggest.map((suggestion, index) => ({\n value: suggestion.id \|\| index.toString(),\n label: suggestion.address \|\| index.toString(),\n }))\n },\n [element.stateTerritoryFilter, formId],\n )\n\n const handleChange = React.useCallback(\n async (addressId: string \| undefined) => {\n if (!addressId) {\n onChange(element, undefined)\n return\n }\n\n setIsLoadingAddressDetails(true)\n try {\n const result = await formService.getGeoscapeAddress(formId, addressId)\n onChange(element, result)\n } catch (newError) {\n if (isMounted.current) {\n setError(newError as Error)\n }\n }\n if (isMounted.current) {\n setIsLoadingAddressDetails(false)\n }\n },\n [isMounted, onChange, element, formId],\n )\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = value.addressDetails?.formattedAddress \|\| value.addressId\n if (label !== newLabel) {\n setLabel(newLabel \|\| '')\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-geoscape-address-element\">\n <FormElementLabelContainer\n className=\"ob-geoscape-address 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 \|\| isLoadingAddressDetails}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={handleChange}\n isLoading={isLoadingAddressDetails}\n hasError={!!error}\n onChangeLabel={setLabel}\n searchDebounceMs={750}\n searchMinCharacters={4}\n onSearch={handleSearch}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementLabelContainer>\n\n {error && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-geoscape-address-details-error-message\">\n {error.toString()}\n </div>\n </div>\n )}\n </div>\n )\n}\n\nexport default React.memo(FormElementGeoscapeAddress)\n"]}
1	+ {"version":3,"file":"FormElementGeoscapeAddress.js","sourceRoot":"","sources":["../../src/form-elements/FormElementGeoscapeAddress.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { formService } from '@oneblink/apps'\n\nimport AutocompleteDropdown from '../components/renderer/AutocompleteDropdown'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormTypes, GeoscapeTypes } from '@oneblink/types'\nimport useIsMounted from '../hooks/useIsMounted'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n formId: number\n id: string\n element: FormTypes.GeoscapeAddressElement\n value: GeoscapeTypes.GeoscapeAddress \| undefined\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n onChange: FormElementValueChangeHandler<GeoscapeTypes.GeoscapeAddress>\n} & IsDirtyProps\n\nfunction FormElementGeoscapeAddress({\n formId,\n id,\n element,\n value,\n displayValidationMessage,\n validationMessage,\n onChange,\n isDirty,\n setIsDirty,\n}: Props) {\n const isMounted = useIsMounted()\n const [label, setLabel] = React.useState('')\n const [error, setError] = React.useState<Error \| undefined>()\n const [isLoadingAddressDetails, setIsLoadingAddressDetails] =\n React.useState(false)\n\n const handleSearch = React.useCallback(\n async (query: string, abortSignal: AbortSignal) => {\n setError(undefined)\n\n const params: {\n query: string\n maxNumberOfResults?: number\n stateTerritory?: string\n } = {\n query,\n maxNumberOfResults: 10,\n }\n\n if (element.stateTerritoryFilter) {\n params.stateTerritory = element.stateTerritoryFilter.join(',')\n }\n\n const result = await formService.searchGeoscapeAddresses(\n formId,\n params,\n abortSignal,\n )\n\n return result.suggest.map((suggestion, index) => ({\n value: suggestion.id \|\| index.toString(),\n label: suggestion.address \|\| index.toString(),\n }))\n },\n [element.stateTerritoryFilter, formId],\n )\n\n const handleChange = React.useCallback(\n async (addressId: string \| undefined) => {\n if (!addressId) {\n onChange(element, {\n value: undefined,\n })\n return\n }\n\n setIsLoadingAddressDetails(true)\n try {\n const result = await formService.getGeoscapeAddress(formId, addressId)\n onChange(element, {\n value: result,\n })\n } catch (newError) {\n if (isMounted.current) {\n setError(newError as Error)\n }\n }\n if (isMounted.current) {\n setIsLoadingAddressDetails(false)\n }\n },\n [isMounted, onChange, element, formId],\n )\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = value.addressDetails?.formattedAddress \|\| value.addressId\n if (label !== newLabel) {\n setLabel(newLabel \|\| '')\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-geoscape-address-element\">\n <FormElementLabelContainer\n className=\"ob-geoscape-address 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 \|\| isLoadingAddressDetails}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={handleChange}\n isLoading={isLoadingAddressDetails}\n hasError={!!error}\n onChangeLabel={setLabel}\n searchDebounceMs={750}\n searchMinCharacters={4}\n onSearch={handleSearch}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementLabelContainer>\n\n {error && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-geoscape-address-details-error-message\">\n {error.toString()}\n </div>\n </div>\n )}\n </div>\n )\n}\n\nexport default React.memo(FormElementGeoscapeAddress)\n"]}

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

@@ -36,7 +36,9 @@ function FormElementLocation({ id, element, value, onChange, validationMessage,
     const [location, setLocation] = React.useState(undefined);
     const onClear = React.useCallback(() => {
         hideLocationPicker();
-        onChange(element, undefined);
+        onChange(element, {
+            value: undefined,
+        });
         setLocation(undefined);
     }, [element, hideLocationPicker, onChange]);
     const onCancel = React.useCallback(() => {
@@ -65,7 +67,9 @@ function FormElementLocation({ id, element, value, onChange, validationMessage,
     const onConfirm = React.useCallback(() => {
         setIsDirty();
         hideLocationPicker();
-        onChange(element, location);
+        onChange(element, {
+            value: location,
+        });
     }, [element, hideLocationPicker, location, onChange, setIsDirty]);
     // SET DEFAULT/PREFILL DATA
     React.useEffect(() => {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementLocation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementLocation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,eAAe,MAAM,0BAA0B,CAAA;AACtD,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAC1E,OAAO,WAAW,MAAM,0BAA0B,CAAA;AAClD,OAAO,WAAW,MAAM,cAAc,CAAA;AACtC,OAAO,SAAS,MAAM,kCAAkC,CAAA;AACxD,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAC1D,OAAO,sBAAsB,MAAM,8BAA8B,CAAA;AAEjE,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AACxF,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAkBvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,QAA4B,EAAE,EAAE;IAChE,IAAI,QAAQ,EAAE;QACZ,OAAO,GAAG,QAAQ,CAAC,QAAQ,IAAI,QAAQ,CAAC,SAAS,EAAE,CAAA;KACpD;AACH,CAAC,CAAA;AAED,SAAS,kBAAkB,CAAC,KAAc;IACxC,IAAI,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QACvC,OAAM;KACP;IAED,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAgC,CAAA;IACtE,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;QACjE,OAAM;KACP;IAED,OAAO;QACL,QAAQ;QACR,SAAS;QACT,IAAI,EAAE,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc;KACvD,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,GAAG,CAAA;AACrB,MAAM,cAAc,GAAG,EAAE,CAAA;AACzB,MAAM,MAAM,GAAG,gDAAgD,CAAA;AAC/D,SAAS,mBAAmB,CAAC,EAC3B,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,CAAC,oBAAoB,EAAE,kBAAkB,EAAE,kBAAkB,CAAC,GAClE,eAAe,CAAC,KAAK,CAAC,CAAA;IAExB,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,SAAS,CAAC,CAAA;IAC7E,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACrC,kBAAkB,EAAE,CAAA;QACpB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;QAC5B,WAAW,CAAC,SAAS,CAAC,CAAA;IACxB,CAAC,EAAE,CAAC,OAAO,EAAE,kBAAkB,EAAE,QAAQ,CAAC,CAAC,CAAA;IAE3C,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACtC,kBAAkB,EAAE,CAAA;QACpB,WAAW,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAA;IACxC,CAAC,EAAE,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAA;IAE/B,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAC5C,kBAAkB,EAAE,CAAA;QAEpB,IAAI,QAAQ,EAAE;YACZ,OAAM;SACP;QAED,IAAI,eAAe,GAAG,IAAI,CAAA;QAC1B,IAAI;YACF,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,kBAAkB,EAAE,CAAA;YACrD,eAAe,GAAG,MAAM,CAAC,MAAM,CAAA;SAChC;QAAC,OAAO,GAAG,EAAE;YACZ,OAAO,CAAC,KAAK,CACX,2DAA2D,EAC3D,GAAG,CACJ,CAAA;YACD,MAAM,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAA;SAC7B;gBAAS;YACR,WAAW,CAAC,kBAAkB,CAAC,eAAe,IAAI,aAAa,EAAE,CAAC,CAAC,CAAA;SACpE;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAA;IAElC,MAAM,iBAAiB,GAAG,CAAC,QAAQ,IAAI,oBAAoB,CAAA;IAE3D,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACvC,UAAU,EAAE,CAAA;QACZ,kBAAkB,EAAE,CAAA;QACpB,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAA;IAC7B,CAAC,EAAE,CAAC,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAA;IAEjE,2BAA2B;IAC3B,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,QAAQ,GAAG,kBAAkB,CAAC,KAAK,CAAC,CAAA;QAC1C,IAAI,QAAQ,EAAE;YACZ,WAAW,CAAC,QAAQ,CAAC,CAAA;SACtB;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,6BAAK,SAAS,EAAC,0BAA0B;QACvC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,aAAa,EACvB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,6BAAK,SAAS,EAAC,SAAS;gBACtB,oBAAC,eAAe,IACd,MAAM,EAAE,oBAAoB,EAC5B,SAAS,EAAE,iBAAiB,EAC5B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,WAAW,GACrB;gBAEF,6BAAK,SAAS,EAAC,yCAAyC,IACrD,oBAAoB,CAAC,CAAC,CAAC,CACtB;oBACE,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,2HAA2H,EACrI,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,OAAO,CAAC,QAAQ,aAGnB;oBACT,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,gIAAgI,EAC1I,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,CAAC,QAAQ,cAGhC,CACR,CACJ,CAAC,CAAC,CAAC,CACF;oBACE,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,wIAAwI,EAClJ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ,YAGnB;oBACT,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,gHAAgH,EAC1H,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,OAAO,CAAC,QAAQ,aAGnB,CACR,CACJ,CACG,CACF;YAEL,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,CACxB,CACP,CAAA;AACH,CAAC;AAED,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,eAAe,CAAC,EAC1D,SAAS,EACT,MAAM,EACN,QAAQ,EACR,QAAQ,GAMT;IACC,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAEhC,IAAI,SAAS,EAAE;QACb,OAAO,CACL,gCAAQ,SAAS,EAAC,WAAW;YAC3B,6BAAK,SAAS,EAAC,gBAAgB;gBAC7B,oBAAC,SAAS,IAAC,KAAK,SAAa,CACzB,CACC,CACV,CAAA;KACF;IAED,IAAI,SAAS,EAAE;QACb,OAAO,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,GAAI,CAAA;KACjE;IAED,IAAI,MAAM,EAAE;QACV,IAAI,CAAC,QAAQ,EAAE;YACb,+EAA+E;YAC/E,6EAA6E;YAC7E,eAAe;YACf,0CAA0C;YAC1C,MAAM,IAAI,KAAK,CACb,0DAA0D,CAC3D,CAAA;SACF;QAED,OAAO,oBAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAA;KAClE;IAED,IAAI,QAAQ,EAAE;QACZ,OAAO,oBAAC,aAAa,IAAC,QAAQ,EAAE,QAAQ,GAAI,CAAA;KAC7C;IAED,OAAO,IAAI,CAAA;AACb,CAAC,CAAC,CAAA;AAEF,SAAS,8BAA8B,CAAC,EACtC,QAAQ,GAGT;IACC,OAAO,CACL,gCAAQ,SAAS,EAAC,WAAW;QAC3B,6BAAK,SAAS,EAAC,kCAAkC;YAC/C,4BAAI,SAAS,EAAC,YAAY,gCAA+B;YACxD,QAAQ,CACL,CACC,CACV,CAAA;AACH,CAAC;AAED,MAAM,iBAAiB,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,iBAAiB,CAAC,EAC9D,QAAQ,EACR,MAAM,GAIP;IACC,IAAI,MAAM,EAAE;QACV,IAAI,QAAQ,EAAE;YACZ,oFAAoF;YACpF,OAAO,CACL,oBAAC,8BAA8B;gBAC7B;;oBACY,yCAAc;kFAEtB,CAC2B,CAClC,CAAA;SACF;QAED,wFAAwF;QACxF,OAAO,CACL,oBAAC,8BAA8B;YAC7B;;gBACqD,wCAAa;gBAAC,GAAG;6CAElE,CAC2B,CAClC,CAAA;KACF;IAED,kDAAkD;IAClD,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL,oBAAC,8BAA8B;YAC7B,4BAAI,SAAS,EAAC,kCAAkC,eAAc;YAC9D;gBACE,+BAAI,QAAQ,CAAC,QAAQ,CAAK,CACxB;YACJ,4BAAI,SAAS,EAAC,mCAAmC,gBAAe;YAChE;gBACE,+BAAI,QAAQ,CAAC,SAAS,CAAK,CACzB,CAC2B,CAClC,CAAA;KACF;IAED,6EAA6E;IAC7E,OAAO,IAAI,CAAA;AACb,CAAC,CAAC,CAAA;AAEF,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,EACtD,QAAQ,GAGT;IACC,MAAM,gBAAgB,GAAG,sBAAsB,EAAE,CAAA;IAEjD,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACnC,MAAM,MAAM,GAAG,GAAG,QAAQ,CAAC,QAAQ,IAAI,QAAQ,CAAC,SAAS,EAAE,CAAA;QAC3D,MAAM,OAAO,GAAG;YACd,GAAG,EAAE,gBAAgB;YACrB,IAAI,EAAE,GAAG,SAAS,IAAI,SAAS,EAAE;YACjC,IAAI,EAAE,QAAQ,CAAC,IAAI;YACnB,MAAM;YACN,OAAO,EAAE,aAAa,MAAM,EAAE;SAC/B,CAAA;QACD,OAAO,GAAG,MAAM,IAAI,WAAW,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,CAAA;IACtD,CAAC,EAAE,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEhC,OAAO,CACL,gCAAQ,SAAS,EAAC,WAAW;QAC3B,6BACE,SAAS,EAAC,kBAAkB,EAC5B,GAAG,EAAE,sBAAsB,QAAQ,CAAC,QAAQ,cAAc,QAAQ,CAAC,SAAS,YAAY,EACxF,GAAG,EAAE,SAAS,EACd,MAAM,EAAE,SAAS,EACjB,KAAK,EAAE,SAAS,GAChB,CACK,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,EACvD,QAAQ,EACR,QAAQ,GAIT;IACC,MAAM,gBAAgB,GAAG,sBAAsB,EAAE,CAAA;IAEjD,MAAM,EAAE,QAAQ,EAAE,GAAG,cAAc,CAAC;QAClC,gBAAgB,EAAE,gBAAgB,aAAhB,gBAAgB,cAAhB,gBAAgB,GAAI,EAAE;KACzC,CAAC,CAAA;IACF,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAyB,IAAI,CAAC,CAAA;IAElE,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAChC,OAAO;YACL,GAAG,EAAE,QAAQ,CAAC,QAAQ;YACtB,GAAG,EAAE,QAAQ,CAAC,SAAS;SACxB,CAAA;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAA;IAE3C,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC3C,IAAI,CAAC,GAAG,EAAE;YACR,OAAM;SACP;QAED,QAAQ,CAAC;YACP,QAAQ,EAAE,QAAQ,CAAC,QAAQ;YAC3B,SAAS,EAAE,QAAQ,CAAC,SAAS;YAC7B,IAAI,EAAE,GAAG,CAAC,OAAO,EAAE;SACpB,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,SAAS,EAAE,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAA;IAE1D,OAAO,CACL,gCAAQ,SAAS,EAAC,WAAW,IAC1B,QAAQ,IAAI,CACX,oBAAC,SAAS,IACR,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,EAC5B,SAAS,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAC7B,iBAAiB,EAAE;YACjB,MAAM,EAAE,GAAG;SACZ,EACD,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,QAAQ,CAAC,IAAI,EACnB,aAAa,EAAE,aAAa;QAE5B,oBAAC,MAAM,IACL,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EACrC,QAAQ,EAAE,MAAM,EAChB,SAAS,QACT,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;gBACf,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE;oBACb,OAAM;iBACP;gBACD,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,CAAA;gBACtC,QAAQ,CAAC;oBACP,QAAQ,EAAE,GAAG;oBACb,SAAS,EAAE,GAAG;oBACd,IAAI,EAAE,QAAQ,CAAC,IAAI;iBACpB,CAAC,CAAA;YACJ,CAAC,GACO,CACA,CACb,CACM,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport useBooleanState from '../hooks/useBooleanState'\nimport useIsOffline from '../hooks/useIsOffline'\nimport { GoogleMap, Marker, useJsApiLoader } from '@react-google-maps/api'\nimport geolocation from '@blinkmobile/geolocation'\nimport queryString from 'query-string'\nimport OnLoading from '../components/renderer/OnLoading'\nimport defaultCoords from '../services/defaultCoordinates'\nimport useGoogleMapsApiKeyKey from '../hooks/useGoogleMapsApiKey'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Sentry } from '@oneblink/apps'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.LocationElement\n value: unknown \| undefined\n onChange: FormElementValueChangeHandler<Coords>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\ntype Coords = {\n latitude: number\n longitude: number\n zoom?: number\n}\n\nexport const stringifyLocation = (location: Coords \| undefined) => {\n if (location) {\n return `${location.latitude},${location.longitude}`\n }\n}\n\nfunction parseLocationValue(value: unknown): Coords \| undefined {\n if (!value \|\| typeof value !== 'object') {\n return\n }\n\n const { latitude, longitude, zoom } = value as Record<string, unknown>\n if (typeof latitude !== 'number' \|\| typeof longitude !== 'number') {\n return\n }\n\n return {\n latitude,\n longitude,\n zoom: typeof zoom === 'number' ? zoom : initialMapZoom,\n }\n}\n\nconst mapHeight = 300\nconst initialMapZoom = 15\nconst apiUrl = 'https://maps.googleapis.com/maps/api/staticmap'\nfunction FormElementLocation({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [isLocationPickerOpen, showLocationPicker, hideLocationPicker] =\n useBooleanState(false)\n\n const [location, setLocation] = React.useState<Coords \| undefined>(undefined)\n const onClear = React.useCallback(() => {\n hideLocationPicker()\n onChange(element, undefined)\n setLocation(undefined)\n }, [element, hideLocationPicker, onChange])\n\n const onCancel = React.useCallback(() => {\n hideLocationPicker()\n setLocation(parseLocationValue(value))\n }, [hideLocationPicker, value])\n\n const onLocate = React.useCallback(async () => {\n showLocationPicker()\n\n if (location) {\n return\n }\n\n let currentLocation = null\n try {\n const result = await geolocation.getCurrentPosition()\n currentLocation = result.coords\n } catch (err) {\n console.error(\n 'Error while attempting to find the users current location',\n err,\n )\n Sentry.captureException(err)\n } finally {\n setLocation(parseLocationValue(currentLocation \|\| defaultCoords()))\n }\n }, [location, showLocationPicker])\n\n const isLoadingLocation = !location && isLocationPickerOpen\n\n const onConfirm = React.useCallback(() => {\n setIsDirty()\n hideLocationPicker()\n onChange(element, location)\n }, [element, hideLocationPicker, location, onChange, setIsDirty])\n\n // SET DEFAULT/PREFILL DATA\n React.useEffect(() => {\n const newValue = parseLocationValue(value)\n if (newValue) {\n setLocation(newValue)\n }\n }, [value])\n\n return (\n <div className=\"cypress-location-element\">\n <FormElementLabelContainer\n className=\"ob-location\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"control\">\n <LocationDisplay\n isOpen={isLocationPickerOpen}\n isLoading={isLoadingLocation}\n location={location}\n onChange={setLocation}\n />\n\n <div className=\"buttons ob-buttons ob-location__buttons\">\n {isLocationPickerOpen ? (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__cancel ob-location__button ob-location__button-cancel cypress-cancel-location-button\"\n onClick={onCancel}\n disabled={element.readOnly}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className=\"is-primary button ob-button ob-button__confirm ob-location__button ob-location__button-confirm cypress-confirm-location-button\"\n onClick={onConfirm}\n disabled={element.readOnly \|\| !location}\n >\n Confirm\n </button>\n </>\n ) : (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__clear ob-button-clear ob-location__button ob-location__button-clear cypress-clear-location-button\"\n onClick={onClear}\n disabled={element.readOnly}\n >\n Clear\n </button>\n <button\n type=\"button\"\n className=\"is-primary button ob-button ob-button__edit ob-location__button ob-location__button-edit cypress-locate-button\"\n onClick={onLocate}\n disabled={element.readOnly}\n >\n Locate\n </button>\n </>\n )}\n </div>\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\nconst LocationDisplay = React.memo(function LocationDisplay({\n isLoading,\n isOpen,\n location,\n onChange,\n}: {\n isLoading: boolean\n isOpen: boolean\n location: Coords \| undefined\n onChange: (location: Coords) => void\n}) {\n const isOffline = useIsOffline()\n\n if (isLoading) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content\">\n <OnLoading small></OnLoading>\n </div>\n </figure>\n )\n }\n\n if (isOffline) {\n return <LocationIsOffline location={location} isOpen={isOpen} />\n }\n\n if (isOpen) {\n if (!location) {\n // There is no location to display while user is attempting to pick a location.\n // This should never happen, if loading has finished a default should be set.\n // Fail fast!!!\n // https://en.wikipedia.org/wiki/Fail-fast\n throw new Error(\n 'Default location was not set for \"location\" form element',\n )\n }\n\n return <LocationPicker location={location} onChange={onChange} />\n }\n\n if (location) {\n return <LocationImage location={location} />\n }\n\n return null\n})\n\nfunction LocationIsOfflineFigureContent({\n children,\n}: {\n children: React.ReactNode\n}) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <h4 className=\"title is-4\">You are currently offline</h4>\n {children}\n </div>\n </figure>\n )\n}\n\nconst LocationIsOffline = React.memo(function LocationIsOffline({\n location,\n isOpen,\n}: {\n location: Coords \| undefined\n isOpen: boolean\n}) {\n if (isOpen) {\n if (location) {\n // If user is offline and attempting to pick a location and there is one set already\n return (\n <LocationIsOfflineFigureContent>\n <p>\n Click the <b>Confirm</b> button below to set the location to your\n current position.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and attempting to pick a location and there is one nothing set yet\n return (\n <LocationIsOfflineFigureContent>\n <p>\n We could not find your current location. Click the <b>Cancel</b>{' '}\n button below to try again.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and has confirmed a location\n if (location) {\n return (\n <LocationIsOfflineFigureContent>\n <h3 className=\"title is-3 ob-location__latitude\">Latitude</h3>\n <p>\n <b>{location.latitude}</b>\n </p>\n <h3 className=\"title is-3 ob-location__longitude\">Longitude</h3>\n <p>\n <b>{location.longitude}</b>\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // User is offline with no location set and not attempting to pick a location\n return null\n})\n\nconst LocationImage = React.memo(function LocationImage({\n location,\n}: {\n location: Coords\n}) {\n const googleMapsApiKey = useGoogleMapsApiKeyKey()\n\n const staticUrl = React.useMemo(() => {\n const center = `${location.latitude},${location.longitude}`\n const queries = {\n key: googleMapsApiKey,\n size: `${mapHeight}x${mapHeight}`,\n zoom: location.zoom,\n center,\n markers: `color:red\|${center}`,\n }\n return `${apiUrl}?${queryString.stringify(queries)}`\n }, [googleMapsApiKey, location])\n\n return (\n <figure className=\"ob-figure\">\n <img\n className=\"ob-location__map\"\n alt={`map with center at ${location.latitude} latitude, ${location.longitude} longitude`}\n src={staticUrl}\n height={mapHeight}\n width={mapHeight}\n />\n </figure>\n )\n})\n\nconst LocationPicker = React.memo(function SummaryResult({\n location,\n onChange,\n}: {\n location: Coords\n onChange: (newLocation: Coords) => void\n}) {\n const googleMapsApiKey = useGoogleMapsApiKeyKey()\n\n const { isLoaded } = useJsApiLoader({\n googleMapsApiKey: googleMapsApiKey ?? '',\n })\n const [map, setMap] = React.useState<google.maps.Map \| null>(null)\n\n const center = React.useMemo(() => {\n return {\n lat: location.latitude,\n lng: location.longitude,\n }\n }, [location.latitude, location.longitude])\n\n const onZoomChanged = React.useCallback(() => {\n if (!map) {\n return\n }\n\n onChange({\n latitude: location.latitude,\n longitude: location.longitude,\n zoom: map.getZoom(),\n })\n }, [location.latitude, location.longitude, map, onChange])\n\n return (\n <figure className=\"ob-figure\">\n {isLoaded && (\n <GoogleMap\n onLoad={(map) => setMap(map)}\n onUnmount={() => setMap(null)}\n mapContainerStyle={{\n height: 300,\n }}\n center={center}\n zoom={location.zoom}\n onZoomChanged={onZoomChanged}\n >\n <Marker\n animation={google.maps.Animation.DROP}\n position={center}\n draggable\n onDragEnd={(e) => {\n if (!e.latLng) {\n return\n }\n const { lat, lng } = e.latLng.toJSON()\n onChange({\n latitude: lat,\n longitude: lng,\n zoom: location.zoom,\n })\n }}\n ></Marker>\n </GoogleMap>\n )}\n </figure>\n )\n})\n\nexport default React.memo(FormElementLocation)\n"]}
1	+ {"version":3,"file":"FormElementLocation.js","sourceRoot":"","sources":["../../src/form-elements/FormElementLocation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport useBooleanState from '../hooks/useBooleanState'\nimport useIsOffline from '../hooks/useIsOffline'\nimport { GoogleMap, Marker, useJsApiLoader } from '@react-google-maps/api'\nimport geolocation from '@blinkmobile/geolocation'\nimport queryString from 'query-string'\nimport OnLoading from '../components/renderer/OnLoading'\nimport defaultCoords from '../services/defaultCoordinates'\nimport useGoogleMapsApiKeyKey from '../hooks/useGoogleMapsApiKey'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { Sentry } from '@oneblink/apps'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.LocationElement\n value: unknown \| undefined\n onChange: FormElementValueChangeHandler<Coords>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\ntype Coords = {\n latitude: number\n longitude: number\n zoom?: number\n}\n\nexport const stringifyLocation = (location: Coords \| undefined) => {\n if (location) {\n return `${location.latitude},${location.longitude}`\n }\n}\n\nfunction parseLocationValue(value: unknown): Coords \| undefined {\n if (!value \|\| typeof value !== 'object') {\n return\n }\n\n const { latitude, longitude, zoom } = value as Record<string, unknown>\n if (typeof latitude !== 'number' \|\| typeof longitude !== 'number') {\n return\n }\n\n return {\n latitude,\n longitude,\n zoom: typeof zoom === 'number' ? zoom : initialMapZoom,\n }\n}\n\nconst mapHeight = 300\nconst initialMapZoom = 15\nconst apiUrl = 'https://maps.googleapis.com/maps/api/staticmap'\nfunction FormElementLocation({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const [isLocationPickerOpen, showLocationPicker, hideLocationPicker] =\n useBooleanState(false)\n\n const [location, setLocation] = React.useState<Coords \| undefined>(undefined)\n const onClear = React.useCallback(() => {\n hideLocationPicker()\n onChange(element, {\n value: undefined,\n })\n setLocation(undefined)\n }, [element, hideLocationPicker, onChange])\n\n const onCancel = React.useCallback(() => {\n hideLocationPicker()\n setLocation(parseLocationValue(value))\n }, [hideLocationPicker, value])\n\n const onLocate = React.useCallback(async () => {\n showLocationPicker()\n\n if (location) {\n return\n }\n\n let currentLocation = null\n try {\n const result = await geolocation.getCurrentPosition()\n currentLocation = result.coords\n } catch (err) {\n console.error(\n 'Error while attempting to find the users current location',\n err,\n )\n Sentry.captureException(err)\n } finally {\n setLocation(parseLocationValue(currentLocation \|\| defaultCoords()))\n }\n }, [location, showLocationPicker])\n\n const isLoadingLocation = !location && isLocationPickerOpen\n\n const onConfirm = React.useCallback(() => {\n setIsDirty()\n hideLocationPicker()\n onChange(element, {\n value: location,\n })\n }, [element, hideLocationPicker, location, onChange, setIsDirty])\n\n // SET DEFAULT/PREFILL DATA\n React.useEffect(() => {\n const newValue = parseLocationValue(value)\n if (newValue) {\n setLocation(newValue)\n }\n }, [value])\n\n return (\n <div className=\"cypress-location-element\">\n <FormElementLabelContainer\n className=\"ob-location\"\n id={id}\n element={element}\n required={element.required}\n >\n <div className=\"control\">\n <LocationDisplay\n isOpen={isLocationPickerOpen}\n isLoading={isLoadingLocation}\n location={location}\n onChange={setLocation}\n />\n\n <div className=\"buttons ob-buttons ob-location__buttons\">\n {isLocationPickerOpen ? (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__cancel ob-location__button ob-location__button-cancel cypress-cancel-location-button\"\n onClick={onCancel}\n disabled={element.readOnly}\n >\n Cancel\n </button>\n <button\n type=\"button\"\n className=\"is-primary button ob-button ob-button__confirm ob-location__button ob-location__button-confirm cypress-confirm-location-button\"\n onClick={onConfirm}\n disabled={element.readOnly \|\| !location}\n >\n Confirm\n </button>\n </>\n ) : (\n <>\n <button\n type=\"button\"\n className=\"is-light button ob-button ob-button__clear ob-button-clear ob-location__button ob-location__button-clear cypress-clear-location-button\"\n onClick={onClear}\n disabled={element.readOnly}\n >\n Clear\n </button>\n <button\n type=\"button\"\n className=\"is-primary button ob-button ob-button__edit ob-location__button ob-location__button-edit cypress-locate-button\"\n onClick={onLocate}\n disabled={element.readOnly}\n >\n Locate\n </button>\n </>\n )}\n </div>\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\nconst LocationDisplay = React.memo(function LocationDisplay({\n isLoading,\n isOpen,\n location,\n onChange,\n}: {\n isLoading: boolean\n isOpen: boolean\n location: Coords \| undefined\n onChange: (location: Coords) => void\n}) {\n const isOffline = useIsOffline()\n\n if (isLoading) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content\">\n <OnLoading small></OnLoading>\n </div>\n </figure>\n )\n }\n\n if (isOffline) {\n return <LocationIsOffline location={location} isOpen={isOpen} />\n }\n\n if (isOpen) {\n if (!location) {\n // There is no location to display while user is attempting to pick a location.\n // This should never happen, if loading has finished a default should be set.\n // Fail fast!!!\n // https://en.wikipedia.org/wiki/Fail-fast\n throw new Error(\n 'Default location was not set for \"location\" form element',\n )\n }\n\n return <LocationPicker location={location} onChange={onChange} />\n }\n\n if (location) {\n return <LocationImage location={location} />\n }\n\n return null\n})\n\nfunction LocationIsOfflineFigureContent({\n children,\n}: {\n children: React.ReactNode\n}) {\n return (\n <figure className=\"ob-figure\">\n <div className=\"figure-content has-text-centered\">\n <h4 className=\"title is-4\">You are currently offline</h4>\n {children}\n </div>\n </figure>\n )\n}\n\nconst LocationIsOffline = React.memo(function LocationIsOffline({\n location,\n isOpen,\n}: {\n location: Coords \| undefined\n isOpen: boolean\n}) {\n if (isOpen) {\n if (location) {\n // If user is offline and attempting to pick a location and there is one set already\n return (\n <LocationIsOfflineFigureContent>\n <p>\n Click the <b>Confirm</b> button below to set the location to your\n current position.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and attempting to pick a location and there is one nothing set yet\n return (\n <LocationIsOfflineFigureContent>\n <p>\n We could not find your current location. Click the <b>Cancel</b>{' '}\n button below to try again.\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // If user is offline and has confirmed a location\n if (location) {\n return (\n <LocationIsOfflineFigureContent>\n <h3 className=\"title is-3 ob-location__latitude\">Latitude</h3>\n <p>\n <b>{location.latitude}</b>\n </p>\n <h3 className=\"title is-3 ob-location__longitude\">Longitude</h3>\n <p>\n <b>{location.longitude}</b>\n </p>\n </LocationIsOfflineFigureContent>\n )\n }\n\n // User is offline with no location set and not attempting to pick a location\n return null\n})\n\nconst LocationImage = React.memo(function LocationImage({\n location,\n}: {\n location: Coords\n}) {\n const googleMapsApiKey = useGoogleMapsApiKeyKey()\n\n const staticUrl = React.useMemo(() => {\n const center = `${location.latitude},${location.longitude}`\n const queries = {\n key: googleMapsApiKey,\n size: `${mapHeight}x${mapHeight}`,\n zoom: location.zoom,\n center,\n markers: `color:red\|${center}`,\n }\n return `${apiUrl}?${queryString.stringify(queries)}`\n }, [googleMapsApiKey, location])\n\n return (\n <figure className=\"ob-figure\">\n <img\n className=\"ob-location__map\"\n alt={`map with center at ${location.latitude} latitude, ${location.longitude} longitude`}\n src={staticUrl}\n height={mapHeight}\n width={mapHeight}\n />\n </figure>\n )\n})\n\nconst LocationPicker = React.memo(function SummaryResult({\n location,\n onChange,\n}: {\n location: Coords\n onChange: (newLocation: Coords) => void\n}) {\n const googleMapsApiKey = useGoogleMapsApiKeyKey()\n\n const { isLoaded } = useJsApiLoader({\n googleMapsApiKey: googleMapsApiKey ?? '',\n })\n const [map, setMap] = React.useState<google.maps.Map \| null>(null)\n\n const center = React.useMemo(() => {\n return {\n lat: location.latitude,\n lng: location.longitude,\n }\n }, [location.latitude, location.longitude])\n\n const onZoomChanged = React.useCallback(() => {\n if (!map) {\n return\n }\n\n onChange({\n latitude: location.latitude,\n longitude: location.longitude,\n zoom: map.getZoom(),\n })\n }, [location.latitude, location.longitude, map, onChange])\n\n return (\n <figure className=\"ob-figure\">\n {isLoaded && (\n <GoogleMap\n onLoad={(map) => setMap(map)}\n onUnmount={() => setMap(null)}\n mapContainerStyle={{\n height: 300,\n }}\n center={center}\n zoom={location.zoom}\n onZoomChanged={onZoomChanged}\n >\n <Marker\n animation={google.maps.Animation.DROP}\n position={center}\n draggable\n onDragEnd={(e) => {\n if (!e.latLng) {\n return\n }\n const { lat, lng } = e.latLng.toJSON()\n onChange({\n latitude: lat,\n longitude: lng,\n zoom: location.zoom,\n })\n }}\n ></Marker>\n </GoogleMap>\n )}\n </figure>\n )\n})\n\nexport default React.memo(FormElementLocation)\n"]}

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

@@ -9,7 +9,9 @@ function FormElementNumber({ id, element, value, onChange, validationMessage, di
     const text = React.useMemo(() => (typeof value === 'number' ? value.toString() : ''), [value]);
     const handleChange = React.useCallback((event) => {
         const newValue = parseFloat(event.target.value);
-        onChange(element, isNaN(newValue) ? undefined : newValue);
+        onChange(element, {
+            value: isNaN(newValue) ? undefined : newValue,
+        });
     }, [element, onChange]);
     const htmlInputElementRef = React.useRef(null);
     //this onWheel callback prevents numbers changing while scrolling

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementNumber.js","sourceRoot":"","sources":["../../src/form-elements/FormElementNumber.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport _debounce from 'lodash.debounce'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useIsPageVisible from '../hooks/useIsPageVisible'\n\ntype Props = {\n id: string\n element: FormTypes.NumberElement\n value: unknown\n onChange: FormElementValueChangeHandler<number>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementNumber({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const isPageVisible = useIsPageVisible()\n\n const text = React.useMemo(\n () => (typeof value === 'number' ? value.toString() : ''),\n [value],\n )\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = parseFloat(event.target.value)\n onChange(element, isNaN(newValue) ? undefined : newValue)\n },\n [element, onChange],\n )\n const htmlInputElementRef = React.useRef<HTMLInputElement>(null)\n\n //this onWheel callback prevents numbers changing while scrolling\n const handleWheel = React.useCallback(() => {\n if (htmlInputElementRef.current !== document.activeElement) {\n return\n }\n htmlInputElementRef.current?.blur()\n setTimeout(() => {\n htmlInputElementRef.current?.focus()\n })\n }, [])\n\n return (\n <div className=\"cypress-number-element\">\n <FormElementLabelContainer\n className=\"ob-number\"\n id={id}\n element={element}\n required={element.required}\n >\n {!element.isSlider ? (\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"number\"\n placeholder={element.placeholderValue}\n id={id}\n value={typeof value === 'number' ? value : ''}\n name={element.name}\n className=\"input ob-input cypress-number-control\"\n onChange={handleChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n ref={htmlInputElementRef}\n onWheel={handleWheel}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5\">tag</i>\n </span>\n </div>\n {!!element.readOnly && !!text && (\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 ) : isPageVisible ? (\n <SliderControl\n id={id}\n text={text}\n value={value}\n element={element}\n onChange={handleChange}\n onBlur={setIsDirty}\n />\n ) : undefined}\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\nconst sliderBubbleWidthInPixels = 24\n\nconst SliderControl = React.memo(function SliderControl({\n id,\n text,\n value,\n element,\n onChange,\n onBlur,\n}: {\n id: string\n text: string\n value: unknown\n element: FormTypes.NumberElement\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => unknown\n onBlur: () => void\n}) {\n const sliderOutputRef = React.useRef<HTMLOutputElement>(null)\n const sliderInputRef = React.useRef<HTMLInputElement>(null)\n\n const number = React.useMemo(\n () => (typeof value === 'number' ? value : parseFloat(value as string)),\n [value],\n )\n\n const removeIsDraggingClass = React.useMemo(\n () =>\n _debounce((outputElement: HTMLOutputElement) => {\n if (outputElement.classList.contains('is-dragging')) {\n outputElement.classList.remove('is-dragging')\n }\n }, 500),\n [],\n )\n\n React.useEffect(() => {\n if (\n Number.isNaN(number) \|\|\n typeof element.maxNumber !== 'number' \|\|\n typeof element.minNumber !== 'number'\n ) {\n return\n }\n\n const outputElement = sliderOutputRef.current\n const inputElement = sliderInputRef.current\n if (outputElement && inputElement) {\n const range = element.maxNumber - element.minNumber\n const percentage = (number - element.minNumber) / range\n const inputWidth = inputElement.getBoundingClientRect().width\n const outputWidth = outputElement.getBoundingClientRect().width\n const sliderBubbleOffSetPixels =\n (percentage - 0.5) * -sliderBubbleWidthInPixels\n\n outputElement.style.left = `${percentage * inputWidth}px`\n outputElement.style.marginLeft = `-${\n outputWidth / 2 - sliderBubbleOffSetPixels\n }px`\n\n if (!outputElement.classList.contains('is-dragging')) {\n outputElement.classList.add('is-dragging')\n }\n removeIsDraggingClass(outputElement)\n }\n }, [element.maxNumber, element.minNumber, number, removeIsDraggingClass])\n\n return (\n <div className=\"control\">\n <output\n ref={sliderOutputRef}\n className=\"ob-number__output cypress-number-output\"\n htmlFor={id}\n >\n {text}\n </output>\n <input\n ref={sliderInputRef}\n id={id}\n name={element.name}\n className=\"slider ob-input is-fullwidth cypress-slider-number-control is-large is-circle cypress-number-control\"\n step={element.sliderIncrement ? element.sliderIncrement : 1}\n min={element.minNumber}\n max={element.maxNumber}\n value={text}\n type=\"range\"\n onChange={onChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={onBlur}\n />\n </div>\n )\n})\n\nexport default React.memo(FormElementNumber)\n"]}
1	+ {"version":3,"file":"FormElementNumber.js","sourceRoot":"","sources":["../../src/form-elements/FormElementNumber.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,qBAAqB,MAAM,8CAA8C,CAAA;AAChF,OAAO,SAAS,MAAM,iBAAiB,CAAA;AACvC,OAAO,YAAY,MAAM,qCAAqC,CAAA;AAE9D,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,gBAAgB,MAAM,2BAA2B,CAAA;AAWxD,SAAS,iBAAiB,CAAC,EACzB,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,wBAAwB,EACxB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,aAAa,GAAG,gBAAgB,EAAE,CAAA;IAExC,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CACxB,GAAG,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACzD,CAAC,KAAK,CAAC,CACR,CAAA;IACD,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,CAAC,KAA0C,EAAE,EAAE;QAC7C,MAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;QAC/C,QAAQ,CAAC,OAAO,EAAE;YAChB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;SAC9C,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CAAA;IACD,MAAM,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAEhE,iEAAiE;IACjE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;;QACzC,IAAI,mBAAmB,CAAC,OAAO,KAAK,QAAQ,CAAC,aAAa,EAAE;YAC1D,OAAM;SACP;QACD,MAAA,mBAAmB,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAA;QACnC,UAAU,CAAC,GAAG,EAAE;;YACd,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA;QACtC,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,6BAAK,SAAS,EAAC,wBAAwB;QACrC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,WAAW,EACrB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAEzB,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CACnB,6BAAK,SAAS,EAAC,kBAAkB;gBAC/B,6BAAK,SAAS,EAAC,qCAAqC;oBAClD,+BACE,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAC7C,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,uCAAuC,EACjD,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,UAAU,EAClB,GAAG,EAAE,mBAAmB,EACxB,OAAO,EAAE,WAAW,GACpB;oBACF,8BAAM,SAAS,EAAC,sCAAsC;wBACpD,2BAAG,SAAS,EAAC,0BAA0B,UAAQ,CAC1C,CACH;gBACL,CAAC,CAAC,OAAO,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,IAAI,CAC/B,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,CACP,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAClB,oBAAC,aAAa,IACZ,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,GAClB,CACH,CAAC,CAAC,CAAC,SAAS;YAEZ,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,CACxB,CACP,CAAA;AACH,CAAC;AAED,MAAM,yBAAyB,GAAG,EAAE,CAAA;AAEpC,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,EACtD,EAAE,EACF,IAAI,EACJ,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,GAQP;IACC,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC7D,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAE3D,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAC1B,GAAG,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,KAAe,CAAC,CAAC,EACvE,CAAC,KAAK,CAAC,CACR,CAAA;IAED,MAAM,qBAAqB,GAAG,KAAK,CAAC,OAAO,CACzC,GAAG,EAAE,CACH,SAAS,CAAC,CAAC,aAAgC,EAAE,EAAE;QAC7C,IAAI,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;YACnD,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,CAAA;SAC9C;IACH,CAAC,EAAE,GAAG,CAAC,EACT,EAAE,CACH,CAAA;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IACE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;YACpB,OAAO,OAAO,CAAC,SAAS,KAAK,QAAQ;YACrC,OAAO,OAAO,CAAC,SAAS,KAAK,QAAQ,EACrC;YACA,OAAM;SACP;QAED,MAAM,aAAa,GAAG,eAAe,CAAC,OAAO,CAAA;QAC7C,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,CAAA;QAC3C,IAAI,aAAa,IAAI,YAAY,EAAE;YACjC,MAAM,KAAK,GAAG,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAA;YACnD,MAAM,UAAU,GAAG,CAAC,MAAM,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAA;YACvD,MAAM,UAAU,GAAG,YAAY,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAA;YAC7D,MAAM,WAAW,GAAG,aAAa,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAA;YAC/D,MAAM,wBAAwB,GAC5B,CAAC,UAAU,GAAG,GAAG,CAAC,GAAG,CAAC,yBAAyB,CAAA;YAEjD,aAAa,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,UAAU,GAAG,UAAU,IAAI,CAAA;YACzD,aAAa,CAAC,KAAK,CAAC,UAAU,GAAG,IAC/B,WAAW,GAAG,CAAC,GAAG,wBACpB,IAAI,CAAA;YAEJ,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;gBACpD,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAA;aAC3C;YACD,qBAAqB,CAAC,aAAa,CAAC,CAAA;SACrC;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAA;IAEzE,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS;QACtB,gCACE,GAAG,EAAE,eAAe,EACpB,SAAS,EAAC,yCAAyC,EACnD,OAAO,EAAE,EAAE,IAEV,IAAI,CACE;QACT,+BACE,GAAG,EAAE,cAAc,EACnB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,OAAO,CAAC,IAAI,EAClB,SAAS,EAAC,sGAAsG,EAChH,IAAI,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,EAC3D,GAAG,EAAE,OAAO,CAAC,SAAS,EACtB,GAAG,EAAE,OAAO,CAAC,SAAS,EACtB,KAAK,EAAE,IAAI,EACX,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,MAAM,EAAE,MAAM,GACd,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport CopyToClipboardButton from '../components/renderer/CopyToClipboardButton'\nimport _debounce from 'lodash.debounce'\nimport LookupButton from '../components/renderer/LookupButton'\nimport { FormTypes } from '@oneblink/types'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\nimport useIsPageVisible from '../hooks/useIsPageVisible'\n\ntype Props = {\n id: string\n element: FormTypes.NumberElement\n value: unknown\n onChange: FormElementValueChangeHandler<number>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n} & IsDirtyProps\n\nfunction FormElementNumber({\n id,\n element,\n value,\n onChange,\n validationMessage,\n displayValidationMessage,\n isDirty,\n setIsDirty,\n}: Props) {\n const isPageVisible = useIsPageVisible()\n\n const text = React.useMemo(\n () => (typeof value === 'number' ? value.toString() : ''),\n [value],\n )\n const handleChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = parseFloat(event.target.value)\n onChange(element, {\n value: isNaN(newValue) ? undefined : newValue,\n })\n },\n [element, onChange],\n )\n const htmlInputElementRef = React.useRef<HTMLInputElement>(null)\n\n //this onWheel callback prevents numbers changing while scrolling\n const handleWheel = React.useCallback(() => {\n if (htmlInputElementRef.current !== document.activeElement) {\n return\n }\n htmlInputElementRef.current?.blur()\n setTimeout(() => {\n htmlInputElementRef.current?.focus()\n })\n }, [])\n\n return (\n <div className=\"cypress-number-element\">\n <FormElementLabelContainer\n className=\"ob-number\"\n id={id}\n element={element}\n required={element.required}\n >\n {!element.isSlider ? (\n <div className=\"field has-addons\">\n <div className=\"control is-expanded has-icons-right\">\n <input\n type=\"number\"\n placeholder={element.placeholderValue}\n id={id}\n value={typeof value === 'number' ? value : ''}\n name={element.name}\n className=\"input ob-input cypress-number-control\"\n onChange={handleChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={setIsDirty}\n ref={htmlInputElementRef}\n onWheel={handleWheel}\n />\n <span className=\"ob-input-icon icon is-small is-right\">\n <i className=\"material-icons is-size-5\">tag</i>\n </span>\n </div>\n {!!element.readOnly && !!text && (\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 ) : isPageVisible ? (\n <SliderControl\n id={id}\n text={text}\n value={value}\n element={element}\n onChange={handleChange}\n onBlur={setIsDirty}\n />\n ) : undefined}\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\nconst sliderBubbleWidthInPixels = 24\n\nconst SliderControl = React.memo(function SliderControl({\n id,\n text,\n value,\n element,\n onChange,\n onBlur,\n}: {\n id: string\n text: string\n value: unknown\n element: FormTypes.NumberElement\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => unknown\n onBlur: () => void\n}) {\n const sliderOutputRef = React.useRef<HTMLOutputElement>(null)\n const sliderInputRef = React.useRef<HTMLInputElement>(null)\n\n const number = React.useMemo(\n () => (typeof value === 'number' ? value : parseFloat(value as string)),\n [value],\n )\n\n const removeIsDraggingClass = React.useMemo(\n () =>\n _debounce((outputElement: HTMLOutputElement) => {\n if (outputElement.classList.contains('is-dragging')) {\n outputElement.classList.remove('is-dragging')\n }\n }, 500),\n [],\n )\n\n React.useEffect(() => {\n if (\n Number.isNaN(number) \|\|\n typeof element.maxNumber !== 'number' \|\|\n typeof element.minNumber !== 'number'\n ) {\n return\n }\n\n const outputElement = sliderOutputRef.current\n const inputElement = sliderInputRef.current\n if (outputElement && inputElement) {\n const range = element.maxNumber - element.minNumber\n const percentage = (number - element.minNumber) / range\n const inputWidth = inputElement.getBoundingClientRect().width\n const outputWidth = outputElement.getBoundingClientRect().width\n const sliderBubbleOffSetPixels =\n (percentage - 0.5) * -sliderBubbleWidthInPixels\n\n outputElement.style.left = `${percentage * inputWidth}px`\n outputElement.style.marginLeft = `-${\n outputWidth / 2 - sliderBubbleOffSetPixels\n }px`\n\n if (!outputElement.classList.contains('is-dragging')) {\n outputElement.classList.add('is-dragging')\n }\n removeIsDraggingClass(outputElement)\n }\n }, [element.maxNumber, element.minNumber, number, removeIsDraggingClass])\n\n return (\n <div className=\"control\">\n <output\n ref={sliderOutputRef}\n className=\"ob-number__output cypress-number-output\"\n htmlFor={id}\n >\n {text}\n </output>\n <input\n ref={sliderInputRef}\n id={id}\n name={element.name}\n className=\"slider ob-input is-fullwidth cypress-slider-number-control is-large is-circle cypress-number-control\"\n step={element.sliderIncrement ? element.sliderIncrement : 1}\n min={element.minNumber}\n max={element.maxNumber}\n value={text}\n type=\"range\"\n onChange={onChange}\n required={element.required}\n disabled={element.readOnly}\n onBlur={onBlur}\n />\n </div>\n )\n})\n\nexport default React.memo(FormElementNumber)\n"]}

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

@@ -32,13 +32,13 @@ function FormElementPointAddress({ formId, id, element, value, displayValidation
     }, [element.addressTypeFilter, element.stateTerritoryFilter, formId]);
     const handleChange = React.useCallback(async (addressId) => {
         if (!addressId) {
-            onChange(element, undefined);
+            onChange(element, { value: undefined });
             return;
         }
         setIsLoadingAddressDetails(true);
         try {
             const result = await formService.getPointAddress(formId, addressId);
-            onChange(element, result);
+            onChange(element, { value: result });
         }
         catch (newError) {
             if (isMounted.current) {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementPointAddress.js","sourceRoot":"","sources":["../../src/form-elements/FormElementPointAddress.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,OAAO,oBAAoB,MAAM,6CAA6C,CAAA;AAC9E,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAExF,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAehD,SAAS,uBAAuB,CAAC,EAC/B,MAAM,EACN,EAAE,EACF,OAAO,EACP,KAAK,EACL,wBAAwB,EACxB,iBAAiB,EACjB,QAAQ,EACR,OAAO,EACP,UAAU,GACJ;IACN,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAChC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;IAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAqB,CAAA;IAC7D,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GACzD,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvB,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,KAAK,EAAE,OAAe,EAAE,WAAwB,EAAE,EAAE;QAClD,QAAQ,CAAC,SAAS,CAAC,CAAA;QAEnB,MAAM,MAAM,GAKR;YACF,OAAO;YACP,kBAAkB,EAAE,EAAE;SACvB,CAAA;QAED,IAAI,OAAO,CAAC,oBAAoB,EAAE;YAChC,MAAM,CAAC,cAAc,GAAG,OAAO,CAAC,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;SAC/D;QACD,IAAI,OAAO,CAAC,iBAAiB,EAAE;YAC7B,IAAI,WAAW,GAAgB,KAAK,CAAA;YACpC,IAAI,OAAO,CAAC,iBAAiB,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC1C,WAAW,GAAG,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAgB,CAAA;aAC1D;YACD,MAAM,CAAC,WAAW,GAAG,WAAW,CAAA;SACjC;QAED,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,oBAAoB,CACnD,MAAM,EACN,MAAM,EACN,WAAW,CACZ,CAAA;QAED,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;YACxC,KAAK,EAAE,UAAU,CAAC,EAAE,IAAI,KAAK,CAAC,QAAQ,EAAE;YACxC,KAAK,EAAE,UAAU,CAAC,OAAO,IAAI,KAAK,CAAC,QAAQ,EAAE;SAC9C,CAAC,CAAC,CAAA;IACL,CAAC,EACD,CAAC,OAAO,CAAC,iBAAiB,EAAE,OAAO,CAAC,oBAAoB,EAAE,MAAM,CAAC,CAClE,CAAA;IAED,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,KAAK,EAAE,SAA6B,EAAE,EAAE;QACtC,IAAI,CAAC,SAAS,EAAE;YACd,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;~~YAC5B~~,OAAM;SACP;QAED,0BAA0B,CAAC,IAAI,CAAC,CAAA;QAChC,IAAI;YACF,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,eAAe,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;YACnE,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,CAAA;~~SAC1B~~;QAAC,OAAO,QAAQ,EAAE;YACjB,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,QAAQ,CAAC,QAAiB,CAAC,CAAA;aAC5B;SACF;QACD,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,0BAA0B,CAAC,KAAK,CAAC,CAAA;SAClC;IACH,CAAC,EACD,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC,CACvC,CAAA;IAED,wEAAwE;IACxE,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,IAAI,KAAK,EAAE;YACT,MAAM,QAAQ,GAAG,CAAA,MAAA,KAAK,CAAC,cAAc,0CAAE,gBAAgB,KAAI,KAAK,CAAC,SAAS,CAAA;YAC1E,IAAI,KAAK,KAAK,QAAQ,EAAE;gBACtB,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAA;aACzB;SACF;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,6BAAK,SAAS,EAAC,+BAA+B;QAC5C,oBAAC,yBAAyB,IACxB,SAAS,EAAC,kCAAkC,EAC5C,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,oBAAC,oBAAoB,IACnB,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,uBAAuB,EACrD,WAAW,EAAE,OAAO,CAAC,gBAAgB,EACrC,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,KAAK,EAAE,KAAK,EACZ,iBAAiB,EAAE,iBAAiB,EACpC,wBAAwB,EAAE,wBAAwB,EAClD,aAAa,EAAE,YAAY,EAC3B,SAAS,EAAE,uBAAuB,EAClC,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,aAAa,EAAE,QAAQ,EACvB,gBAAgB,EAAE,GAAG,EACrB,mBAAmB,EAAE,CAAC,EACtB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,GACtB,CACwB;QAE3B,KAAK,IAAI,CACR,6BAAK,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,kBAAkB;YAC5C,6BAAK,SAAS,EAAC,4EAA4E,IACxF,KAAK,CAAC,QAAQ,EAAE,CACb,CACF,CACP,CACG,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { formService } from '@oneblink/apps'\n\nimport AutocompleteDropdown from '../components/renderer/AutocompleteDropdown'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormTypes, PointTypes } from '@oneblink/types'\nimport useIsMounted from '../hooks/useIsMounted'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n formId: number\n id: string\n element: FormTypes.PointAddressElement\n value: PointTypes.PointAddress \| undefined\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n onChange: FormElementValueChangeHandler<PointTypes.PointAddress>\n} & IsDirtyProps\n\ntype AddressType = 'all' \| 'physical' \| 'mailing'\n\nfunction FormElementPointAddress({\n formId,\n id,\n element,\n value,\n displayValidationMessage,\n validationMessage,\n onChange,\n isDirty,\n setIsDirty,\n}: Props) {\n const isMounted = useIsMounted()\n const [label, setLabel] = React.useState('')\n const [error, setError] = React.useState<Error \| undefined>()\n const [isLoadingAddressDetails, setIsLoadingAddressDetails] =\n React.useState(false)\n\n const handleSearch = React.useCallback(\n async (address: string, abortSignal: AbortSignal) => {\n setError(undefined)\n\n const params: {\n address: string\n maxNumberOfResults?: number\n stateTerritory?: string\n addressType?: AddressType\n } = {\n address,\n maxNumberOfResults: 10,\n }\n\n if (element.stateTerritoryFilter) {\n params.stateTerritory = element.stateTerritoryFilter.join(',')\n }\n if (element.addressTypeFilter) {\n let addressType: AddressType = 'all'\n if (element.addressTypeFilter.length === 1) {\n addressType = element.addressTypeFilter[0] as AddressType\n }\n params.addressType = addressType\n }\n\n const result = await formService.searchPointAddresses(\n formId,\n params,\n abortSignal,\n )\n\n return result.map((suggestion, index) => ({\n value: suggestion.id \|\| index.toString(),\n label: suggestion.address \|\| index.toString(),\n }))\n },\n [element.addressTypeFilter, element.stateTerritoryFilter, formId],\n )\n\n const handleChange = React.useCallback(\n async (addressId: string \| undefined) => {\n if (!addressId) {\n onChange(element, undefined)\n return\n }\n\n setIsLoadingAddressDetails(true)\n try {\n const result = await formService.getPointAddress(formId, addressId)\n onChange(element, result)\n } catch (newError) {\n if (isMounted.current) {\n setError(newError as Error)\n }\n }\n if (isMounted.current) {\n setIsLoadingAddressDetails(false)\n }\n },\n [isMounted, onChange, element, formId],\n )\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = value.addressDetails?.formattedAddress \|\| value.addressId\n if (label !== newLabel) {\n setLabel(newLabel \|\| '')\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-point-address-element\">\n <FormElementLabelContainer\n className=\"ob-point-address 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 \|\| isLoadingAddressDetails}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={handleChange}\n isLoading={isLoadingAddressDetails}\n hasError={!!error}\n onChangeLabel={setLabel}\n searchDebounceMs={750}\n searchMinCharacters={4}\n onSearch={handleSearch}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementLabelContainer>\n\n {error && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-point-address-details-error-message\">\n {error.toString()}\n </div>\n </div>\n )}\n </div>\n )\n}\n\nexport default React.memo(FormElementPointAddress)\n"]}
1	+ {"version":3,"file":"FormElementPointAddress.js","sourceRoot":"","sources":["../../src/form-elements/FormElementPointAddress.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { formService } from '@oneblink/apps'\n\nimport AutocompleteDropdown from '../components/renderer/AutocompleteDropdown'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport { FormTypes, PointTypes } from '@oneblink/types'\nimport useIsMounted from '../hooks/useIsMounted'\nimport { FormElementValueChangeHandler, IsDirtyProps } from '../types/form'\n\ntype Props = {\n formId: number\n id: string\n element: FormTypes.PointAddressElement\n value: PointTypes.PointAddress \| undefined\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n onChange: FormElementValueChangeHandler<PointTypes.PointAddress>\n} & IsDirtyProps\n\ntype AddressType = 'all' \| 'physical' \| 'mailing'\n\nfunction FormElementPointAddress({\n formId,\n id,\n element,\n value,\n displayValidationMessage,\n validationMessage,\n onChange,\n isDirty,\n setIsDirty,\n}: Props) {\n const isMounted = useIsMounted()\n const [label, setLabel] = React.useState('')\n const [error, setError] = React.useState<Error \| undefined>()\n const [isLoadingAddressDetails, setIsLoadingAddressDetails] =\n React.useState(false)\n\n const handleSearch = React.useCallback(\n async (address: string, abortSignal: AbortSignal) => {\n setError(undefined)\n\n const params: {\n address: string\n maxNumberOfResults?: number\n stateTerritory?: string\n addressType?: AddressType\n } = {\n address,\n maxNumberOfResults: 10,\n }\n\n if (element.stateTerritoryFilter) {\n params.stateTerritory = element.stateTerritoryFilter.join(',')\n }\n if (element.addressTypeFilter) {\n let addressType: AddressType = 'all'\n if (element.addressTypeFilter.length === 1) {\n addressType = element.addressTypeFilter[0] as AddressType\n }\n params.addressType = addressType\n }\n\n const result = await formService.searchPointAddresses(\n formId,\n params,\n abortSignal,\n )\n\n return result.map((suggestion, index) => ({\n value: suggestion.id \|\| index.toString(),\n label: suggestion.address \|\| index.toString(),\n }))\n },\n [element.addressTypeFilter, element.stateTerritoryFilter, formId],\n )\n\n const handleChange = React.useCallback(\n async (addressId: string \| undefined) => {\n if (!addressId) {\n onChange(element, { value: undefined })\n return\n }\n\n setIsLoadingAddressDetails(true)\n try {\n const result = await formService.getPointAddress(formId, addressId)\n onChange(element, { value: result })\n } catch (newError) {\n if (isMounted.current) {\n setError(newError as Error)\n }\n }\n if (isMounted.current) {\n setIsLoadingAddressDetails(false)\n }\n },\n [isMounted, onChange, element, formId],\n )\n\n // Ensure the label is set if the value is set outside of this component\n React.useEffect(() => {\n if (value) {\n const newLabel = value.addressDetails?.formattedAddress \|\| value.addressId\n if (label !== newLabel) {\n setLabel(newLabel \|\| '')\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [value])\n\n return (\n <div className=\"cypress-point-address-element\">\n <FormElementLabelContainer\n className=\"ob-point-address 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 \|\| isLoadingAddressDetails}\n placeholder={element.placeholderValue}\n required={element.required}\n value={value}\n validationMessage={validationMessage}\n displayValidationMessage={displayValidationMessage}\n onChangeValue={handleChange}\n isLoading={isLoadingAddressDetails}\n hasError={!!error}\n onChangeLabel={setLabel}\n searchDebounceMs={750}\n searchMinCharacters={4}\n onSearch={handleSearch}\n isDirty={isDirty}\n setIsDirty={setIsDirty}\n />\n </FormElementLabelContainer>\n\n {error && (\n <div role=\"alert\" className=\"has-margin-top-8\">\n <div className=\"has-text-danger ob-error__text cypress-point-address-details-error-message\">\n {error.toString()}\n </div>\n </div>\n )}\n </div>\n )\n}\n\nexport default React.memo(FormElementPointAddress)\n"]}

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

@@ -21,14 +21,18 @@ function FormElementRadio({ id, element, value, onChange, conditionallyShownOpti
                             checked: 'ob-radio__input-checked',
                         }, disableRipple: true, value: option.value || '', id: `${id}_${option.value}`, disabled: element.readOnly, checked: value === option.value, onChange: (e) => {
                             setIsDirty();
-                            onChange(element, e.target.value);
+                            onChange(element, {
+                                value: e.target.value,
+                            });
                         } }),
                     ` ${option.label}`)))))) : (React.createElement("div", { className: "buttons ob-buttons ob-buttons-radio cypress-radio-button-group" }, filteredOptions.map((option) => {
                 const isSelected = value === option.value;
                 return (React.createElement("div", { className: "ob-button-radio-container", key: option.value },
                     React.createElement(OptionButton, { element: element, option: option, isSelected: isSelected, onClick: () => {
                             setIsDirty();
-                            onChange(element, option.value);
+                            onChange(element, {
+                                value: option.value,
+                            });
                         }, className: clsx('button ob-button ob-button__input ob-radio__button cypress-radio-button-control', {
                             'is-primary': isSelected,
                             'is-light': !isSelected,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FormElementRadio.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAErC,OAAO,kBAAkB,MAAM,2CAA2C,CAAA;AAC1E,OAAO,qBAAqB,MAAM,gCAAgC,CAAA;AAElE,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,yBAAyB,MAAM,kDAAkD,CAAA;AAqBxF,SAAS,gBAAgB,CAAC,EACxB,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,EACR,gCAAgC,EAChC,iBAAiB,EACjB,wBAAwB,EACxB,oBAAoB,EACpB,OAAO,EACP,UAAU,GACJ;IACN,MAAM,eAAe,GAAG,qBAAqB,CAAC;QAC5C,OAAO;QACP,KAAK;QACL,QAAQ;QACR,gCAAgC;QAChC,oBAAoB;KACrB,CAAC,CAAA;IAEF,OAAO,CACL,6BAAK,SAAS,EAAC,uBAAuB;QACpC,oBAAC,yBAAyB,IACxB,SAAS,EAAC,UAAU,EACpB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAE1B,oBAAC,kBAAkB,IACjB,OAAO,EAAE,OAAO,CAAC,OAAO,EACxB,gCAAgC,EAAE,gCAAgC,IAEjE,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,CAClB,6BAAK,SAAS,EAAC,oBAAoB,IAChC,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC/B,6BAAK,SAAS,EAAC,SAAS,EAAC,GAAG,EAAE,MAAM,CAAC,KAAK;gBACxC,+BACE,SAAS,EAAC,iDAAiD,EAC3D,OAAO,EAAE,GAAG,EAAE,IAAI,MAAM,CAAC,KAAK,EAAE;oBAEhC,oBAAC,KAAK,IACJ,KAAK,EAAC,SAAS,EACf,SAAS,EAAC,uCAAuC,EACjD,OAAO,EAAE;4BACP,OAAO,EAAE,yBAAyB;yBACnC,EACD,aAAa,QACb,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,EAAE,EACzB,EAAE,EAAE,GAAG,EAAE,IAAI,MAAM,CAAC,KAAK,EAAE,EAC3B,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAC1B,OAAO,EAAE,KAAK,KAAK,MAAM,CAAC,KAAK,EAC/B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;4BACd,UAAU,EAAE,CAAA;4BACZ,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;~~wBACnC~~,CAAC,GACD;oBACD,IAAI,MAAM,CAAC,KAAK,EAAE,CACb,CACJ,CACP,CAAC,CACE,CACP,CAAC,CAAC,CAAC,CACF,6BAAK,SAAS,EAAC,gEAAgE,IAC5E,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;gBAC9B,MAAM,UAAU,GAAG,KAAK,KAAK,MAAM,CAAC,KAAK,CAAA;gBACzC,OAAO,CACL,6BAAK,SAAS,EAAC,2BAA2B,EAAC,GAAG,EAAE,MAAM,CAAC,KAAK;oBAC1D,oBAAC,YAAY,IACX,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,GAAG,EAAE;4BACZ,UAAU,EAAE,CAAA;4BACZ,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,KAAK,CAAC,CAAA;~~wBACjC~~,CAAC,EACD,SAAS,EAAE,IAAI,CACb,iFAAiF,EACjF;4BACE,YAAY,EAAE,UAAU;4BACxB,UAAU,EAAE,CAAC,UAAU;yBACxB,CACF,GACD,CACE,CACP,CAAA;YACH,CAAC,CAAC,CACE,CACP,CACkB;YAEpB,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,CACxB,CACP,CAAA;AACH,CAAC;AACD,eAAe,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Radio } from '@mui/material'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport { FormTypes } from '@oneblink/types'\nimport OptionButton from './OptionButton'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.RadioButtonElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n conditionallyShownOptionsElement:\n \| FormElementConditionallyShownElement\n \| undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementRadio({\n id,\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n validationMessage,\n displayValidationMessage,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n return (\n <div className=\"cypress-radio-element\">\n <FormElementLabelContainer\n className=\"ob-radio\"\n id={id}\n element={element}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {!element.buttons ? (\n <div className=\"ob-radio-container\">\n {filteredOptions.map((option) => (\n <div className=\"control\" key={option.value}>\n <label\n className=\"radio ob-radio__input-label cypress-radio-label\"\n htmlFor={`${id}_${option.value}`}\n >\n <Radio\n color=\"primary\"\n className=\"ob-radio__input cypress-radio-control\"\n classes={{\n checked: 'ob-radio__input-checked',\n }}\n disableRipple\n value={option.value \|\| ''}\n id={`${id}_${option.value}`}\n disabled={element.readOnly}\n checked={value === option.value}\n onChange={(e) => {\n setIsDirty()\n onChange(element, e.target.value)\n }}\n />\n {` ${option.label}`}\n </label>\n </div>\n ))}\n </div>\n ) : (\n <div className=\"buttons ob-buttons ob-buttons-radio cypress-radio-button-group\">\n {filteredOptions.map((option) => {\n const isSelected = value === option.value\n return (\n <div className=\"ob-button-radio-container\" key={option.value}>\n <OptionButton\n element={element}\n option={option}\n isSelected={isSelected}\n onClick={() => {\n setIsDirty()\n onChange(element, option.value)\n }}\n className={clsx(\n 'button ob-button ob-button__input ob-radio__button cypress-radio-button-control',\n {\n 'is-primary': isSelected,\n 'is-light': !isSelected,\n },\n )}\n />\n </div>\n )\n })}\n </div>\n )}\n </FormElementOptions>\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}\nexport default React.memo(FormElementRadio)\n"]}
1	+ {"version":3,"file":"FormElementRadio.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRadio.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Radio } from '@mui/material'\n\nimport FormElementOptions from '../components/renderer/FormElementOptions'\nimport useFormElementOptions from '../hooks/useFormElementOptions'\nimport { FormTypes } from '@oneblink/types'\nimport OptionButton from './OptionButton'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport {\n FormElementValueChangeHandler,\n FormElementConditionallyShownElement,\n IsDirtyProps,\n UpdateFormElementsHandler,\n} from '../types/form'\n\ntype Props = {\n id: string\n element: FormTypes.RadioButtonElement\n value: unknown\n onChange: FormElementValueChangeHandler<string>\n displayValidationMessage: boolean\n validationMessage: string \| undefined\n conditionallyShownOptionsElement:\n \| FormElementConditionallyShownElement\n \| undefined\n onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nfunction FormElementRadio({\n id,\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n validationMessage,\n displayValidationMessage,\n onUpdateFormElements,\n isDirty,\n setIsDirty,\n}: Props) {\n const filteredOptions = useFormElementOptions({\n element,\n value,\n onChange,\n conditionallyShownOptionsElement,\n onUpdateFormElements,\n })\n\n return (\n <div className=\"cypress-radio-element\">\n <FormElementLabelContainer\n className=\"ob-radio\"\n id={id}\n element={element}\n required={element.required}\n >\n <FormElementOptions\n options={element.options}\n conditionallyShownOptionsElement={conditionallyShownOptionsElement}\n >\n {!element.buttons ? (\n <div className=\"ob-radio-container\">\n {filteredOptions.map((option) => (\n <div className=\"control\" key={option.value}>\n <label\n className=\"radio ob-radio__input-label cypress-radio-label\"\n htmlFor={`${id}_${option.value}`}\n >\n <Radio\n color=\"primary\"\n className=\"ob-radio__input cypress-radio-control\"\n classes={{\n checked: 'ob-radio__input-checked',\n }}\n disableRipple\n value={option.value \|\| ''}\n id={`${id}_${option.value}`}\n disabled={element.readOnly}\n checked={value === option.value}\n onChange={(e) => {\n setIsDirty()\n onChange(element, {\n value: e.target.value,\n })\n }}\n />\n {` ${option.label}`}\n </label>\n </div>\n ))}\n </div>\n ) : (\n <div className=\"buttons ob-buttons ob-buttons-radio cypress-radio-button-group\">\n {filteredOptions.map((option) => {\n const isSelected = value === option.value\n return (\n <div className=\"ob-button-radio-container\" key={option.value}>\n <OptionButton\n element={element}\n option={option}\n isSelected={isSelected}\n onClick={() => {\n setIsDirty()\n onChange(element, {\n value: option.value,\n })\n }}\n className={clsx(\n 'button ob-button ob-button__input ob-radio__button cypress-radio-button-control',\n {\n 'is-primary': isSelected,\n 'is-light': !isSelected,\n },\n )}\n />\n </div>\n )\n })}\n </div>\n )}\n </FormElementOptions>\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}\nexport default React.memo(FormElementRadio)\n"]}

package/dist/form-elements/FormElementRepeatableSet.d.ts CHANGED Viewed

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { FormTypes, SubmissionTypes } from '@oneblink/types';
-import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, FormElementValueChangeHandler, IsDirtyProps, UpdateFormElementsHandler } from '../types/form';
+import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, NestedFormElementValueChangeHandler, IsDirtyProps, UpdateFormElementsHandler } from '../types/form';
 type Props = {
     formId: number;
     id: string;
     isEven: boolean;
     element: FormTypes.RepeatableSetElement;
     value: Array<SubmissionTypes.S3SubmissionData['submission']> | undefined;
-    onChange: FormElementValueChangeHandler<SubmissionTypes.S3SubmissionData['submission'][]>;
+    onChange: NestedFormElementValueChangeHandler<SubmissionTypes.S3SubmissionData['submission'][]>;
     onLookup: FormElementLookupHandler;
     formElementConditionallyShown: FormElementConditionallyShown | undefined;
     formElementValidation: FormElementValidation | undefined;