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

package/build/revamp/wise/renderers/SelectInputRenderer/RadioInputRendererComponent.spec.js

@@ -0,0 +1,76 @@
+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 { screen } from '@testing-library/react';
+import { renderWithProviders } from '../../../../test-utils';
+import { RadioInputRendererComponent } from './RadioInputRendererComponent';
+describe('RadioInputRendererComponent', function () {
+    var getProps = function () { return ({
+        type: 'input-select',
+        id: 'id',
+        children: [],
+        description: 'description',
+        autoComplete: 'off',
+        required: false,
+        disabled: false,
+        error: 'error',
+        help: 'help',
+        label: 'label',
+        options: [
+            {
+                title: 'Option A',
+                disabled: false,
+            },
+            {
+                title: 'Option B',
+                disabled: false,
+            },
+        ],
+        selectedIndex: null,
+        onSelect: jest.fn(),
+        onFocus: jest.fn(),
+        onBlur: jest.fn(),
+    }); };
+    describe('When the value is updated from outside the UI component', function () {
+        it('should update the selected value', function () {
+            var props = getProps();
+            var rerender = renderWithProviders(_jsx(RadioInputRendererComponent, __assign({}, props))).rerender;
+            expect(screen.getByLabelText('Option A')).not.toBeChecked();
+            expect(screen.getByLabelText('Option B')).not.toBeChecked();
+            rerender(_jsx(RadioInputRendererComponent, __assign({}, props, { selectedIndex: 1 })));
+            expect(screen.getByLabelText('Option B')).toBeChecked();
+        });
+    });
+    describe('When the options are updated (e.g. refresh-on-change)', function () {
+        it('should update the options', function () {
+            var props = __assign(__assign({}, getProps()), { selectedIndex: 1 });
+            var rerender = renderWithProviders(_jsx(RadioInputRendererComponent, __assign({}, props))).rerender;
+            expect(screen.getByLabelText('Option B')).toBeChecked();
+            var updatedProps = __assign(__assign({}, props), { options: [
+                    {
+                        title: 'Option A',
+                        disabled: false,
+                    },
+                    {
+                        title: 'Option NEW',
+                        disabled: false,
+                    },
+                    {
+                        title: 'Option B',
+                        disabled: false,
+                    },
+                ] });
+            rerender(_jsx(RadioInputRendererComponent, __assign({}, updatedProps)));
+            expect(screen.getByLabelText('Option NEW')).toBeChecked();
+        });
+    });
+});

package/build/revamp/wise/renderers/SelectInputRenderer/SegmentedInputRendererComponent.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import FieldInput from '../components/FieldInput';
+import { SegmentedControl } from '@transferwise/components';
+export function SegmentedInputRendererComponent(props) {
+    var id = props.id, children = props.children, description = props.description, error = props.error, help = props.help, label = props.label, options = props.options, selectedIndex = props.selectedIndex, onSelect = props.onSelect;
+    useEffect(function () {
+        if (!isValidIndex(selectedIndex, options.length)) {
+            onSelect(0);
+        }
+    }, [selectedIndex, onSelect, options.length]);
+    return (_jsxs(_Fragment, { children: [_jsx(FieldInput, { id: id, label: label, help: help, description: description, error: error, children: _jsx(SegmentedControl, { name: "".concat(id, "-segmented-control"), value: String(selectedIndex), mode: "view", segments: options.map(function (option, index) { return ({
+                        id: String(index),
+                        value: String(index),
+                        label: option.title,
+                        controls: "".concat(id, "-children"),
+                    }); }), onChange: function (value) { return onSelect(Number(value)); } }) }), _jsx("div", { id: "".concat(id, "-children"), children: children })] }));
+}
+var isValidIndex = function (index, options) {
+    return index !== null && index >= 0 && index < options;
+};

package/build/revamp/wise/renderers/SelectInputRenderer/SelectInputRenderer.js

@@ -0,0 +1,33 @@
+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 { RadioInputRendererComponent } from './RadioInputRendererComponent';
+import { TabInputRendererComponent } from './TabInputRendererComponent';
+import { SelectInputRendererComponent } from './SelectInputRendererComponent';
+import { SegmentedInputRendererComponent } from './SegmentedInputRendererComponent';
+var SelectInputRenderer = {
+    canRenderType: 'input-select',
+    render: function (props) {
+        switch (props.control) {
+            case 'radio':
+                return _jsx(RadioInputRendererComponent, __assign({}, props));
+            case 'tab':
+                return props.options.length > 3 ? (_jsx(SelectInputRendererComponent, __assign({}, props))) : (_jsx(TabInputRendererComponent, __assign({}, props)));
+            case 'segmented':
+                return props.options.length > 3 ? (_jsx(SelectInputRendererComponent, __assign({}, props))) : (_jsx(SegmentedInputRendererComponent, __assign({}, props)));
+            case 'select':
+            default:
+                return _jsx(SelectInputRendererComponent, __assign({}, props));
+        }
+    },
+};
+export default SelectInputRenderer;

package/build/revamp/wise/renderers/SelectInputRenderer/SelectInputRendererComponent.js

@@ -0,0 +1,56 @@
+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);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { SelectInput, SelectInputOptionContent } from '@transferwise/components';
+import FieldInput from '../components/FieldInput';
+import { SelectTriggerMedia } from './SelectTriggerMedia';
+import { OptionMedia } from './OptionMedia';
+export function SelectInputRendererComponent(props) {
+    var id = props.id, children = props.children, description = props.description, disabled = props.disabled, error = props.error, help = props.help, label = props.label, options = props.options, placeholder = props.placeholder, required = props.required, selectedIndex = props.selectedIndex, onSelect = props.onSelect;
+    var items = options.map(function (option, index) {
+        var _a, _b, _c;
+        return ({
+            type: 'option',
+            value: index,
+            filterMatchers: __spreadArray(__spreadArray([], ((_a = option.keywords) !== null && _a !== void 0 ? _a : []), true), [(_b = option.title) !== null && _b !== void 0 ? _b : '', (_c = option.description) !== null && _c !== void 0 ? _c : ''], false),
+            disabled: option.disabled,
+        });
+    });
+    var renderValue = function (index, withinTrigger) {
+        var option = index >= 0 ? options[index] : null;
+        if (option === null) {
+            return null;
+        }
+        var contentProps = withinTrigger
+            ? {
+                title: option.title,
+                note: option.description,
+                icon: _jsx(SelectTriggerMedia, { icon: option.icon, image: option.image }),
+            }
+            : {
+                title: option.title,
+                description: option.description,
+                icon: _jsx(OptionMedia, { icon: option.icon, image: option.image }),
+            };
+        return _jsx(SelectInputOptionContent, __assign({}, contentProps));
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(FieldInput, { id: id, label: label, help: help, description: description, error: error, children: _jsx(SelectInput, { name: id, placeholder: placeholder, items: items, disabled: disabled, value: selectedIndex, renderValue: renderValue, filterable: items.length >= 8, onChange: onSelect, onClear: required ? undefined : function () { return onSelect(null); } }) }), children] }));
+}

package/build/revamp/wise/renderers/SelectInputRenderer/SelectTriggerMedia.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Avatar, AvatarType } from '@transferwise/components';
+import DynamicIcon from '../components/icon/DynamicIcon';
+export function SelectTriggerMedia(_a) {
+    var icon = _a.icon, image = _a.image;
+    if (image === null || image === void 0 ? void 0 : image.url) {
+        return null;
+    }
+    if (icon && 'name' in icon) {
+        return (_jsx(Avatar, { type: AvatarType.ICON, size: 24, children: _jsx(DynamicIcon, { name: icon.name }) }));
+    }
+    if (icon && 'text' in icon) {
+        return (_jsx(Avatar, { type: AvatarType.ICON, size: 24, children: icon.text }));
+    }
+    return null;
+}

package/build/revamp/wise/renderers/SelectInputRenderer/TabInputRendererComponent.js

@@ -0,0 +1,22 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tabs } from '@transferwise/components';
+import { useEffect } from 'react';
+import FieldInput from '../components/FieldInput';
+export function TabInputRendererComponent(props) {
+    var id = props.id, children = props.children, description = props.description, disabled = props.disabled, error = props.error, help = props.help, label = props.label, options = props.options, selectedIndex = props.selectedIndex, onSelect = props.onSelect;
+    useEffect(function () {
+        if (!isValidIndex(selectedIndex, options.length)) {
+            onSelect(0);
+        }
+    }, [selectedIndex, onSelect, options.length]);
+    return (_jsxs(_Fragment, { children: [_jsx(FieldInput, { id: id, label: label, help: help, description: description, error: error, children: _jsx(Tabs, { name: id, selected: selectedIndex !== null && selectedIndex !== void 0 ? selectedIndex : 0, tabs: options.map(function (option) { return ({
+                        title: option.title,
+                        // if we pass null, we get some props-types console errors
+                        // eslint-disable-next-line react/jsx-no-useless-fragment
+                        content: _jsx(_Fragment, {}),
+                        disabled: option.disabled || disabled,
+                    }); }), onTabSelect: onSelect }) }), children] }));
+}
+var isValidIndex = function (index, options) {
+    return index !== null && index >= 0 && index < options;
+};

package/build/revamp/wise/renderers/StatusListRenderer.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Header, Summary } from '@transferwise/components';
+import DynamicIcon from './components/icon/DynamicIcon';
+import { getMargin } from './utils/layout-utils';
+var StatusListRenderer = {
+    canRenderType: 'status-list',
+    render: function (_a) {
+        var margin = _a.margin, items = _a.items, title = _a.title;
+        return (_jsxs("div", { className: getMargin(margin), children: [title ? _jsx(Header, { title: title }) : null, items.map(function (_a) {
+                    var description = _a.description, icon = _a.icon, status = _a.status, itemTitle = _a.title;
+                    return (_jsx(Summary, { title: itemTitle, description: description, icon: icon && 'name' in icon ? _jsx(DynamicIcon, { name: icon.name }) : null, status: mapStatus(status) }, "".concat(title, "/").concat(description || '')));
+                })] }));
+    },
+};
+export default StatusListRenderer;
+export var mapStatus = function (status) {
+    if (status === 'not-done') {
+        return 'notDone';
+    }
+    return status;
+};

package/build/revamp/wise/renderers/TextInputRenderer.js

@@ -0,0 +1,35 @@
+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);
+};
+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 { jsx as _jsx } from "react/jsx-runtime";
+import VariableTextInput from './components/VariableTextInput';
+import FieldInput from './components/FieldInput';
+var TextInputRenderer = {
+    canRenderType: 'input-text',
+    render: function (props) {
+        var id = props.id, control = props.control, label = props.label, description = props.description, help = props.help, error = props.error, type = props.type, initialValue = props.value, rest = __rest(props, ["id", "control", "label", "description", "help", "error", "type", "value"]);
+        var value = initialValue !== null && initialValue !== void 0 ? initialValue : '';
+        var inputProps = __assign(__assign({}, rest), { value: value, id: id });
+        return (_jsx(FieldInput, { id: id, label: label, description: description, error: error, help: help, children: _jsx(VariableTextInput, { control: control, inputProps: inputProps }) }));
+    },
+};
+export default TextInputRenderer;

package/build/revamp/wise/renderers/UploadInputRenderer.js

@@ -0,0 +1,136 @@
+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);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 { jsx as _jsx } from "react/jsx-runtime";
+import { Upload, UploadInput } from '@transferwise/components';
+import FieldInput from './components/FieldInput';
+import UploadFieldInput from './components/UploadFieldInput';
+import { getAcceptsString, toFile, toKilobytes } from './utils/file-utils';
+import { getRandomId } from './utils/getRandomId';
+var UploadInputRenderer = {
+    canRenderType: 'input-upload',
+    render: function (props) {
+        var id = props.id, accepts = props.accepts, error = props.error, label = props.label, description = props.description, disabled = props.disabled, maxSize = props.maxSize, onUpload = props.onUpload;
+        var onUploadFile = function (formData) { return __awaiter(void 0, void 0, void 0, function () {
+            var file;
+            return __generator(this, function (_a) {
+                file = formData.get('file');
+                return [2 /*return*/, onUpload(file).then(function () { return ({
+                        id: getRandomId(),
+                    }); })];
+            });
+        }); };
+        var onDeleteFile = function () { return __awaiter(void 0, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, onUpload(null)];
+                    case 1:
+                        _a.sent();
+                        return [2 /*return*/];
+                }
+            });
+        }); };
+        return (
+        // We don't pass help here as there is no sensible place to display it
+        _jsx(UploadFieldInput, { id: id, label: undefined, description: undefined, error: error, children: _jsx(UploadInput, { id: id, description: description, disabled: disabled, fileTypes: getAcceptsString(accepts), sizeLimit: maxSize ? toKilobytes(maxSize) : undefined, uploadButtonTitle: label, onDeleteFile: onDeleteFile, onUploadFile: onUploadFile }) }));
+    },
+};
+var LargeUploadRenderer = {
+    canRenderType: 'input-upload',
+    canRender: function (props) { return props.control === 'upload-large'; },
+    render: function (props) {
+        var id = props.id, accepts = props.accepts, control = props.control, label = props.label, description = props.description, disabled = props.disabled, error = props.error, help = props.help, maxSize = props.maxSize, type = props.type, onUpload = props.onUpload, rest = __rest(props, ["id", "accepts", "control", "label", "description", "disabled", "error", "help", "maxSize", "type", "onUpload"]);
+        var uploadProps = __assign(__assign({}, rest), { id: id, name: id });
+        var onUploadFile = function (file, fileName) { return __awaiter(void 0, void 0, void 0, function () {
+            var convertedFile, _a, e_1;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _b.trys.push([0, 5, , 7]);
+                        if (!file) return [3 /*break*/, 2];
+                        return [4 /*yield*/, toFile(file, fileName)];
+                    case 1:
+                        _a = _b.sent();
+                        return [3 /*break*/, 3];
+                    case 2:
+                        _a = null;
+                        _b.label = 3;
+                    case 3:
+                        convertedFile = _a;
+                        return [4 /*yield*/, onUpload(convertedFile)];
+                    case 4:
+                        _b.sent();
+                        return [3 /*break*/, 7];
+                    case 5:
+                        e_1 = _b.sent();
+                        return [4 /*yield*/, onUpload(null)];
+                    case 6:
+                        _b.sent();
+                        throw e_1;
+                    case 7: return [2 /*return*/];
+                }
+            });
+        }); };
+        return (_jsx(FieldInput, { id: id, label: label, description: description, error: error, help: help, children: _jsx(Upload, __assign({}, uploadProps, { usAccept: getAcceptsString(accepts), usDisabled: disabled, onSuccess: onUploadFile, onFailure: function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+                    return [2 /*return*/, onUpload(null)];
+                }); }); }, onCancel: function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+                    return [2 /*return*/, onUpload(null)];
+                }); }); } })) }));
+    },
+};
+export { UploadInputRenderer, LargeUploadRenderer };

package/build/revamp/wise/renderers/components/FieldInput.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Field } from '@wise/forms';
+import { LabelContentWithHelp } from './LabelContentWithHelp';
+function FieldInput(_a) {
+    var id = _a.id, children = _a.children, label = _a.label, error = _a.error, description = _a.description, help = _a.help;
+    var labelContent = label && help ? _jsx(LabelContentWithHelp, { text: label, help: help }) : label;
+    return (_jsx(Field, { id: id, label: labelContent, hint: description, error: error, children: children }));
+}
+export default FieldInput;

package/build/revamp/wise/renderers/components/Help.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Info, Markdown } from '@transferwise/components';
+import { useIntl } from 'react-intl';
+import helpMessages from '../../../../common/messages/help.messages';
+function Help(_a) {
+    var help = _a.help;
+    var intl = useIntl();
+    return (_jsx(Info, { className: "m-l-1", content: _jsx(Markdown, { config: { link: { target: '_blank' } }, children: help }), presentation: "POPOVER", size: "sm", "aria-label": intl.formatMessage(helpMessages.helpAria) }));
+}
+export default Help;

package/build/revamp/wise/renderers/components/LabelContentWithHelp.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Help from './Help';
+export function LabelContentWithHelp(_a) {
+    var text = _a.text, help = _a.help;
+    return (_jsxs("div", { children: [text, _jsx(Help, { help: help })] }));
+}

package/build/revamp/wise/renderers/components/UploadFieldInput.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { InlineAlert } from '@transferwise/components';
+import classNames from 'classnames';
+import { LabelContentWithHelp } from './LabelContentWithHelp';
+// Unfortunately we can't use FieldInput for uploads, as it doesn't play nicely with the input
+function UploadFieldInput(_a) {
+    var id = _a.id, children = _a.children, label = _a.label, description = _a.description, error = _a.error, help = _a.help;
+    var labelContent = label && help ? _jsx(LabelContentWithHelp, { text: label, help: help }) : label;
+    var descriptionId = description ? "".concat(id, "-description") : undefined;
+    return (_jsxs("div", { className: classNames('form-group d-block', {
+            'has-error': !!error,
+        }), children: [_jsx("label", { htmlFor: id, className: "control-label", children: labelContent }), children, error && (_jsx(InlineAlert, { type: "negative", id: descriptionId, children: error }))] }));
+}
+export default UploadFieldInput;

package/build/revamp/wise/renderers/components/VariableDateInput.js

@@ -0,0 +1,36 @@
+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";
+/* eslint-disable @typescript-eslint/non-nullable-type-assertion-style */
+import { DateInput, DateLookup } from '@transferwise/components';
+import { dateStringToDateOrNull, dateToDateString } from '../utils/value-utils';
+function VariableDateInput(_a) {
+    var control = _a.control, inputProps = _a.inputProps;
+    var autoComplete = inputProps.autoComplete, minimumDate = inputProps.minimumDate, maximumDate = inputProps.maximumDate, placeholder = inputProps.placeholder, disabled = inputProps.disabled, onBlur = inputProps.onBlur, onChange = inputProps.onChange, onFocus = inputProps.onFocus;
+    if (control === 'date-lookup') {
+        return (_jsx(DateLookup
+        // DateLookup handles null values perfectly well, it's just typed incorrectly
+        , { 
+            // DateLookup handles null values perfectly well, it's just typed incorrectly
+            value: dateStringToDateOrNull(inputProps.value), min: dateStringToDateOrNull(minimumDate), max: dateStringToDateOrNull(maximumDate), placeholder: placeholder, disabled: disabled, onChange: function (date) {
+                onChange(date !== null ? dateToDateString(date) : null);
+            }, onBlur: onBlur, onFocus: onFocus }));
+    }
+    return (_jsx(DateInput, __assign({}, inputProps, { dayAutoComplete: getAutocompleteString(autoComplete, 'day'), yearAutoComplete: getAutocompleteString(autoComplete, 'year') })));
+}
+var getAutocompleteString = function (value, suffix) {
+    if (value === 'bday') {
+        return "".concat(value, "-").concat(suffix);
+    }
+    return undefined;
+};
+export default VariableDateInput;

package/build/revamp/wise/renderers/components/VariableTextInput.js

@@ -0,0 +1,69 @@
+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);
+};
+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 { jsx as _jsx } from "react/jsx-runtime";
+import { Input, InputWithDisplayFormat, PhoneNumberInput as PhoneNumber, TextArea, TextareaWithDisplayFormat, } from '@transferwise/components';
+import { onWheel } from '../utils/input-utils';
+import { numericValueOrNull } from '../utils/value-utils';
+function VariableTextInput(_a) {
+    var control = _a.control, inputProps = _a.inputProps;
+    switch (control) {
+        case 'password':
+            return _jsx(TextInput, __assign({ type: "password" }, inputProps));
+        case 'email':
+            return _jsx(TextInput, __assign({ type: "email" }, inputProps));
+        case 'textarea':
+            return _jsx(TextAreaInput, __assign({}, inputProps));
+        case 'numeric':
+            return _jsx(NumericInput, __assign({ type: "number" }, inputProps));
+        case 'phone-number':
+            return _jsx(PhoneNumberInput, __assign({}, inputProps));
+        default:
+            return _jsx(TextInput, __assign({ type: "text" }, inputProps));
+    }
+}
+function TextInput(_a) {
+    var id = _a.id, displayFormat = _a.displayFormat, onChange = _a.onChange, rest = __rest(_a, ["id", "displayFormat", "onChange"]);
+    if (typeof displayFormat === 'string') {
+        var inputProps = __assign({ id: id, name: id, className: 'form-control' }, rest);
+        return (_jsx(InputWithDisplayFormat, __assign({ displayPattern: displayFormat, onChange: function (newValue) { return onChange(newValue); } }, inputProps)));
+    }
+    return _jsx(Input, __assign({ id: id, name: id, onChange: function (e) { return onChange(e.target.value); } }, rest));
+}
+function TextAreaInput(_a) {
+    var id = _a.id, displayFormat = _a.displayFormat, onChange = _a.onChange, rest = __rest(_a, ["id", "displayFormat", "onChange"]);
+    var textAreaProps = __assign({ id: id, name: id }, rest);
+    return typeof displayFormat === 'string' ? (_jsx(TextareaWithDisplayFormat, __assign({ displayPattern: displayFormat, onChange: function (newValue) { return onChange(newValue); } }, textAreaProps))) : (_jsx(TextArea, __assign({ onChange: function (e) { return onChange(e.target.value); } }, textAreaProps)));
+}
+function NumericInput(_a) {
+    var id = _a.id, displayFormat = _a.displayFormat, onChange = _a.onChange, rest = __rest(_a, ["id", "displayFormat", "onChange"]);
+    var numericProps = __assign({ id: id, name: id, onWheel: onWheel }, rest);
+    return typeof displayFormat === 'string' ? (_jsx(InputWithDisplayFormat, __assign({ displayPattern: displayFormat, onChange: function (newValue) { return onChange(numericValueOrNull(newValue)); } }, numericProps))) : (_jsx(Input, __assign({ onChange: function (_a) {
+            var newValue = _a.target.value;
+            return onChange(numericValueOrNull(newValue));
+        } }, numericProps)));
+}
+function PhoneNumberInput(_a) {
+    var value = _a.value, rest = __rest(_a, ["value"]);
+    return _jsx(PhoneNumber, __assign({ initialValue: value }, rest));
+}
+export default VariableTextInput;

package/build/revamp/wise/renderers/components/icon/DynamicIcon.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FlagIcon, isFlagIcon } from './FlagIcon';
+import { NamedIcon, isNamedIcon } from './NamedIcon';
+function DynamicIcon(_a) {
+    var name = _a.name;
+    if (isFlagIcon(name)) {
+        return _jsx(FlagIcon, { name: name });
+    }
+    if (isNamedIcon(name)) {
+        return _jsx(NamedIcon, { name: name });
+    }
+    return null;
+}
+export function isValidIconName(name) {
+    return isNamedIcon(name) || isFlagIcon(name);
+}
+export default DynamicIcon;

package/build/revamp/wise/renderers/components/icon/FlagIcon.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Flag } from '@wise/art';
+export var isFlagIcon = function (name) { return name.startsWith('flag-'); };
+export function FlagIcon(_a) {
+    var name = _a.name;
+    if (!isFlagIcon(name)) {
+        return null;
+    }
+    var code = name.substring(5);
+    return _jsx(Flag, { code: code });
+}

package/build/revamp/wise/renderers/components/icon/NamedIcon.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as icons from '@transferwise/icons';
+export var isNamedIcon = function (name) {
+    var iconName = toCapitalisedCamelCase(name);
+    return Object.keys(icons).includes(iconName);
+};
+export function NamedIcon(_a) {
+    var name = _a.name;
+    if (!isNamedIcon(name)) {
+        return null;
+    }
+    var iconName = toCapitalisedCamelCase(name);
+    var Icon = icons[iconName];
+    return _jsx(Icon, { size: 24 });
+}
+var toCapitalisedCamelCase = function (value) {
+    return value.split('-').map(capitaliseFirstChar).join('');
+};
+var capitaliseFirstChar = function (value) { return "".concat(value[0].toUpperCase()).concat(value.slice(1)); };