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

package/build/revamp/tests/legacy/useExternal.spec.js

@@ -0,0 +1,235 @@
+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 { fireEvent, screen, waitFor } from '@testing-library/react';
+import DynamicFlowWise from '../../DynamicFlowWise';
+import { renderWithProviders, getMockHttpClient, respondWith } from '../../../test-utils';
+var mockWindowOpenSuccess = function () {
+    return window.open.mockImplementation(function () { return 'fake window'; });
+};
+var mockWindonOpenFail = function () { return window.open.mockImplementation(function () { return null; }); };
+describe('useExternal', function () {
+    var mockHttpClient = jest.fn(function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+        return [2 /*return*/, Promise.resolve(new Response(''))];
+    }); }); });
+    var onError = jest.fn();
+    var onCompletion = jest.fn();
+    var renderComponent = function (step) {
+        return renderWithProviders(_jsx(DynamicFlowWise, { flowId: "the-flow-id", initialStep: step, httpClient: mockHttpClient, onCompletion: onCompletion, onError: onError }));
+    };
+    afterEach(function () {
+        mockHttpClient.mockClear();
+        jest.restoreAllMocks();
+    });
+    describe('Given a step with an "external" property', function () {
+        var step = {
+            type: 'form',
+            id: 'external',
+            title: 'Step Title',
+            external: { url: 'https://third-party.website' },
+            layout: [{ type: 'paragraph', text: 'This is a paragraph in the step layout' }],
+            schemas: [],
+        };
+        it('attempts to open the specified URL, but ONLY ONCE', function () { return __awaiter(void 0, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        jest.spyOn(window, 'open');
+                        mockWindowOpenSuccess();
+                        renderComponent(step);
+                        expect(window.open).toHaveBeenCalledTimes(1);
+                        expect(window.open).toHaveBeenCalledWith('https://third-party.website', '_blank');
+                        return [4 /*yield*/, waitFor(function () {
+                                expect(window.open).toHaveBeenCalledTimes(1);
+                            })];
+                    case 1:
+                        _a.sent();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        describe('when the window/tab fails to open', function () {
+            it('displays a confirmation UI (ExternalConfirmationStep)', function () { return __awaiter(void 0, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            jest.spyOn(window, 'open');
+                            mockWindonOpenFail();
+                            renderComponent(step);
+                            return [4 /*yield*/, expect(screen.findByText('Please confirm')).resolves.toBeInTheDocument()];
+                        case 1:
+                            _a.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            }); });
+            describe('when the confirmation button is clicked', function () {
+                it('opens the external url and displays the step layout', function () {
+                    jest.spyOn(window, 'open');
+                    mockWindonOpenFail();
+                    renderComponent(step);
+                    expect(screen.getByText('Please confirm')).toBeInTheDocument();
+                    var confirmButton = screen.getByText('Open in new tab');
+                    window.open.mockClear();
+                    fireEvent.click(confirmButton);
+                    expect(window.open).toHaveBeenCalledTimes(1);
+                    expect(screen.getByText('This is a paragraph in the step layout')).toBeInTheDocument();
+                });
+            });
+            describe('when the cancel button is clicked', function () {
+                it('does not open the external url and displays the step layout', function () {
+                    jest.spyOn(window, 'open');
+                    mockWindonOpenFail();
+                    renderComponent(step);
+                    expect(screen.getByText('Please confirm')).toBeInTheDocument();
+                    var confirmButton = screen.getByText('Cancel');
+                    window.open.mockClear();
+                    fireEvent.click(confirmButton);
+                    expect(window.open).toHaveBeenCalledTimes(0);
+                    expect(screen.getByText('This is a paragraph in the step layout')).toBeInTheDocument();
+                });
+            });
+            describe('when a subsequent step with external is loaded using the same URL', function () {
+                var mockClient = getMockHttpClient({
+                    '/external': function () { return __awaiter(void 0, void 0, void 0, function () {
+                        return __generator(this, function (_a) {
+                            return [2 /*return*/, respondWith({
+                                    type: 'form',
+                                    id: 'external',
+                                    title: 'External Step',
+                                    external: { url: 'https://third-party.website' },
+                                    layout: [
+                                        { type: 'paragraph', text: 'This is a paragraph in the external step layout' },
+                                        { type: 'button', action: { url: '/layout', title: 'Continue to layout step' } },
+                                    ],
+                                    schemas: [],
+                                })];
+                        });
+                    }); },
+                    '/layout': function () { return __awaiter(void 0, void 0, void 0, function () {
+                        return __generator(this, function (_a) {
+                            return [2 /*return*/, respondWith({
+                                    type: 'form',
+                                    id: 'layout',
+                                    title: 'Layout Step',
+                                    layout: [
+                                        { type: 'paragraph', text: 'This is a paragraph in the layout step layout' },
+                                        {
+                                            type: 'button',
+                                            action: { url: '/external', title: 'Continue to external step' },
+                                        },
+                                    ],
+                                    schemas: [],
+                                })];
+                        });
+                    }); },
+                });
+                it('displays the confirmation UI (ExternalConfirmationStep) a second time', function () { return __awaiter(void 0, void 0, void 0, function () {
+                    var confirmButton;
+                    return __generator(this, function (_a) {
+                        switch (_a.label) {
+                            case 0:
+                                jest.spyOn(window, 'open');
+                                mockWindonOpenFail();
+                                renderWithProviders(_jsx(DynamicFlowWise, { flowId: "the-flow-id", initialAction: { method: 'GET', url: '/external' }, httpClient: mockClient, onCompletion: onCompletion, onError: onError }));
+                                return [4 /*yield*/, expect(screen.findByText('Please confirm')).resolves.toBeInTheDocument()];
+                            case 1:
+                                _a.sent();
+                                confirmButton = screen.getByText('Cancel');
+                                window.open.mockClear();
+                                fireEvent.click(confirmButton);
+                                expect(window.open).toHaveBeenCalledTimes(0);
+                                expect(screen.getByText('This is a paragraph in the external step layout')).toBeInTheDocument();
+                                fireEvent.click(screen.getByText(/continue to layout step/i));
+                                return [4 /*yield*/, expect(screen.findByText('Layout Step')).resolves.toBeInTheDocument()];
+                            case 2:
+                                _a.sent();
+                                fireEvent.click(screen.getByText(/continue to external step/i));
+                                return [4 /*yield*/, expect(screen.findByText('Please confirm')).resolves.toBeInTheDocument()];
+                            case 3:
+                                _a.sent();
+                                return [2 /*return*/];
+                        }
+                    });
+                }); });
+            });
+        });
+        describe('when the window/tab opens successfully', function () {
+            it('displays the step normally', function () { return __awaiter(void 0, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            jest.spyOn(window, 'open');
+                            mockWindowOpenSuccess();
+                            renderComponent(step);
+                            return [4 /*yield*/, expect(screen.findByText('This is a paragraph in the step layout')).resolves.toBeInTheDocument()];
+                        case 1:
+                            _a.sent();
+                            expect(screen.queryByText('Please confirm')).not.toBeInTheDocument();
+                            return [2 /*return*/];
+                    }
+                });
+            }); });
+        });
+    });
+    describe('Given a step with a malformed "external" property', function () {
+        var step = {
+            type: 'form',
+            id: 'external',
+            title: 'Step Title',
+            external: { wrong: 'banana' },
+            layout: [{ type: 'paragraph', text: 'This is a paragraph in the step layout' }],
+            schemas: [],
+        };
+        it('does not attempt to open a new tab', function () { return __awaiter(void 0, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        jest.spyOn(window, 'open');
+                        mockWindowOpenSuccess();
+                        renderComponent(step);
+                        return [4 /*yield*/, waitFor(function () {
+                                expect(window.open).not.toHaveBeenCalled();
+                            })];
+                    case 1:
+                        _a.sent();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+    });
+});

package/build/revamp/types.js

@@ -0,0 +1 @@
+export {};

package/build/revamp/useDynamicFlowCore.js

@@ -0,0 +1,285 @@
+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 { validateStep } from '@wise/dynamic-flow-types';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useIntl } from 'react-intl';
+import { mapStepToComponent } from './domain/mappers/mapStepToComponent';
+import { executeRefresh } from './flow/executeRefresh';
+import { executeSubmission } from './flow/executeSubmission';
+import { getSchemaErrorMessageFunction } from './renderers/getSchemaErrorMessageFunction';
+import { findComponent } from './utils/findComponent';
+import { useStableCallback } from './utils/useStableCallback';
+export function useDynamicFlowCore(props) {
+    var _this = this;
+    var flowId = props.flowId, initialAction = props.initialAction, initialStep = props.initialStep, _a = props.displayStepTitle, displayStepTitle = _a === void 0 ? true : _a, rest = __rest(props, ["flowId", "initialAction", "initialStep", "displayStepTitle"]);
+    var httpClient = useStableCallback(rest.httpClient);
+    var onCompletion = useStableCallback(rest.onCompletion);
+    var onValueChange = useStableCallback(props.onValueChange);
+    var onError = useStableCallback(rest.onError);
+    var onEvent = useStableCallback(rest.onEvent);
+    var onLog = useStableCallback(rest.onLog);
+    var _b = useIntl(), formatMessage = _b.formatMessage, locale = _b.locale;
+    var getErrorMessageFunctions = useMemo(function () { return getSchemaErrorMessageFunction(formatMessage, locale); }, [formatMessage, locale]);
+    var _c = useState(null), stepComponent = _c[0], setStepComponent = _c[1];
+    var stepComponentRef = useRef(null);
+    var stepRef = useRef(initialStep !== null && initialStep !== void 0 ? initialStep : null);
+    var etagRef = useRef(null);
+    var abortControllerRef = useRef(new AbortController());
+    var abortCurrentAndGetNewAbortSignal = function () {
+        abortControllerRef.current.abort();
+        abortControllerRef.current = new AbortController();
+        return abortControllerRef.current.signal;
+    };
+    useEffect(function () {
+        // Initialise Flow
+        trackCoreEvent('Initiated');
+        if (!initialStep && initialAction) {
+            void onAction(__assign({ method: 'GET' }, initialAction));
+        }
+        if (initialStep && !initialAction) {
+            initialiseWithStep(initialStep, null);
+            trackCoreEvent('Step Shown', { isFirstStep: true });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    var initialiseWithStep = useCallback(function (newStep, etag) {
+        var _a, _b, _c;
+        (_a = stepComponentRef.current) === null || _a === void 0 ? void 0 : _a.stop();
+        stepRef.current = newStep;
+        etagRef.current = etag;
+        var validationResult = validateStep(newStep);
+        if (!validationResult.valid) {
+            logEvent('warning', 'Invalid step.', { errors: validationResult.errors });
+        }
+        var updateComponent = function (id, update) {
+            var currentStepComponent = stepComponentRef.current;
+            if (currentStepComponent) {
+                update(findComponent([currentStepComponent], id));
+                setStepComponent(function () {
+                    var newStepDomainComponent = __assign({}, currentStepComponent);
+                    stepComponentRef.current = newStepDomainComponent;
+                    return newStepDomainComponent;
+                });
+            }
+        };
+        try {
+            var newStepComponent_1 = mapStepToComponent({
+                stepLocalValue: (_c = (_b = stepComponentRef.current) === null || _b === void 0 ? void 0 : _b.getLocalValue()) !== null && _c !== void 0 ? _c : null,
+                step: newStep,
+                displayStepTitle: displayStepTitle,
+                loadingState: 'idle',
+                updateComponent: updateComponent,
+                getErrorMessageFunctions: getErrorMessageFunctions,
+                trackEvent: trackEvent,
+                logEvent: logEvent,
+                httpClient: httpClient,
+                onAction: onAction,
+                onRefresh: onRefresh,
+                onValueChange: onValueChange,
+            });
+            setStepComponent(function () {
+                stepComponentRef.current = newStepComponent_1;
+                return newStepComponent_1;
+            });
+        }
+        catch (error) {
+            closeWithError(error);
+        }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    var trackEvent = useCallback(function (eventName, properties) {
+        var _a, _b, _c, _d;
+        var stepId = (_b = (_a = stepRef.current) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : (_c = stepRef.current) === null || _c === void 0 ? void 0 : _c.key;
+        var analytics = (_d = stepRef.current) === null || _d === void 0 ? void 0 : _d.analytics;
+        var metadata = __assign(__assign(__assign({ flowId: flowId }, (stepId ? { stepId: stepId } : {})), analytics), properties);
+        try {
+            onEvent === null || onEvent === void 0 ? void 0 : onEvent("Dynamic Flow - ".concat(eventName), __assign({}, metadata));
+        }
+        catch (_e) { }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    var trackCoreEvent = trackEvent;
+    var logEvent = useCallback(function (level, message, properties) {
+        var _a, _b, _c;
+        try {
+            onLog === null || onLog === void 0 ? void 0 : onLog(level, message, __assign(__assign({}, properties), { flowId: flowId, stepId: (_b = (_a = stepRef.current) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : (_c = stepRef.current) === null || _c === void 0 ? void 0 : _c.key }));
+        }
+        catch (_d) { }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    var closeWithError = useCallback(function (error, analytics) {
+        trackCoreEvent('Failed', __assign({}, analytics));
+        onError(error);
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    var onAction = useCallback(function (action) { return __awaiter(_this, void 0, void 0, function () {
+        var model, command, isFirstStep, genericErrorMessage, _a, errors, _b, refreshUrl, _c, errors, error_1;
+        var _d, _e, _f;
+        return __generator(this, function (_g) {
+            switch (_g.label) {
+                case 0:
+                    _g.trys.push([0, 3, , 4]);
+                    (_d = stepComponentRef.current) === null || _d === void 0 ? void 0 : _d.setLoadingState('loading');
+                    return [4 /*yield*/, ((_e = stepComponentRef.current) === null || _e === void 0 ? void 0 : _e.getSubmittableValue())];
+                case 1:
+                    model = (_f = (_g.sent())) !== null && _f !== void 0 ? _f : null;
+                    return [4 /*yield*/, executeSubmission({
+                            action: action,
+                            model: model,
+                            isInitial: stepRef.current === null,
+                            httpClient: httpClient,
+                            trackEvent: trackCoreEvent,
+                        })];
+                case 2:
+                    command = _g.sent();
+                    switch (command.type) {
+                        case 'complete': {
+                            onCompletion(command.result);
+                            trackCoreEvent('Succeeded');
+                            break;
+                        }
+                        case 'replace-step': {
+                            isFirstStep = stepRef.current === null;
+                            initialiseWithStep(command.step, command.etag);
+                            trackCoreEvent('Step Shown', { isFirstStep: isFirstStep });
+                            break;
+                        }
+                        case 'error': {
+                            genericErrorMessage = getErrorMessageFunctions().genericErrorWithRetry();
+                            _a = command.body.errors, errors = _a === void 0 ? { error: genericErrorMessage } : _a;
+                            if (stepRef.current) {
+                                initialiseWithStep(__assign(__assign({}, stepRef.current), { errors: errors, model: model }), etagRef.current);
+                            }
+                            else {
+                                closeWithError(new Error('Initial request failed'), {});
+                            }
+                            break;
+                        }
+                        case 'refresh': {
+                            _b = command.body, refreshUrl = _b.refreshUrl, _c = _b.errors, errors = _c === void 0 ? {} : _c;
+                            void onRefresh(undefined, refreshUrl, errors);
+                            break;
+                        }
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _g.sent();
+                    closeWithError(error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); }, []);
+    var onRefresh = useCallback(function (schemaId, refreshUrl, errorsOverride) {
+        if (refreshUrl === void 0) { refreshUrl = ''; }
+        return __awaiter(_this, void 0, void 0, function () {
+            var model, command, errors, error_2;
+            var _a, _b, _c, _d;
+            return __generator(this, function (_e) {
+                switch (_e.label) {
+                    case 0:
+                        _e.trys.push([0, 3, , 4]);
+                        (_a = stepComponentRef.current) === null || _a === void 0 ? void 0 : _a.setLoadingState('loading');
+                        return [4 /*yield*/, ((_b = stepComponentRef.current) === null || _b === void 0 ? void 0 : _b.getSubmittableValue())];
+                    case 1:
+                        model = (_c = (_e.sent())) !== null && _c !== void 0 ? _c : null;
+                        return [4 /*yield*/, executeRefresh({
+                                abortSignal: abortCurrentAndGetNewAbortSignal(),
+                                url: refreshUrl,
+                                model: model,
+                                schemaId: schemaId,
+                                etag: etagRef.current,
+                                httpClient: httpClient,
+                                trackEvent: trackCoreEvent,
+                            })];
+                    case 2:
+                        command = _e.sent();
+                        switch (command.type) {
+                            case 'refresh-step':
+                                {
+                                    errors = errorsOverride !== null && errorsOverride !== void 0 ? errorsOverride : command.step.errors;
+                                    initialiseWithStep(__assign(__assign({}, command.step), { errors: errors }), command.etag);
+                                }
+                                break;
+                            case 'error': {
+                                closeWithError(new Error('Failed to refresh'), command.body.analytics);
+                                break;
+                            }
+                            case 'noop':
+                                (_d = stepComponentRef.current) === null || _d === void 0 ? void 0 : _d.setLoadingState('idle');
+                                break;
+                        }
+                        return [3 /*break*/, 4];
+                    case 3:
+                        error_2 = _e.sent();
+                        closeWithError(error_2, undefined);
+                        return [3 /*break*/, 4];
+                    case 4: return [2 /*return*/];
+                }
+            });
+        });
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    return { stepComponentRef: stepComponentRef };
+}

package/build/revamp/utils/component-utils.js

@@ -0,0 +1,86 @@
+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 { isObjectLocalValue, isObjectModel } from './type-utils';
+export var getSubmittableData = function (components) { return __awaiter(void 0, void 0, void 0, function () {
+    return __generator(this, function (_a) {
+        return [2 /*return*/, Promise.all(components.map(function (component) { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+                return [2 /*return*/, component.getSubmittableValue()];
+            }); }); })).then(function (values) {
+                return values.reduce(function (acc, value) { return mergeModels(acc, value); }, null);
+            })];
+    });
+}); };
+export var getLocalValues = function (components) {
+    return components
+        .map(function (component) { return component.getLocalValue(); })
+        .reduce(function (acc, value) { return mergeLocalValues(acc, value); }, null);
+};
+export var mergeLocalValues = function (valueA, valueB) {
+    if (valueA === null) {
+        return valueB;
+    }
+    if (valueB === null) {
+        return valueA;
+    }
+    if (isObjectLocalValue(valueA) && isObjectLocalValue(valueB)) {
+        return __assign(__assign({}, valueA), valueB);
+    }
+    return valueB;
+};
+export var mergeModels = function (valueA, valueB) {
+    if (valueA === null) {
+        return valueB;
+    }
+    if (valueB === null) {
+        return valueA;
+    }
+    if (isObjectModel(valueA) && isObjectModel(valueB)) {
+        return __assign(__assign({}, valueA), valueB);
+    }
+    return valueB;
+};