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

package/dist/form-elements/FormElementBSB.js

@@ -1,101 +1,101 @@
-import * as React from 'react';
-import InputMask from 'react-input-mask';
-import clsx from 'clsx';
-import CopyToClipboardButton from '../components/renderer/CopyToClipboardButton';
-import useBooleanState from '../hooks/useBooleanState';
-import LookupButton from '../components/renderer/LookupButton';
-import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
-import { formService } from '@oneblink/apps';
-function FormElementBSB({ id, formId, element, value, onChange, validationMessage, displayValidationMessage, }) {
-    const [text, setText] = React.useState(typeof value === 'string' ? value : '');
-    const isValidFormat = /\d{3}-\d{3}/.test(text);
-    const [isDirty, setIsDirty] = useBooleanState(false);
-    const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState({
-        isLoading: false,
-        errorMessage: null,
-        bsbRecord: null,
-    });
-    React.useEffect(() => {
-        if (bsbRecord) {
-            onChange(element, bsbRecord.bsb);
-        }
-    }, [bsbRecord, element, onChange, value]);
-    React.useEffect(() => {
-        if (text === '') {
-            return;
-        }
-        if (!isValidFormat) {
-            setState({
-                isLoading: false,
-                errorMessage: null,
-                bsbRecord: null,
-            });
-            return;
-        }
-        setState({
-            isLoading: true,
-            errorMessage: null,
-            bsbRecord: null,
-        });
-        const abortController = new AbortController();
-        const getBSBRecord = async () => {
-            onChange(element, { isValidating: true, isInvalid: false });
-            try {
-                const bsbRecord = await formService.getBSBRecord(formId, text, abortController.signal);
-                if (!abortController.signal.aborted) {
-                    setState({
-                        isLoading: false,
-                        errorMessage: null,
-                        bsbRecord,
-                    });
-                }
-            }
-            catch (error) {
-                console.warn('Error validating BSB number', error);
-                if (!abortController.signal.aborted) {
-                    onChange(element, { isInvalid: true, isValidating: false });
-                    setState({
-                        isLoading: false,
-                        errorMessage: `The BSB number "${text}" does not exist`,
-                        bsbRecord: null,
-                    });
-                }
-            }
-        };
-        getBSBRecord();
-        return () => {
-            abortController.abort();
-        };
-    }, [formId, isValidFormat, text, onChange, element]);
-    return (React.createElement("div", { className: "cypress-bsb-element" },
-        React.createElement(FormElementLabelContainer, { className: "ob-bsb", id: id, element: element, required: element.required },
-            React.createElement("div", { className: "field has-addons" },
-                React.createElement("div", { className: clsx('control is-expanded', {
-                        'is-loading': isLoading,
-                    }) },
-                    React.createElement(InputMask, { mask: "999-999", 
-                        // @ts-expect-error "react-input-mask" types do not match code
-                        maskChar: "x", type: "text", placeholder: element.placeholderValue, id: id, name: element.name, className: "input ob-input cypress-bsb-control", value: text, onChange: (e) => {
-                            setText(e.target.value);
-                        }, required: element.required, disabled: element.readOnly, onBlur: () => {
-                            if (text === 'xxx-xxx') {
-                                onChange(element, undefined);
-                            }
-                            setIsDirty();
-                        } })),
-                bsbRecord && (React.createElement("div", { className: "control ob-bsb__record-control" },
-                    React.createElement("a", { className: "button is-static ob-bsb__record-button" },
-                        bsbRecord.financialInstitutionMnemonic,
-                        " - ",
-                        bsbRecord.name))),
-                !!element.readOnly && !!value && (React.createElement("div", { className: "control" },
-                    React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
-                React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage })),
-            (((isDirty || displayValidationMessage) &&
-                !!validationMessage &&
-                !isLoading) ||
-                errorMessage) && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
-                React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, errorMessage || validationMessage))))));
-}
-export default React.memo(FormElementBSB);
+import * as React from 'react';
+import InputMask from 'react-input-mask';
+import clsx from 'clsx';
+import CopyToClipboardButton from '../components/renderer/CopyToClipboardButton';
+import useBooleanState from '../hooks/useBooleanState';
+import LookupButton from '../components/renderer/LookupButton';
+import FormElementLabelContainer from '../components/renderer/FormElementLabelContainer';
+import { formService } from '@oneblink/apps';
+function FormElementBSB({ id, formId, element, value, onChange, validationMessage, displayValidationMessage, }) {
+    const [text, setText] = React.useState(typeof value === 'string' ? value : '');
+    const isValidFormat = /\d{3}-\d{3}/.test(text);
+    const [isDirty, setIsDirty] = useBooleanState(false);
+    const [{ isLoading, errorMessage, bsbRecord }, setState] = React.useState({
+        isLoading: false,
+        errorMessage: null,
+        bsbRecord: null,
+    });
+    React.useEffect(() => {
+        if (bsbRecord) {
+            onChange(element, bsbRecord.bsb);
+        }
+    }, [bsbRecord, element, onChange, value]);
+    React.useEffect(() => {
+        if (text === '') {
+            return;
+        }
+        if (!isValidFormat) {
+            setState({
+                isLoading: false,
+                errorMessage: null,
+                bsbRecord: null,
+            });
+            return;
+        }
+        setState({
+            isLoading: true,
+            errorMessage: null,
+            bsbRecord: null,
+        });
+        const abortController = new AbortController();
+        const getBSBRecord = async () => {
+            onChange(element, { isValidating: true, isInvalid: false });
+            try {
+                const bsbRecord = await formService.getBSBRecord(formId, text, abortController.signal);
+                if (!abortController.signal.aborted) {
+                    setState({
+                        isLoading: false,
+                        errorMessage: null,
+                        bsbRecord,
+                    });
+                }
+            }
+            catch (error) {
+                console.warn('Error validating BSB number', error);
+                if (!abortController.signal.aborted) {
+                    onChange(element, { isInvalid: true, isValidating: false });
+                    setState({
+                        isLoading: false,
+                        errorMessage: `The BSB number "${text}" does not exist`,
+                        bsbRecord: null,
+                    });
+                }
+            }
+        };
+        getBSBRecord();
+        return () => {
+            abortController.abort();
+        };
+    }, [formId, isValidFormat, text, onChange, element]);
+    return (React.createElement("div", { className: "cypress-bsb-element" },
+        React.createElement(FormElementLabelContainer, { className: "ob-bsb", id: id, element: element, required: element.required },
+            React.createElement("div", { className: "field has-addons" },
+                React.createElement("div", { className: clsx('control is-expanded', {
+                        'is-loading': isLoading,
+                    }) },
+                    React.createElement(InputMask, { mask: "999-999", 
+                        // @ts-expect-error "react-input-mask" types do not match code
+                        maskChar: "x", type: "text", placeholder: element.placeholderValue, id: id, name: element.name, className: "input ob-input cypress-bsb-control", value: text, onChange: (e) => {
+                            setText(e.target.value);
+                        }, required: element.required, disabled: element.readOnly, onBlur: () => {
+                            if (text === 'xxx-xxx') {
+                                onChange(element, undefined);
+                            }
+                            setIsDirty();
+                        } })),
+                bsbRecord && (React.createElement("div", { className: "control ob-bsb__record-control" },
+                    React.createElement("a", { className: "button is-static ob-bsb__record-button" },
+                        bsbRecord.financialInstitutionMnemonic,
+                        " - ",
+                        bsbRecord.name))),
+                !!element.readOnly && !!value && (React.createElement("div", { className: "control" },
+                    React.createElement(CopyToClipboardButton, { className: "button is-input-addon copy-button cypress-copy-to-clipboard-button", text: text }))),
+                React.createElement(LookupButton, { isInputButton: true, value: value, validationMessage: validationMessage })),
+            (((isDirty || displayValidationMessage) &&
+                !!validationMessage &&
+                !isLoading) ||
+                errorMessage) && (React.createElement("div", { role: "alert", className: "has-margin-top-8" },
+                React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, errorMessage || validationMessage))))));
+}
+export default React.memo(FormElementBSB);
 //# sourceMappingURL=FormElementBSB.js.map

package/dist/form-elements/FormElementBarcodeScanner.d.ts

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import { FormTypes } from '@oneblink/types';
-import { FormElementValueChangeHandler } from '../types/form';
-declare type Props = {
-    id: string;
-    element: FormTypes.BarcodeScannerElement;
-    value: unknown | undefined;
-    onChange: FormElementValueChangeHandler<string>;
-    displayValidationMessage: boolean;
-    validationMessage: string | undefined;
-};
-declare function FormElementBarcodeScanner({ id, element, value, onChange, validationMessage, displayValidationMessage, }: Props): JSX.Element;
-declare const _default: React.MemoExoticComponent<typeof FormElementBarcodeScanner>;
-export default _default;
+import * as React from 'react';
+import { FormTypes } from '@oneblink/types';
+import { FormElementValueChangeHandler } from '../types/form';
+declare type Props = {
+    id: string;
+    element: FormTypes.BarcodeScannerElement;
+    value: unknown | undefined;
+    onChange: FormElementValueChangeHandler<string>;
+    displayValidationMessage: boolean;
+    validationMessage: string | undefined;
+};
+declare function FormElementBarcodeScanner({ id, element, value, onChange, validationMessage, displayValidationMessage, }: Props): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof FormElementBarcodeScanner>;
+export default _default;