@oneblink/apps-react 2.2.0 → 2.3.0-beta.2

package/dist/components/renderer/OneBlinkFormElements.d.ts

@@ -1,19 +1,19 @@
-import * as React from 'react';
-import { FormTypes } from '@oneblink/types';
-import { FormElementLookupHandler, FormElementsConditionallyShown, FormElementsValidation, FormElementValueChangeHandler, FormSubmissionModel } from '../../types/form';
-export declare type Props<T extends FormTypes._NestedElementsElement> = {
-    formId: number;
-    elements: FormTypes.FormElement[];
-    formElementsConditionallyShown: FormElementsConditionallyShown | undefined;
-    formElementsValidation: FormElementsValidation | undefined;
-    displayValidationMessages: boolean;
-    onChange: FormElementValueChangeHandler;
-    onLookup: FormElementLookupHandler;
-    isEven?: boolean;
-    idPrefix: string;
-    model: FormSubmissionModel;
-    parentElement: T;
-};
-declare function OneBlinkFormElements<T extends FormTypes._NestedElementsElement>({ formId, elements, isEven, idPrefix, displayValidationMessages, formElementsValidation, formElementsConditionallyShown, onChange, onLookup, model, parentElement, }: Props<T>): JSX.Element;
-declare const _default: React.MemoExoticComponent<typeof OneBlinkFormElements>;
-export default _default;
+import * as React from 'react';
+import { FormTypes } from '@oneblink/types';
+import { FormElementLookupHandler, FormElementsConditionallyShown, FormElementsValidation, FormElementValueChangeHandler, FormSubmissionModel } from '../../types/form';
+export declare type Props<T extends FormTypes._NestedElementsElement> = {
+    formId: number;
+    elements: FormTypes.FormElement[];
+    formElementsConditionallyShown: FormElementsConditionallyShown | undefined;
+    formElementsValidation: FormElementsValidation | undefined;
+    displayValidationMessages: boolean;
+    onChange: FormElementValueChangeHandler;
+    onLookup: FormElementLookupHandler;
+    isEven?: boolean;
+    idPrefix: string;
+    model: FormSubmissionModel;
+    parentElement: T;
+};
+declare function OneBlinkFormElements<T extends FormTypes._NestedElementsElement>({ formId, elements, isEven, idPrefix, displayValidationMessages, formElementsValidation, formElementsConditionallyShown, onChange, onLookup, model, parentElement, }: Props<T>): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof OneBlinkFormElements>;
+export default _default;

package/dist/components/renderer/OneBlinkFormElements.js

@@ -1,203 +1,203 @@
-import * as React from 'react';
-import clsx from 'clsx';
-import LookupNotification from './LookupNotification';
-import FormElementBarcodeScanner from '../../form-elements/FormElementBarcodeScanner';
-import FormElementEmail from '../../form-elements/FormElementEmail';
-import FormElementABN from '../../form-elements/FormElementABN';
-import FormElementBSB from '../../form-elements/FormElementBSB';
-import FormElementText from '../../form-elements/FormElementText';
-import FormElementTextarea from '../../form-elements/FormElementTextarea';
-import FormElementNumber from '../../form-elements/FormElementNumber';
-import FormElementHeading from '../../form-elements/FormElementHeading';
-import FormElementHTML from '../../form-elements/FormElementHTML';
-import FormElementTelephone from '../../form-elements/FormElementTelephone';
-import FormElementSelect from '../../form-elements/FormElementSelect';
-import FormElementDate from '../../form-elements/FormElementDate';
-import FormElementImage from '../../form-elements/FormElementImage';
-import FormElementDateTime from '../../form-elements/FormElementDateTime';
-import FormElementTime from '../../form-elements/FormElementTime';
-import FormElementCalculation from '../../form-elements/FormElementCalculation';
-import FormElementRadio from '../../form-elements/FormElementRadio';
-import FormElementAutocomplete from '../../form-elements/FormElementAutocomplete';
-import FormElementRepeatableSet from '../../form-elements/FormElementRepeatableSet';
-import FormElementSignature from '../../form-elements/FormElementSignature';
-import FormElementCheckBoxes from '../../form-elements/FormElementCheckBoxes';
-import FormElementFiles, { stringifyAttachments, } from '../../form-elements/FormElementFiles';
-import FormElementForm from '../../form-elements/FormElementForm';
-import FormElementSection from '../../form-elements/FormElementSection';
-import FormElementCamera from '../../form-elements/FormElementCamera';
-import FormElementSummary from '../../form-elements/FormElementSummary';
-import FormElementCaptcha from '../../form-elements/FormElementCaptcha';
-import FormElementLocation, { stringifyLocation, } from '../../form-elements/FormElementLocation';
-import FormElementGeoscapeAddress from '../../form-elements/FormElementGeoscapeAddress';
-import FormElementCompliance from '../../form-elements/FormElementCompliance';
-import FormElementPointAddress from '../../form-elements/FormElementPointAddress';
-import FormElementBoolean from '../../form-elements/FormElementBoolean';
-import FormElementCivicaStreetName from '../../form-elements/FormElementCivicaStreetName';
-import FormElementCivicaNameRecord from '../../form-elements/FormElementCivicaNameRecord';
-import FormElementFreshdeskDependentField from '../../form-elements/FormElementFreshdeskDependentField';
-import { FormSubmissionModelContextProvider } from '../../hooks/useFormSubmissionModelContext';
-function OneBlinkFormElements({ formId, elements, isEven, idPrefix, displayValidationMessages, formElementsValidation, formElementsConditionallyShown, onChange, onLookup, model, parentElement, }) {
-    return (React.createElement(FormSubmissionModelContextProvider, { elements: parentElement.elements, model: model, formElementsConditionallyShown: formElementsConditionallyShown }, elements.map((element) => {
-        var _a, _b;
-        if (element.type === 'section') {
-            if ((_a = formElementsConditionallyShown === null || formElementsConditionallyShown === void 0 ? void 0 : formElementsConditionallyShown[element.id]) === null || _a === void 0 ? void 0 : _a.isHidden) {
-                return null;
-            }
-            return (React.createElement("div", { key: element.id, className: clsx('ob-element cypress-element-container', element.customCssClasses) },
-                React.createElement(FormElementSection, { formId: formId, element: element, displayValidationMessages: displayValidationMessages, idPrefix: idPrefix, formElementsConditionallyShown: formElementsConditionallyShown, formElementsValidation: formElementsValidation, onChange: onChange, onLookup: onLookup, model: model, parentElement: parentElement })));
-        }
-        if (element.type === 'page' ||
-            ((_b = formElementsConditionallyShown === null || formElementsConditionallyShown === void 0 ? void 0 : formElementsConditionallyShown[element.name]) === null || _b === void 0 ? void 0 : _b.isHidden)) {
-            return null;
-        }
-        return (React.createElement("div", { key: element.id, className: clsx('ob-element cypress-element-container', element.customCssClasses
-                ? element.customCssClasses.join(' ')
-                : ''), "data-cypress-element-name": element.name, "data-ob-name": element.name },
-            React.createElement(FormElementSwitch, { formId: formId, element: element, value: model[element.name], displayValidationMessage: displayValidationMessages, isEven: isEven, id: `${idPrefix}${element.name}`, formElementConditionallyShown: formElementsConditionallyShown === null || formElementsConditionallyShown === void 0 ? void 0 : formElementsConditionallyShown[element.name], formElementValidation: formElementsValidation === null || formElementsValidation === void 0 ? void 0 : formElementsValidation[element.name], onChange: onChange, onLookup: onLookup })));
-    })));
-}
-export default React.memo(OneBlinkFormElements);
-const FormElementSwitch = React.memo(function OneBlinkFormElement({ formId, element, value, displayValidationMessage, formElementValidation, formElementConditionallyShown, isEven, id, onChange, onLookup, }) {
-    const conditionallyShownOptions = (formElementConditionallyShown === null || formElementConditionallyShown === void 0 ? void 0 : formElementConditionallyShown.type) === 'formElement'
-        ? formElementConditionallyShown === null || formElementConditionallyShown === void 0 ? void 0 : formElementConditionallyShown.options
-        : undefined;
-    const validationMessage = typeof formElementValidation === 'string'
-        ? formElementValidation
-        : undefined;
-    switch (element.type) {
-        case 'heading': {
-            return React.createElement(FormElementHeading, { element: element });
-        }
-        case 'html': {
-            return React.createElement(FormElementHTML, { element: element });
-        }
-        case 'date': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementDate, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'email': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementEmail, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'text': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementText, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'abn': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementABN, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'bsb': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementBSB, { id: id, formId: formId, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'barcodeScanner': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementBarcodeScanner, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'textarea': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementTextarea, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'number': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementNumber, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'telephone': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementTelephone, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'autocomplete': {
-            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
-                React.createElement(FormElementAutocomplete, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
-        }
-        case 'select': {
-            return (React.createElement(LookupNotification, { autoLookupValue: !element.multi ? value : undefined, element: element, onLookup: onLookup },
-                React.createElement(FormElementSelect, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
-        }
-        case 'radio': {
-            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
-                React.createElement(FormElementRadio, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
-        }
-        case 'draw': {
-            return (React.createElement(FormElementSignature, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage }));
-        }
-        case 'calculation': {
-            return (React.createElement(FormElementCalculation, { element: element, onChange: onChange, value: value }));
-        }
-        case 'repeatableSet': {
-            return (React.createElement(FormElementRepeatableSet, { formId: formId, id: id, isEven: !isEven, element: element, value: value, onChange: onChange, onLookup: onLookup, formElementConditionallyShown: formElementConditionallyShown, formElementValidation: formElementValidation, displayValidationMessage: displayValidationMessage }));
-        }
-        case 'image': {
-            return React.createElement(FormElementImage, { element: element });
-        }
-        case 'datetime': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementDateTime, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'time': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementTime, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'checkboxes': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
-                React.createElement(FormElementCheckBoxes, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
-        }
-        case 'files': {
-            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup, autoLookupValue: value, stringifyAutoLookupValue: stringifyAttachments },
-                React.createElement(FormElementFiles, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'infoPage':
-        case 'form': {
-            return (React.createElement(FormElementForm, { formId: formId, id: id, element: element, value: value, onChange: onChange, onLookup: onLookup, displayValidationMessages: displayValidationMessage, formElementValidation: formElementValidation, formElementConditionallyShown: formElementConditionallyShown }));
-        }
-        case 'camera': {
-            return (React.createElement(FormElementCamera, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage }));
-        }
-        case 'summary': {
-            return (React.createElement(FormElementSummary, { element: element, onChange: onChange, value: value }));
-        }
-        case 'captcha': {
-            return (React.createElement(FormElementCaptcha, { element: element, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage }));
-        }
-        case 'location': {
-            return (React.createElement(LookupNotification, { autoLookupValue: value, stringifyAutoLookupValue: stringifyLocation, element: element, onLookup: onLookup },
-                React.createElement(FormElementLocation, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'geoscapeAddress': {
-            const v = value;
-            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
-                React.createElement(FormElementGeoscapeAddress, { id: id, formId: formId, element: element, value: v, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'compliance': {
-            return (React.createElement(LookupNotification, { autoLookupValue: value ? value.value : undefined, element: element, onLookup: onLookup },
-                React.createElement(FormElementCompliance, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions, isEven: isEven })));
-        }
-        case 'freshdeskDependentField': {
-            return (React.createElement(FormElementFreshdeskDependentField, { formId: formId, id: id, element: element, value: value, onChange: onChange, onLookup: onLookup, displayValidationMessages: displayValidationMessage, formElementValidation: formElementValidation, formElementConditionallyShown: formElementConditionallyShown }));
-        }
-        case 'pointAddress': {
-            const v = value;
-            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
-                React.createElement(FormElementPointAddress, { id: id, formId: formId, element: element, value: v, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'boolean': {
-            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
-                React.createElement(FormElementBoolean, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'civicaStreetName': {
-            const v = value;
-            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
-                React.createElement(FormElementCivicaStreetName, { id: id, formId: formId, element: element, value: v, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
-        }
-        case 'civicaNameRecord': {
-            return (React.createElement(FormElementCivicaNameRecord, { formId: formId, id: id, element: element, value: value, onChange: onChange, onLookup: onLookup, displayValidationMessages: displayValidationMessage, formElementValidation: formElementValidation, formElementConditionallyShown: formElementConditionallyShown }));
-        }
-        default: {
-            console.warn('Invalid element', element);
-            return null;
-        }
-    }
-});
+import * as React from 'react';
+import clsx from 'clsx';
+import LookupNotification from './LookupNotification';
+import FormElementBarcodeScanner from '../../form-elements/FormElementBarcodeScanner';
+import FormElementEmail from '../../form-elements/FormElementEmail';
+import FormElementABN from '../../form-elements/FormElementABN';
+import FormElementBSB from '../../form-elements/FormElementBSB';
+import FormElementText from '../../form-elements/FormElementText';
+import FormElementTextarea from '../../form-elements/FormElementTextarea';
+import FormElementNumber from '../../form-elements/FormElementNumber';
+import FormElementHeading from '../../form-elements/FormElementHeading';
+import FormElementHTML from '../../form-elements/FormElementHTML';
+import FormElementTelephone from '../../form-elements/FormElementTelephone';
+import FormElementSelect from '../../form-elements/FormElementSelect';
+import FormElementDate from '../../form-elements/FormElementDate';
+import FormElementImage from '../../form-elements/FormElementImage';
+import FormElementDateTime from '../../form-elements/FormElementDateTime';
+import FormElementTime from '../../form-elements/FormElementTime';
+import FormElementCalculation from '../../form-elements/FormElementCalculation';
+import FormElementRadio from '../../form-elements/FormElementRadio';
+import FormElementAutocomplete from '../../form-elements/FormElementAutocomplete';
+import FormElementRepeatableSet from '../../form-elements/FormElementRepeatableSet';
+import FormElementSignature from '../../form-elements/FormElementSignature';
+import FormElementCheckBoxes from '../../form-elements/FormElementCheckBoxes';
+import FormElementFiles, { stringifyAttachments, } from '../../form-elements/FormElementFiles';
+import FormElementForm from '../../form-elements/FormElementForm';
+import FormElementSection from '../../form-elements/FormElementSection';
+import FormElementCamera from '../../form-elements/FormElementCamera';
+import FormElementSummary from '../../form-elements/FormElementSummary';
+import FormElementCaptcha from '../../form-elements/FormElementCaptcha';
+import FormElementLocation, { stringifyLocation, } from '../../form-elements/FormElementLocation';
+import FormElementGeoscapeAddress from '../../form-elements/FormElementGeoscapeAddress';
+import FormElementCompliance from '../../form-elements/FormElementCompliance';
+import FormElementPointAddress from '../../form-elements/FormElementPointAddress';
+import FormElementBoolean from '../../form-elements/FormElementBoolean';
+import FormElementCivicaStreetName from '../../form-elements/FormElementCivicaStreetName';
+import FormElementCivicaNameRecord from '../../form-elements/FormElementCivicaNameRecord';
+import FormElementFreshdeskDependentField from '../../form-elements/FormElementFreshdeskDependentField';
+import { FormSubmissionModelContextProvider } from '../../hooks/useFormSubmissionModelContext';
+function OneBlinkFormElements({ formId, elements, isEven, idPrefix, displayValidationMessages, formElementsValidation, formElementsConditionallyShown, onChange, onLookup, model, parentElement, }) {
+    return (React.createElement(FormSubmissionModelContextProvider, { elements: parentElement.elements, model: model, formElementsConditionallyShown: formElementsConditionallyShown }, elements.map((element) => {
+        var _a, _b;
+        if (element.type === 'section') {
+            if ((_a = formElementsConditionallyShown === null || formElementsConditionallyShown === void 0 ? void 0 : formElementsConditionallyShown[element.id]) === null || _a === void 0 ? void 0 : _a.isHidden) {
+                return null;
+            }
+            return (React.createElement("div", { key: element.id, className: clsx('ob-element cypress-element-container', element.customCssClasses) },
+                React.createElement(FormElementSection, { formId: formId, element: element, displayValidationMessages: displayValidationMessages, idPrefix: idPrefix, formElementsConditionallyShown: formElementsConditionallyShown, formElementsValidation: formElementsValidation, onChange: onChange, onLookup: onLookup, model: model, parentElement: parentElement })));
+        }
+        if (element.type === 'page' ||
+            ((_b = formElementsConditionallyShown === null || formElementsConditionallyShown === void 0 ? void 0 : formElementsConditionallyShown[element.name]) === null || _b === void 0 ? void 0 : _b.isHidden)) {
+            return null;
+        }
+        return (React.createElement("div", { key: element.id, className: clsx('ob-element cypress-element-container', element.customCssClasses
+                ? element.customCssClasses.join(' ')
+                : ''), "data-cypress-element-name": element.name, "data-ob-name": element.name },
+            React.createElement(FormElementSwitch, { formId: formId, element: element, value: model[element.name], displayValidationMessage: displayValidationMessages, isEven: isEven, id: `${idPrefix}${element.name}`, formElementConditionallyShown: formElementsConditionallyShown === null || formElementsConditionallyShown === void 0 ? void 0 : formElementsConditionallyShown[element.name], formElementValidation: formElementsValidation === null || formElementsValidation === void 0 ? void 0 : formElementsValidation[element.name], onChange: onChange, onLookup: onLookup })));
+    })));
+}
+export default React.memo(OneBlinkFormElements);
+const FormElementSwitch = React.memo(function OneBlinkFormElement({ formId, element, value, displayValidationMessage, formElementValidation, formElementConditionallyShown, isEven, id, onChange, onLookup, }) {
+    const conditionallyShownOptions = (formElementConditionallyShown === null || formElementConditionallyShown === void 0 ? void 0 : formElementConditionallyShown.type) === 'formElement'
+        ? formElementConditionallyShown === null || formElementConditionallyShown === void 0 ? void 0 : formElementConditionallyShown.options
+        : undefined;
+    const validationMessage = typeof formElementValidation === 'string'
+        ? formElementValidation
+        : undefined;
+    switch (element.type) {
+        case 'heading': {
+            return React.createElement(FormElementHeading, { element: element });
+        }
+        case 'html': {
+            return React.createElement(FormElementHTML, { element: element });
+        }
+        case 'date': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementDate, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'email': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementEmail, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'text': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementText, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'abn': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementABN, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'bsb': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementBSB, { id: id, formId: formId, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'barcodeScanner': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementBarcodeScanner, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'textarea': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementTextarea, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'number': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementNumber, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'telephone': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementTelephone, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'autocomplete': {
+            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
+                React.createElement(FormElementAutocomplete, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
+        }
+        case 'select': {
+            return (React.createElement(LookupNotification, { autoLookupValue: !element.multi ? value : undefined, element: element, onLookup: onLookup },
+                React.createElement(FormElementSelect, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
+        }
+        case 'radio': {
+            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
+                React.createElement(FormElementRadio, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
+        }
+        case 'draw': {
+            return (React.createElement(FormElementSignature, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage }));
+        }
+        case 'calculation': {
+            return (React.createElement(FormElementCalculation, { element: element, onChange: onChange, value: value }));
+        }
+        case 'repeatableSet': {
+            return (React.createElement(FormElementRepeatableSet, { formId: formId, id: id, isEven: !isEven, element: element, value: value, onChange: onChange, onLookup: onLookup, formElementConditionallyShown: formElementConditionallyShown, formElementValidation: formElementValidation, displayValidationMessage: displayValidationMessage }));
+        }
+        case 'image': {
+            return React.createElement(FormElementImage, { element: element });
+        }
+        case 'datetime': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementDateTime, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'time': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementTime, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'checkboxes': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup },
+                React.createElement(FormElementCheckBoxes, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions })));
+        }
+        case 'files': {
+            return (React.createElement(LookupNotification, { element: element, onLookup: onLookup, autoLookupValue: value, stringifyAutoLookupValue: stringifyAttachments },
+                React.createElement(FormElementFiles, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'infoPage':
+        case 'form': {
+            return (React.createElement(FormElementForm, { formId: formId, id: id, element: element, value: value, onChange: onChange, onLookup: onLookup, displayValidationMessages: displayValidationMessage, formElementValidation: formElementValidation, formElementConditionallyShown: formElementConditionallyShown }));
+        }
+        case 'camera': {
+            return (React.createElement(FormElementCamera, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage }));
+        }
+        case 'summary': {
+            return (React.createElement(FormElementSummary, { element: element, onChange: onChange, value: value }));
+        }
+        case 'captcha': {
+            return (React.createElement(FormElementCaptcha, { element: element, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage }));
+        }
+        case 'location': {
+            return (React.createElement(LookupNotification, { autoLookupValue: value, stringifyAutoLookupValue: stringifyLocation, element: element, onLookup: onLookup },
+                React.createElement(FormElementLocation, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'geoscapeAddress': {
+            const v = value;
+            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
+                React.createElement(FormElementGeoscapeAddress, { id: id, formId: formId, element: element, value: v, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'compliance': {
+            return (React.createElement(LookupNotification, { autoLookupValue: value ? value.value : undefined, element: element, onLookup: onLookup },
+                React.createElement(FormElementCompliance, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage, conditionallyShownOptions: conditionallyShownOptions, isEven: isEven })));
+        }
+        case 'freshdeskDependentField': {
+            return (React.createElement(FormElementFreshdeskDependentField, { formId: formId, id: id, element: element, value: value, onChange: onChange, onLookup: onLookup, displayValidationMessages: displayValidationMessage, formElementValidation: formElementValidation, formElementConditionallyShown: formElementConditionallyShown }));
+        }
+        case 'pointAddress': {
+            const v = value;
+            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
+                React.createElement(FormElementPointAddress, { id: id, formId: formId, element: element, value: v, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'boolean': {
+            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
+                React.createElement(FormElementBoolean, { id: id, element: element, value: value, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'civicaStreetName': {
+            const v = value;
+            return (React.createElement(LookupNotification, { autoLookupValue: value, element: element, onLookup: onLookup },
+                React.createElement(FormElementCivicaStreetName, { id: id, formId: formId, element: element, value: v, onChange: onChange, validationMessage: validationMessage, displayValidationMessage: displayValidationMessage })));
+        }
+        case 'civicaNameRecord': {
+            return (React.createElement(FormElementCivicaNameRecord, { formId: formId, id: id, element: element, value: value, onChange: onChange, onLookup: onLookup, displayValidationMessages: displayValidationMessage, formElementValidation: formElementValidation, formElementConditionallyShown: formElementConditionallyShown }));
+        }
+        default: {
+            console.warn('Invalid element', element);
+            return null;
+        }
+    }
+});
 //# sourceMappingURL=OneBlinkFormElements.js.map

package/dist/components/renderer/PageFormElements.d.ts

@@ -1,17 +1,17 @@
-import * as React from 'react';
-import { FormTypes } from '@oneblink/types';
-import { FormElementsConditionallyShown, FormElementsValidation, FormElementValueChangeHandler, FormSubmissionModel, SetFormSubmission } from '../../types/form';
-export declare type Props = {
-    formId: number;
-    isActive: boolean;
-    pageElement: FormTypes.PageElement;
-    displayValidationMessages: boolean;
-    model: FormSubmissionModel;
-    formElementsConditionallyShown: FormElementsConditionallyShown | undefined;
-    formElementsValidation: FormElementsValidation | undefined;
-    onChange: FormElementValueChangeHandler;
-    setFormSubmission: SetFormSubmission;
-};
-declare function PageFormElements({ formId, isActive, pageElement, model, displayValidationMessages, formElementsConditionallyShown, formElementsValidation, onChange, setFormSubmission, }: Props): JSX.Element;
-declare const _default: React.MemoExoticComponent<typeof PageFormElements>;
-export default _default;
+import * as React from 'react';
+import { FormTypes } from '@oneblink/types';
+import { FormElementsConditionallyShown, FormElementsValidation, FormElementValueChangeHandler, FormSubmissionModel, SetFormSubmission } from '../../types/form';
+export declare type Props = {
+    formId: number;
+    isActive: boolean;
+    pageElement: FormTypes.PageElement;
+    displayValidationMessages: boolean;
+    model: FormSubmissionModel;
+    formElementsConditionallyShown: FormElementsConditionallyShown | undefined;
+    formElementsValidation: FormElementsValidation | undefined;
+    onChange: FormElementValueChangeHandler;
+    setFormSubmission: SetFormSubmission;
+};
+declare function PageFormElements({ formId, isActive, pageElement, model, displayValidationMessages, formElementsConditionallyShown, formElementsValidation, onChange, setFormSubmission, }: Props): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof PageFormElements>;
+export default _default;

package/dist/components/renderer/PageFormElements.js

@@ -1,49 +1,49 @@
-import * as React from 'react';
-import clsx from 'clsx';
-import OneBlinkFormElements from './OneBlinkFormElements';
-import useFormDefinition from '../../hooks/useFormDefinition';
-import { IsPageVisibleProvider } from '../../hooks/useIsPageVisible';
-import { FlatpickrGuidProvider } from '../../hooks/useFlatpickrGuid';
-function PageFormElements({ formId, isActive, pageElement, model, displayValidationMessages, formElementsConditionallyShown, formElementsValidation, onChange, setFormSubmission, }) {
-    const handleLookup = React.useCallback((mergeLookupResults) => {
-        setFormSubmission((currentFormSubmission) => {
-            const { submission, elements } = mergeLookupResults({
-                elements: pageElement.elements,
-                submission: currentFormSubmission.submission,
-            });
-            const definition = {
-                ...currentFormSubmission.definition,
-            };
-            if (pageElement.id === formId.toString()) {
-                definition.elements = elements;
-            }
-            else {
-                definition.elements = currentFormSubmission.definition.elements.map((formElement) => {
-                    if (formElement.id === pageElement.id &&
-                        formElement.type === 'page') {
-                        return {
-                            ...formElement,
-                            elements,
-                        };
-                    }
-                    else {
-                        return formElement;
-                    }
-                });
-            }
-            return {
-                submission,
-                definition,
-            };
-        });
-    }, [formId, pageElement.elements, pageElement.id, setFormSubmission]);
-    const form = useFormDefinition();
-    return (React.createElement(IsPageVisibleProvider, { isPageVisible: isActive },
-        React.createElement(FlatpickrGuidProvider, null,
-            React.createElement("div", { key: pageElement.id, className: clsx('ob-page step-content is-active cypress-page', {
-                    'is-invisible': !isActive,
-                }) },
-                React.createElement(OneBlinkFormElements, { formId: formId, model: model, parentElement: form, formElementsConditionallyShown: formElementsConditionallyShown, formElementsValidation: formElementsValidation, displayValidationMessages: displayValidationMessages, elements: pageElement.elements, onChange: onChange, onLookup: handleLookup, idPrefix: "" })))));
-}
-export default React.memo(PageFormElements);
+import * as React from 'react';
+import clsx from 'clsx';
+import OneBlinkFormElements from './OneBlinkFormElements';
+import useFormDefinition from '../../hooks/useFormDefinition';
+import { IsPageVisibleProvider } from '../../hooks/useIsPageVisible';
+import { FlatpickrGuidProvider } from '../../hooks/useFlatpickrGuid';
+function PageFormElements({ formId, isActive, pageElement, model, displayValidationMessages, formElementsConditionallyShown, formElementsValidation, onChange, setFormSubmission, }) {
+    const handleLookup = React.useCallback((mergeLookupResults) => {
+        setFormSubmission((currentFormSubmission) => {
+            const { submission, elements } = mergeLookupResults({
+                elements: pageElement.elements,
+                submission: currentFormSubmission.submission,
+            });
+            const definition = {
+                ...currentFormSubmission.definition,
+            };
+            if (pageElement.id === formId.toString()) {
+                definition.elements = elements;
+            }
+            else {
+                definition.elements = currentFormSubmission.definition.elements.map((formElement) => {
+                    if (formElement.id === pageElement.id &&
+                        formElement.type === 'page') {
+                        return {
+                            ...formElement,
+                            elements,
+                        };
+                    }
+                    else {
+                        return formElement;
+                    }
+                });
+            }
+            return {
+                submission,
+                definition,
+            };
+        });
+    }, [formId, pageElement.elements, pageElement.id, setFormSubmission]);
+    const form = useFormDefinition();
+    return (React.createElement(IsPageVisibleProvider, { isPageVisible: isActive },
+        React.createElement(FlatpickrGuidProvider, null,
+            React.createElement("div", { key: pageElement.id, className: clsx('ob-page step-content is-active cypress-page', {
+                    'is-invisible': !isActive,
+                }) },
+                React.createElement(OneBlinkFormElements, { formId: formId, model: model, parentElement: form, formElementsConditionallyShown: formElementsConditionallyShown, formElementsValidation: formElementsValidation, displayValidationMessages: displayValidationMessages, elements: pageElement.elements, onChange: onChange, onLookup: handleLookup, idPrefix: "" })))));
+}
+export default React.memo(PageFormElements);
 //# sourceMappingURL=PageFormElements.js.map

package/dist/components/renderer/ProgressBar.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+interface Props {
+    progress: number;
+    className?: string;
+}
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/renderer/ProgressBar.js

@@ -0,0 +1,7 @@
+import { LinearProgress } from '@mui/material';
+import * as React from 'react';
+const ProgressBar = ({ progress, className }) => {
+    return (React.createElement(LinearProgress, { className: className, variant: "determinate", value: progress }));
+};
+export default React.memo(ProgressBar);
+//# sourceMappingURL=ProgressBar.js.map