@wise/dynamic-flow-client 1.6.0 → 1.7.0

package/build/main.js

@@ -4469,7 +4469,7 @@ var DynamicImage = ({ component: image }) => {
   if (!imageSource) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: `df-image ${size || "xl"}`, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components15.Image, __spreadValues({ className: `img-responsive ${getMarginBottom(margin || "lg")}` }, imageProps)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: `df-image ${size || "md"}`, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components15.Image, __spreadValues({ className: `img-responsive ${getMarginBottom(margin || "md")}` }, imageProps)) });
 };
 var readImageBlobAsDataURL = (imageBlob) => {
   return new Promise((resolve, reject) => {
@@ -4501,31 +4501,49 @@ var getImageSource = async (httpClient, imageUrl) => {
 };
 var DynamicImage_default = DynamicImage;
 
-// src/layout/DynamicLayout.tsx
+// src/layout/instructions/DynamicInstructions.tsx
+var import_components16 = require("@transferwise/components");
 var import_jsx_runtime41 = require("react/jsx-runtime");
+var doContext = ["positive", "neutral"];
+var dontContext = ["warning", "negative"];
+var DynamicInstructions = ({ component }) => {
+  const { items } = component;
+  const dos = items.filter((item) => doContext.includes(item.context)).map(({ text }) => text);
+  const donts = items.filter((item) => dontContext.includes(item.context)).map(({ text }) => text);
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: getMarginBottom(component.margin || "md"), children: [
+    component.title ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components16.Header, { title: component.title }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components16.InstructionsList, { dos, donts })
+  ] });
+};
+var DynamicInstructions_default = DynamicInstructions;
+
+// src/layout/DynamicLayout.tsx
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var getKey = (component) => JSON.stringify(component);
 var DynamicLayout = (props) => {
   const { components, model, submitted, errors, onModelChange, onAction, onPersistAsync, baseUrl } = props;
   const renderComponent = (component) => {
     switch (component.type) {
       case "heading":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicHeading_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicHeading_default, { component }, getKey(component));
       case "paragraph":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicParagraph_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicParagraph_default, { component }, getKey(component));
       case "image":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicImage_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicImage_default, { component }, getKey(component));
       case "alert":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicAlert_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicAlert_default, { component }, getKey(component));
       case "review":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicReview_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicReview_default, { component, onAction }, getKey(component));
       case "divider":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicDivider_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicDivider_default, { component }, getKey(component));
       case "info":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicInfo, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicInfo, { component }, getKey(component));
+      case "instructions":
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicInstructions_default, { component }, getKey(component));
       case "markdown":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicMarkdown, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicMarkdown, { component }, getKey(component));
       case "columns":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           DynamicColumns_default,
           {
             component,
@@ -4539,7 +4557,7 @@ var DynamicLayout = (props) => {
           getKey(component)
         );
       case "form":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           DynamicForm_default,
           {
             component,
@@ -4552,9 +4570,9 @@ var DynamicLayout = (props) => {
           getKey(__spreadProps(__spreadValues({}, component), { errors: errors != null ? errors : null }))
         );
       case "button":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicButton_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicButton_default, { component, onAction }, getKey(component));
       case "box":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           DynamicBox_default,
           {
             component,
@@ -4568,32 +4586,32 @@ var DynamicLayout = (props) => {
           getKey(component)
         );
       case "decision":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicDecision_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicDecision_default, { component, onAction }, getKey(component));
       case "external":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicExternal_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicExternal_default, { component, onAction }, getKey(component));
       case "list":
       case "status-list":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicStatusList_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicStatusList_default, { component, onAction }, getKey(component));
       case "loading-indicator":
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicLoadingIndicator_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicLoadingIndicator_default, { component }, getKey(component));
       default:
-        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", {}, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", {}, getKey(component));
     }
   };
   if (useHasHttpClientProvider() || baseUrl == null) {
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: components.map(renderComponent) });
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_jsx_runtime42.Fragment, { children: components.map(renderComponent) });
   } else {
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HttpClientProviderFromBaseUrl, { baseUrl, children: components.map(renderComponent) });
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(HttpClientProviderFromBaseUrl, { baseUrl, children: components.map(renderComponent) });
   }
 };
 var DynamicLayout_default = DynamicLayout;
 
 // src/layout/list/DynamicStatusList.tsx
-var import_components16 = require("@transferwise/components");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_components17 = require("@transferwise/components");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var DynamicStatusList = ({ component }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: getMarginBottom(component.margin || "md"), children: [
-    component.title ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("h4", { className: "m-b-2", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: getMarginBottom(component.margin || "md"), children: [
+    component.title ? /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("h4", { className: "m-b-2", children: [
       " ",
       component.title,
       " "
@@ -4606,8 +4624,8 @@ var mapListItemToSummary = ({ title, description, icon, status }) => {
     key: `${title}/${description || ""}`,
     title,
     description
-  }, (icon == null ? void 0 : icon.name) ? { icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DynamicIcon_default, { type: icon.name }) } : {}), status ? { status: statusMap[status] } : {});
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_components16.Summary, __spreadValues({}, props));
+  }, (icon == null ? void 0 : icon.name) ? { icon: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DynamicIcon_default, { type: icon.name }) } : {}), status ? { status: statusMap[status] } : {});
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components17.Summary, __spreadValues({}, props));
 };
 var statusListMap = {
   done: "done",
@@ -4623,12 +4641,12 @@ var statusMap = __spreadValues(__spreadValues({}, statusListMap), legacyStatusMa
 var DynamicStatusList_default = DynamicStatusList;
 
 // src/layout/loadingIndicator/DynamicLoadingIndicator.tsx
-var import_components17 = require("@transferwise/components");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_components18 = require("@transferwise/components");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var DynamicLoadingIndicator = ({ component }) => {
   const { margin, size = "md" } = component;
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
-    import_components17.Loader,
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    import_components18.Loader,
     {
       size,
       classNames: {
@@ -4641,7 +4659,7 @@ var DynamicLoadingIndicator = ({ component }) => {
 var DynamicLoadingIndicator_default = DynamicLoadingIndicator;
 
 // src/layout/paragraph/DynamicParagraph.tsx
-var import_components19 = require("@transferwise/components");
+var import_components20 = require("@transferwise/components");
 var import_react_intl14 = require("react-intl");
 
 // src/layout/paragraph/DynamicParagraph.messages.ts
@@ -4660,19 +4678,19 @@ var DynamicParagraph_messages_default = (0, import_react_intl13.defineMessages)(
 });
 
 // src/layout/paragraph/useSnackBarIfAvailable.ts
-var import_components18 = require("@transferwise/components");
+var import_components19 = require("@transferwise/components");
 var import_react23 = require("react");
 function useSnackBarIfAvailable() {
-  const context = (0, import_react23.useContext)(import_components18.SnackbarContext);
+  const context = (0, import_react23.useContext)(import_components19.SnackbarContext);
   return context ? context.createSnackbar : noop3;
 }
 function noop3() {
 }
 
 // src/layout/paragraph/DynamicParagraph.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
-var DynamicParagraph = ({ component }) => component.control === "copyable" ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(CopyableDynamicParagraph, { component }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(BasicDynamicParagraph, { component });
-var BasicDynamicParagraph = ({ component }) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("p", { className: getTextAlignmentAndMargin(component), children: [
+var import_jsx_runtime45 = require("react/jsx-runtime");
+var DynamicParagraph = ({ component }) => component.control === "copyable" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(CopyableDynamicParagraph, { component }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BasicDynamicParagraph, { component });
+var BasicDynamicParagraph = ({ component }) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("p", { className: getTextAlignmentAndMargin(component), children: [
   " ",
   component.text,
   " "
@@ -4686,8 +4704,8 @@ var CopyableDynamicParagraph = ({ component }) => {
     (_a = navigator.clipboard) == null ? void 0 : _a.writeText(text).then(() => createSnackbar({ text: formatMessage(DynamicParagraph_messages_default.copied) })).catch(noop4);
   };
   const classNames7 = getTextAlignmentAndMargin({ align: component.align, margin: "sm" }) + " form-control";
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: getTextAlignmentAndMargin(component), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: getTextAlignmentAndMargin(component), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       "input",
       {
         type: "text",
@@ -4697,7 +4715,7 @@ var CopyableDynamicParagraph = ({ component }) => {
         style: { textOverflow: "ellipsis" }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_components19.Button, { block: true, onClick: copy, children: formatMessage(DynamicParagraph_messages_default.copy) })
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_components20.Button, { block: true, onClick: copy, children: formatMessage(DynamicParagraph_messages_default.copy) })
   ] });
 };
 function noop4() {
@@ -4705,8 +4723,8 @@ function noop4() {
 var DynamicParagraph_default = DynamicParagraph;
 
 // src/layout/review/DynamicReview.tsx
-var import_components20 = require("@transferwise/components");
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_components21 = require("@transferwise/components");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var mapFieldsToDefinitions = ({ label, value }, index) => {
   return { key: String(index), title: label, value };
 };
@@ -4718,7 +4736,7 @@ var DynamicReview = (props) => {
   const review = props.component;
   const margin = getMarginBottom(review.margin || "xs");
   const getReviewAction = (action) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
       "a",
       {
         href: action.url,
@@ -4732,13 +4750,13 @@ var DynamicReview = (props) => {
       }
     );
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_jsx_runtime45.Fragment, { children: [
-    review.title && /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("h6", { className: "m-b-2", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
+    review.title && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("h6", { className: "m-b-2", children: [
       review.title,
       review.action && getReviewAction(review.action)
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
-      import_components20.DefinitionList,
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      import_components21.DefinitionList,
       {
         layout: getReviewLayout(review),
         definitions: review.fields.map(mapFieldsToDefinitions)
@@ -4749,7 +4767,7 @@ var DynamicReview = (props) => {
 var DynamicReview_default = DynamicReview;
 
 // src/jsonSchemaForm/basicTypeSchema/BasicTypeSchema.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var isNullish = (value) => isNull(value) || isUndefined(value);
 var getDefaultValue = (schema) => {
   return schema.type === "boolean" && isNullish(schema.default) ? false : schema.default;
@@ -4823,15 +4841,15 @@ var BasicTypeSchema = (props) => {
   };
   const showLabel = props.schema.format !== "file" && props.schema.type !== "boolean";
   const schemaHelp = props.schema.help;
-  return !isHidden ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
-    props.schema.alert && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(DynamicAlert_default, { component: props.schema.alert }),
-    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: (0, import_classnames6.default)(formGroupClasses), children: [
-      showLabel && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "d-inline-block", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("label", { className: "control-label d-inline", htmlFor: id, children: props.schema.title }),
-        !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Help_default, { help: schemaHelp })
+  return !isHidden ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
+    props.schema.alert && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(DynamicAlert_default, { component: props.schema.alert }),
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: (0, import_classnames6.default)(formGroupClasses), children: [
+      showLabel && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "d-inline-block", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("label", { className: "control-label d-inline", htmlFor: id, children: props.schema.title }),
+        !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Help_default, { help: schemaHelp })
       ] }),
-      !showLabel && !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Help_default, { help: schemaHelp }),
-      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      !showLabel && !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Help_default, { help: schemaHelp }),
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
         SchemaFormControl_default,
         {
           id,
@@ -4843,7 +4861,7 @@ var BasicTypeSchema = (props) => {
           onBlur
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
         ControlFeedback_default,
         {
           changed,
@@ -4867,7 +4885,7 @@ BasicTypeSchema.defaultProps = {
 var BasicTypeSchema_default = BasicTypeSchema;
 
 // src/jsonSchemaForm/persistAsyncSchema/persistAsyncBasicSchema/PersistAsyncBasicSchema.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var getIdFromResponse = (idProperty, response) => {
   return response[idProperty];
 };
@@ -4959,7 +4977,7 @@ var PersistAsyncBasicSchema = (props) => {
       setPersistAsyncModel(newPersistAsyncModel);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
     BasicTypeSchema_default,
     {
       required,
@@ -5170,7 +5188,7 @@ function useStepPolling(polling, onAction) {
 }
 
 // src/step/layoutStep/LayoutStep.tsx
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var getComponents = (step, options) => {
   var _a;
   if (isEmpty(step)) {
@@ -5193,7 +5211,7 @@ var LayoutStep = (props) => {
     onEvent("Dynamic Flow - onAction supressed", { reason: "LayoutStep - loading state" });
   };
   useStepPolling(stepSpecification.polling, onAction);
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
     DynamicLayout_default,
     {
       components,
@@ -5237,49 +5255,49 @@ var CameraCapture_messages_default = (0, import_react_intl17.defineMessages)({
 });
 
 // src/step/cameraStep/cameraCapture/components/index.tsx
-var import_components21 = require("@transferwise/components");
+var import_components22 = require("@transferwise/components");
 var import_react_intl18 = require("react-intl");
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var CaptureBottomBar = ({ onCapture }) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "bottom-bar", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(CaptureButton, { onClick: onCapture }) });
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var CaptureBottomBar = ({ onCapture }) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "bottom-bar", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(CaptureButton, { onClick: onCapture }) });
 var ReviewBottomBar = ({
   onSubmit,
   onRetry
 }) => {
   const intl = (0, import_react_intl18.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "bottom-bar p-x-2", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "col-xs-12 col-md-6 col-md-offset-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
-      import_components21.Button,
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "bottom-bar p-x-2", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "col-xs-12 col-md-6 col-md-offset-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      import_components22.Button,
       {
         className: "m-b-1",
         block: true,
-        size: import_components21.Size.MEDIUM,
-        type: import_components21.ControlType.ACCENT,
+        size: import_components22.Size.MEDIUM,
+        type: import_components22.ControlType.ACCENT,
         onClick: onSubmit,
         children: intl.formatMessage(CameraCapture_messages_default.reviewSubmit)
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
-      import_components21.Button,
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      import_components22.Button,
       {
         className: "m-b-2",
         block: true,
-        size: import_components21.Size.MEDIUM,
-        type: import_components21.ControlType.ACCENT,
-        priority: import_components21.Priority.SECONDARY,
+        size: import_components22.Size.MEDIUM,
+        type: import_components22.ControlType.ACCENT,
+        priority: import_components22.Priority.SECONDARY,
         onClick: onRetry,
         children: intl.formatMessage(CameraCapture_messages_default.reviewRetry)
       }
     )
   ] }) }) });
 };
-var CaptureButton = ({ onClick }) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+var CaptureButton = ({ onClick }) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
   "button",
   {
     type: "button",
     className: "camera-capture-btn m-b-2",
     "data-testid": "camera-capture-button",
     onClick,
-    children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "camera-capture-btn-inner" })
+    children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "camera-capture-btn-inner" })
   }
 );
 
@@ -5359,7 +5377,7 @@ var useVideoConstraints = (direction) => {
 
 // src/step/cameraStep/cameraCapture/overlay/Overlay.tsx
 var import_react31 = require("react");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var captureButtonHeight = 92;
 var reviewButtonsHeight = 120;
 var imageHeight = 40;
@@ -5388,18 +5406,18 @@ var Overlay = ({
     return () => window.removeEventListener("resize", listener);
   });
   let helperBoxHeight = (imageUrl ? imageHeight : 0) + (title ? titleHeight : 0) + (instructions ? instructionsHeight : 0);
-  let helperBox = /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
-    imageUrl && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("img", { className: "camera-capture-img", src: imageUrl, alt: "" }),
-    title && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("h4", { className: "camera-capture-title", children: title }),
-    instructions && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("small", { className: "camera-capture-instructions", children: instructions })
+  let helperBox = /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
+    imageUrl && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("img", { className: "camera-capture-img", src: imageUrl, alt: "" }),
+    title && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("h4", { className: "camera-capture-title", children: title }),
+    instructions && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("small", { className: "camera-capture-instructions", children: instructions })
   ] });
   const frameBottomMargin = captureButtonHeight + helperBoxHeight;
   if (reviewInstructions) {
     helperBoxHeight = frameBottomMargin - reviewButtonsHeight;
-    helperBox = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("small", { className: "camera-capture-instructions", children: reviewInstructions });
+    helperBox = /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("small", { className: "camera-capture-instructions", children: reviewInstructions });
     const frameWithReviewInstructionsMinBottomMargin = reviewButtonsHeight + reviewInstructionsHeight;
     if (frameBottomMargin < frameWithReviewInstructionsMinBottomMargin) {
-      helperBox = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx_runtime50.Fragment, {});
+      helperBox = /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, {});
     }
   }
   const framePosition = {
@@ -5417,20 +5435,20 @@ var Overlay = ({
       width: "90%"
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("svg", { ref: svgReference, xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("mask", { id: "mask", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("rect", { width: "100%", height: "100%", fill: "#fff" }),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("image", __spreadValues({ href: overlay }, framePosition))
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("svg", { ref: svgReference, xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("mask", { id: "mask", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("rect", { width: "100%", height: "100%", fill: "#fff" }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("image", __spreadValues({ href: overlay }, framePosition))
     ] }) }),
-    overlay && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("rect", { width: "100%", height: "100%", mask: "url(#mask)", fillOpacity: "0.72" }),
-    outline && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("image", __spreadValues({ href: outline }, framePosition)),
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("foreignObject", { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", __spreadProps(__spreadValues({ className: "camera-capture-text-and-image-container" }, helperBoxPosition), { children: helperBox })) })
+    overlay && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("rect", { width: "100%", height: "100%", mask: "url(#mask)", fillOpacity: "0.72" }),
+    outline && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("image", __spreadValues({ href: outline }, framePosition)),
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("foreignObject", { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", __spreadProps(__spreadValues({ className: "camera-capture-text-and-image-container" }, helperBoxPosition), { children: helperBox })) })
   ] });
 };
 var Overlay_default = Overlay;
 
 // src/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.tsx
-var import_components22 = require("@transferwise/components");
+var import_components23 = require("@transferwise/components");
 var import_react_intl20 = require("react-intl");
 
 // src/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.messages.ts
@@ -5454,13 +5472,13 @@ var NoCameraAccess_messages_default = (0, import_react_intl19.defineMessages)({
 });
 
 // src/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.tsx
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var NoCameraAccess = ({ onAction }) => {
   const intl = (0, import_react_intl20.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { id: "no-camera-access", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "container p-t-5", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "col-md-6 col-md-offset-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("h2", { className: "text-xs-center m-b-3", children: intl.formatMessage(NoCameraAccess_messages_default.title) }),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "text-xs-center m-b-5", children: intl.formatMessage(NoCameraAccess_messages_default.paragraph) }),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_components22.Button, { block: true, onClick: onAction, children: intl.formatMessage(NoCameraAccess_messages_default.action) })
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { id: "no-camera-access", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "container p-t-5", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "col-md-6 col-md-offset-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("h2", { className: "text-xs-center m-b-3", children: intl.formatMessage(NoCameraAccess_messages_default.title) }),
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-xs-center m-b-5", children: intl.formatMessage(NoCameraAccess_messages_default.paragraph) }),
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_components23.Button, { block: true, onClick: onAction, children: intl.formatMessage(NoCameraAccess_messages_default.action) })
   ] }) }) }) });
 };
 var NoCameraAccess_default = NoCameraAccess;
@@ -5484,12 +5502,12 @@ var CameraNotSupported_messages_default = (0, import_react_intl21.defineMessages
 });
 
 // src/step/cameraStep/cameraCapture/screens/CameraNotSupported/CameraNotSupported.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var CameraNotSupported = () => {
   const intl = (0, import_react_intl22.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { id: "camera-not-supported", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "container p-t-5", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "col-md-6 col-md-offset-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("h2", { className: "text-xs-center m-b-3", children: intl.formatMessage(CameraNotSupported_messages_default.title) }),
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-xs-center m-b-5", children: intl.formatMessage(CameraNotSupported_messages_default.paragraph) })
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { id: "camera-not-supported", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "container p-t-5", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "col-md-6 col-md-offset-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("h2", { className: "text-xs-center m-b-3", children: intl.formatMessage(CameraNotSupported_messages_default.title) }),
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-xs-center m-b-5", children: intl.formatMessage(CameraNotSupported_messages_default.paragraph) })
   ] }) }) }) });
 };
 var CameraNotSupported_default = CameraNotSupported;
@@ -5514,7 +5532,7 @@ var getCameraStartedProperties = async (props, videoStream) => {
 };
 
 // src/step/cameraStep/cameraCapture/CameraCapture.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var CameraCapture = ({
   direction = "back",
   overlay = "",
@@ -5583,8 +5601,8 @@ var CameraCapture = ({
     setReviewImage(void 0);
   };
   const handleRetryCameraAccess = () => setMode("CAPTURE");
-  const captureScreen = /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
-    videoConstraints && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  const captureScreen = /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
+    videoConstraints && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       import_react_webcam.default,
       {
         ref: webcamReference,
@@ -5595,7 +5613,7 @@ var CameraCapture = ({
         onUserMedia: handleUserMedia
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       Overlay_default,
       {
         overlay,
@@ -5605,11 +5623,11 @@ var CameraCapture = ({
         instructions
       }
     ),
-    ready && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(CaptureBottomBar, { onCapture: () => void handleCapture() })
+    ready && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(CaptureBottomBar, { onCapture: () => void handleCapture() })
   ] });
-  const reviewScreen = /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("img", { className: "review-image", src: reviewImage == null ? void 0 : reviewImage.source, alt: "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  const reviewScreen = /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("img", { className: "review-image", src: reviewImage == null ? void 0 : reviewImage.source, alt: "" }),
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       Overlay_default,
       {
         overlay,
@@ -5619,19 +5637,19 @@ var CameraCapture = ({
         reviewInstructions: intl.formatMessage(CameraCapture_messages_default.reviewInstructions)
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ReviewBottomBar, { onSubmit: handleReviewSubmit, onRetry: handleReviewRetry })
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ReviewBottomBar, { onSubmit: handleReviewSubmit, onRetry: handleReviewRetry })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("section", { className: "camera-capture", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("section", { className: "camera-capture", children: [
     mode === "CAPTURE" && captureScreen,
     mode === "REVIEW" && reviewScreen,
-    mode === "NO_CAMERA_ACCESS" && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(NoCameraAccess_default, { onAction: handleRetryCameraAccess }),
-    mode === "CAMERA_NOT_SUPPORTED" && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(CameraNotSupported_default, {})
+    mode === "NO_CAMERA_ACCESS" && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(NoCameraAccess_default, { onAction: handleRetryCameraAccess }),
+    mode === "CAMERA_NOT_SUPPORTED" && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(CameraNotSupported_default, {})
   ] });
 };
 var CameraCapture_default = CameraCapture;
 
 // src/step/cameraStep/CameraStep.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 function blobToBase64(blob) {
   return new Promise((resolve, _) => {
     const reader = new FileReader();
@@ -5669,7 +5687,7 @@ var CameraStep = (props) => {
       });
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     CameraCapture_default,
     {
       overlay,
@@ -5746,12 +5764,12 @@ var ExternalConfirmationStep_messages_default = (0, import_react_intl24.defineMe
 });
 
 // src/step/externalConfirmationStep/ExternalConfirmationStep.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var noop5 = () => {
 };
 var ExternalConfirmationStep = ({ url, onClose }) => {
   const { formatMessage } = (0, import_react_intl25.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     DynamicLayout_default,
     {
       components: [
@@ -5816,7 +5834,7 @@ function getOrigin(url) {
 }
 
 // src/dynamicFlow/DynamicFlowStep.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var DynamicFlowStep = (props) => {
   var _a;
   const { step, globalError } = props;
@@ -5826,14 +5844,14 @@ var DynamicFlowStep = (props) => {
     return null;
   }
   if (externalUrl && requiresManualTrigger) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ExternalConfirmationStep_default, { url: externalUrl, onClose: dismissConfirmation });
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ExternalConfirmationStep_default, { url: externalUrl, onClose: dismissConfirmation });
   }
   if (isCameraStep(step)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(CameraStep_default, __spreadProps(__spreadValues({}, props), { step }));
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(CameraStep_default, __spreadProps(__spreadValues({}, props), { step }));
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
-    globalError ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DynamicAlert_default, { component: { context: "negative", markdown: globalError, margin: "lg" } }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(LayoutStep_default, __spreadProps(__spreadValues({}, props), { stepSpecification: step }))
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
+    globalError ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DynamicAlert_default, { component: { context: "negative", markdown: globalError, margin: "lg" } }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(LayoutStep_default, __spreadProps(__spreadValues({}, props), { stepSpecification: step }))
   ] });
 };
 
@@ -5952,19 +5970,19 @@ var isInlineSchema = (schema) => {
 };
 
 // src/dynamicFlow/utils/useLoader.tsx
-var import_components24 = require("@transferwise/components");
+var import_components25 = require("@transferwise/components");
 var import_react36 = require("react");
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function useLoader(loaderConfig, initialState) {
   const config = __spreadValues({
-    size: import_components24.Size.EXTRA_LARGE,
+    size: import_components25.Size.EXTRA_LARGE,
     initial: true,
     submission: false
   }, loaderConfig);
   const [loadingState, setLoadingState] = (0, import_react36.useState)(initialState);
   const shouldDisplayLoader = config.initial && loadingState === "initial" || config.submission && loadingState === "submission";
-  const loader = shouldDisplayLoader ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
-    import_components24.Loader,
+  const loader = shouldDisplayLoader ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    import_components25.Loader,
     {
       size: config.size,
       classNames: { "tw-loader": "tw-loader m-x-auto" },
@@ -5978,7 +5996,7 @@ function useLoader(loaderConfig, initialState) {
 var import_react37 = require("react");
 
 // src/dynamicFlow/utils/errorBoundary/ErrorBoundaryAlert.tsx
-var import_components25 = require("@transferwise/components");
+var import_components26 = require("@transferwise/components");
 var import_react_intl27 = require("react-intl");
 
 // src/dynamicFlow/utils/errorBoundary/ErrorBoundary.messages.ts
@@ -5997,18 +6015,18 @@ var ErrorBoundary_messages_default = (0, import_react_intl26.defineMessages)({
 });
 
 // src/dynamicFlow/utils/errorBoundary/ErrorBoundaryAlert.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var ErrorBoundaryAlert = ({ onDismiss }) => {
   const { formatMessage } = (0, import_react_intl27.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
-    import_components25.Alert,
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+    import_components26.Alert,
     {
       action: {
         text: formatMessage(ErrorBoundary_messages_default.retry),
         href: window.location.href
       },
       message: formatMessage(ErrorBoundary_messages_default.errorAlert),
-      type: import_components25.Sentiment.NEGATIVE,
+      type: import_components26.Sentiment.NEGATIVE,
       className: "m-b-3",
       onDismiss
     }
@@ -6016,7 +6034,7 @@ var ErrorBoundaryAlert = ({ onDismiss }) => {
 };
 
 // src/dynamicFlow/utils/errorBoundary/ErrorBoundary.tsx
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var noop6 = () => {
 };
 var ErrorBoundary = class extends import_react37.Component {
@@ -6037,8 +6055,8 @@ var ErrorBoundary = class extends import_react37.Component {
   render() {
     const { children } = this.props;
     const { hasError, isFatalError } = this.state;
-    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_jsx_runtime59.Fragment, { children: [
-      hasError && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ErrorBoundaryAlert, { onDismiss: this.handleErrorReset }),
+    return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_jsx_runtime60.Fragment, { children: [
+      hasError && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ErrorBoundaryAlert, { onDismiss: this.handleErrorReset }),
       !isFatalError && children
     ] });
   }
@@ -6139,7 +6157,7 @@ var assertResponseIsValid = (response) => {
 var isResponse = (response) => typeof response === "object" && response !== null && "clone" in response && "bodyUsed" in response;
 
 // src/dynamicFlow/DynamicFlow.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var noop7 = () => {
 };
 var DynamicFlowComponent = ({
@@ -6357,7 +6375,7 @@ var DynamicFlowComponent = ({
       await actionHandler(action);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(LogProvider, { flowId, stepId: (step == null ? void 0 : step.id) || (step == null ? void 0 : step.key), onLog, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(EventsContextProvider, { metadata: analyticsMetadata, onEvent, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DynamicFlowProvider, { loading: isLoading, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HttpClientProvider, { httpClient, children: loader !== null ? loader : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(LogProvider, { flowId, stepId: (step == null ? void 0 : step.id) || (step == null ? void 0 : step.key), onLog, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(EventsContextProvider, { metadata: analyticsMetadata, onEvent, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DynamicFlowProvider, { loading: isLoading, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HttpClientProvider, { httpClient, children: loader !== null ? loader : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
     DynamicFlowStep,
     {
       step,
@@ -6373,7 +6391,7 @@ var DynamicFlowComponent = ({
     }
   ) }) }) }) });
 };
-var DynamicFlow = (props) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ErrorBoundary_default, { onError: props.onError, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DynamicFlowComponent, __spreadValues({}, props)) });
+var DynamicFlow = (props) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(ErrorBoundary_default, { onError: props.onError, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DynamicFlowComponent, __spreadValues({}, props)) });
 var DynamicFlow_default = DynamicFlow;
 var combineModels2 = (formModels) => {
   return Object.values(formModels).reduce((previous, model) => __spreadValues(__spreadValues({}, previous), model), {});