@wise/dynamic-flow-client 5.8.1 → 5.9.0

package/build/domain/mappers/layout/sectionLayoutToComponent.js

@@ -0,0 +1,15 @@
+import { createSectionComponent } from '../../components/SectionComponent';
+import { mapLayoutToComponent } from '../mapLayoutToComponent';
+import { getDomainLayerCallToAction } from '../utils/call-to-action-utils';
+export const sectionLayoutToComponent = (uid, { analyticsId, control, title, components, callToAction, margin, tags }, mapperProps, schemaComponents) => {
+    return createSectionComponent({
+        uid,
+        analyticsId,
+        control,
+        title,
+        components: components.map((component, index) => mapLayoutToComponent(`${uid}.section-${index}`, component, mapperProps, schemaComponents)),
+        margin: margin !== null && margin !== void 0 ? margin : 'md',
+        callToAction: getDomainLayerCallToAction(callToAction, mapperProps),
+        tags,
+    });
+};

package/build/domain/mappers/layout/statusListLayoutToComponent.js

@@ -0,0 +1,15 @@
+import { createStatusListComponent } from '../../components/StatusListComponent';
+import { getDomainLayerCallToAction } from '../utils/call-to-action-utils';
+import { mapTags } from '../utils/tags-utils';
+export const statusListLayoutToComponent = (uid, { analyticsId, control, items, margin, tags, title }, mapperProps) => createStatusListComponent({
+    uid,
+    analyticsId,
+    control,
+    items: items.map((item) => {
+        const callToAction = getDomainLayerCallToAction(item.callToAction, mapperProps);
+        return Object.assign(Object.assign({}, item), { callToAction, tags: mapTags(item) });
+    }),
+    margin: margin !== null && margin !== void 0 ? margin : 'md',
+    tags,
+    title,
+});

package/build/domain/mappers/layout/tabsLayoutToComponent.js

@@ -0,0 +1,16 @@
+import { createTabsComponent } from '../../components/TabsComponent';
+import { mapLayoutToComponent } from '../mapLayoutToComponent';
+import { mapTags } from '../utils/tags-utils';
+export const tabsLayoutToComponent = (uid, { analyticsId, control, margin, tags, tabs }, mapperProps, schemaComponents) => createTabsComponent({
+    uid,
+    analyticsId,
+    control,
+    margin: margin !== null && margin !== void 0 ? margin : 'md',
+    tags,
+    tabs: mapTabs(tabs, uid, mapperProps, schemaComponents),
+});
+const mapTabs = (tabs, uid, mapperProps, schemaComponents) => tabs.map(({ components, tag, tags, title }, tabIndex) => ({
+    title,
+    tags: mapTags({ tag, tags }),
+    components: components.map((c, componentIndex) => mapLayoutToComponent(`${uid}.tabs-${tabIndex}-${componentIndex}`, c, mapperProps, schemaComponents)),
+}));

package/build/domain/mappers/layout/upsellLayoutToComponent.js

@@ -0,0 +1,25 @@
+import { createUpsellComponent } from '../../components/UpsellComponent';
+import { getDomainLayerCallToAction } from '../utils/call-to-action-utils';
+import { getDomainLayerMedia } from '../utils/media-utils';
+export const upsellLayoutToComponent = (uid, { analyticsId, callToAction, control, margin, media, onDismiss, tags, text }, mapperProps) => {
+    const { onComponentUpdate } = mapperProps;
+    return createUpsellComponent({
+        uid,
+        analyticsId,
+        callToAction: getDomainLayerCallToAction(callToAction, mapperProps),
+        control,
+        margin: margin !== null && margin !== void 0 ? margin : 'md',
+        media: getDomainLayerMedia({ media }),
+        tags,
+        text,
+        onDismiss: onDismiss
+            ? () => {
+                const { url, method } = onDismiss;
+                const body = method === 'GET' ? undefined : JSON.stringify(onDismiss.body);
+                void mapperProps.httpClient(url, { method, body }).catch(() => {
+                    // we can ignore errors on dismiss upsell
+                });
+            }
+            : undefined,
+    }, onComponentUpdate);
+};

package/build/domain/mappers/mapLayoutToComponent.js

@@ -0,0 +1,81 @@
+import { alertLayoutToComponent } from './layout/alertLayoutToComponent';
+import { boxLayoutToComponent } from './layout/boxLayoutToComponent';
+import { buttonLayoutToComponent } from './layout/buttonLayoutToComponent';
+import { columnsLayoutToComponent } from './layout/columnsLayoutToComponent';
+import { decisionLayoutToComponent } from './layout/decisionLayoutToComponent';
+import { deprecatedListLayoutToComponent, isDeprecatedListLayout, } from './layout/deprecatedListLayoutToComponent';
+import { dividerLayoutToComponent } from './layout/dividerLayoutToComponent';
+import { formLayoutToComponent } from './layout/formLayoutToComponent';
+import { headingLayoutToComponent } from './layout/headingLayoutToComponent';
+import { imageLayoutToComponent } from './layout/imageLayoutToComponent';
+import { infoLayoutToComponent } from './layout/infoLayoutToComponent';
+import { instructionsLayoutToComponent } from './layout/instructionsLayoutToComponent';
+import { listLayoutToComponent } from './layout/listLayoutToComponent';
+import { loadingIndicatorLayoutToComponent } from './layout/loadingIndicatorLayoutToComponent';
+import { markdownLayoutToComponent } from './layout/markdownLayoutToComponent';
+import { mediaLayoutToComponent } from './layout/mediaLayoutToComponent';
+import { modalLayoutToComponent } from './layout/modalLayoutToComponent';
+import { paragraphLayoutToComponent } from './layout/paragraphLayoutToComponent';
+import { progressLayoutToComponent } from './layout/progressLayoutToComponent';
+import { reviewLayoutToComponent } from './layout/reviewLayoutToComponent';
+import { searchLayoutToComponent } from './layout/searchLayoutToComponent';
+import { sectionLayoutToComponent } from './layout/sectionLayoutToComponent';
+import { statusListLayoutToComponent } from './layout/statusListLayoutToComponent';
+import { tabsLayoutToComponent } from './layout/tabsLayoutToComponent';
+import { upsellLayoutToComponent } from './layout/upsellLayoutToComponent';
+export const mapLayoutToComponent = (uid, layout, mapperProps, schemaComponents) => {
+    switch (layout.type) {
+        case 'alert':
+            return alertLayoutToComponent(uid, layout, mapperProps);
+        case 'box':
+            return boxLayoutToComponent(uid, layout, mapperProps, schemaComponents);
+        case 'button':
+            return buttonLayoutToComponent(uid, layout, mapperProps);
+        case 'columns':
+            return columnsLayoutToComponent(uid, layout, mapperProps, schemaComponents);
+        case 'decision':
+            return decisionLayoutToComponent(uid, layout, mapperProps);
+        case 'divider':
+            return dividerLayoutToComponent(uid, layout);
+        case 'form':
+            return formLayoutToComponent(uid, layout, schemaComponents);
+        case 'heading':
+            return headingLayoutToComponent(uid, layout);
+        case 'image':
+            return imageLayoutToComponent(uid, layout);
+        case 'info':
+            return infoLayoutToComponent(uid, layout);
+        case 'instructions':
+            return instructionsLayoutToComponent(uid, layout);
+        case 'list':
+            return isDeprecatedListLayout(layout)
+                ? deprecatedListLayoutToComponent(uid, layout)
+                : listLayoutToComponent(uid, layout, mapperProps);
+        case 'loading-indicator':
+            return loadingIndicatorLayoutToComponent(uid, layout);
+        case 'markdown':
+            return markdownLayoutToComponent(uid, layout);
+        case 'media':
+            return mediaLayoutToComponent(uid, layout);
+        case 'modal':
+            return modalLayoutToComponent(uid, layout, mapperProps, schemaComponents);
+        case 'paragraph':
+            return paragraphLayoutToComponent(uid, layout);
+        case 'progress':
+            return progressLayoutToComponent(uid, layout);
+        case 'review':
+            return reviewLayoutToComponent(uid, layout, mapperProps);
+        case 'search':
+            return searchLayoutToComponent(uid, layout, mapperProps);
+        case 'section':
+            return sectionLayoutToComponent(uid, layout, mapperProps, schemaComponents);
+        case 'status-list':
+            return statusListLayoutToComponent(uid, layout, mapperProps);
+        case 'tabs':
+            return tabsLayoutToComponent(uid, layout, mapperProps, schemaComponents);
+        case 'upsell':
+            return upsellLayoutToComponent(uid, layout, mapperProps);
+        default:
+            throw new Error(`Invalid layout type in ${JSON.stringify(layout)}`);
+    }
+};

package/build/domain/mappers/mapSchemaToComponent.js

@@ -0,0 +1,61 @@
+import { numberSchemaToComponent } from './schema/numberSchemaToComponent';
+import { isAllOfSchema, isArraySchema, isBlobSchema, isBooleanSchema, isConstSchema, isIntegerSchema, isNumberSchema, isObjectSchema, isOneOfSchema, isSchemaWithPersistAsync, isStringSchema, } from '../../utils/type-utils';
+import { allOfSchemaToComponent } from './schema/allOfSchemaToComponent';
+import { arraySchemaToComponent } from './schema/arraySchemaToComponent/arraySchemaToComponent';
+import { blobSchemaToComponent } from './schema/blobSchemaToComponent';
+import { booleanSchemaToComponent } from './schema/booleanSchemaToComponent';
+import { constSchemaToComponent } from './schema/constSchemaToComponent';
+import { integerSchemaToComponent } from './schema/integerSchemaToComponent';
+import { objectSchemaToFormattedValueComponent } from './schema/objectSchemaToComponent/objectSchemaToFormattedValueComponent';
+import { objectSchemaToMoneyInputComponent } from './schema/objectSchemaToComponent/objectSchemaToMoneyInputComponent';
+import { objectSchemaToObjectComponent } from './schema/objectSchemaToComponent/objectSchemaToObjectComponent';
+import { oneOfSchemaToComponent } from './schema/oneOfSchemaToComponent/oneOfSchemaToComponent';
+import { persistAsyncSchemaToComponent } from './schema/persistAsyncSchemaToComponent';
+import { stringSchemaToComponent } from './schema/stringSchemaToComponent/stringSchemaToComponent';
+export const mapSchemaToComponent = (schemaMapperProps, mapperProps) => {
+    const { uid, schema } = schemaMapperProps;
+    if (isConstSchema(schema)) {
+        return constSchemaToComponent(uid, Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isSchemaWithPersistAsync(schema)) {
+        return persistAsyncSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isAllOfSchema(schema)) {
+        return allOfSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isOneOfSchema(schema)) {
+        return oneOfSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isBooleanSchema(schema)) {
+        return booleanSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isObjectSchema(schema)) {
+        const { format } = schema;
+        if (format === 'money') {
+            return objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+        }
+        if (format != null && Object.keys(schema.properties).length === 0) {
+            return objectSchemaToFormattedValueComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: Object.assign(Object.assign({}, schema), { format }) }), mapperProps);
+        }
+        return objectSchemaToObjectComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isIntegerSchema(schema)) {
+        return integerSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isNumberSchema(schema)) {
+        return numberSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isStringSchema(schema)) {
+        return stringSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isArraySchema(schema)) {
+        return arraySchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    if (isBlobSchema(schema)) {
+        if (!schemaMapperProps.onPersistAsync) {
+            throw new Error('Blob schemas can only be used as the schema of a persist async configuration.');
+        }
+        return blobSchemaToComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema }), mapperProps);
+    }
+    throw new Error('Not yet supported');
+};

package/build/domain/mappers/mapSchemaToComponent.test.js

@@ -0,0 +1,112 @@
+import { getMockMapperProps, getMockSchemaMapperProps } from './schema/tests/test-utils';
+import { mapSchemaToComponent } from './mapSchemaToComponent';
+describe('mapSchemaToComponents', () => {
+    describe('when no alert is given', () => {
+        it('returns a StepComponent for the schema', () => {
+            const schema = {
+                type: 'string',
+            };
+            const component = mapSchemaToComponent(getMockSchemaMapperProps({ schema, model: null }), getMockMapperProps());
+            expect(component.type).toBe('text');
+        });
+    });
+    describe('when const schemas are given', () => {
+        const constSchemas = {
+            $id: '#schema',
+            type: 'object',
+            title: 'Object Schema',
+            displayOrder: ['cbs', 'cns', 'css', 'cos', 'cas'],
+            properties: {
+                cbs: {
+                    title: 'Const boolean schema',
+                    const: true,
+                },
+                cns: {
+                    title: 'Const number schema',
+                    const: 42,
+                },
+                css: {
+                    title: 'Const string schema',
+                    const: 'Hello World!',
+                },
+                cos: {
+                    title: 'Const object schema',
+                    const: {
+                        name: 'John Doe',
+                    },
+                },
+                cas: {
+                    title: 'Const array schema',
+                    const: ['Hello', 'World!'],
+                },
+            },
+        };
+        describe('when the getValue function is called', () => {
+            it('returns the const values', async () => {
+                const component = mapSchemaToComponent(getMockSchemaMapperProps({ schema: constSchemas, model: null }), getMockMapperProps());
+                expect(await component.getSubmittableValue()).toStrictEqual({
+                    cbs: true,
+                    cns: 42,
+                    css: 'Hello World!',
+                    cos: { name: 'John Doe' },
+                    cas: ['Hello', 'World!'],
+                });
+            });
+        });
+    });
+    describe('when hidden schemas are given', () => {
+        const hiddenSchemas = {
+            $id: '#schema',
+            type: 'object',
+            title: 'Object Schema',
+            displayOrder: ['hbs', 'hns', 'hss'],
+            properties: {
+                hbs: {
+                    type: 'boolean',
+                    title: 'Hidden boolean schema',
+                    hidden: true,
+                    default: true,
+                },
+                hns: {
+                    type: 'number',
+                    title: 'Hidden number schema',
+                    hidden: true,
+                    default: 42,
+                },
+                hss: {
+                    type: 'string',
+                    title: 'Hidden string schema',
+                    hidden: true,
+                    default: 'Hello World!',
+                },
+            },
+        };
+        describe('when model is null', () => {
+            describe('and the getValue function is called', () => {
+                it('returns the default values', async () => {
+                    const component = mapSchemaToComponent(getMockSchemaMapperProps({ schema: hiddenSchemas, model: null }), getMockMapperProps());
+                    expect(await component.getSubmittableValue()).toStrictEqual({
+                        hbs: true,
+                        hns: 42,
+                        hss: 'Hello World!',
+                    });
+                });
+            });
+        });
+        describe('when model is not null', () => {
+            describe('and the getValue function is called', () => {
+                it('prefers to return the model values over the default values', async () => {
+                    const component = mapSchemaToComponent(getMockSchemaMapperProps({
+                        schema: hiddenSchemas,
+                        model: { hbs: false, hns: 0, hss: 'Hello' },
+                    }), getMockMapperProps());
+                    expect(await component.getSubmittableValue()).toStrictEqual({
+                        hbs: false,
+                        hns: 0,
+                        hss: 'Hello',
+                    });
+                });
+            });
+        });
+    });
+});

package/build/domain/mappers/mapStepSchemas.js

@@ -0,0 +1,17 @@
+import { mapSchemaToComponent } from './mapSchemaToComponent';
+export const mapStepSchemas = (uid, step, stepLocalValue, mapperProps, referencedSchemaIds) => {
+    const isReferenced = (schemaId) => schemaId != null && referencedSchemaIds.includes(schemaId);
+    return step.schemas.map((schema, i) => {
+        var _a, _b;
+        const schemaComponent = mapSchemaToComponent({
+            uid: `${uid}.schemas-${i}.${schema.$id}`,
+            schemaId: schema.$id,
+            schema,
+            model: (_a = step.model) !== null && _a !== void 0 ? _a : null,
+            localValue: stepLocalValue,
+            validationErrors: (_b = step.errors) === null || _b === void 0 ? void 0 : _b.validation,
+            required: true,
+        }, mapperProps);
+        return Object.assign(Object.assign({}, schemaComponent), { isSchemaReferencedInStep: isReferenced(schema.$id) });
+    });
+};

package/build/domain/mappers/mapStepToComponent.js

@@ -0,0 +1,132 @@
+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 { createExternalConfirmation } from '../components/step/ExternalConfirmationComponent';
+import { createStepComponent } from '../components/step/StepDomainComponent';
+import { getStepPolling } from '../features/polling/getStepPolling';
+import { getStepRefreshAfter } from '../features/refreshAfter/getStepRefreshAfter';
+import { mapLayoutToComponent } from './mapLayoutToComponent';
+import { mapStepSchemas } from './mapStepSchemas';
+import { mapToolbarToComponent } from './mapToolbarToComponent';
+import { groupLayoutByPinned } from './utils/groupLayoutByPinned';
+import { normaliseMarginInLastComponent } from './utils/layout-utils';
+import { getStepPrefetch } from '../features/prefetch/getStepPrefetch';
+export const mapStepToComponent = (_a) => {
+    var _b;
+    var { uid: rootUid, loadingState, features, trackEvent, onPoll, onBehavior } = _a, restProps = __rest(_a, ["uid", "loadingState", "features", "trackEvent", "onPoll", "onBehavior"]);
+    const { etag, step, stepLocalValue, flowRequestCache, logEvent, onComponentUpdate } = restProps;
+    const { id, control, description, errors, external, key, navigation, polling, refreshAfter, title, tags, } = step;
+    const submissionBehaviors = [];
+    const registerSubmissionBehavior = (behavior) => {
+        if (behavior.type === 'action' && behavior.action.prefetch) {
+            // eslint-disable-next-line functional/immutable-data
+            submissionBehaviors.push(behavior);
+        }
+        if (behavior.type === 'subflow' &&
+            behavior.launchConfig.type === 'dynamic' &&
+            behavior.launchConfig.request.prefetch) {
+            // eslint-disable-next-line functional/immutable-data
+            submissionBehaviors.push(behavior);
+        }
+    };
+    const back = mapBackNavigation(navigation, onBehavior, features.isEnabled('nativeBack'));
+    const stepId = id || key;
+    if (stepId === undefined) {
+        throw new Error('Step must have an id or a key');
+    }
+    const uid = `${rootUid}.${stepId !== null && stepId !== void 0 ? stepId : 'step'}`;
+    const stepPolling = polling
+        ? getStepPolling({
+            pollingConfig: polling,
+            logEvent,
+            onBehavior,
+            onPoll,
+            registerSubmissionBehavior,
+        })
+        : undefined;
+    const stepRefreshAfter = refreshAfter
+        ? getStepRefreshAfter({ refreshAfter, logEvent, onBehavior })
+        : undefined;
+    const stepPrefetch = getStepPrefetch(restProps.httpClient, flowRequestCache, submissionBehaviors);
+    const externalConfirmation = (external === null || external === void 0 ? void 0 : external.url)
+        ? createExternalConfirmation(`${uid}-external-confirmation`, external === null || external === void 0 ? void 0 : external.url, onComponentUpdate)
+        : undefined;
+    const mapperProps = Object.assign(Object.assign({}, restProps), { features,
+        trackEvent,
+        onBehavior,
+        registerSubmissionBehavior });
+    const referencedSchemaIds = getReferencedSchemaId(step);
+    const schemaComponents = mapStepSchemas(uid, step, stepLocalValue, mapperProps, referencedSchemaIds);
+    const { layout, footer } = getLayoutAndFooter(step, features);
+    const layoutComponents = layout.map((layoutComponent, index) => mapLayoutToComponent(`${uid}.layout-${index}`, layoutComponent, mapperProps, schemaComponents));
+    const footerComponents = normaliseMarginInLastComponent(footer).map((footerComponent, index) => mapLayoutToComponent(`${uid}.footer-${index}`, footerComponent, mapperProps, schemaComponents));
+    const toolbar = mapToolbarToComponent(uid, step.toolbar, mapperProps);
+    const stepComponent = createStepComponent({
+        uid,
+        back,
+        etag,
+        toolbar,
+        layoutComponents,
+        schemaComponents,
+        footerComponents,
+        control,
+        description,
+        error: errors === null || errors === void 0 ? void 0 : errors.error,
+        externalConfirmation,
+        loadingState,
+        stepPolling,
+        stepRefreshAfter,
+        title,
+        tags,
+        stackBehavior: (_b = navigation === null || navigation === void 0 ? void 0 : navigation.stackBehavior) !== null && _b !== void 0 ? _b : 'default',
+        stepPrefetch,
+        step,
+        onComponentUpdate,
+        trackEvent,
+        onBehavior,
+    });
+    return stepComponent;
+};
+const getReferencedSchemaId = (step) => {
+    const { schemas, layout } = step;
+    const stringifiedLayout = JSON.stringify(layout);
+    return schemas
+        .filter((schema) => stringifiedLayout.includes(`"schemaId":"${schema.$id}"`) ||
+        stringifiedLayout.includes(`"schema":{"$ref":"${schema.$id}"`))
+        .map((schema) => schema.$id)
+        .filter((schemaId) => schemaId !== undefined);
+};
+const mapBackNavigation = (navigation, onBehavior, isNativeBackEnabled) => {
+    var _a;
+    const backNavigation = (_a = navigation === null || navigation === void 0 ? void 0 : navigation.back) !== null && _a !== void 0 ? _a : navigation === null || navigation === void 0 ? void 0 : navigation.backButton;
+    const backBehavior = { type: 'back', action: backNavigation === null || backNavigation === void 0 ? void 0 : backNavigation.action };
+    return backNavigation || isNativeBackEnabled
+        ? {
+            title: backNavigation === null || backNavigation === void 0 ? void 0 : backNavigation.title,
+            onClick: () => {
+                void onBehavior(backBehavior);
+            },
+        }
+        : undefined;
+};
+const getLayoutAndFooter = (step, features) => {
+    var _a;
+    if (step.footer) {
+        const { layout = [], footer = [] } = step;
+        return { layout, footer };
+    }
+    if (features.isEnabled('pinnedButtons')) {
+        const { pinned: footer, nonPinned: layout } = groupLayoutByPinned((_a = step.layout) !== null && _a !== void 0 ? _a : []);
+        return { layout, footer };
+    }
+    const { layout = [] } = step;
+    return { layout, footer: [] };
+};