@wise/dynamic-flow-client 3.11.3 → 3.11.4-experiment-node20-aa45bc2

package/build/legacy/jsonSchemaForm/promotedOneOfSchema/promotedOneOfControl/PromotedOneOfControl.spec.js

@@ -0,0 +1,82 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { shallow } from 'enzyme';
+import PromotedOneOfCheckboxControl from './PromotedOneOfCheckboxControl';
+import PromotedOneOfControl from './PromotedOneOfControl';
+import PromotedOneOfRadioControl from './PromotedOneOfRadioControl';
+jest.mock('../../../common/utils', function () { return (__assign(__assign({}, jest.requireActual('../../../common/utils')), { generateRandomId: function () { return 'DUMMY_GENERATED_UNIQUE_ID'; } })); });
+describe('Given a PromotedOneOfControl component', function () {
+    var component;
+    var props;
+    var setSelection;
+    var selection = 'promoted';
+    var promotedOneOf = {
+        title: 'a promoted oneOf title',
+        description: 'a promoted oneOf description',
+    };
+    var promotion = {
+        other: {
+            title: 'Other title',
+        },
+    };
+    var promotionWithRadioControl = __assign(__assign({}, promotion), { control: 'radio' });
+    var promotionWithCheckboxControl = __assign(__assign({}, promotion), { control: 'checkbox' });
+    beforeEach(function () {
+        setSelection = jest.fn();
+        props = {
+            promotedOneOf: promotedOneOf,
+            promotion: promotion,
+            selection: selection,
+            setSelection: setSelection,
+            title: undefined,
+        };
+    });
+    describe('id prop', function () {
+        it('should be the $id in schema', function () {
+            component = shallow(_jsx(PromotedOneOfControl, __assign({}, props, { id: "DUMMY_ID" })));
+            expect(component.find(PromotedOneOfRadioControl).prop('id')).toBe('DUMMY_ID');
+        });
+        it('should be random number if $id is not present in schema', function () {
+            component = shallow(_jsx(PromotedOneOfControl, __assign({}, props)));
+            expect(component.find(PromotedOneOfRadioControl).prop('id')).toBe('DUMMY_GENERATED_UNIQUE_ID');
+        });
+    });
+    describe('when given a radio control', function () {
+        beforeEach(function () {
+            component = shallow(_jsx(PromotedOneOfControl, __assign({}, props, { promotion: promotionWithRadioControl })));
+        });
+        it('should render PromotedOneOfRadioControl', function () {
+            expect(component.find(PromotedOneOfRadioControl)).toHaveLength(1);
+        });
+        it('should pass down all props', function () {
+            expect(component.find(PromotedOneOfRadioControl).props()).toStrictEqual(__assign(__assign({}, props), { id: 'DUMMY_GENERATED_UNIQUE_ID', promotion: promotionWithRadioControl }));
+        });
+    });
+    describe('when control not given', function () {
+        it('should default to radio control', function () {
+            component = shallow(_jsx(PromotedOneOfControl, __assign({}, props)));
+            expect(component.find(PromotedOneOfRadioControl)).toHaveLength(1);
+        });
+    });
+    describe('when given a checkbox control', function () {
+        beforeEach(function () {
+            component = shallow(_jsx(PromotedOneOfControl, __assign({}, props, { promotion: promotionWithCheckboxControl })));
+        });
+        it('should render PromotedOneOfCheckboxControl', function () {
+            expect(component.find(PromotedOneOfCheckboxControl)).toHaveLength(1);
+        });
+        it('should should pass down all props', function () {
+            expect(component.find(PromotedOneOfCheckboxControl).props()).toStrictEqual(__assign(__assign({}, props), { id: 'DUMMY_GENERATED_UNIQUE_ID', promotion: promotionWithCheckboxControl }));
+        });
+    });
+});

package/build/legacy/jsonSchemaForm/promotedOneOfSchema/promotedOneOfControl/PromotedOneOfRadioControl.js

@@ -0,0 +1,32 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { RadioGroup } from '@transferwise/components';
+import { getAvatarPropertyForRadioOption } from '../../schemaFormControl/utils';
+function PromotedOneOfRadioControl(props) {
+    var _a, _b;
+    var id = props.id, selection = props.selection, setSelection = props.setSelection, promotion = props.promotion, promotedOneOf = props.promotedOneOf, title = props.title;
+    var radios = [
+        __assign({ value: 'promoted', 
+            // TODO: LOW avoid type assertion below: the expression may be nullish, but "label" cannot be
+            label: (((_a = promotion.promoted) === null || _a === void 0 ? void 0 : _a.title) || promotedOneOf.title), secondary: ((_b = promotion.promoted) === null || _b === void 0 ? void 0 : _b.description) || promotedOneOf.description }, getAvatarPropertyForRadioOption(promotedOneOf)),
+        __assign({ value: 'other', label: promotion.other.title, secondary: promotion.other.description }, getAvatarPropertyForRadioOption(promotion.other)),
+    ];
+    return (_jsxs("div", { className: "form-group", children: [title && (_jsx("label", { className: "control-label", htmlFor: id, children: title })), _jsx(RadioGroup, { name: "promoted-selection", selectedValue: selection, radios: radios, 
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-expect-error -- TODO: avoid @ts-ignore -- apparently RadioGroup does not expect an id prop
+                id: id, onChange: setSelection })] }));
+}
+PromotedOneOfRadioControl.defaultProps = {
+    title: undefined,
+};
+export default PromotedOneOfRadioControl;

package/build/legacy/jsonSchemaForm/promotedOneOfSchema/promotedOneOfControl/PromotedOneOfRadioControl.spec.js

@@ -0,0 +1,130 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { RadioGroup } from '@transferwise/components';
+import { shallow } from 'enzyme';
+import PromotedOneOfRadioControl from './PromotedOneOfRadioControl';
+describe('Given a PromotedOneOfRadioControl component', function () {
+    var component;
+    var props;
+    var setSelection;
+    var selection = 'promoted';
+    var title = 'Group title';
+    var promotedOneOf = {
+        title: 'a promoted oneOf title',
+        description: 'a promoted oneOf description',
+    };
+    var promotion = {
+        other: {
+            title: 'Other title',
+            description: 'Other description',
+        },
+    };
+    var promotionWithPromotedLabels = {
+        promoted: {
+            title: 'Promoted title',
+            description: 'Promoted description',
+        },
+        other: {
+            title: 'Other title',
+            description: 'Other description',
+        },
+    };
+    beforeEach(function () {
+        setSelection = jest.fn();
+        props = {
+            title: title,
+            promotedOneOf: promotedOneOf,
+            promotion: promotion,
+            selection: selection,
+            setSelection: setSelection,
+        };
+    });
+    describe('when provided valid props', function () {
+        it('should render radio group', function () {
+            component = shallow(_jsx(PromotedOneOfRadioControl, __assign({}, props)));
+            expect(component.find(RadioGroup)).toHaveLength(1);
+        });
+        it('should render the schema title in a label', function () {
+            expect(component.find('.control-label').text()).toContain(title);
+        });
+        describe('when promoted labels are available', function () {
+            it('should use promoted labels in the radio options', function () {
+                component = shallow(_jsx(PromotedOneOfRadioControl, __assign({}, props, { promotion: promotionWithPromotedLabels })));
+                expect(component.find(RadioGroup).props().radios).toStrictEqual([
+                    {
+                        value: 'promoted',
+                        label: 'Promoted title',
+                        secondary: 'Promoted description',
+                    },
+                    {
+                        value: 'other',
+                        label: 'Other title',
+                        secondary: 'Other description',
+                    },
+                ]);
+            });
+        });
+        describe('when image and icon are provided for the promoted and other element', function () {
+            it('should render the avatars', function () {
+                var promotedOneOfWithImage = __assign(__assign({}, promotedOneOf), { image: {
+                        url: 'someUrl',
+                    } });
+                var promotionWithIcon = {
+                    other: {
+                        title: 'Other title',
+                        description: 'Other description',
+                        icon: {
+                            name: 'bank',
+                        },
+                    },
+                };
+                component = shallow(_jsx(PromotedOneOfRadioControl, __assign({}, props, { promotedOneOf: promotedOneOfWithImage, promotion: promotionWithIcon })));
+                var radios = component.find(RadioGroup).props().radios;
+                var promoted = radios[0];
+                var other = radios[1];
+                expect(promoted.value).toBe('promoted');
+                expect(promoted.label).toBe('a promoted oneOf title');
+                expect(promoted.secondary).toBe('a promoted oneOf description');
+                expect(promoted.avatar).toBeDefined();
+                expect(other.value).toBe('other');
+                expect(other.label).toBe('Other title');
+                expect(other.secondary).toBe('Other description');
+                expect(other.avatar).toBeDefined();
+            });
+        });
+        describe('when promoted labels are not available', function () {
+            it('should fallback to using the labels of the promoted oneOf', function () {
+                component = shallow(_jsx(PromotedOneOfRadioControl, __assign({}, props)));
+                expect(component.find(RadioGroup).props().radios).toStrictEqual([
+                    {
+                        value: 'promoted',
+                        label: 'a promoted oneOf title',
+                        secondary: 'a promoted oneOf description',
+                    },
+                    {
+                        value: 'other',
+                        label: 'Other title',
+                        secondary: 'Other description',
+                    },
+                ]);
+            });
+        });
+        describe('when an option is selected', function () {
+            it('should trigger setSelection', function () {
+                component = shallow(_jsx(PromotedOneOfRadioControl, __assign({}, props)));
+                component.find(RadioGroup).simulate('change', 'other');
+                expect(setSelection).toHaveBeenCalledWith('other');
+            });
+        });
+    });
+});

package/build/legacy/jsonSchemaForm/readOnlySchema/ReadOnlySchema.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { DefinitionList, Layout } from '@transferwise/components';
+import { useIntl } from 'react-intl';
+import { isBasicSchema, isOneOfSchema } from '../../common/utils';
+import { isBoolean } from '../../common/validators';
+import { getAvatarPropertyForRadioOption } from '../schemaFormControl/utils';
+import messages from './ReadOnlySchema.messages';
+function ReadOnlySchema(_a) {
+    var schema = _a.schema, model = _a.model;
+    var _b = schema.title, title = _b === void 0 ? '' : _b;
+    var formatMessage = useIntl().formatMessage;
+    var value = getValueForSchema({ schema: schema, model: model, formatMessage: formatMessage });
+    // FIXME: This is a workaround for the fact that the DefinitionList component value prop doesn't match Model
+    return (_jsx(DefinitionList, { layout: Layout.VERTICAL_ONE_COLUMN, definitions: [{ title: title, value: value, key: '' }] }));
+}
+export default ReadOnlySchema;
+function getValueForSchema(_a) {
+    var schema = _a.schema, model = _a.model, formatMessage = _a.formatMessage;
+    if (isBasicSchema(schema)) {
+        if (isOneOfSchema(schema)) {
+            return getValueFromOneOfSchema(schema, model);
+            // eslint-disable-next-line no-else-return
+        }
+        else {
+            // eslint-disable-next-line no-lonely-if
+            if (schema.type === 'boolean' && isBoolean(model)) {
+                return model ? formatMessage(messages.yes) : formatMessage(messages.no);
+                // eslint-disable-next-line no-else-return
+            }
+            else {
+                // eslint-disable-next-line @typescript-eslint/no-base-to-string
+                return (model && model.toString()) || '';
+            }
+        }
+    }
+    return '';
+}
+function getValueFromOneOfSchema(schema, model) {
+    var option = getSelectedOneOf(schema, model);
+    // FIXME Remove type assertion
+    return option ? getValueFromOption(option) : model;
+}
+function getSelectedOneOf(schema, model) {
+    return schema.oneOf.find(function (childSchema) {
+        return 'const' in childSchema ? model === childSchema.const : false;
+    });
+}
+function getValueFromOption(option) {
+    var text = option.title && option.description
+        ? "".concat(option.title, " - ").concat(option.description)
+        : option.title || '';
+    var icon = getAvatarPropertyForRadioOption({ icon: option.icon });
+    return (icon === null || icon === void 0 ? void 0 : icon.avatar) ? (_jsxs(_Fragment, { children: [icon.avatar, " ", text] })) : (text);
+}

package/build/legacy/jsonSchemaForm/readOnlySchema/ReadOnlySchema.messages.js

@@ -0,0 +1,13 @@
+import { defineMessages } from 'react-intl';
+export default defineMessages({
+    yes: {
+        id: 'dynamicFlows.ReadOnlySchema.yes',
+        defaultMessage: 'Yes',
+        description: 'Yes, used for boolean schemas with a value of true.',
+    },
+    no: {
+        id: 'dynamicFlows.ReadOnlySchema.no',
+        defaultMessage: 'No',
+        description: 'No: used for boolean schemas with a value of false.',
+    },
+});

package/build/legacy/jsonSchemaForm/readOnlySchema/ReadOnlySchema.spec.js

@@ -0,0 +1,117 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DefinitionList } from '@transferwise/components';
+import React from 'react';
+import { mount } from '../../test-utils';
+import ReadOnlySchema from './ReadOnlySchema';
+describe('Given a component for rendering read-only schemas', function () {
+    function mountComponent(props) {
+        var defaultProps = {
+            onChange: jest.fn(),
+            onPersistAsync: jest.fn(),
+            submitted: false,
+        };
+        return mount(_jsx(ReadOnlySchema, __assign({}, defaultProps, props)));
+    }
+    describe('when schema is of basic type', function () {
+        describe('when model is not null', function () {
+            it('should render a DefinitionList with one title/value', function () {
+                var wrapper = mountComponent({
+                    schema: { readOnly: true, title: 'Some Title', type: 'string' },
+                    model: 'some value',
+                });
+                var definitionList = wrapper.find(DefinitionList);
+                expect(definitionList.props('definitions').definitions).toMatchObject([
+                    {
+                        title: 'Some Title',
+                        value: 'some value',
+                    },
+                ]);
+            });
+        });
+        describe('when schema type is boolean', function () {
+            it('should render a DefinitionList with where the value is "Yes" for "true"', function () {
+                var wrapper = mountComponent({
+                    schema: { readOnly: true, title: 'Some Title', type: 'boolean' },
+                    model: true,
+                });
+                var definitionList = wrapper.find(DefinitionList);
+                expect(definitionList.props('definitions').definitions).toMatchObject([
+                    {
+                        title: 'Some Title',
+                        value: 'Yes',
+                    },
+                ]);
+            });
+            it('should render a DefinitionList with where the value is "No" for "false"', function () {
+                var wrapper = mountComponent({
+                    schema: { readOnly: true, title: 'Some Title', type: 'boolean' },
+                    model: false,
+                });
+                var definitionList = wrapper.find(DefinitionList);
+                expect(definitionList.props('definitions').definitions).toMatchObject([
+                    {
+                        title: 'Some Title',
+                        value: 'No',
+                    },
+                ]);
+            });
+        });
+        describe('when model is null', function () {
+            it('should render a DefinitionList with one title/value, where the value is an empty string', function () {
+                var wrapper = mountComponent({
+                    schema: { readOnly: true, title: 'Some Title', type: 'string' },
+                    model: null,
+                });
+                var definitionList = wrapper.find(DefinitionList);
+                expect(definitionList.props('definitions').definitions).toMatchObject([
+                    {
+                        title: 'Some Title',
+                        value: '',
+                    },
+                ]);
+            });
+        });
+    });
+    describe('when schema is oneOf a of basic type using "const"', function () {
+        it('displays the value from the selected option, matching by const value, using title and description', function () {
+            var wrapper = mountComponent({
+                schema: {
+                    readOnly: true,
+                    title: 'Currency',
+                    type: 'string',
+                    oneOf: [
+                        {
+                            title: 'GBP',
+                            description: 'British pound',
+                            const: 'GBP',
+                        },
+                        {
+                            title: 'USD',
+                            description: 'United States dollar',
+                            const: 'USD',
+                        },
+                    ],
+                },
+                model: 'USD',
+            });
+            var definitionList = wrapper.find(DefinitionList);
+            expect(definitionList.props('definitions').definitions).toMatchObject([
+                {
+                    title: 'Currency',
+                    value: 'USD - United States dollar',
+                },
+            ]);
+        });
+    });
+});

package/build/legacy/jsonSchemaForm/readOnlySchema/index.js

@@ -0,0 +1 @@
+export { default } from './ReadOnlySchema';

package/build/legacy/jsonSchemaForm/schemaFormControl/SchemaFormControl.js

@@ -0,0 +1,138 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { FormControlType } from '../../common/constants';
+import { isOneOfSchema, isStringSchema } from '../../common/utils';
+import { getValidBasicModelOrNull, isNull, isUndefined } from '../../common/validators';
+import FormControl from '../../formControl';
+import { mapConstSchemaToOption, mapSchemaToUploadOptions } from './utils';
+import { useLogger } from '../../common/contexts';
+var isNativeInput = function (propsSchemaType) {
+    return propsSchemaType === 'string' || propsSchemaType === 'number';
+};
+export var getControlType = function (schema) {
+    if (isOneOfSchema(schema)) {
+        if (schema.control === FormControlType.TAB && schema.oneOf.length > 3) {
+            return FormControlType.SELECT;
+        }
+        if (schema.control == null || !Object.values(FormControlType).includes(schema.control)) {
+            return FormControlType.SELECT;
+        }
+        return schema.control;
+    }
+    if (isStringSchema(schema)) {
+        return getStringSchemaControlType(schema);
+    }
+    // We should really check if the control is known, but I don't want to break behaviour so I'm leaving it as is for now
+    if ('control' in schema && schema.control) {
+        return schema.control;
+    }
+    if (schema.type === 'boolean') {
+        return 'checkbox';
+    }
+    if (schema.type === 'integer') {
+        return 'number';
+    }
+    return schema.type;
+};
+export var getStringSchemaControlType = function (_a) {
+    var format = _a.format, control = _a.control;
+    if (control) {
+        return stringControlToFormControlType[control] || control;
+    }
+    if (format) {
+        return stringFormatToFormControlType[format] || 'text';
+    }
+    return 'text';
+};
+var stringControlToFormControlType = {
+    'date-lookup': 'date-lookup',
+    password: 'password',
+    textarea: 'textarea',
+    email: 'email',
+    numeric: 'numeric',
+    'phone-number': 'tel',
+};
+var stringFormatToFormControlType = {
+    date: 'date',
+    // Legacy formats
+    email: 'email',
+    base64url: 'file',
+    password: 'password',
+    'phone-number': 'tel',
+};
+var getOptions = function (schema, controlType) {
+    if (schema.oneOf) {
+        return schema.oneOf.map(function (childSchema) { return mapConstSchemaToOption(childSchema, controlType); });
+    }
+    return null;
+};
+function SchemaFormControl(props) {
+    var id = props.id, schema = props.schema, value = props.value, disabled = props.disabled, required = props.required, onChange = props.onChange, onFocus = props.onFocus, onBlur = props.onBlur, onSearchChange = props.onSearchChange, describedBy = props.describedBy;
+    var log = useLogger();
+    var getSanitisedValue = function (value) {
+        return isNativeInput(schema.type) && (isNull(value) || isUndefined(value)) ? '' : value;
+    };
+    var onModelChange = function (value, type, metadata) {
+        onChange(getValidBasicModelOrNull(value, schema), type, metadata);
+    };
+    var controlType = getControlType(schema);
+    useEffect(function () {
+        warnIfInvalidSchema(schema, log, controlType);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [JSON.stringify(schema), log, controlType]);
+    var options = schema.values || getOptions(schema, controlType);
+    var events = {
+        onFocus: onFocus,
+        onBlur: onBlur,
+        onSearchChange: onSearchChange,
+        onChange: onModelChange,
+    };
+    var safeValue = getSanitisedValue(value);
+    var controlProps = {
+        id: id,
+        name: id,
+        label: schema.title,
+        description: schema.description,
+        options: options || [],
+        placeholder: schema.placeholder,
+        autoComplete: !schema.help,
+        autocompleteHint: schema.autocompleteHint,
+        disabled: disabled || schema.disabled,
+        displayPattern: schema.displayFormat,
+        // TODO: LOW avoid type assertion below
+        uploadProps: mapSchemaToUploadOptions(schema),
+        describedBy: describedBy,
+        required: required,
+    };
+    return (_jsx("div", { "aria-describedby": describedBy, children: _jsx(FormControl, __assign({ type: controlType, value: safeValue }, events, controlProps)) }));
+}
+SchemaFormControl.defaultProps = {
+    value: null,
+    onFocus: null,
+    onBlur: null,
+    onSearchChange: null,
+    disabled: false,
+};
+var warnIfInvalidSchema = function (schema, log, controlType) {
+    if (isOneOfSchema(schema) && schema.oneOf.length === 2 && !schema.control) {
+        log.warning('Deprecation warning', 'A oneOf schema with 2 options and no control type currently renders as a "radio" but will be changed to render as a "select". Please specify control radio to retain the existing behaviour.');
+    }
+    if (controlType === 'file') {
+        log.warning('Deprecation warning', 'Please use a persist-async blob schema instead of string with base64url for file uploads. The base64url does not perform well on low end devices. Support for this schema will be removed in a later release.');
+    }
+    if (schema.values) {
+        log.warning('Deprecated schema', 'Schema.values is a legacy approach. Please use oneOf.');
+    }
+};
+export default SchemaFormControl;