@wise/dynamic-flow-client 5.8.1 → 5.9.0

package/build/domain/mappers/schema/objectSchemaToComponent/objectSchemaToFormattedValueComponent.js

@@ -0,0 +1,9 @@
+import { createFormattedValueComponent } from '../../../components/FormattedValueComponent';
+import { mapCommonSchemaProps } from '../utils/mapCommonSchemaProps';
+import { getSchemaOnChange } from '../../../features/schema-on-change/getSchemaOnChange';
+export const objectSchemaToFormattedValueComponent = (schemaMapperProps, mapperProps) => {
+    const { onBehavior } = mapperProps;
+    const { schema } = schemaMapperProps;
+    const { format } = schema;
+    return createFormattedValueComponent(Object.assign(Object.assign({}, mapCommonSchemaProps(schemaMapperProps)), { format, value: schemaMapperProps.model, schemaOnChange: getSchemaOnChange(schema, onBehavior) }), mapperProps.onComponentUpdate);
+};

package/build/domain/mappers/schema/objectSchemaToComponent/objectSchemaToMoneyInputComponent.js

@@ -0,0 +1,119 @@
+import { isConstSchema, isOneOfSchema, isStringSchema } from '../../../../utils/type-utils';
+import { createMoneyInputComponent } from '../../../components/MoneyInputComponent';
+import { getAboveMaximumMoneyAmountCheck, getBelowMinimumMoneyAmountCheck, } from '../../../features/validation/value-checks';
+import { mapCommonSchemaProps } from '../utils/mapCommonSchemaProps';
+import { createComponentMap } from './objectSchemaToObjectComponent';
+import { isObject } from '../../../../utils/type-validators';
+// Constraints for amount schema
+const isAmountSchema = (schema) => isStringSchema(schema) &&
+    !schema.hidden &&
+    schema.format !== 'date' &&
+    schema.format !== 'base64url' &&
+    schema.persistAsync === undefined;
+// Constraints for currency schema
+const isCurrencyConstSchema = (schema) => isConstSchema(schema);
+// A oneOf schema is valid for currency if all its options are const schemas, and there is at least one option
+const isCurrencySelectSchema = (schema) => isOneOfSchema(schema) &&
+    schema.oneOf.length > 0 &&
+    schema.oneOf.every((option) => isCurrencyConstSchema(option));
+export const objectSchemaToMoneyInputComponent = (schemaMapperProps, mapperProps) => {
+    return createMoneyInputComponent(Object.assign(Object.assign({}, mapCommonSchemaProps(schemaMapperProps)), createMoneyInputSubComponents(schemaMapperProps, mapperProps)), mapperProps.onComponentUpdate);
+};
+const createMoneyInputSubComponents = (schemaMapperProps, mapperProps) => {
+    const { schema: objectSchema, model } = schemaMapperProps;
+    const amountKey = getAmountSchemaKey(objectSchema, mapperProps);
+    const currencyKey = getCurrencySchemaKey(objectSchema, mapperProps);
+    // This is to ensure that the currency schema is always a oneOf schema,
+    // so that it is always mapped to a SelectInputComponent.
+    const currencySchema = objectSchema.properties[currencyKey];
+    const customSchemaMapperProps = Object.assign(Object.assign({}, schemaMapperProps), { model: getSanitizedModel(amountKey, model), schema: isOneOfSchema(currencySchema)
+            ? objectSchema
+            : replaceKeyInObjectSchema(objectSchema, currencyKey, { oneOf: [currencySchema] }) });
+    const componentMap = createComponentMap(customSchemaMapperProps, mapperProps, 'money');
+    const amountComponent = componentMap[amountKey];
+    assertAmountComponent(amountComponent, mapperProps.logEvent);
+    const currencyComponent = componentMap[currencyKey];
+    assertCurrencyComponent(currencyComponent, mapperProps.logEvent);
+    const extraValues = getExtraValues(componentMap, [amountKey, currencyKey]);
+    const checks = getMinMaxChecks(objectSchema, amountKey, mapperProps);
+    return { amountKey, amountComponent, currencyKey, currencyComponent, extraValues, checks };
+};
+const isNumberString = (value) => {
+    return (typeof value === 'string' &&
+        !Number.isNaN(Number.parseFloat(value)) &&
+        /^\d*(?:\.\d*)?$/.test(value));
+};
+const getSanitizedModel = (key, value) => {
+    if (isObject(value)) {
+        const amount = value[key];
+        if (!isNumberString(amount)) {
+            return Object.assign(Object.assign({}, value), { [key]: null });
+        }
+    }
+    return value;
+};
+const getAmountSchemaKey = ({ displayOrder, properties }, mapperProps) => {
+    var _a;
+    const entry = displayOrder
+        .map((key) => ({ key, schema: properties[key] }))
+        .find(({ schema }) => isAmountSchema(schema));
+    if (!entry) {
+        const message = `Object schema with format "money" is not properly configured. It must have one schema property of type "string" which is not hidden and has a valid format or no format at all.`;
+        (_a = mapperProps.logEvent) === null || _a === void 0 ? void 0 : _a.call(mapperProps, 'error', message);
+        throw new Error(message);
+    }
+    return entry.key;
+};
+const getCurrencySchemaKey = ({ displayOrder, properties }, mapperProps) => {
+    var _a;
+    const entry = displayOrder
+        .map((key) => ({ key, schema: properties[key] }))
+        .find(({ schema }) => isCurrencyConstSchema(schema) || isCurrencySelectSchema(schema));
+    if (!entry) {
+        const message = `Object schema with format "money" is not properly configured. It must have one schema property representing the currency code. This property must be a const schema or a oneOf schema with at least one const schema options.`;
+        (_a = mapperProps.logEvent) === null || _a === void 0 ? void 0 : _a.call(mapperProps, 'error', message);
+        throw new Error(message);
+    }
+    return entry.key;
+};
+// Returns a new ObjectSchema with the specified key replaced by the new schema
+const replaceKeyInObjectSchema = (objSchema, key, newSchema) => {
+    return Object.assign(Object.assign({}, objSchema), { properties: Object.assign(Object.assign({}, objSchema.properties), { [key]: newSchema }) });
+};
+const getMinMaxChecks = (objectSchema, amountKey, mapperProps) => {
+    const amountSchema = objectSchema.properties[amountKey];
+    const errorMessageFunctions = mapperProps.getErrorMessageFunctions(amountSchema.validationMessages);
+    const checks = [
+        getAboveMaximumMoneyAmountCheck(amountSchema, errorMessageFunctions),
+        getBelowMinimumMoneyAmountCheck(amountSchema, errorMessageFunctions),
+    ];
+    return checks;
+};
+// Returns values of schema components that are either const or hidden,
+// excluding the ones with keys in excludeKeys (typically, amount and currency).
+function getExtraValues(componentMap, excludeKeys) {
+    return Object.fromEntries(Object.entries(componentMap)
+        .filter(([key, component]) => !excludeKeys.includes(key) && (component.type === 'const' || component.hidden))
+        .map(([key, component]) => [key, component.getSubmittableValueSync()]));
+}
+function assertAmountComponent(component, logEvent) {
+    if (component.type !== 'text') {
+        // This should never happen because isAmountSchema ensures that the amount schema
+        // is a string schema of without hidden, date or base64url format,
+        // and those are always mapped to TextInputComponents.
+        const message = 'A string schema was selected for amount but it was not successfully mapped into a TextInputComponent.';
+        logEvent === null || logEvent === void 0 ? void 0 : logEvent('error', message);
+        throw new Error(message);
+    }
+}
+function assertCurrencyComponent(component, logEvent) {
+    if (component.type !== 'select') {
+        // This should never happen because
+        // oneOfSchemaToComponent always returns a SelectInputComponent
+        // for oneOf schemas with const options, and
+        // we have already asserted that the oneOf schema only has const options.
+        const message = 'A schema was selected for currency but it was not successfully mapped into a SelectInputComponent.';
+        logEvent === null || logEvent === void 0 ? void 0 : logEvent('error', message);
+        throw new Error(message);
+    }
+}

package/build/domain/mappers/schema/objectSchemaToComponent/objectSchemaToMoneyInputComponent.test.js

@@ -0,0 +1,96 @@
+import { objectSchemaToMoneyInputComponent } from './objectSchemaToMoneyInputComponent';
+describe('objectSchemaToMoneyInputComponent', () => {
+    const schemaMapperProps = {
+        uid: 'test-money-input',
+        model: { amount: '100' },
+        localValue: null,
+        validationErrors: null,
+    };
+    const mapperProps = {
+        logEvent: () => { },
+        getErrorMessageFunctions: () => () => '',
+    };
+    describe('when the object schema has "format": "money"', () => {
+        describe('and it is properly configured', () => {
+            it('should map to a MoneyInputComponent', () => {
+                const moneyInputComponent = objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'string', format: 'numeric' },
+                            currency: { const: 'USD' },
+                        },
+                        displayOrder: ['amount', 'currency'],
+                    } }), mapperProps);
+                expect(moneyInputComponent.type).toBe('money-input');
+            });
+        });
+        describe('but it is not properly configured', () => {
+            it('should throw when missing string schema (for amount)', () => {
+                expect(() => objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'number' },
+                            currency: { const: 'USD' },
+                        },
+                        displayOrder: ['amount', 'currency'],
+                    } }), mapperProps)).toThrow(/not properly configured.*string/);
+            });
+            it('should throw when missing a usable string schema (hidden schemas cannot be used)', () => {
+                expect(() => objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'string', hidden: true },
+                            currency: { const: 'USD' },
+                        },
+                        displayOrder: ['amount', 'currency'],
+                    } }), mapperProps)).toThrow(/not properly configured.*string/);
+            });
+            it('should throw when missing a usable string schema (format: "date" cannot be used)', () => {
+                expect(() => objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'string', format: 'date' },
+                            currency: { const: 'USD' },
+                        },
+                        displayOrder: ['amount', 'currency'],
+                    } }), mapperProps)).toThrow(/not properly configured.*string/);
+            });
+            it('should throw when missing a usable string schema (upload schemas cannot be used)', () => {
+                expect(() => objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'string', format: 'base64url' },
+                            currency: { const: 'USD' },
+                        },
+                        displayOrder: ['amount', 'currency'],
+                    } }), mapperProps)).toThrow(/not properly configured.*string/);
+            });
+            it('should throw when missing currency schema', () => {
+                expect(() => objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'string' },
+                        },
+                        displayOrder: ['amount'],
+                    } }), mapperProps)).toThrow(/not properly configured.*currency code/);
+            });
+            it('should throw when currency schema oneOf is empty', () => {
+                expect(() => objectSchemaToMoneyInputComponent(Object.assign(Object.assign({}, schemaMapperProps), { schema: {
+                        type: 'object',
+                        format: 'money',
+                        properties: {
+                            amount: { type: 'string', format: 'numeric' },
+                            currency: { oneOf: [] },
+                        },
+                        displayOrder: ['amount', 'currency'],
+                    } }), mapperProps)).toThrow(/not properly configured.*const.*oneOf/);
+            });
+        });
+    });
+});

package/build/domain/mappers/schema/objectSchemaToComponent/objectSchemaToObjectComponent.js

@@ -0,0 +1,31 @@
+import { isObjectLocalValue, isObjectModel } from '../../../../utils/type-utils';
+import { createObjectComponent } from '../../../components/ObjectComponent';
+import { mapSchemaToComponent } from '../../mapSchemaToComponent';
+import { isObject } from '../../../../utils/type-validators';
+import { mapCommonSchemaProps } from '../utils/mapCommonSchemaProps';
+import { assertDisplayOrder } from './assertDisplayOrder';
+export const objectSchemaToObjectComponent = (schemaMapperProps, mapperProps) => {
+    assertDisplayOrder(schemaMapperProps.schema, mapperProps.logEvent);
+    const componentMap = createComponentMap(schemaMapperProps, mapperProps, 'obj');
+    return createObjectComponent(Object.assign(Object.assign({}, mapCommonSchemaProps(schemaMapperProps)), { displayOrder: schemaMapperProps.schema.displayOrder, componentMap }));
+};
+export const createComponentMap = (schemaMapperProps, mapperProps, uidPrefix) => {
+    const { uid, localValue, schema, model, validationErrors } = schemaMapperProps;
+    const { $id, displayOrder, properties, required } = schema;
+    const initialReducerValue = {};
+    return displayOrder.reduce((acc, propName) => {
+        var _a;
+        const propSchema = properties[propName];
+        if (propSchema === undefined) {
+            throw new Error(`Object schema ${$id} has no property named ${propName}`);
+        }
+        return Object.assign(Object.assign({}, acc), { [propName]: mapSchemaToComponent({
+                uid: `${uid}.${uidPrefix}-${propName}`,
+                schema: propSchema,
+                model: isObjectModel(model) ? model[propName] : null,
+                localValue: isObjectLocalValue(localValue) ? localValue[propName] : null,
+                required: (_a = required === null || required === void 0 ? void 0 : required.includes(propName)) !== null && _a !== void 0 ? _a : false,
+                validationErrors: isObject(validationErrors) ? validationErrors[propName] : undefined,
+            }, mapperProps) });
+    }, initialReducerValue);
+};

package/build/domain/mappers/schema/objectSchemaToComponent/objectSchemaToObjectComponent.test.js

@@ -0,0 +1,99 @@
+import { getMockMapperProps, getMockSchemaMapperProps } from '../tests/test-utils';
+import { objectSchemaToObjectComponent } from './objectSchemaToObjectComponent';
+describe('objectSchemaToObjectComponent', () => {
+    const defaultMapperProps = getMockMapperProps();
+    describe('initial model handling', () => {
+        describe('when the initial model is null', () => {
+            it('sets component value to an empty object', async () => {
+                const schemaMapperProps = getMockSchemaMapperProps({
+                    schema: {
+                        type: 'object',
+                        properties: {},
+                        displayOrder: [],
+                    },
+                    model: null,
+                });
+                const component = objectSchemaToObjectComponent(schemaMapperProps, defaultMapperProps);
+                expect(await component.getSubmittableValue()).toStrictEqual({});
+            });
+            it('is still an empty object if child values have not been set', async () => {
+                const schemaMapperProps = getMockSchemaMapperProps({
+                    schema: {
+                        type: 'object',
+                        properties: {
+                            name: {
+                                type: 'string',
+                            },
+                            occupation: {
+                                type: 'string',
+                            },
+                        },
+                        displayOrder: ['name', 'occupation'],
+                    },
+                    model: null,
+                });
+                const component = objectSchemaToObjectComponent(schemaMapperProps, defaultMapperProps);
+                expect(await component.getSubmittableValue()).toStrictEqual({});
+            });
+        });
+        describe('when initial model is defined', () => {
+            const schemaMapperProps = getMockSchemaMapperProps({
+                schema: {
+                    type: 'object',
+                    properties: {
+                        name: {
+                            type: 'string',
+                        },
+                        occupation: {
+                            type: 'string',
+                        },
+                    },
+                    displayOrder: ['name', 'occupation'],
+                },
+                model: {
+                    name: 'John Smith',
+                    city: 'New York',
+                },
+            });
+            it('sets the component value to the initial model', async () => {
+                const component = objectSchemaToObjectComponent(schemaMapperProps, defaultMapperProps);
+                expect(await component.getSubmittableValue()).toStrictEqual(expect.objectContaining({
+                    name: 'John Smith',
+                }));
+            });
+        });
+    });
+    describe('initial validation error handling', () => {
+        it('sets the initial error if provided', () => {
+            const schemaMapperProps = getMockSchemaMapperProps({
+                schema: {
+                    type: 'object',
+                    properties: {
+                        name: {
+                            type: 'string',
+                        },
+                        occupation: {
+                            type: 'string',
+                        },
+                    },
+                    displayOrder: ['name', 'occupation'],
+                },
+                model: {
+                    name: 'Jane Doe',
+                    occupation: 'Programmer',
+                },
+                validationErrors: {
+                    name: 'Problem with this name',
+                    occupation: 'Problem with this occupation',
+                },
+            });
+            const component = objectSchemaToObjectComponent(schemaMapperProps, defaultMapperProps);
+            expect(component.componentMap.name.errors).toStrictEqual([
+                'Problem with this name',
+            ]);
+            expect(component.componentMap.occupation.errors).toStrictEqual([
+                'Problem with this occupation',
+            ]);
+        });
+    });
+});

package/build/domain/mappers/schema/oneOfSchemaToComponent/oneOfSchemaToComponent.js

@@ -0,0 +1,76 @@
+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 { isAllOfSchema, isArrayTupleSchema, isObjectSchema } from '../../../../utils/type-utils';
+import { createSelectInputComponent } from '../../../components/SelectInputComponent';
+import { getSchemaOnChange } from '../../../features/schema-on-change/getSchemaOnChange';
+import { getRequiredCheck } from '../../../features/validation/value-checks';
+import { mapSchemaToComponent } from '../../mapSchemaToComponent';
+import { getAutocompleteString } from '../../utils/getAutocompleteString';
+import { getDomainLayerMedia } from '../../utils/media-utils';
+import { mapInlineAlert } from '../../utils/utils';
+import { mapCommonSchemaProps } from '../utils/mapCommonSchemaProps';
+export const oneOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
+    var _a;
+    const { uid, localValue, schema, model, validationErrors: initialError, required = false, } = schemaMapperProps;
+    const initialModel = (_a = model !== null && model !== void 0 ? model : schema.default) !== null && _a !== void 0 ? _a : null;
+    if (schema.oneOf.length === 1 && isFormSectionSchema(schema.oneOf[0])) {
+        return mapSchemaToComponent({
+            uid,
+            schema: supressSchemaTitleAndDescription(schema.oneOf[0]),
+            model: initialModel,
+            localValue,
+            validationErrors: initialError,
+            required,
+        }, mapperProps);
+    }
+    const options = schema.oneOf.map((childSchema, index) => {
+        var _a;
+        const { title = '', description, image, icon, media, keywords = [], tags, additionalText, inlineAlert, supportingValues, } = childSchema;
+        return {
+            title,
+            description,
+            additionalText,
+            analyticsId: (_a = childSchema.analyticsId) !== null && _a !== void 0 ? _a : childSchema.$id,
+            disabled: 'disabled' in childSchema ? Boolean(childSchema.disabled) : false,
+            inlineAlert: mapInlineAlert(inlineAlert),
+            keywords,
+            media: getDomainLayerMedia({ icon, image, media }),
+            supportingValues,
+            tags,
+            component: mapSchemaToComponent({
+                uid: `${uid}.oneOf-${index}`,
+                schema: isFormSectionSchema(childSchema)
+                    ? supressSchemaTitleAndDescription(childSchema)
+                    : childSchema,
+                model: initialModel,
+                localValue,
+                validationErrors: initialError,
+                required,
+            }, mapperProps),
+        };
+    });
+    const { getErrorMessageFunctions, onComponentUpdate, trackEvent, onBehavior, onValueChange } = mapperProps;
+    const { validationMessages } = schema;
+    const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
+    return createSelectInputComponent(Object.assign(Object.assign({}, mapCommonSchemaProps(schemaMapperProps)), { autoComplete: getAutocompleteString(schema.autocompleteHint), checks: schema.hidden ? [] : [getRequiredCheck(required, errorMessageFunctions)], options,
+        initialModel, schemaOnChange: getSchemaOnChange(schema, onBehavior), onValueChange,
+        trackEvent }), onComponentUpdate);
+};
+const isFormSectionSchema = (schema) => isObjectSchema(schema) || isArrayTupleSchema(schema) || isAllOfSchema(schema);
+/**
+ * When using a schema in a oneOf, the title is not needed, as it is already displayed in the dropdown, radio or tab.
+ * We also suppress the description, because it is not displayed on mobile clients.
+ */
+const supressSchemaTitleAndDescription = (schema) => {
+    const { title, description } = schema, headlessSchema = __rest(schema, ["title", "description"]);
+    return headlessSchema;
+};