@wise/dynamic-flow-client 5.12.0 → 5.12.1

package/build/controller/getResponseType.js

@@ -0,0 +1,35 @@
+import { isObject } from '../utils/type-validators';
+const responseTypes = ['step', 'action', 'exit', 'modal', 'subflow', 'no-op'];
+/**
+ * Returns either 'step', 'action', 'exit', 'modal', 'subflow', or 'no-op' based on the response headers and body.
+ * This function takes a response body parameter because, for legacy reasons, we still need to consider the body
+ * to determine the response type, in cases where the response headers are not set.
+ * Ideally it should just be a matter of checking the "X-Df-Response-Type" response header.
+ */
+export const getResponseType = (headers, body) => {
+    const headerResponseType = getResponseTypeFromHeader(headers);
+    if (headerResponseType) {
+        return headerResponseType;
+    }
+    if (isObject(body) && body.action) {
+        // TODO: use Zod to validate the action object
+        return 'action';
+    }
+    return 'step';
+};
+export const getResponseTypeFromHeader = (headers) => {
+    if (headers === null || headers === void 0 ? void 0 : headers.has('X-Df-Response-Type')) {
+        const type = headers.get('X-Df-Response-Type');
+        assertDFResponseType(type);
+        return type;
+    }
+    if (headers === null || headers === void 0 ? void 0 : headers.has('X-Df-Exit')) {
+        return 'exit';
+    }
+    return undefined;
+};
+function assertDFResponseType(type) {
+    if (!responseTypes.includes(type)) {
+        throw new Error("Unsupported X-Df-Response-Type. Allowed values are 'step', 'action', 'exit', 'modal', 'subflow', 'no-op'.");
+    }
+}

package/build/controller/getSafeHttpClient.js

@@ -0,0 +1,8 @@
+export const getSafeHttpClient = (httpClient) => async (input, init) => {
+    try {
+        return await httpClient(input, init);
+    }
+    catch (_a) {
+        return null;
+    }
+};

package/build/controller/getStepCounter.js

@@ -0,0 +1,16 @@
+/**
+ * To ensure there are no uid collisions between consecutive steps, we use a
+ * counter that is appended to the step id. This means that even steps with the
+ * same structure and ids will not have the same component uids.
+ */
+export const getStepCounter = () => {
+    let count = 0;
+    return {
+        increment() {
+            count = (count + 1) % 100;
+        },
+        get current() {
+            return count;
+        },
+    };
+};

package/build/controller/handleErrorResponse.js

@@ -0,0 +1,26 @@
+import { parseResponseBodyAsJsonElement, isErrorResponseBody, parseResponseBodyAsText, } from './response-utils';
+export const handleErrorResponse = async (response, actionId, trackEvent) => {
+    const body = await parseResponseBodyAsJsonElement(response.clone());
+    if (isErrorResponseBody(body)) {
+        const refreshUrl = body.refreshUrl || body.refreshFormUrl;
+        const { error, validation, analytics } = body;
+        trackEvent('Action Failed', Object.assign(Object.assign({}, analytics), { actionId, statusCode: response.status }));
+        const errors = { error, validation };
+        return refreshUrl
+            ? { type: 'refresh', body: { refreshUrl, errors } }
+            : {
+                type: 'error',
+                body: { errors, analytics },
+                httpError: { statusCode: response.status },
+            };
+    }
+    trackEvent('Action Failed', { actionId, statusCode: response.status });
+    const errorMessage = await parseResponseBodyAsText(response);
+    return {
+        type: 'error',
+        httpError: {
+            message: errorMessage || undefined,
+            statusCode: response.status,
+        },
+    };
+};

package/build/controller/makeSafeHttpClient.js

@@ -0,0 +1,8 @@
+export const makeSafeHttpClient = (httpClient) => async (...props) => {
+    try {
+        return await httpClient(...props);
+    }
+    catch (_a) {
+        return null;
+    }
+};

package/build/controller/response-utils.js

@@ -0,0 +1,72 @@
+import { validateActionResponse, validateSubflowResponse } from '@wise/dynamic-flow-types/spec';
+import { isArray, isObject } from '../utils/type-validators';
+export const parseResponseBodyAsJsonElement = async (response) => {
+    assertResponseIsValid(response);
+    try {
+        return (await response.json());
+    }
+    catch (_a) {
+        return null;
+    }
+};
+export const parseResponseBodyAsText = async (response) => {
+    try {
+        return await response.text();
+    }
+    catch (_a) {
+        return null;
+    }
+};
+export function isActionResponseBody(body) {
+    return validateActionResponse(body).valid;
+}
+export function assertActionResponseBody(body) {
+    // TODO: use zod to validate the action object instead of this
+    if (!isObject(body) || !isObject(body.action)) {
+        throw new Error('Incorrect response body in action response. Expected an object satisfying the type { action: Action }.');
+    }
+}
+// TODO make this a modal response body type
+export function assertModalResponseBody(body) {
+    if (isObject(body)) {
+        if ('content' in body && isArray(body.content)) {
+            return;
+        }
+    }
+    throw new Error('Incorrect response body in modal response. Expected an object satisfying the type { title?: string, components: Layout[] }.');
+}
+export function assertSubflowResponseBody(body) {
+    const { valid } = validateSubflowResponse(body);
+    if (valid) {
+        return;
+    }
+    throw new Error('Incorrect response body in subflow response.');
+}
+export function isErrorResponseBody(body) {
+    return Boolean(isObject(body) &&
+        (body.refreshFormUrl || body.refreshUrl || body.validation || body.error || body.analytics));
+}
+export function assertErrorResponseBody(body) {
+    // TODO: use zod to validate the error object instead of this
+    if (!isErrorResponseBody(body)) {
+        throw new Error('Incorrect error response body in error response. Expected an object with either `refreshUrl`, `validation` or `error` properties.');
+    }
+}
+export function assertStepResponseBody(body) {
+    // TODO: use zod to validate the error object instead of this
+    if (!isObject(body)) {
+        throw new Error('Incorrect response body in step response. Expected an object.');
+    }
+}
+const assertResponseIsValid = (response) => {
+    if (!isResponse(response)) {
+        throw new Error('Incorrect type of response from fetch. Expected object of type Response.');
+    }
+    if (response.bodyUsed) {
+        throw new Error('The body of the provided Response object has already been used. Every request must respond with a new Response object.');
+    }
+};
+const isResponse = (response) => typeof response === 'object' &&
+    response !== null &&
+    'clone' in response &&
+    'bodyUsed' in response;

package/build/domain/components/AlertComponent.js

@@ -0,0 +1 @@
+export const createAlertComponent = (alertProps) => (Object.assign({ type: 'alert', kind: 'layout' }, alertProps));

package/build/domain/components/AllOfComponent.js

@@ -0,0 +1,40 @@
+import { getLocalValues, getSubmittableData, getSubmittableDataSync, } from '../../utils/component-utils';
+import { summariseFromChildren } from '../features/summary/summary-utils';
+import { validateComponents } from '../features/validation/validation-functions';
+export const createAllOfComponent = (allOfProps) => {
+    const { uid, schemaId, analyticsId, alert, components, control, description, help, hidden, media, title, tags, } = allOfProps;
+    return {
+        type: 'all-of',
+        kind: 'input',
+        uid,
+        schemaId,
+        analyticsId,
+        alert,
+        components,
+        control,
+        description,
+        help,
+        hidden,
+        media,
+        title,
+        tags,
+        getChildren() {
+            return this.components;
+        },
+        getSummary() {
+            return summariseFromChildren(this.getChildren());
+        },
+        async getSubmittableValue() {
+            return getSubmittableData(this.components);
+        },
+        getSubmittableValueSync() {
+            return getSubmittableDataSync(this.components);
+        },
+        getLocalValue() {
+            return getLocalValues(this.components);
+        },
+        validate() {
+            return hidden ? true : validateComponents(this.getChildren());
+        },
+    };
+};

package/build/domain/components/BooleanInputComponent.js

@@ -0,0 +1,50 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { getComponentValidationAsync } from '../features/validationAsync/getComponentValidationAsync';
+import { getInputUpdateFunction } from './utils/component-utils';
+export const createBooleanInputComponent = (booleanInputProps, onComponentUpdate) => {
+    const { uid, id, value, schemaOnChange, performValidationAsync, onValueChange, onPersistAsync, summariser } = booleanInputProps, rest = __rest(booleanInputProps, ["uid", "id", "value", "schemaOnChange", "performValidationAsync", "onValueChange", "onPersistAsync", "summariser"]);
+    const update = getInputUpdateFunction(onComponentUpdate);
+    const validateAsync = performValidationAsync
+        ? getComponentValidationAsync(update, performValidationAsync)
+        : undefined;
+    const booleanComponent = Object.assign({ type: 'boolean', kind: 'input', uid,
+        id, autoComplete: '', value,
+        _update(updateFn) {
+            update(this, updateFn);
+        },
+        onBlur() { }, // Noop
+        onFocus() { }, // Noop
+        onChange(updatedValue) {
+            this._update((draft) => {
+                draft.errors = [];
+                draft.value = updatedValue;
+            });
+            void (schemaOnChange === null || schemaOnChange === void 0 ? void 0 : schemaOnChange());
+            void (onPersistAsync === null || onPersistAsync === void 0 ? void 0 : onPersistAsync().catch(() => { }));
+            validateAsync === null || validateAsync === void 0 ? void 0 : validateAsync(this, this.getLocalValue()).catch(() => { }); // Noop
+            onValueChange();
+        },
+        async getSubmittableValue() {
+            return this.getSubmittableValueSync();
+        },
+        getSubmittableValueSync() {
+            return this.getLocalValue();
+        },
+        getSummary() {
+            return summariser(this.getLocalValue());
+        },
+        getLocalValue() {
+            return this.value;
+        }, validate: () => true }, rest);
+    return booleanComponent;
+};

package/build/domain/components/BoxComponent.js

@@ -0,0 +1,3 @@
+export const createBoxComponent = (boxProps) => (Object.assign(Object.assign({}, boxProps), { type: 'box', kind: 'layout', getChildren() {
+        return this.components;
+    } }));

package/build/domain/components/ButtonComponent.js

@@ -0,0 +1 @@
+export const createButtonComponent = (buttonProps) => (Object.assign({ type: 'button', kind: 'layout' }, buttonProps));

package/build/domain/components/ColumnsComponent.js

@@ -0,0 +1,3 @@
+export const createColumnsComponent = (columnsProps) => (Object.assign(Object.assign({}, columnsProps), { type: 'columns', kind: 'layout', getChildren() {
+        return [...this.startComponents, ...this.endComponents];
+    } }));

package/build/domain/components/ConstComponent.js

@@ -0,0 +1,18 @@
+export const createConstComponent = (hiddenProps) => {
+    const { uid, schemaId, analyticsId, value, summary, layout, hidden, tags } = hiddenProps;
+    return {
+        type: 'const',
+        kind: 'input',
+        uid,
+        schemaId,
+        analyticsId,
+        layout,
+        hidden,
+        tags,
+        getLocalValue: () => value,
+        getSubmittableValue: async () => value,
+        getSubmittableValueSync: () => value,
+        getSummary: () => summary,
+        validate: () => true,
+    };
+};

package/build/domain/components/ContainerComponent.js

@@ -0,0 +1,3 @@
+export const createContainerComponent = (containerProps) => (Object.assign(Object.assign({}, containerProps), { type: 'container', kind: 'layout', getChildren() {
+        return this.components;
+    } }));

package/build/domain/components/DateInputComponent.js

@@ -0,0 +1,75 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { isValidDate } from '../../utils/type-validators';
+import { getLocalValueValidator } from '../features/validation/validation-functions';
+import { getComponentValidationAsync } from '../features/validationAsync/getComponentValidationAsync';
+import { getInputUpdateFunction } from './utils/component-utils';
+import { isOrWasValid } from './utils/isOrWasValid';
+export const createDateInputComponent = (textInputProps, onComponentUpdate) => {
+    const { uid, id, checks, schemaOnChange, performValidationAsync, onValueChange, onPersistAsync, summariser, value } = textInputProps, rest = __rest(textInputProps, ["uid", "id", "checks", "schemaOnChange", "performValidationAsync", "onValueChange", "onPersistAsync", "summariser", "value"]);
+    const update = getInputUpdateFunction(onComponentUpdate);
+    const getValidationErrors = getLocalValueValidator(checks);
+    const validateAsync = performValidationAsync
+        ? getComponentValidationAsync(update, performValidationAsync)
+        : undefined;
+    const dateInputComponent = Object.assign({ type: 'date', kind: 'input', uid,
+        id,
+        value,
+        _update(updateFn) {
+            update(this, updateFn);
+        },
+        onBlur() {
+            const isValid = this.validate();
+            if (isValid) {
+                validateAsync === null || validateAsync === void 0 ? void 0 : validateAsync(this, this.getLocalValue()).catch(() => { }); // Noop
+            }
+        },
+        onFocus() { }, // Noop
+        onChange(updatedValue) {
+            const prevValue = this.value;
+            this._update((draft) => {
+                draft.errors = [];
+                draft.validationAsyncState.messages = {};
+                draft.value = updatedValue;
+            });
+            if (isOrWasValid(getValidationErrors, prevValue, updatedValue)) {
+                void (schemaOnChange === null || schemaOnChange === void 0 ? void 0 : schemaOnChange());
+            }
+            onValueChange();
+            if (getValidationErrors(updatedValue).length === 0) {
+                void (onPersistAsync === null || onPersistAsync === void 0 ? void 0 : onPersistAsync().catch(() => { }));
+            }
+        },
+        async getSubmittableValue() {
+            return this.getSubmittableValueSync();
+        },
+        getSubmittableValueSync() {
+            if (isValidDate(this.getLocalValue())) {
+                return this.getLocalValue();
+            }
+            return null;
+        },
+        getSummary() {
+            return summariser(this.getLocalValue());
+        },
+        getLocalValue() {
+            return this.value;
+        },
+        validate() {
+            const errors = getValidationErrors(this.getLocalValue());
+            this._update((draft) => {
+                draft.errors = errors;
+            });
+            return errors.length === 0;
+        } }, rest);
+    return dateInputComponent;
+};

package/build/domain/components/DecisionComponent.js

@@ -0,0 +1 @@
+export const createDecisionComponent = (decisionProps) => (Object.assign({ type: 'decision', kind: 'layout' }, decisionProps));

package/build/domain/components/DividerComponent.js

@@ -0,0 +1 @@
+export const createDividerComponent = (props) => (Object.assign({ type: 'divider', kind: 'layout' }, props));

package/build/domain/components/FormComponent.js

@@ -0,0 +1,3 @@
+export const createFormComponent = (formProps) => (Object.assign(Object.assign({}, formProps), { type: 'form', kind: 'layout', getChildren() {
+        return [this.schemaComponent];
+    } }));

package/build/domain/components/FormattedValueComponent.js

@@ -0,0 +1,44 @@
+import { getInputUpdateFunction } from './utils/component-utils';
+export const createFormattedValueComponent = (props, onComponentUpdate) => {
+    const { uid, schemaId, analyticsId, alert, control, description, errors, format, help, hidden, media, summariser, title, tags, value, schemaOnChange, } = props;
+    const update = getInputUpdateFunction(onComponentUpdate);
+    return {
+        type: 'formatted-value',
+        kind: 'input',
+        uid,
+        schemaId,
+        analyticsId,
+        alert,
+        control,
+        description,
+        errors,
+        format,
+        help,
+        hidden,
+        media,
+        title,
+        tags,
+        value,
+        async getSubmittableValue() {
+            return this.getSubmittableValueSync();
+        },
+        getSubmittableValueSync() {
+            return this.getLocalValue();
+        },
+        getSummary() {
+            return summariser(this.getLocalValue());
+        },
+        getLocalValue() {
+            return this.value;
+        },
+        validate() {
+            return true;
+        },
+        onChange(newValue) {
+            update(this, (draft) => {
+                draft.value = newValue;
+            });
+            void (schemaOnChange === null || schemaOnChange === void 0 ? void 0 : schemaOnChange());
+        },
+    };
+};

package/build/domain/components/HeadingComponent.js

@@ -0,0 +1 @@
+export const createHeadingComponent = (headingProps) => (Object.assign({ type: 'heading', kind: 'layout' }, headingProps));

package/build/domain/components/ImageComponent.js

@@ -0,0 +1 @@
+export const createImageComponent = (imageProps) => (Object.assign({ type: 'image', kind: 'layout' }, imageProps));

package/build/domain/components/InstructionsComponent.js

@@ -0,0 +1 @@
+export const createInstructionsComponent = (instructionsProps) => (Object.assign({ type: 'instructions', kind: 'layout' }, instructionsProps));

package/build/domain/components/IntegerInputComponent.js

@@ -0,0 +1,74 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { getDebouncedSchemaOnChange } from '../features/schema-on-change/getDebouncedSchemaOnChange';
+import { getLocalValueValidator } from '../features/validation/validation-functions';
+import { getDebouncedComponentValidationAsync } from '../features/validationAsync/getComponentValidationAsync';
+import { getInputUpdateFunction } from './utils/component-utils';
+export const createIntegerInputComponent = (integerInputProps, onComponentUpdate) => {
+    const { uid, id, checks, value, schemaOnChange, performValidationAsync, onValueChange, onPersistAsync, summariser } = integerInputProps, rest = __rest(integerInputProps, ["uid", "id", "checks", "value", "schemaOnChange", "performValidationAsync", "onValueChange", "onPersistAsync", "summariser"]);
+    const update = getInputUpdateFunction(onComponentUpdate);
+    const getValidationErrors = getLocalValueValidator(checks);
+    const performOnChange = getDebouncedSchemaOnChange(schemaOnChange, getValidationErrors);
+    const validateAsync = performValidationAsync
+        ? getDebouncedComponentValidationAsync(update, performValidationAsync)
+        : undefined;
+    const integerComponent = Object.assign({ type: 'integer', kind: 'input', uid,
+        id,
+        value,
+        _update(updateFn) {
+            update(this, updateFn);
+        },
+        onBlur() {
+            const isValid = this.validate();
+            performOnChange === null || performOnChange === void 0 ? void 0 : performOnChange.flush();
+            if (isValid) {
+                void (onPersistAsync === null || onPersistAsync === void 0 ? void 0 : onPersistAsync().catch(() => { }));
+                validateAsync === null || validateAsync === void 0 ? void 0 : validateAsync.flush();
+            }
+        },
+        onFocus() { }, // Noop
+        onChange(updatedValue) {
+            const prevValue = this.value;
+            this._update((draft) => {
+                draft.errors = [];
+                draft.validationAsyncState.messages = {};
+                draft.value = updatedValue;
+            });
+            performOnChange === null || performOnChange === void 0 ? void 0 : performOnChange(prevValue, updatedValue);
+            const isValid = getValidationErrors(updatedValue).length === 0;
+            if (isValid) {
+                validateAsync === null || validateAsync === void 0 ? void 0 : validateAsync(this, updatedValue);
+            }
+            onValueChange();
+        },
+        async getSubmittableValue() {
+            return this.getSubmittableValueSync();
+        },
+        getSubmittableValueSync() {
+            var _a;
+            return (_a = this.getLocalValue()) !== null && _a !== void 0 ? _a : null;
+        },
+        getSummary() {
+            return summariser(this.getLocalValue());
+        },
+        getLocalValue() {
+            return this.value;
+        },
+        validate() {
+            const errors = getValidationErrors(this.getLocalValue());
+            this._update((draft) => {
+                draft.errors = errors;
+            });
+            return errors.length === 0;
+        } }, rest);
+    return integerComponent;
+};

package/build/domain/components/ListComponent.js

@@ -0,0 +1 @@
+export const createListComponent = (listProps) => (Object.assign({ type: 'list', kind: 'layout' }, listProps));

package/build/domain/components/LoadingIndicatorComponent.js

@@ -0,0 +1 @@
+export const createLoadingIndicatorComponent = (loadingIndicatorProps) => (Object.assign({ type: 'loading-indicator', kind: 'layout' }, loadingIndicatorProps));

package/build/domain/components/MarkdownComponent.js

@@ -0,0 +1 @@
+export const createMarkdownComponent = (markdownProps) => (Object.assign({ type: 'markdown', kind: 'layout' }, markdownProps));

package/build/domain/components/MediaComponent.js

@@ -0,0 +1 @@
+export const createMediaComponent = (props) => (Object.assign({ type: 'media', kind: 'layout' }, props));

package/build/domain/components/ModalComponent.js

@@ -0,0 +1,16 @@
+import { getInputUpdateFunction } from './utils/component-utils';
+export const createModalContentComponent = (modalProps, onComponentUpdate) => {
+    const update = getInputUpdateFunction(onComponentUpdate);
+    const modalContentComponent = Object.assign(Object.assign({ type: 'modal', kind: 'layout', open: true }, modalProps), { _update(updateFn) {
+            update(this, updateFn);
+        },
+        getChildren() {
+            return this.components;
+        },
+        close() {
+            update(this, (draft) => {
+                draft.open = false;
+            });
+        } });
+    return modalContentComponent;
+};

package/build/domain/components/ModalLayoutComponent.js

@@ -0,0 +1,3 @@
+export const createModalComponent = (modalProps) => (Object.assign(Object.assign({ type: 'modal-layout', kind: 'layout' }, modalProps), { getChildren() {
+        return this.content.components;
+    } }));

package/build/domain/components/MoneyInputComponent.js

@@ -0,0 +1,57 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { getLocalValueValidator } from '../features/validation/validation-functions';
+import { getInputUpdateFunction } from './utils/component-utils';
+export const createMoneyInputComponent = (moneyInputProps, onComponentUpdate) => {
+    const { id, uid, schemaId, analyticsId, amountKey, amountComponent, currencyKey, currencyComponent, control, description, help, hidden, media, summariser, title, tags, extraValues, checks } = moneyInputProps, rest = __rest(moneyInputProps, ["id", "uid", "schemaId", "analyticsId", "amountKey", "amountComponent", "currencyKey", "currencyComponent", "control", "description", "help", "hidden", "media", "summariser", "title", "tags", "extraValues", "checks"]);
+    const getValidationErrors = getLocalValueValidator(checks);
+    const update = getInputUpdateFunction(onComponentUpdate);
+    const moneyComponent = Object.assign({ type: 'money-input', kind: 'input', id,
+        uid,
+        schemaId,
+        analyticsId, autoComplete: 'off', control,
+        description,
+        help,
+        hidden,
+        media,
+        title,
+        tags, value: {
+            [amountKey]: amountComponent.getLocalValue(),
+            [currencyKey]: currencyComponent.getLocalValue(),
+        }, _update(updateFn) {
+            update(this, updateFn);
+        }, components: {
+            amount: amountComponent,
+            currency: currencyComponent,
+        }, async getSubmittableValue() {
+            return Object.assign({ [amountKey]: await amountComponent.getSubmittableValue(), [currencyKey]: await currencyComponent.getSubmittableValue() }, extraValues);
+        },
+        getSubmittableValueSync() {
+            return Object.assign({ [amountKey]: amountComponent.getSubmittableValueSync(), [currencyKey]: currencyComponent.getSubmittableValueSync() }, extraValues);
+        },
+        getLocalValue() {
+            return Object.assign({ [amountKey]: amountComponent.getLocalValue(), [currencyKey]: currencyComponent.getLocalValue() }, extraValues);
+        },
+        getSummary() {
+            return summariser(this.getLocalValue());
+        },
+        validate() {
+            const errors = getValidationErrors(amountComponent.getLocalValue());
+            this._update((draft) => {
+                draft.errors = errors;
+            });
+            return amountComponent.validate() && currencyComponent.validate() && errors.length === 0;
+        },
+        onBlur() { }, // noop
+        onFocus() { } }, rest);
+    return moneyComponent;
+};