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

package/build/revamp/utils/type-validators.spec.js

@@ -0,0 +1,163 @@
+import { isString, isNumber, isInteger, isBoolean, isArray, isObject, isNull, isUndefined, isNullish, } from './type-validators';
+describe('type-validators', function () {
+    describe('isString', function () {
+        it('should return true when the value is a string', function () {
+            expect(isString('a')).toBe(true);
+            expect(isString('')).toBe(true);
+        });
+        it('should return false when the value is a different primitive type', function () {
+            expect(isString(1)).toBe(false);
+            expect(isString(true)).toBe(false);
+            expect(isString(undefined)).toBe(false);
+            expect(isString(null)).toBe(false);
+            expect(isString(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isString([])).toBe(false);
+            expect(isString({})).toBe(false);
+        });
+    });
+    describe('isNumber', function () {
+        it('should return true when the value is a number', function () {
+            expect(isNumber(1)).toBe(true);
+            expect(isNumber(0)).toBe(true);
+            expect(isNumber(1.23)).toBe(true);
+            expect(isNumber(-1)).toBe(true);
+        });
+        it('should return false when the value is a different primitive type', function () {
+            expect(isNumber('a')).toBe(false);
+            expect(isNumber(true)).toBe(false);
+            expect(isNumber(undefined)).toBe(false);
+            expect(isNumber(null)).toBe(false);
+            expect(isNumber(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isNumber([])).toBe(false);
+            expect(isNumber({})).toBe(false);
+        });
+    });
+    describe('isInteger', function () {
+        it('should return true when the value is a integer', function () {
+            expect(isInteger(1)).toBe(true);
+            expect(isInteger(0)).toBe(true);
+            expect(isInteger(-1)).toBe(true);
+        });
+        it('should return false when the value is a float', function () {
+            expect(isInteger(1.23)).toBe(false);
+            expect(isInteger(-1.23)).toBe(false);
+        });
+        it('should return false when the value is a different primitive type', function () {
+            expect(isInteger('a')).toBe(false);
+            expect(isInteger(true)).toBe(false);
+            expect(isInteger(undefined)).toBe(false);
+            expect(isInteger(null)).toBe(false);
+            expect(isInteger(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isInteger([])).toBe(false);
+            expect(isInteger({})).toBe(false);
+        });
+    });
+    describe('isBoolean', function () {
+        it('should return true when the value is a boolean', function () {
+            expect(isBoolean(true)).toBe(true);
+            expect(isBoolean(false)).toBe(true);
+        });
+        it('should return false when the value is a different primitive type', function () {
+            expect(isBoolean(1)).toBe(false);
+            expect(isBoolean('a')).toBe(false);
+            expect(isBoolean(undefined)).toBe(false);
+            expect(isBoolean(null)).toBe(false);
+            expect(isBoolean(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isBoolean([])).toBe(false);
+            expect(isBoolean({})).toBe(false);
+        });
+    });
+    describe('isArray', function () {
+        it('should return true when the value is an array', function () {
+            expect(isArray([1])).toBe(true);
+            expect(isArray([])).toBe(true);
+        });
+        it('should return false when the value is null or undefined', function () {
+            expect(isArray(undefined)).toBe(false);
+            expect(isArray(null)).toBe(false);
+        });
+        it('should return false when the value is a different primitive type', function () {
+            expect(isArray(1)).toBe(false);
+            expect(isArray('a')).toBe(false);
+            expect(isArray(true)).toBe(false);
+            expect(isArray(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is an object', function () {
+            expect(isArray({})).toBe(false);
+        });
+    });
+    describe('isObject', function () {
+        it('should return true when the value is an object', function () {
+            expect(isObject({ a: 1 })).toBe(true);
+            expect(isObject({})).toBe(true);
+        });
+        it('should return false when the value is an array', function () {
+            expect(isObject([])).toBe(false);
+        });
+        it('should return false when the value is a primitive', function () {
+            expect(isObject(1)).toBe(false);
+            expect(isObject('a')).toBe(false);
+            expect(isObject(true)).toBe(false);
+            expect(isObject(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is null or undefined', function () {
+            expect(isObject(undefined)).toBe(false);
+            expect(isObject(null)).toBe(false);
+        });
+    });
+    describe('isNull', function () {
+        it('should return true when the value is null', function () {
+            expect(isNull(null)).toBe(true);
+        });
+        it('should return false when the value is undefined', function () {
+            expect(isNull(undefined)).toBe(false);
+        });
+        it('should return false when the value is a primitive', function () {
+            expect(isNull(0)).toBe(false);
+            expect(isNull(false)).toBe(false);
+            expect(isNull(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isNull([])).toBe(false);
+            expect(isNull({})).toBe(false);
+        });
+    });
+    describe('isUndefined', function () {
+        it('should return true when the value is undefined', function () {
+            expect(isUndefined(undefined)).toBe(true);
+        });
+        it('should return false when the value is a primitive', function () {
+            expect(isUndefined(0)).toBe(false);
+            expect(isUndefined(false)).toBe(false);
+            expect(isUndefined(null)).toBe(false);
+            expect(isUndefined(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isNull([])).toBe(false);
+            expect(isNull({})).toBe(false);
+        });
+    });
+    describe('isNullish', function () {
+        it('should return true when the value is null or undefined', function () {
+            expect(isNullish(null)).toBe(true);
+            expect(isNullish(undefined)).toBe(true);
+        });
+        it('should return false when the value is a primitive', function () {
+            expect(isNullish(0)).toBe(false);
+            expect(isNullish(false)).toBe(false);
+            expect(isNullish(Number.NaN)).toBe(false);
+        });
+        it('should return false when the value is a complex type', function () {
+            expect(isNullish([])).toBe(false);
+            expect(isNullish({})).toBe(false);
+        });
+    });
+});

package/build/revamp/utils/useStableCallback.js

@@ -0,0 +1,21 @@
+import { useCallback, useLayoutEffect, useRef } from 'react';
+/**
+ * Returns a referentially stable function that always calls the latest function.
+ * @param handler
+ * @returns
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function useStableCallback(handler) {
+    var ref = useRef(handler);
+    useLayoutEffect(function () {
+        ref.current = handler;
+    });
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-return
+    return useCallback(function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        return (ref.current ? ref.current.apply(ref, args) : null);
+    }, []);
+}

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

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Alert } from '@transferwise/components';
+import { getMargin } from './utils/layout-utils';
+var AlertRenderer = {
+    canRenderType: 'alert',
+    render: function (_a) {
+        var context = _a.context, markdown = _a.markdown, margin = _a.margin;
+        return (_jsx(Alert, { type: context, className: getMargin(margin), message: markdown }));
+    },
+};
+export default AlertRenderer;

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

@@ -0,0 +1,34 @@
+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 FieldInput from './components/FieldInput';
+import { Checkbox } from '@transferwise/components';
+var BooleanInputRenderer = {
+    canRenderType: 'input-boolean',
+    render: function (props) {
+        var id = props.id, control = props.control, _a = props.label, label = _a === void 0 ? '' : _a, description = props.description, help = props.help, error = props.error, type = props.type, value = props.value, rest = __rest(props, ["id", "control", "label", "description", "help", "error", "type", "value"]);
+        var checkboxProps = __assign(__assign({}, rest), { label: label, secondary: description, checked: value });
+        return (_jsx(FieldInput, { id: id, label: "", description: "", error: error, help: help, children: _jsx(Checkbox, __assign({ id: id }, checkboxProps)) }));
+    },
+};
+export default BooleanInputRenderer;

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

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { getMargin } from './utils/layout-utils';
+var BoxRenderer = {
+    canRenderType: 'box',
+    render: function (_a) {
+        var _b;
+        var border = _a.border, children = _a.children, margin = _a.margin, width = _a.width;
+        var hasFixedWidth = width !== 'xl';
+        var contents = (_jsx("div", { className: classNames((_b = {
+                    'df-box-renderer-border': border
+                },
+                _b["df-box-renderer-width-".concat(width)] = hasFixedWidth,
+                _b[getMargin(margin)] = !hasFixedWidth,
+                _b)), children: children }));
+        return hasFixedWidth ? (_jsx("div", { className: classNames('df-box-renderer-fixed-width', getMargin(margin)), children: contents })) : (contents);
+    },
+};
+export default BoxRenderer;

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

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button } from '@transferwise/components';
+import { getMargin } from './utils/layout-utils';
+import { useLoadingContext } from './step/StepRendererContext';
+var ButtonRenderer = {
+    canRenderType: 'button',
+    render: ButtonRendererComponent,
+};
+function ButtonRendererComponent(_a) {
+    var control = _a.control, context = _a.context, disabled = _a.disabled, margin = _a.margin, title = _a.title, size = _a.size, onClick = _a.onClick;
+    var className = getMargin(margin);
+    var priority = mapControl(control);
+    // Button doesn't support tertiary buttons with a context, and will render as
+    // secondary. This is inconsistent with mobile, so for now we remove context
+    var type = priority === 'tertiary' ? undefined : mapContext(context);
+    var isLoading = useLoadingContext().isLoading;
+    return (_jsx(Button, { block: true, className: className, disabled: isLoading || disabled, priority: mapControl(control), size: mapSize(size), type: type, onClick: onClick, children: title }));
+}
+var mapContext = function (context) {
+    switch (context) {
+        case 'neutral':
+        case 'warning':
+            return 'accent';
+        default:
+            return context;
+    }
+};
+var mapControl = function (control) {
+    switch (control) {
+        case 'primary':
+        case 'tertiary':
+            return control;
+        default:
+            return 'secondary';
+    }
+};
+var mapSize = function (size) {
+    if (!size) {
+        return undefined;
+    }
+    switch (size) {
+        case 'xs':
+        case 'sm':
+            return 'sm';
+        case 'lg':
+        case 'xl':
+            return 'lg';
+        case 'md':
+        default:
+            return 'md';
+    }
+};
+export default ButtonRenderer;

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

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { getMargin } from './utils/layout-utils';
+var ColumnsRenderer = {
+    canRenderType: 'columns',
+    render: function (_a) {
+        var bias = _a.bias, margin = _a.margin, startChildren = _a.startChildren, endChildren = _a.endChildren;
+        return (_jsxs("div", { className: classNames('df-columns-renderer-container', getMargin(margin), {
+                'df-columns-renderer-bias-start': bias === 'start',
+                'df-columns-renderer-bias-end': bias === 'end',
+            }), children: [_jsx("div", { className: "df-columns-renderer-column", children: startChildren }), _jsx("div", { className: "df-columns-renderer-column", children: endChildren })] }));
+    },
+};
+export default ColumnsRenderer;

package/build/revamp/wise/renderers/DateInputRenderer.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 VariableDateInput from './components/VariableDateInput';
+import FieldInput from './components/FieldInput';
+var DateInputRenderer = {
+    canRenderType: 'input-date',
+    render: function (props) {
+        var id = props.id, control = props.control, label = props.label, description = props.description, error = props.error, type = props.type, help = props.help, initialValue = props.value, rest = __rest(props, ["id", "control", "label", "description", "error", "type", "help", "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(VariableDateInput, { control: control, inputProps: inputProps }) }));
+    },
+};
+export default DateInputRenderer;

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

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { NavigationOptionsList, NavigationOption } from '@transferwise/components';
+import { getMargin } from './utils/layout-utils';
+import { NavigationOptionMedia } from './components/icon/NavigationOptionMedia';
+import { useLoadingContext } from './step/StepRendererContext';
+var DecisionRenderer = {
+    canRenderType: 'decision',
+    render: DecisionRendererComponent,
+};
+export default DecisionRenderer;
+function DecisionRendererComponent(_a) {
+    var margin = _a.margin, options = _a.options;
+    var isLoading = useLoadingContext().isLoading;
+    return (_jsx("div", { className: getMargin(margin), children: _jsx(NavigationOptionsList, { children: options.map(function (_a) {
+                var description = _a.description, disabled = _a.disabled, icon = _a.icon, image = _a.image, title = _a.title, onClick = _a.onClick;
+                return (_jsx(NavigationOption, { title: title, content: description, disabled: isLoading || disabled, media: _jsx(NavigationOptionMedia, { icon: icon, image: image }), showMediaCircle: false, showMediaAtAllSizes: true, onClick: onClick }, JSON.stringify(title)));
+            }) }) }));
+}

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

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getMargin } from './utils/layout-utils';
+var DividerRenderer = {
+    canRenderType: 'divider',
+    render: function (_a) {
+        var margin = _a.margin;
+        return _jsx("hr", { className: "m-t-0 ".concat(getMargin(margin)) });
+    },
+};
+export default DividerRenderer;

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

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getMargin } from './utils/layout-utils';
+var FormRenderer = {
+    canRenderType: 'form',
+    render: function (_a) {
+        var children = _a.children, margin = _a.margin;
+        return _jsx("div", { className: getMargin(margin), children: children });
+    },
+};
+export default FormRenderer;

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

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Header } from '@transferwise/components';
+var FormSectionRenderer = {
+    canRenderType: 'form-section',
+    render: function (_a) {
+        var title = _a.title, description = _a.description, children = _a.children;
+        return (_jsxs("fieldset", { children: [title && (
+                // TODO - once section headers support help, we could show help in here
+                _jsx(Header
+                // FIXME - this should be a legend
+                , { 
+                    // FIXME - this should be a legend
+                    as: "h2", title: title })), description && _jsx("p", { children: description }), children] }));
+    },
+};
+export default FormSectionRenderer;

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

@@ -0,0 +1,57 @@
+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 { Display } from '@transferwise/components';
+import { getTextAlignmentAndMargin } from './utils/layout-utils';
+var HeadingRenderer = {
+    canRenderType: 'heading',
+    render: function (props) { return _jsx(Heading, __assign({}, props)); },
+};
+function Heading(props) {
+    var text = props.text, size = props.size, align = props.align, margin = props.margin, control = props.control;
+    var className = getTextAlignmentAndMargin({ align: align, margin: margin });
+    return control === 'display' ? (_jsx(DisplayHeading, { size: size, text: text, className: className })) : (_jsx(StandardHeading, { size: size, text: text, className: className }));
+}
+function DisplayHeading(_a) {
+    var size = _a.size, text = _a.text, className = _a.className;
+    return (_jsx(Display, { type: getDisplayType(size), className: className, children: text }));
+}
+function StandardHeading(_a) {
+    var size = _a.size, text = _a.text, className = _a.className;
+    switch (size) {
+        case 'xs':
+            return _jsx("h5", { className: className, children: text });
+        case 'sm':
+            return _jsx("h4", { className: className, children: text });
+        case 'lg':
+            return _jsx("h2", { className: className, children: text });
+        case 'xl':
+            return _jsx("h1", { className: className, children: text });
+        case 'md':
+        default:
+            return _jsx("h3", { className: className, children: text });
+    }
+}
+var getDisplayType = function (size) {
+    switch (size) {
+        case 'xs':
+        case 'sm':
+            return 'display-small';
+        case 'xl':
+        case 'lg':
+            return 'display-large';
+        case 'md':
+        default:
+            return 'display-medium';
+    }
+};
+export default HeadingRenderer;

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

@@ -0,0 +1,112 @@
+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 };
+    }
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Image } from '@transferwise/components';
+import { getMargin } from './utils/layout-utils';
+import { useEffect, useState } from 'react';
+import { isRelativePath } from '../../../common/utils/api-utils';
+import { useHttpClient } from '../../../common/httpClientContext';
+var ImageRenderer = {
+    canRenderType: 'image',
+    render: function (props) { return _jsx(ImageRendererComponent, __assign({}, props)); },
+};
+export default ImageRenderer;
+function ImageRendererComponent(_a) {
+    var accessibilityDescription = _a.accessibilityDescription, margin = _a.margin, size = _a.size, url = _a.url;
+    var _b = useState(''), imageSource = _b[0], setImageSource = _b[1];
+    var httpClient = useHttpClient();
+    useEffect(function () {
+        void getImageSource(httpClient, url).then(setImageSource);
+    }, [url, httpClient]);
+    return (_jsx("div", { className: "df-image ".concat(size || 'md'), children: _jsx(Image, { className: "img-responsive ".concat(getMargin(margin)), alt: accessibilityDescription !== null && accessibilityDescription !== void 0 ? accessibilityDescription : '', src: imageSource, stretch: true, shrink: true }) }));
+}
+var readImageBlobAsDataURL = function (imageBlob) { return __awaiter(void 0, void 0, void 0, function () {
+    return __generator(this, function (_a) {
+        // we can safely assume the type of reader.result is string
+        // because we're calling reader.readAsDataURL
+        // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/result
+        return [2 /*return*/, new Promise(function (resolve, reject) {
+                var reader = new FileReader();
+                reader.addEventListener('loadend', function () { return resolve(reader.result); });
+                reader.addEventListener('error', reject);
+                reader.readAsDataURL(imageBlob);
+            })];
+    });
+}); };
+var getImageSource = function (httpClient, imageUrl) { return __awaiter(void 0, void 0, void 0, function () {
+    var _a;
+    var _b;
+    return __generator(this, function (_c) {
+        switch (_c.label) {
+            case 0:
+                _c.trys.push([0, 3, , 4]);
+                if (!(isRelativePath(imageUrl) || (imageUrl === null || imageUrl === void 0 ? void 0 : imageUrl.startsWith("".concat((_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.origin, "/"))))) return [3 /*break*/, 2];
+                return [4 /*yield*/, httpClient(imageUrl, {
+                        method: 'GET',
+                        headers: { 'Content-Type': 'image/image' },
+                        credentials: 'same-origin',
+                    })
+                        .then(function (response) { return __awaiter(void 0, void 0, void 0, function () {
+                        return __generator(this, function (_a) {
+                            if (response.ok) {
+                                return [2 /*return*/, response.blob()];
+                            }
+                            throw new Error('Image fetching failed');
+                        });
+                    }); })
+                        .then(readImageBlobAsDataURL)
+                        .catch(function () { return imageUrl; })];
+            case 1: return [2 /*return*/, _c.sent()];
+            case 2: return [2 /*return*/, imageUrl];
+            case 3:
+                _a = _c.sent();
+                return [2 /*return*/, imageUrl];
+            case 4: return [2 /*return*/];
+        }
+    });
+}); };

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

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Header, InstructionsList } from '@transferwise/components';
+import { getMargin } from './utils/layout-utils';
+var doContext = ['positive', 'neutral'];
+var dontContext = ['warning', 'negative'];
+var InstructionsRenderer = {
+    canRenderType: 'instructions',
+    render: function (_a) {
+        var items = _a.items, margin = _a.margin, title = _a.title;
+        var dos = items.filter(function (item) { return doContext.includes(item.context); }).map(function (_a) {
+            var text = _a.text;
+            return text;
+        });
+        var donts = items
+            .filter(function (item) { return dontContext.includes(item.context); })
+            .map(function (_a) {
+            var text = _a.text;
+            return text;
+        });
+        return (_jsxs("div", { className: getMargin(margin), children: [title ? _jsx(Header, { title: title }) : null, _jsx(InstructionsList, { dos: dos, donts: donts })] }));
+    },
+};
+export default InstructionsRenderer;

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

@@ -0,0 +1,38 @@
+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 } from '@transferwise/components';
+import { onWheel } from './utils/input-utils';
+import FieldInput from './components/FieldInput';
+var IntegerInputRenderer = {
+    canRenderType: 'input-integer',
+    render: function (props) {
+        var id = props.id, label = props.label, error = props.error, description = props.description, help = props.help, type = props.type, value = props.value, onChange = props.onChange, rest = __rest(props, ["id", "label", "error", "description", "help", "type", "value", "onChange"]);
+        return (_jsx(FieldInput, { id: id, label: label, description: description, error: error, help: help, children: _jsx(Input, __assign({ id: id, name: id, type: "number", step: "1", pattern: "\\d+", value: value !== null && value !== void 0 ? value : '', onChange: function (_a) {
+                    var newValue = _a.target.value;
+                    var parsedValue = Number.parseInt(newValue, 10);
+                    onChange(Number.isNaN(parsedValue) ? null : parsedValue);
+                }, onWheel: onWheel }, rest)) }));
+    },
+};
+export default IntegerInputRenderer;