@wise/dynamic-flow-client 5.25.2-experimental-a8a898e → 5.25.2

package/build/index.js

@@ -0,0 +1,9 @@
+export { makeHttpClient } from './common/makeHttpClient';
+export { default as translations } from './i18n';
+export { findRendererPropsByType } from './renderers/utils';
+export { useDynamicFlow } from './useDynamicFlow';
+export { useDynamicFlowModal } from './useDynamicFlowModal';
+export { DynamicFlowCore as DynamicFlow } from './DynamicFlowCore';
+export { eventNames } from './domain/features/eventNames';
+export { makeRequestCache } from './domain/features/prefetch/request-cache';
+export { getDynamicSubflowRenderer } from './renderers/subflow/getDynamicSubflowRenderer';

package/build/renderers/CoreContainerRenderer.js

@@ -0,0 +1,5 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+export const CoreContainerRenderer = {
+    canRenderType: 'container',
+    render: ({ children }) => _jsx(_Fragment, { children: children }),
+};

package/build/renderers/CoreRootRenderer.js

@@ -0,0 +1,12 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { findRendererPropsByType } from './utils';
+export const CoreRootRenderer = {
+    canRenderType: 'root',
+    render: ({ children, childrenProps, subflow }) => {
+        if ((subflow === null || subflow === void 0 ? void 0 : subflow.presentation.type) === 'push') {
+            return _jsx(_Fragment, { children: subflow.children });
+        }
+        const [stepProps] = findRendererPropsByType(childrenProps, 'step');
+        return (_jsxs("div", { id: stepProps === null || stepProps === void 0 ? void 0 : stepProps.id, className: "dynamic-flow-step", children: [children, (subflow === null || subflow === void 0 ? void 0 : subflow.presentation.type) === 'modal' ? subflow.children : undefined] }));
+    },
+};

package/build/renderers/EmptyLoadingStateRenderer.js

@@ -0,0 +1,5 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+export const EmptyLoadingStateRenderer = {
+    canRenderType: 'loading-state',
+    render: () => _jsx(_Fragment, {}),
+};

package/build/renderers/getRenderFunction.js

@@ -0,0 +1,24 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+export const getRenderFunction = (renderers) => {
+    function ComponentRenderer(props) {
+        const { type } = props;
+        if (type === 'hidden') {
+            return null;
+        }
+        const renderer = renderers.find(({ canRenderType, canRender = () => true }) => 
+        // once the type is matched, we know the props are of the correct type
+        canRenderType === type && canRender(props));
+        if (!renderer) {
+            throw new Error(`Could not find a renderer for ${type}`);
+        }
+        // if renderer defined, we know props are of the correct type
+        return renderer.render(props);
+    }
+    const render = (props) => {
+        if (!props) {
+            return _jsx(_Fragment, {});
+        }
+        return _jsx(ComponentRenderer, Object.assign({}, props), props.uid);
+    };
+    return render;
+};

package/build/renderers/getSchemaErrorMessageFunction.js

@@ -0,0 +1,111 @@
+import { formatDate } from '@transferwise/formatting';
+import errorMessages from '../common/messages/validation.messages';
+import genericErrorMessages from '../common/messages/generic-error.messages';
+import arrayErrorMessages from '../common/messages/validation.array.messages';
+import fileUploadMessages from '../common/messages/file-upload.messages';
+import multiFileUploadMessages from '../common/messages/multi-file-upload.messages';
+import downloadMessages from '../common/messages/download.messages';
+export function getSchemaErrorMessageFunction(formatMessage, locale) {
+    return (validationMessages) => createErrorMessageFunctions(validationMessages !== null && validationMessages !== void 0 ? validationMessages : {}, formatMessage, locale);
+}
+const createErrorMessageFunctions = (validationMessages, formatMessage, locale) => ({
+    minimum(minimum) {
+        var _a;
+        return ((_a = validationMessages.minimum) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.minimum, {
+            minimum,
+        }));
+    },
+    maximum(maximum) {
+        var _a;
+        return ((_a = validationMessages.maximum) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.maximum, {
+            maximum,
+        }));
+    },
+    minimumDate(minimumDate) {
+        var _a;
+        return ((_a = validationMessages.minimum) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.minimumDate, {
+            minimum: formatDate(new Date(minimumDate), locale, formatDateOptions),
+        }));
+    },
+    maximumDate(maximumDate) {
+        var _a;
+        return ((_a = validationMessages.maximum) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.maximumDate, {
+            maximum: formatDate(new Date(maximumDate), locale, formatDateOptions),
+        }));
+    },
+    invalidDate() {
+        var _a;
+        return (_a = validationMessages.invalidDate) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.patternDate);
+    },
+    minLength(minLength) {
+        var _a;
+        return ((_a = validationMessages.minLength) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.minLength, {
+            minLength,
+        }));
+    },
+    maxLength(maxLength) {
+        var _a;
+        return ((_a = validationMessages.maxLength) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.maxLength, {
+            maxLength,
+        }));
+    },
+    minItems(minItems) {
+        var _a;
+        return ((_a = validationMessages.minItems) !== null && _a !== void 0 ? _a : formatMessage(arrayErrorMessages.minItemsError, {
+            minItems,
+        }));
+    },
+    maxItems(maxItems) {
+        var _a;
+        return ((_a = validationMessages.maxItems) !== null && _a !== void 0 ? _a : formatMessage(arrayErrorMessages.maxItemsError, {
+            maxItems,
+        }));
+    },
+    minFiles(minItems) {
+        var _a;
+        return ((_a = validationMessages.minItems) !== null && _a !== void 0 ? _a : formatMessage(multiFileUploadMessages.minItemsError, {
+            minItems,
+        }));
+    },
+    maxFiles(maxItems) {
+        var _a;
+        return ((_a = validationMessages.maxItems) !== null && _a !== void 0 ? _a : formatMessage(multiFileUploadMessages.maxItemsError, {
+            maxItems,
+        }));
+    },
+    maxSize() {
+        var _a;
+        return (_a = validationMessages.maxSize) !== null && _a !== void 0 ? _a : formatMessage(fileUploadMessages.maxFileSizeError);
+    },
+    accepts() {
+        var _a;
+        return (_a = validationMessages.accepts) !== null && _a !== void 0 ? _a : formatMessage(fileUploadMessages.wrongFileTypeError);
+    },
+    pattern() {
+        var _a;
+        return (_a = validationMessages.pattern) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.pattern);
+    },
+    required() {
+        var _a;
+        return (_a = validationMessages.required) !== null && _a !== void 0 ? _a : formatMessage(errorMessages.required);
+    },
+    genericError() {
+        return formatMessage(genericErrorMessages.genericError);
+    },
+    genericErrorWithRetry() {
+        return formatMessage(genericErrorMessages.genericErrorRetryHint);
+    },
+    downloadStarted() {
+        return formatMessage(downloadMessages.downloadStarted);
+    },
+    downloadFailed() {
+        return formatMessage(downloadMessages.downloadFailed);
+    },
+    downloadSuccessful() {
+        return formatMessage(downloadMessages.downloadSuccessful);
+    },
+});
+const formatDateOptions = {
+    timeZone: 'UTC',
+    dateStyle: 'long',
+};

package/build/renderers/mappers/alertComponentToProps.js

@@ -0,0 +1,3 @@
+import { mapCallToActionOptional } from './utils/mapCallToAction';
+import { pick } from './utils/pick';
+export const alertComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'context', 'control', 'margin', 'markdown', 'media', 'tags', 'title')), { callToAction: mapCallToActionOptional(component.callToAction), onDismiss: component.dismiss, secondaryCallToAction: mapCallToActionOptional(component.secondaryCallToAction) }), rendererMapperProps));

package/build/renderers/mappers/allOfComponentToProps.js

@@ -0,0 +1,6 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const allOfComponentToProps = (component, rendererMapperProps) => {
+    const childrenProps = component.components.map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign(Object.assign(Object.assign({ type: 'form-section' }, pick(component, 'uid', 'analyticsId', 'control', 'description', 'help', 'media', 'tags', 'title')), rendererMapperProps), { children: childrenProps.map(rendererMapperProps.render), childrenProps });
+};

package/build/renderers/mappers/booleanInputComponentToProps.js

@@ -0,0 +1,3 @@
+import { inputComponentToProps } from './utils/inputComponentToProps';
+import { pick } from './utils/pick';
+export const booleanInputComponentToProps = (component, rendererMapperProps) => { var _a; return (Object.assign(Object.assign(Object.assign(Object.assign({}, inputComponentToProps(component, 'input-checkbox')), rendererMapperProps), pick(component, 'additionalText', 'supportingValues', 'inlineAlert')), { onChange: component.setValue, value: (_a = component.value) !== null && _a !== void 0 ? _a : false })); };

package/build/renderers/mappers/boxComponentToProps.js

@@ -0,0 +1,13 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const boxComponentToProps = (component, rendererMapperProps) => {
+    const childrenProps = component.components.map((c) => componentToRendererProps(c, rendererMapperProps));
+    const { border, control } = component;
+    return Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'width', 'margin', 'tags')), rendererMapperProps), { control: mapBoxControl({ border, control }), children: childrenProps.map(rendererMapperProps.render), childrenProps });
+};
+const mapBoxControl = ({ border, control, }) => {
+    if (border && control == null) {
+        return 'bordered';
+    }
+    return control;
+};

package/build/renderers/mappers/buttonComponentToProps.js

@@ -0,0 +1,4 @@
+import { pick } from './utils/pick';
+export const buttonComponentToProps = (component, rendererMapperProps) => {
+    return Object.assign(Object.assign(Object.assign({ type: 'button' }, pick(component, 'uid', 'analyticsId', 'title', 'control', 'context', 'margin', 'media', 'pinOrder', 'size', 'onClick', 'tags')), { disabled: component.disabled || rendererMapperProps.stepLoadingState !== 'idle' }), rendererMapperProps);
+};

package/build/renderers/mappers/collectionComponentToProps.js

@@ -0,0 +1,11 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+import { mapAdditionalInfo, mapCallToActionOptional } from './utils/mapCallToAction';
+export const collectionComponentToProps = (component, rendererMapperProps) => {
+    var _a, _b;
+    var _c, _d, _e;
+    const { render } = rendererMapperProps;
+    const beforeSectionsProps = (_c = (_a = component.state.beforeSections) === null || _a === void 0 ? void 0 : _a.map((child) => componentToRendererProps(child, rendererMapperProps))) !== null && _c !== void 0 ? _c : [];
+    const afterSectionsProps = (_d = (_b = component.state.afterSections) === null || _b === void 0 ? void 0 : _b.map((child) => componentToRendererProps(child, rendererMapperProps))) !== null && _d !== void 0 ? _d : [];
+    return Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'tags')), rendererMapperProps), { status: component.status, state: Object.assign(Object.assign({}, component.state), { filters: (_e = component.state.filters) !== null && _e !== void 0 ? _e : [], sections: component.state.sections.map((section) => (Object.assign(Object.assign({}, section), { callToAction: mapCallToActionOptional(section.callToAction), items: section.items.map((item) => (Object.assign(Object.assign({}, item), { callToAction: mapCallToActionOptional(item.callToAction), additionalInfo: mapAdditionalInfo(item.additionalInfo), disabled: rendererMapperProps.stepLoadingState !== 'idle' || item.disabled }))) }))), beforeSectionsProps, beforeSections: beforeSectionsProps.map(render), afterSectionsProps, afterSections: afterSectionsProps.map(render) }) });
+};

package/build/renderers/mappers/columnsComponentToProps.js

@@ -0,0 +1,8 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const columnsComponentToProps = (component, rendererMapperProps) => {
+    const startChildrenProps = component.startComponents.map((c) => componentToRendererProps(c, rendererMapperProps));
+    const endChildrenProps = component.endComponents.map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign(Object.assign(Object.assign({}, rendererMapperProps), pick(component, 'uid', 'analyticsId', 'type', 'bias', 'control', 'margin', 'tags')), { startChildren: startChildrenProps.map(rendererMapperProps.render), endChildren: endChildrenProps.map(rendererMapperProps.render), startChildrenProps,
+        endChildrenProps });
+};

package/build/renderers/mappers/componentToRendererProps.js

@@ -0,0 +1,165 @@
+import { isHiddenComponent } from '../../utils/type-utils';
+import { alertComponentToProps } from './alertComponentToProps';
+import { allOfComponentToProps } from './allOfComponentToProps';
+import { booleanInputComponentToProps } from './booleanInputComponentToProps';
+import { boxComponentToProps } from './boxComponentToProps';
+import { collectionComponentToProps } from './collectionComponentToProps';
+import { buttonComponentToProps } from './buttonComponentToProps';
+import { columnsComponentToProps } from './columnsComponentToProps';
+import { constComponentToProps } from './constComponentToProps';
+import { containerComponentToProps } from './containerComponentToProps';
+import { dateInputComponentToProps } from './dateInputComponentToProps';
+import { decisionComponentToProps } from './decisionComponentToProps';
+import { dividerComponentToProps } from './dividerComponentToProps';
+import { externalComponentToProps } from './externalComponentToProps';
+import { formattedValueComponentToProps } from './formattedValueComponentToProps';
+import { formComponentToProps } from './formComponentToProps';
+import { headingComponentToProps } from './headingComponentToProps';
+import { hiddenComponentToProps } from './hiddenComponentToProps';
+import { imageComponentToProps } from './imageComponentToProps';
+import { instructionsComponentToProps } from './instructionsComponentToProps';
+import { integerInputComponentToProps } from './integerInputComponentToProps';
+import { listComponentToProps } from './listComponentToProps';
+import { loadingIndicatorComponentToProps } from './loadingIndicatorComponentToProps';
+import { markdownComponentToProps } from './markdownComponentToProps';
+import { mediaComponentToProps } from './mediaComponentToProps';
+import { modalComponentToProps } from './modalComponentToProps';
+import { modalLayoutComponentToProps } from './modalLayoutComponentToProps';
+import { moneyInputComponentToProps } from './moneyInputComponentToProps';
+import { multiSelectInputComponentToProps } from './multiSelectComponentToProps';
+import { multiUploadInputComponentToProps } from './multiUploadInputComponentToProps';
+import { numberInputComponentToProps } from './numberInputComponentToProps';
+import { objectComponentToProps } from './objectComponentToProps';
+import { paragraphComponentToProps } from './paragraphComponentToProps';
+import { persistAsyncComponentToProps } from './persistAsyncComponentToProps';
+import { progressComponentToProps } from './progressComponentToProps';
+import { repeatableComponentToProps } from './repeatableComponentToProps';
+import { reviewComponentToProps } from './reviewComponentToProps';
+import { searchComponentToProps } from './searchComponentToProps';
+import { sectionComponentToProps } from './sectionComponentToProps';
+import { selectInputComponentToProps } from './selectInputComponentToProps';
+import { statusListComponentToProps } from './statusListComponentToProps';
+import { tabsComponentToProps } from './tabsComponentToProps';
+import { textInputComponentToProps } from './textInputComponentToProps';
+import { tupleComponentToProps } from './tupleComponentToProps';
+import { uploadInputComponentToProps } from './uploadInputComponentToProps';
+import { upsellComponentToProps } from './upsellComponentToProps';
+export const componentToRendererProps = (component, mapperProps) => {
+    const trackEventWithLayoutId = ((eventName, properties) => mapperProps.trackEvent(eventName, Object.assign({ layoutId: component.analyticsId }, properties)));
+    const rendererMapperProps = component.kind === 'layout'
+        ? Object.assign(Object.assign({}, mapperProps), { trackEvent: trackEventWithLayoutId }) : mapperProps;
+    if (isHiddenComponent(component)) {
+        // Any component that is hidden is mapped to the same HiddenRendererProps, and won't be rendered
+        return hiddenComponentToProps(component, rendererMapperProps);
+    }
+    const componentProps = getComponentProps(component, rendererMapperProps);
+    const alertProps = getComponentAlertProps(component, rendererMapperProps);
+    if (alertProps) {
+        // A component with an alert is mapped to a container with the alert and the component
+        const childrenProps = [alertProps, componentProps];
+        return Object.assign({ type: 'container', uid: `${component.uid}-wrapper`, children: childrenProps.map(rendererMapperProps.render), childrenProps }, rendererMapperProps);
+    }
+    return componentProps;
+};
+const getComponentProps = (component, rendererMapperProps) => {
+    switch (component.type) {
+        case 'alert':
+            return alertComponentToProps(component, rendererMapperProps);
+        case 'all-of':
+            return allOfComponentToProps(component, rendererMapperProps);
+        case 'boolean':
+            return booleanInputComponentToProps(component, rendererMapperProps);
+        case 'box':
+            return boxComponentToProps(component, rendererMapperProps);
+        case 'button':
+            return buttonComponentToProps(component, rendererMapperProps);
+        case 'collection':
+            return collectionComponentToProps(component, rendererMapperProps);
+        case 'columns':
+            return columnsComponentToProps(component, rendererMapperProps);
+        case 'container':
+            return containerComponentToProps(component, rendererMapperProps);
+        case 'date':
+            return dateInputComponentToProps(component, rendererMapperProps);
+        case 'decision':
+            return decisionComponentToProps(component, rendererMapperProps);
+        case 'divider':
+            return dividerComponentToProps(component, rendererMapperProps);
+        case 'external-confirmation':
+            return externalComponentToProps(component, rendererMapperProps);
+        case 'formatted-value':
+            return formattedValueComponentToProps(component, rendererMapperProps);
+        case 'form':
+            return formComponentToProps(component, rendererMapperProps);
+        case 'heading':
+            return headingComponentToProps(component, rendererMapperProps);
+        case 'const':
+            return constComponentToProps(component, rendererMapperProps);
+        case 'image':
+            return imageComponentToProps(component, rendererMapperProps);
+        case 'instructions':
+            return instructionsComponentToProps(component, rendererMapperProps);
+        case 'integer':
+            return integerInputComponentToProps(component, rendererMapperProps);
+        case 'list':
+            return listComponentToProps(component, rendererMapperProps);
+        case 'loading-indicator':
+            return loadingIndicatorComponentToProps(component, rendererMapperProps);
+        case 'markdown':
+            return markdownComponentToProps(component, rendererMapperProps);
+        case 'media':
+            return mediaComponentToProps(component, rendererMapperProps);
+        case 'modal-layout':
+            return modalLayoutComponentToProps(component, rendererMapperProps);
+        case 'modal':
+            return modalComponentToProps(component, rendererMapperProps);
+        case 'money-input':
+            return moneyInputComponentToProps(component, rendererMapperProps);
+        case 'multi-select':
+            return multiSelectInputComponentToProps(component, rendererMapperProps);
+        case 'multi-upload':
+            return multiUploadInputComponentToProps(component, rendererMapperProps);
+        case 'number':
+            return numberInputComponentToProps(component, rendererMapperProps);
+        case 'object':
+            return objectComponentToProps(component, rendererMapperProps);
+        case 'paragraph':
+            return paragraphComponentToProps(component, rendererMapperProps);
+        case 'progress':
+            return progressComponentToProps(component, rendererMapperProps);
+        case 'repeatable':
+            return repeatableComponentToProps(component, rendererMapperProps);
+        case 'review':
+            return reviewComponentToProps(component, rendererMapperProps);
+        case 'search':
+            return searchComponentToProps(component, rendererMapperProps);
+        case 'section':
+            return sectionComponentToProps(component, rendererMapperProps);
+        case 'select':
+            return selectInputComponentToProps(component, rendererMapperProps);
+        case 'status-list':
+            return statusListComponentToProps(component, rendererMapperProps);
+        case 'tabs':
+            return tabsComponentToProps(component, rendererMapperProps);
+        case 'text':
+            return textInputComponentToProps(component, rendererMapperProps);
+        case 'tuple':
+            return tupleComponentToProps(component, rendererMapperProps);
+        case 'upload':
+            return uploadInputComponentToProps(component, rendererMapperProps);
+        case 'upsell':
+            return upsellComponentToProps(component, rendererMapperProps);
+        case 'persist-async':
+            return persistAsyncComponentToProps(component, rendererMapperProps);
+        case 'root':
+            throw new Error('Root components are only mapped from rootComponentToProps');
+        case 'step':
+            throw new Error('Step components are only mapped from rootComponentToProps');
+        case 'subflow':
+            throw new Error('Subflow components are only mapped from rootComponentToProps');
+        default:
+            throw new Error('Unknown component type');
+    }
+};
+const getComponentAlertProps = (component, rendererMapperProps) => 'alert' in component && component.alert
+    ? Object.assign({ type: 'alert', uid: `${component.uid}-alert`, margin: 'md', context: component.alert.context, markdown: component.alert.content }, rendererMapperProps) : null;

package/build/renderers/mappers/constComponentToProps.js

@@ -0,0 +1,5 @@
+import { componentToRendererProps } from './componentToRendererProps';
+export const constComponentToProps = (component, rendererMapperProps) => {
+    const childrenProps = component.layout.map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign({ type: 'container', uid: `${component.uid}-wrapper`, childrenProps, children: childrenProps.map(rendererMapperProps.render) }, rendererMapperProps);
+};

package/build/renderers/mappers/containerComponentToProps.js

@@ -0,0 +1,8 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const containerComponentToProps = (component, rendererMapperProps) => {
+    const childrenProps = component
+        .getChildren()
+        .map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign(Object.assign(Object.assign({}, pick(component, 'type', 'uid')), { children: childrenProps.map(rendererMapperProps.render), childrenProps }), rendererMapperProps);
+};

package/build/renderers/mappers/dateInputComponentToProps.js

@@ -0,0 +1,3 @@
+import { inputComponentToProps } from './utils/inputComponentToProps';
+import { pick } from './utils/pick';
+export const dateInputComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign(Object.assign({}, inputComponentToProps(component, 'input-date')), rendererMapperProps), pick(component, 'autoComplete', 'minimumDate', 'maximumDate', 'availability', 'suggestions')), { onChange: component.setValue }));

package/build/renderers/mappers/decisionComponentToProps.js

@@ -0,0 +1,16 @@
+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 { pick } from './utils/pick';
+export const decisionComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'title', 'tags')), rendererMapperProps), { options: component.options.map((_a) => {
+        var { disabled } = _a, option = __rest(_a, ["disabled"]);
+        return (Object.assign(Object.assign({}, option), { disabled: disabled || rendererMapperProps.stepLoadingState !== 'idle', getAnchorProps: option.hrefWithTracking }));
+    }) }));

package/build/renderers/mappers/dividerComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const dividerComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'tags')), rendererMapperProps));

package/build/renderers/mappers/externalComponentToProps.js

@@ -0,0 +1,4 @@
+import { pick } from './utils/pick';
+export const externalComponentToProps = (component, rendererMapperProps) => {
+    return Object.assign(Object.assign(Object.assign({ type: 'external-confirmation' }, pick(component, 'uid', 'url', 'open', 'onCancel')), { visible: component.status === 'failure' }), rendererMapperProps);
+};

package/build/renderers/mappers/formComponentToProps.js

@@ -0,0 +1,8 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const formComponentToProps = (component, rendererMapperProps) => {
+    const childrenProps = component
+        .getChildren()
+        .map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'tags')), { children: childrenProps.map(rendererMapperProps.render), childrenProps }), rendererMapperProps);
+};

package/build/renderers/mappers/formattedValueComponentToProps.js

@@ -0,0 +1,5 @@
+import { pick } from './utils/pick';
+import { getValidationState } from './utils/getValidationState';
+export const formattedValueComponentToProps = (component, rendererMapperProps) => {
+    return Object.assign(Object.assign(Object.assign({ type: 'formatted-value' }, pick(component, 'format', 'uid', 'analyticsId', 'control', 'description', 'help', 'media', 'tags', 'title')), { onChange: component.setValue, validationState: getValidationState(component.errors, undefined) }), rendererMapperProps);
+};

package/build/renderers/mappers/headingComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const headingComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'align', 'control', 'margin', 'size', 'tags', 'text')), rendererMapperProps));

package/build/renderers/mappers/hiddenComponentToProps.js

@@ -0,0 +1 @@
+export const hiddenComponentToProps = ({ uid }, rendererMapperProps) => (Object.assign(Object.assign({}, rendererMapperProps), { uid, type: 'hidden' }));

package/build/renderers/mappers/imageComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const imageComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'align', 'control', 'margin', 'size', 'tags')), rendererMapperProps), { uri: component.content.uri, accessibilityDescription: component.content.accessibilityDescription }));

package/build/renderers/mappers/instructionsComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const instructionsComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'items', 'margin', 'title', 'tags')), rendererMapperProps));

package/build/renderers/mappers/integerInputComponentToProps.js

@@ -0,0 +1,3 @@
+import { inputComponentToProps } from './utils/inputComponentToProps';
+import { pick } from './utils/pick';
+export const integerInputComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign(Object.assign({}, inputComponentToProps(component, 'input-integer')), rendererMapperProps), pick(component, 'autoComplete', 'maximum', 'minimum')), { onChange: component.setValue }));

package/build/renderers/mappers/listComponentToProps.js

@@ -0,0 +1,3 @@
+import { mapAdditionalInfo, mapCallToActionOptional } from './utils/mapCallToAction';
+import { pick } from './utils/pick';
+export const listComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'title', 'tags')), { callToAction: mapCallToActionOptional(component.callToAction), items: component.items.map((item) => (Object.assign(Object.assign({}, item), { callToAction: mapCallToActionOptional(item.callToAction), additionalInfo: mapAdditionalInfo(item.additionalInfo) }))) }), rendererMapperProps));

package/build/renderers/mappers/loadingIndicatorComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const loadingIndicatorComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'size', 'tags')), rendererMapperProps));

package/build/renderers/mappers/markdownComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const markdownComponentToProps = (control, rendererMapperProps) => (Object.assign(Object.assign({}, pick(control, 'uid', 'analyticsId', 'type', 'align', 'margin', 'content', 'control', 'tags', 'size')), rendererMapperProps));

package/build/renderers/mappers/mediaComponentToProps.js

@@ -0,0 +1,2 @@
+import { pick } from './utils/pick';
+export const mediaComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'align', 'control', 'margin', 'media', 'size', 'tags')), rendererMapperProps));

package/build/renderers/mappers/modalComponentToProps.js

@@ -0,0 +1,8 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const modalComponentToProps = (component, rendererMapperProps) => {
+    const childrenProps = component
+        .getChildren()
+        .map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'open', 'tags', 'title')), { children: childrenProps.map(rendererMapperProps.render), childrenProps, onClose: component.close }), rendererMapperProps);
+};

package/build/renderers/mappers/modalLayoutComponentToProps.js

@@ -0,0 +1,13 @@
+import { componentToRendererProps } from './componentToRendererProps';
+import { pick } from './utils/pick';
+export const modalLayoutComponentToProps = (component, rendererMapperProps) => {
+    const { content } = component;
+    const childrenProps = component
+        .getChildren()
+        .map((c) => componentToRendererProps(c, rendererMapperProps));
+    return Object.assign(Object.assign(Object.assign({}, pick(component, 'uid', 'analyticsId', 'type', 'control', 'margin', 'tags', 'trigger')), { content: {
+            children: childrenProps.map(rendererMapperProps.render),
+            childrenProps,
+            title: content.title,
+        } }), rendererMapperProps);
+};

package/build/renderers/mappers/moneyInputComponentToProps.js

@@ -0,0 +1,36 @@
+import { getValidationState } from './utils/getValidationState';
+import { inputComponentToProps } from './utils/inputComponentToProps';
+export const moneyInputComponentToProps = (component, rendererMapperProps) => {
+    const { components, errors, validationAsyncState } = component;
+    const amountComponent = components.amount;
+    const currencyComponent = components.currency;
+    const validationState = pickValidationState([
+        getValidationState(amountComponent.errors, amountComponent.validationAsyncState),
+        getValidationState(currencyComponent.errors, currencyComponent.validationAsyncState),
+        getValidationState(errors, validationAsyncState),
+    ]);
+    const currencies = currencyComponent.options.map(({ analyticsId, title, description, media, keywords, tags }, i) => ({
+        currencyCode: currencyComponent.children[i].getLocalValue(),
+        analyticsId,
+        title,
+        description,
+        media,
+        keywords,
+        tags,
+    }));
+    return Object.assign(Object.assign(Object.assign({}, inputComponentToProps(component, 'money-input')), { amountValue: amountComponent.getLocalValue(), selectedCurrencyIndex: currencyComponent.selectedIndex, onAmountChange: amountComponent.setValue, onCurrencyChange: currencyComponent.selectIndex, placeholder: amountComponent.placeholder, currencies,
+        validationState }), rendererMapperProps);
+};
+// Picks the most relevant validation state from a list of validation states
+const pickValidationState = (states) => {
+    const definedStates = states.filter((state) => state !== undefined);
+    if (definedStates.length === 0) {
+        return undefined;
+    }
+    // if there are any invalid states, return the first one
+    if (definedStates.some((state) => state.status === 'invalid')) {
+        return definedStates.find((state) => state.status === 'invalid');
+    }
+    // otherwise, return the first valid state
+    return definedStates[0];
+};

package/build/renderers/mappers/multiSelectComponentToProps.js

@@ -0,0 +1,19 @@
+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 { inputComponentToProps } from './utils/inputComponentToProps';
+import { pick } from './utils/pick';
+import { selectInputOptionsToProps } from './utils/selectInputOptionsToProps';
+export const multiSelectInputComponentToProps = (component, rendererMapperProps) => {
+    const _a = inputComponentToProps(component, 'input-multi-select'), { required, value } = _a, props = __rest(_a, ["required", "value"]);
+    const options = selectInputOptionsToProps(component.options, component.getChildren(), rendererMapperProps);
+    return Object.assign(Object.assign(Object.assign(Object.assign({}, props), rendererMapperProps), pick(component, 'autoComplete', 'maxItems', 'minItems', 'selectedIndices')), { onSelect: component.selectIndices, options });
+};

package/build/renderers/mappers/multiUploadInputComponentToProps.js

@@ -0,0 +1,7 @@
+import { inputComponentToProps } from './utils/inputComponentToProps';
+import { mapErrorsToValidationState } from './utils/mapErrorsToValidationState';
+import { pick } from './utils/pick';
+export const multiUploadInputComponentToProps = (component, rendererMapperProps) => {
+    const { files } = component;
+    return Object.assign(Object.assign(Object.assign(Object.assign({}, inputComponentToProps(component, 'input-upload-multi')), rendererMapperProps), pick(component, 'accepts', 'cameraConfig', 'maxSize', 'minItems', 'maxItems', 'source', 'uploadLabel')), { value: files.map((file) => (Object.assign(Object.assign({}, file), { validationState: mapErrorsToValidationState(file.errors) }))), onInsertFile: component.insertFile, onRemoveFile: component.removeFile });
+};

package/build/renderers/mappers/numberInputComponentToProps.js

@@ -0,0 +1,3 @@
+import { inputComponentToProps } from './utils/inputComponentToProps';
+import { pick } from './utils/pick';
+export const numberInputComponentToProps = (component, rendererMapperProps) => (Object.assign(Object.assign(Object.assign(Object.assign({}, inputComponentToProps(component, 'input-number')), rendererMapperProps), pick(component, 'maximum', 'minimum')), { onChange: component.setValue }));