@wise/dynamic-flow-client 1.0.1 → 1.1.0

package/build/main.js

@@ -541,92 +541,92 @@ __export(src_exports, {
 module.exports = __toCommonJS(src_exports);
 
 // src/step/layoutStep/utils/layout-utils.ts
-function convertStepToLayout(step31, { displayStepTitle = true } = {}) {
-  if (!step31 || !step31.type) {
+function convertStepToLayout(step33, { displayStepTitle = true } = {}) {
+  if (!step33 || !step33.type) {
     throw new Error("Missing step type");
   }
-  if (step31.layout) {
-    return addMissingTitleAndDescriptionToStep(step31, displayStepTitle);
+  if (step33.layout) {
+    return addMissingTitleAndDescriptionToStep(step33, displayStepTitle);
   }
-  switch (step31.type) {
+  switch (step33.type) {
     case "final":
-      return convertFinalStepToDynamicLayout(step31);
+      return convertFinalStepToDynamicLayout(step33);
     case "decision":
-      return convertDecisionStepToDynamicLayout(step31);
+      return convertDecisionStepToDynamicLayout(step33);
     case "form":
-      return convertFormStepToDynamicLayout(step31);
+      return convertFormStepToDynamicLayout(step33);
     case "external":
-      return convertExternalStepToDynamicLayout(step31);
+      return convertExternalStepToDynamicLayout(step33);
     default:
       throw new Error("invalid step type");
   }
 }
-function convertCommonComponents(step31) {
+function convertCommonComponents(step33) {
   const layout6 = [];
-  if (step31.title) {
-    layout6.push(convertStepTitleToDynamicHeading(step31.title));
+  if (step33.title) {
+    layout6.push(convertStepTitleToDynamicHeading(step33.title));
   }
-  if (step31.image) {
-    const image = convertStepImageToDynamicImage(step31.image);
+  if (step33.image) {
+    const image = convertStepImageToDynamicImage(step33.image);
     layout6.push(image);
   }
-  if (step31.description) {
-    layout6.push(convertStepDescriptionToDynamicParagraph(step31.description));
+  if (step33.description) {
+    layout6.push(convertStepDescriptionToDynamicParagraph(step33.description));
   }
   return layout6;
 }
-function convertExternalStepToDynamicLayout(step31) {
-  return [...convertCommonComponents(step31), convertStepToExternalComponent(step31)];
+function convertExternalStepToDynamicLayout(step33) {
+  return [...convertCommonComponents(step33), convertStepToExternalComponent(step33)];
 }
-function convertStepToExternalComponent(step31) {
+function convertStepToExternalComponent(step33) {
   return {
     type: "external",
-    requestUrl: step31.requestUrl,
-    polling: step31.polling,
-    responseHandlers: step31.responseHandlers,
-    retryTitle: step31.retryTitle
+    requestUrl: step33.requestUrl,
+    polling: step33.polling,
+    responseHandlers: step33.responseHandlers,
+    retryTitle: step33.retryTitle
   };
 }
-function convertFormStepToDynamicLayout(step31) {
-  const layout6 = convertCommonComponents(step31);
-  if (step31.reviewFields) {
-    layout6.push(convertStepReviewToDynamicReview(step31.reviewFields));
+function convertFormStepToDynamicLayout(step33) {
+  const layout6 = convertCommonComponents(step33);
+  if (step33.reviewFields) {
+    layout6.push(convertStepReviewToDynamicReview(step33.reviewFields));
   }
-  if (step31.schemas) {
-    layout6.push(...getSchemaLayout(step31));
+  if (step33.schemas) {
+    layout6.push(...getSchemaLayout(step33));
   }
-  if (step31.actions) {
-    const actions = step31.actions.map(convertStepActionToDynamicAction);
+  if (step33.actions) {
+    const actions = step33.actions.map(convertStepActionToDynamicAction);
     layout6.push(dynamicBox(actions, "md"));
   }
   return layout6;
 }
-function convertFinalStepToDynamicLayout(step31) {
+function convertFinalStepToDynamicLayout(step33) {
   const layout6 = [];
-  if (step31.details) {
-    if (step31.details.image) {
-      const image = convertFinalStepImageToDynamicImage(step31.details.image);
+  if (step33.details) {
+    if (step33.details.image) {
+      const image = convertFinalStepImageToDynamicImage(step33.details.image);
       layout6.push(image);
     }
-    if (step31.details.title) {
-      layout6.push(convertStepTitleToDynamicHeading(step31.details.title));
+    if (step33.details.title) {
+      layout6.push(convertStepTitleToDynamicHeading(step33.details.title));
     }
-    if (step31.details.description) {
-      layout6.push(convertStepDescriptionToDynamicParagraph(step31.details.description));
+    if (step33.details.description) {
+      layout6.push(convertStepDescriptionToDynamicParagraph(step33.details.description));
     }
   }
-  if (step31.actions) {
-    const actions = step31.actions.map(
+  if (step33.actions) {
+    const actions = step33.actions.map(
       (action2) => convertStepActionToDynamicAction(__spreadProps(__spreadValues({}, action2), { type: action2.type || "primary" }))
     );
     layout6.push(dynamicBox(actions, "md"));
   }
   return layout6;
 }
-function convertDecisionStepToDynamicLayout(step31) {
-  const layout6 = convertCommonComponents(step31);
-  if (step31.options) {
-    layout6.push(convertStepDecisionToDynamicDecision(step31.options));
+function convertDecisionStepToDynamicLayout(step33) {
+  const layout6 = convertCommonComponents(step33);
+  if (step33.options) {
+    layout6.push(convertStepDecisionToDynamicDecision(step33.options));
   }
   return layout6;
 }
@@ -712,10 +712,10 @@ function convertReviewFieldToDefinition(reviewField) {
     value: reviewField.value
   };
 }
-function getSchemaLayout(step31) {
+function getSchemaLayout(step33) {
   const layout6 = [];
-  if (step31.schemas && step31.schemas[0]) {
-    const schema2 = step31.schemas[0];
+  if (step33.schemas && step33.schemas[0]) {
+    const schema2 = step33.schemas[0];
     const dynamicForm = convertStepSchemaToDynamicForm(schema2);
     if (isWideForm()) {
       layout6.push(dynamicForm);
@@ -728,11 +728,11 @@ function getSchemaLayout(step31) {
 function isWideForm() {
   return false;
 }
-function addMissingTitleAndDescriptionToStep(step31, displayStepTitle) {
+function addMissingTitleAndDescriptionToStep(step33, displayStepTitle) {
   return [
-    ...displayStepTitle && step31.title ? [convertStepTitleToDynamicHeading(step31.title)] : [],
-    ...step31.description ? [convertStepDescriptionToDynamicParagraph(step31.description)] : [],
-    ...step31.layout || []
+    ...displayStepTitle && step33.title ? [convertStepTitleToDynamicHeading(step33.title)] : [],
+    ...step33.description ? [convertStepDescriptionToDynamicParagraph(step33.description)] : [],
+    ...step33.layout || []
   ];
 }
 
@@ -1715,19 +1715,19 @@ var stepType = {
   LAYOUT: "layout",
   CAMERA: "camera"
 };
-var isCameraStep = (step31) => {
-  return isFormStep(step31) && hasSingleAction(step31) && hasSingleFileUploadSchemaWithCameraOnly(step31);
+var isCameraStep = (step33) => {
+  return isFormStep(step33) && hasSingleAction(step33) && hasSingleFileUploadSchemaWithCameraOnly(step33);
 };
-var isFormStep = (step31) => (step31 == null ? void 0 : step31.type) === "form";
-var hasSingleAction = (step31) => {
+var isFormStep = (step33) => (step33 == null ? void 0 : step33.type) === "form";
+var hasSingleAction = (step33) => {
   var _a;
-  return ((_a = step31 == null ? void 0 : step31.actions) == null ? void 0 : _a.length) === 1;
+  return ((_a = step33 == null ? void 0 : step33.actions) == null ? void 0 : _a.length) === 1;
 };
-var hasSingleFileUploadSchemaWithCameraOnly = (step31) => {
-  if (!step31.schemas) {
+var hasSingleFileUploadSchemaWithCameraOnly = (step33) => {
+  if (!step33.schemas) {
     return false;
   }
-  const schemas = filterHiddenSchemas(step31.schemas);
+  const schemas = filterHiddenSchemas(step33.schemas);
   if ((schemas == null ? void 0 : schemas.length) !== 1) {
     return false;
   }
@@ -1749,8 +1749,8 @@ var filterHiddenSchemas = (schemas) => {
     return (schema2 == null ? void 0 : schema2.hidden) !== true;
   });
 };
-var getStepType = (step31) => {
-  if (isCameraStep(step31)) {
+var getStepType = (step33) => {
+  if (isCameraStep(step33)) {
     return stepType.CAMERA;
   }
   return stepType.LAYOUT;
@@ -2994,7 +2994,7 @@ var _FormControl = class extends import_react13.PureComponent {
     const {
       name,
       placeholder,
-      step: step31,
+      step: step33,
       countryCode,
       type,
       options,
@@ -3102,7 +3102,7 @@ var _FormControl = class extends import_react13.PureComponent {
             placeholder,
             readOnly,
             required,
-            step: step31,
+            step: step33,
             type: "number",
             value: getSafeStringOrNumberValue(value, { coerceValue: true }),
             onBlur: this.handleOnBlur,
@@ -3318,52 +3318,30 @@ FormControl.defaultProps = {
 // src/jsonSchemaForm/schemaFormControl/utils/mapping-utils.tsx
 var import_components9 = require("@transferwise/components");
 
-// src/layout/icon/DynamicIcon.tsx
-var icons = __toESM(require("@transferwise/icons"));
+// src/layout/icon/FlagIcon.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
-var DynamicIcon = ({ type }) => {
-  const iconName = toCapitalisedCamelCase(type);
-  if (!Object.keys(icons).includes(iconName)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, {});
+var isFlagIcon = (name) => availableCurrencyFlags.some((currencyCode) => name === `flag-${currencyCode}`);
+var FlagIcon = ({ name }) => {
+  if (!isFlagIcon(name)) {
+    return null;
   }
-  const Icon = icons[iconName];
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Icon, { size: 24 });
-};
-function toCapitalisedCamelCase(value) {
-  return value.split("-").map(capitaliseFirstChar).join("");
-}
-function capitaliseFirstChar(value) {
-  var _a;
-  return `${(_a = value[0]) == null ? void 0 : _a.toUpperCase()}${value.slice(1)}`;
-}
-function isValidIconName(name) {
-  const iconName = toCapitalisedCamelCase(name);
-  return Object.keys(icons).includes(iconName);
-}
-var DynamicIcon_default = DynamicIcon;
-
-// src/jsonSchemaForm/schemaFormControl/utils/currency-utils.ts
-function getCurrencyFlag(iconName) {
-  if (iconName) {
-    const index = availablePrefixedCurrencyFlags.indexOf(iconName);
-    if (index >= 0) {
-      return {
-        currency: availableCurrencyFlags[index]
-      };
+  const currencyCode = name.substring(5);
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    "img",
+    {
+      src: `https://wise.com/web-art/assets/flags/${currencyCode}.svg`,
+      alt: "",
+      "data-testid": `img-flag-${currencyCode}`
     }
-  }
-  return null;
-}
+  );
+};
 var availableCurrencyFlags = [
-  "eur",
-  "gbp",
-  "inr",
-  "usd",
   "aed",
   "ars",
   "aud",
   "bdt",
   "bgn",
+  "bnd",
   "brl",
   "bwp",
   "cad",
@@ -3375,7 +3353,9 @@ var availableCurrencyFlags = [
   "czk",
   "dkk",
   "egp",
+  "eur",
   "fjd",
+  "gbp",
   "gel",
   "ghs",
   "hkd",
@@ -3383,10 +3363,14 @@ var availableCurrencyFlags = [
   "huf",
   "idr",
   "ils",
+  "imp",
+  "inr",
   "jpy",
   "kes",
   "krw",
+  "lak",
   "lkr",
+  "lsl",
   "mad",
   "mxn",
   "myr",
@@ -3396,6 +3380,7 @@ var availableCurrencyFlags = [
   "nok",
   "npr",
   "nzd",
+  "pab",
   "pen",
   "php",
   "pkr",
@@ -3405,20 +3390,58 @@ var availableCurrencyFlags = [
   "sek",
   "sgd",
   "thb",
+  "tmt",
   "try",
   "tzs",
   "uah",
   "ugx",
+  "usd",
   "uyu",
   "vnd",
   "xof",
   "zar",
   "zmw"
 ];
-var availablePrefixedCurrencyFlags = availableCurrencyFlags.map((code) => `flag-${code}`);
 
-// src/jsonSchemaForm/schemaFormControl/utils/mapping-utils.tsx
+// src/layout/icon/NamedIcon.tsx
+var icons = __toESM(require("@transferwise/icons"));
 var import_jsx_runtime21 = require("react/jsx-runtime");
+var isNamedIcon = (name) => {
+  const iconName = toCapitalisedCamelCase(name);
+  return Object.keys(icons).includes(iconName);
+};
+var NamedIcon = ({ name }) => {
+  if (!isNamedIcon(name)) {
+    return null;
+  }
+  const iconName = toCapitalisedCamelCase(name);
+  const Icon = icons[iconName];
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon, { size: 24 });
+};
+var toCapitalisedCamelCase = (value) => value.split("-").map(capitaliseFirstChar).join("");
+var capitaliseFirstChar = (value) => {
+  var _a;
+  return `${(_a = value[0]) == null ? void 0 : _a.toUpperCase()}${value.slice(1)}`;
+};
+
+// src/layout/icon/DynamicIcon.tsx
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var DynamicIcon = ({ type }) => {
+  if (isFlagIcon(type)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(FlagIcon, { name: type });
+  }
+  if (isNamedIcon(type)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(NamedIcon, { name: type });
+  }
+  return null;
+};
+function isValidIconName(name) {
+  return isNamedIcon(name) || isFlagIcon(name);
+}
+var DynamicIcon_default = DynamicIcon;
+
+// src/jsonSchemaForm/schemaFormControl/utils/mapping-utils.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var mapConstSchemaToOption = (schema2, controlType) => {
   switch (controlType) {
     case "select":
@@ -3429,56 +3452,58 @@ var mapConstSchemaToOption = (schema2, controlType) => {
   }
 };
 var mapConstSchemaToRadioOption = (schema2) => {
-  return __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({
+  return __spreadValues(__spreadValues(__spreadValues({
     // TODO: LOW avoid type assertion -- using || '' would fail some tests
     label: schema2.title,
     value: schema2.const
-  }, getOptionDescription(schema2.title, schema2.description)), mapIconToAvatar(schema2.icon)), mapCurrency(schema2.icon)), mapAvatar(schema2.image)), getDisabled(schema2.disabled));
+  }, getOptionDescription(schema2.title, schema2.description)), getAvatarPropertyForRadioOption(schema2)), getDisabled(schema2.disabled));
 };
 var mapConstSchemaToSelectOption = (schema2) => {
-  return __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({
+  return __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({
     // TODO: LOW avoid type assertion -- using || '' would fail some tests
     label: schema2.title,
     value: schema2.const
-  }, getOptionDescription(schema2.title, schema2.description)), mapIcon(schema2.icon)), mapCurrency(schema2.icon)), mapImage(schema2.image)), getDisabled(schema2.disabled)), mapKeywordsToSearchStrings(schema2.keywords));
+  }, getOptionDescription(schema2.title, schema2.description)), getIconPropertyForSelectOption(schema2.icon)), mapImage(schema2.image)), getDisabled(schema2.disabled)), mapKeywordsToSearchStrings(schema2.keywords));
 };
-var mapCurrency = (icon) => icon ? getCurrencyFlag(icon.name) : null;
 var mapKeywordsToSearchStrings = (searchStrings) => isArray(searchStrings) ? { searchStrings } : {};
 var mapImage = (image) => {
   if (image == null ? void 0 : image.url) {
     return {
-      icon: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "media", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "np-option__no-media-circle", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: image.url, alt: image.name || "" }) }) })
+      icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "media", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "np-option__no-media-circle", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("img", { src: image.url, alt: image.name || "" }) }) })
     };
   }
   return null;
 };
-var mapIcon = (icon) => {
+var getIconPropertyForSelectOption = (icon) => {
+  if ((icon == null ? void 0 : icon.name) && isFlagIcon(icon.name)) {
+    return { currency: icon.name.substring(5) };
+  }
   if ((icon == null ? void 0 : icon.name) && isValidIconName(icon.name)) {
-    return { icon: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DynamicIcon_default, { type: icon.name }) };
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DynamicIcon_default, { type: icon.name }) };
   }
   if (icon == null ? void 0 : icon.text) {
-    return { icon: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: icon.text }) };
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: icon.text }) };
   }
   return null;
 };
-var mapIconToAvatar = (icon) => {
+var getAvatarPropertyForRadioOption = ({ image, icon }) => {
+  if (image == null ? void 0 : image.url) {
+    return {
+      avatar: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_components9.Avatar, { type: import_components9.AvatarType.THUMBNAIL, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("img", { src: image.url, alt: "" }) })
+    };
+  }
   if ((icon == null ? void 0 : icon.name) && isValidIconName(icon.name)) {
     return {
-      avatar: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_components9.Avatar, { type: import_components9.AvatarType.ICON, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DynamicIcon_default, { type: icon.name }) })
+      avatar: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_components9.Avatar, { type: import_components9.AvatarType.ICON, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DynamicIcon_default, { type: icon.name }) })
     };
   }
   if (icon == null ? void 0 : icon.text) {
     return {
-      avatar: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_components9.Avatar, { type: import_components9.AvatarType.INITIALS, children: icon.text })
+      avatar: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_components9.Avatar, { type: import_components9.AvatarType.INITIALS, children: icon.text })
     };
   }
   return null;
 };
-var mapAvatar = (image) => {
-  return image && image.url ? {
-    avatar: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_components9.Avatar, { type: import_components9.AvatarType.THUMBNAIL, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: image.url, alt: "User avatar" }) })
-  } : null;
-};
 var mapSchemaToUploadOptions = ({ accepts }) => __spreadValues({}, isArray(accepts) && { usAccept: accepts.join(",") });
 var getOptionDescription = (title, description) => {
   if (title && description) {
@@ -3495,19 +3520,26 @@ var getDisabled = (disabled) => {
 };
 
 // src/jsonSchemaForm/schemaFormControl/SchemaFormControl.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var isNativeInput = (propsSchemaType) => {
   return propsSchemaType === "string" || propsSchemaType === "number";
 };
-var getControlType = (schema2) => {
-  if ("control" in schema2 && schema2.control) {
-    if (isOneOfSchema(schema2) && schema2.oneOf.length > 3) {
+var getControlType = (schema2, log) => {
+  if (isOneOfSchema(schema2)) {
+    if (schema2.control === FormControlType.TAB && schema2.oneOf.length > 3) {
       return FormControlType.SELECT;
     }
-    return schema2.control;
+    if (schema2.oneOf.length === 2 && !schema2.control) {
+      log.warning(
+        "Deprecation warning",
+        'A oneOf schema with 2 options and no control type currently renders as a "radio" but will be changed to render as a "select". Please specify control radio to retain the existing behaviour.'
+      );
+      return FormControlType.RADIO;
+    }
+    return schema2.control || FormControlType.SELECT;
   }
-  if (schema2.oneOf) {
-    return schema2.oneOf.length === 1 || schema2.oneOf.length >= 3 ? "select" : "radio";
+  if ("control" in schema2 && schema2.control) {
+    return schema2.control;
   }
   if (schema2.type === "string") {
     switch (schema2.format) {
@@ -3543,10 +3575,10 @@ var SchemaFormControl = (props) => {
   const onChange = (value, type) => {
     props.onChange(getValidBasicModelOrNull(value, props.schema), type);
   };
-  const controlType = getControlType(props.schema);
+  const controlType = getControlType(props.schema, log);
   if (controlType === "file") {
     log.warning(
-      "Deprecation advanced warning",
+      "Deprecation warning",
       "Please use a persist-async blob schema instead of string with base64url for file uploads. The base64url does not perform well on low end devices. Support for this schema will be removed in a later release."
     );
   }
@@ -3573,7 +3605,7 @@ var SchemaFormControl = (props) => {
     // TODO: LOW avoid type assertion below
     uploadProps: mapSchemaToUploadOptions(props.schema)
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(FormControl, __spreadValues(__spreadValues({ type: controlType, value: safeValue }, events), controlProps));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FormControl, __spreadValues(__spreadValues({ type: controlType, value: safeValue }, events), controlProps));
 };
 SchemaFormControl.defaultProps = {
   value: null,
@@ -3644,7 +3676,7 @@ function getSchemaProperties(childSchema) {
 }
 
 // src/jsonSchemaForm/oneOfSchema/OneOfSchema.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var OneOfSchema5 = (props) => {
   const onEvent = useEventDispatcher();
   const [changed, setChanged] = (0, import_react14.useState)(false);
@@ -3717,11 +3749,11 @@ var OneOfSchema5 = (props) => {
     "form-group": true,
     "has-error": !changed && props.errors && !isEmpty(props.errors) || (props.submitted || changed && blurred) && validations.length
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-    (props.schema.oneOf.length > 1 || isConstSchema(props.schema.oneOf[0])) && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: (0, import_classnames4.default)(formGroupClasses), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+    (props.schema.oneOf.length > 1 || isConstSchema(props.schema.oneOf[0])) && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: (0, import_classnames4.default)(formGroupClasses), children: [
         getTitleAndHelp(props.schema, id),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           SchemaFormControl_default,
           {
             id,
@@ -3734,7 +3766,7 @@ var OneOfSchema5 = (props) => {
             onSearchChange
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           ControlFeedback_default,
           {
             changed,
@@ -3748,9 +3780,9 @@ var OneOfSchema5 = (props) => {
           }
         )
       ] }),
-      props.schema.alert && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DynamicAlert_default, { component: props.schema.alert })
+      props.schema.alert && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(DynamicAlert_default, { component: props.schema.alert })
     ] }),
-    isNoNConstSchema(props.schema.oneOf[schemaIndex]) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    isNoNConstSchema(props.schema.oneOf[schemaIndex]) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       GenericSchema_default,
       {
         schema: props.schema.oneOf[schemaIndex],
@@ -3766,12 +3798,12 @@ var OneOfSchema5 = (props) => {
   ] });
 };
 function getTitleAndHelp(schema2, id) {
-  const helpElement = schema2.help ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Help_default, { help: schema2.help }) : null;
-  const titleElement = isConstSchema(schema2.oneOf[0]) ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("label", { className: "control-label d-inline", htmlFor: id, children: [
+  const helpElement = schema2.help ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Help_default, { help: schema2.help }) : null;
+  const titleElement = isConstSchema(schema2.oneOf[0]) ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("label", { className: "control-label d-inline", htmlFor: id, children: [
     schema2.title,
     " ",
     helpElement
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("h4", { className: "m-b-2", children: [
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("h4", { className: "m-b-2", children: [
     schema2.title,
     " ",
     helpElement
@@ -3817,7 +3849,7 @@ var import_react16 = require("react");
 // src/jsonSchemaForm/persistAsyncSchema/persistAsyncBlobSchema/UploadInputAdapter.tsx
 var import_components10 = require("@transferwise/components");
 var import_react15 = require("react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var UploadInputAdapter = (props) => {
   const {
     id,
@@ -3851,7 +3883,7 @@ var UploadInputAdapter = (props) => {
       }
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     import_components10.UploadInput,
     {
       id,
@@ -3871,7 +3903,7 @@ var UploadInputAdapter = (props) => {
 };
 
 // src/jsonSchemaForm/persistAsyncSchema/persistAsyncBlobSchema/PersistAsyncBlobSchema.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var PersistAsyncBlobSchema = (props) => {
   const [persistAsyncValidationMessages, setPersistAsyncValidationMessages] = (0, import_react16.useState)({});
   const [persistAsyncValidations, setPersistAsyncValidations] = (0, import_react16.useState)(null);
@@ -3913,8 +3945,8 @@ var PersistAsyncBlobSchema = (props) => {
     "form-group": true,
     "has-error": (props.submitted || changed) && !!combinedValidations.length
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: (0, import_classnames5.default)(formGroupClasses), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: (0, import_classnames5.default)(formGroupClasses), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       UploadInputAdapter,
       __spreadValues({
         id: props.schema.$id || props.schema.persistAsync.schema.$id || props.schema.persistAsync.idProperty,
@@ -3931,7 +3963,7 @@ var PersistAsyncBlobSchema = (props) => {
         onCancel
       }, mapSchemaToUploadOptions(props.schema.persistAsync.schema))
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       ControlFeedback_default,
       {
         blurred: true,
@@ -3955,17 +3987,17 @@ PersistAsyncBlobSchema.defaultProps = {
 var PersistAsyncBlobSchema_default = PersistAsyncBlobSchema;
 
 // src/jsonSchemaForm/persistAsyncSchema/PersistAsyncSchema.tsx
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var PersistAsyncSchema = (props) => {
   const { schema: schema2 } = props;
   const persistAsyncSchemaType = schema2.persistAsync.schema.type;
   if (persistAsyncSchemaType === "blob") {
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       PersistAsyncBlobSchema_default,
       __spreadValues({}, props)
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PersistAsyncBasicSchema_default, __spreadValues({}, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PersistAsyncBasicSchema_default, __spreadValues({}, props));
 };
 PersistAsyncSchema.defaultProps = {
   required: false
@@ -3986,7 +4018,7 @@ var getSelectionFromModel = (schema2, model) => {
 
 // src/jsonSchemaForm/promotedOneOfSchema/promotedOneOfControl/PromotedOneOfCheckboxControl.tsx
 var import_components11 = require("@transferwise/components");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var PromotedOneOfCheckboxControl = (props) => {
   const { id, selection, setSelection } = props;
   const { promoted, other, checkedMeans } = props.promotion;
@@ -3997,33 +4029,33 @@ var PromotedOneOfCheckboxControl = (props) => {
   const toggleSelection = () => {
     setSelection(checked ? selectionWhenUnchecked : selectionWhenChecked);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "form-group", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_components11.Checkbox, { id, label: title, checked, onChange: toggleSelection }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "form-group", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_components11.Checkbox, { id, label: title, checked, onChange: toggleSelection }) });
 };
 PromotedOneOfCheckboxControl.defaultProps = {};
 var PromotedOneOfCheckboxControl_default = PromotedOneOfCheckboxControl;
 
 // src/jsonSchemaForm/promotedOneOfSchema/promotedOneOfControl/PromotedOneOfRadioControl.tsx
 var import_components12 = require("@transferwise/components");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var PromotedOneOfRadioControl = (props) => {
   var _a, _b;
   const { id, selection, setSelection, promotion, promotedOneOf, title } = props;
   const radios = [
-    __spreadValues(__spreadValues({
+    __spreadValues({
       value: "promoted",
       // TODO: LOW avoid type assertion below the expression may be nullish, but "label" cannot be
       label: ((_a = promotion.promoted) == null ? void 0 : _a.title) || promotedOneOf.title,
       secondary: ((_b = promotion.promoted) == null ? void 0 : _b.description) || promotedOneOf.description
-    }, mapIconToAvatar(promotedOneOf.icon)), mapAvatar(promotedOneOf.image)),
-    __spreadValues(__spreadValues({
+    }, getAvatarPropertyForRadioOption(promotedOneOf)),
+    __spreadValues({
       value: "other",
       label: promotion.other.title,
       secondary: promotion.other.description
-    }, mapIconToAvatar(promotion.other.icon)), mapAvatar(promotion.other.image))
+    }, getAvatarPropertyForRadioOption(promotion.other))
   ];
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "form-group", children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("label", { className: "control-label", htmlFor: id, children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "form-group", children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("label", { className: "control-label", htmlFor: id, children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       import_components12.RadioGroup,
       {
         name: "promoted-selection",
@@ -4041,16 +4073,16 @@ PromotedOneOfRadioControl.defaultProps = {
 var PromotedOneOfRadioControl_default = PromotedOneOfRadioControl;
 
 // src/jsonSchemaForm/promotedOneOfSchema/promotedOneOfControl/PromotedOneOfControl.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var PromotedOneOfControl = (props) => {
   const controlType = props.promotion.control || "radio";
   switch (controlType) {
     case "radio":
-      return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(PromotedOneOfRadioControl_default, __spreadValues({}, props));
+      return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(PromotedOneOfRadioControl_default, __spreadValues({}, props));
     case "checkbox":
-      return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(PromotedOneOfCheckboxControl_default, __spreadValues({}, props));
+      return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(PromotedOneOfCheckboxControl_default, __spreadValues({}, props));
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_jsx_runtime29.Fragment, {});
+      return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, {});
   }
 };
 PromotedOneOfControl.defaultProps = {
@@ -4060,7 +4092,7 @@ PromotedOneOfControl.defaultProps = {
 var PromotedOneOfControl_default = PromotedOneOfControl;
 
 // src/jsonSchemaForm/promotedOneOfSchema/PromotedOneOfSchema.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var isPromoted = (schema2) => schema2.promoted === true;
 var PromotedOneOfSchema = (props) => {
   var _a;
@@ -4071,9 +4103,9 @@ var PromotedOneOfSchema = (props) => {
   const promotedOneOf = props.schema.oneOf.find(isPromoted);
   const promotedObjectSchema = getPromotedObjectSchema(promotedOneOf);
   const otherOneOf = getOtherOneOf(props.schema);
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
-    promotedAlert && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DynamicAlert_default, { component: promotedAlert }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
+    promotedAlert && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DynamicAlert_default, { component: promotedAlert }),
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       PromotedOneOfControl_default,
       {
         id: props.schema.$id,
@@ -4084,8 +4116,8 @@ var PromotedOneOfSchema = (props) => {
         setSelection
       }
     ),
-    selection === "promoted" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ObjectSchema_default, __spreadProps(__spreadValues({}, props), { schema: promotedObjectSchema })),
-    selection === "other" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(GenericSchema_default, __spreadProps(__spreadValues({}, props), { schema: otherOneOf }))
+    selection === "promoted" && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ObjectSchema_default, __spreadProps(__spreadValues({}, props), { schema: promotedObjectSchema })),
+    selection === "other" && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(GenericSchema_default, __spreadProps(__spreadValues({}, props), { schema: otherOneOf }))
   ] });
 };
 function getPromotedObjectSchema(promotedSchema) {
@@ -4134,12 +4166,12 @@ var ReadOnlySchema_messages_default = (0, import_react_intl11.defineMessages)({
 });
 
 // src/jsonSchemaForm/readOnlySchema/ReadOnlySchema.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var ReadOnlySchema = ({ schema: schema2, model }) => {
   const { title = "" } = schema2;
   const { formatMessage } = (0, import_react_intl12.useIntl)();
   const value = getValueForSchema({ schema: schema2, model, formatMessage });
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_components13.DefinitionList, { layout: import_components13.Layout.VERTICAL_ONE_COLUMN, definitions: [{ title, value, key: "" }] });
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_components13.DefinitionList, { layout: import_components13.Layout.VERTICAL_ONE_COLUMN, definitions: [{ title, value, key: "" }] });
 };
 var ReadOnlySchema_default = ReadOnlySchema;
 function getValueForSchema({
@@ -4171,22 +4203,17 @@ function getSelectedOneOf(schema2, model) {
 }
 function getValueFromOption(option) {
   const text = option.title && option.description ? `${option.title} - ${option.description}` : option.title || "";
-  const currencyFlag = getCurrencyFlagFromOption(option);
-  return currencyFlag ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
-    currencyFlag,
+  const icon = getAvatarPropertyForRadioOption({ icon: option.icon });
+  return (icon == null ? void 0 : icon.avatar) ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
+    icon.avatar,
     " ",
     text
   ] }) : text;
 }
-function getCurrencyFlagFromOption(option) {
-  var _a, _b;
-  const currency = (_b = getCurrencyFlag((_a = option.icon) == null ? void 0 : _a.name)) == null ? void 0 : _b.currency;
-  return currency ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("i", { className: `currency-flag currency-flag-${currency} hidden-xs` }) : null;
-}
 
 // src/jsonSchemaForm/validationAsyncSchema/ValidationAsyncSchema.tsx
 var import_react18 = require("react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var ValidationAsyncSchema = (props) => {
   const [validationAsyncModel, setValidationAsyncModel] = (0, import_react18.useState)(props.model);
   const previousRequestedModelReference = (0, import_react18.useRef)(null);
@@ -4269,13 +4296,13 @@ var ValidationAsyncSchema = (props) => {
     onBlur,
     infoMessage: validationAsyncSuccessMessage
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(BasicTypeSchema_default, __spreadValues({}, basicTypeSchemaProps));
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(BasicTypeSchema_default, __spreadValues({}, basicTypeSchemaProps));
 };
 ValidationAsyncSchema.defaultProps = { required: false };
 var ValidationAsyncSchema_default = ValidationAsyncSchema;
 
 // src/jsonSchemaForm/genericSchema/GenericSchema.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var GenericSchemaForm = (props) => {
   const { schema: schema2, model = null, errors = null, hideTitle = false, disabled = false } = props;
   const schemaProps = __spreadProps(__spreadValues({}, props), { model, errors, hideTitle, disabled });
@@ -4287,22 +4314,22 @@ var GenericSchemaForm = (props) => {
   );
   switch (type) {
     case "readOnly":
-      return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ReadOnlySchema_default, __spreadValues({}, schemaProps));
+      return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ReadOnlySchema_default, __spreadValues({}, schemaProps));
     case "persistAsync":
       if (isPersistAsyncSchema(schema2) && isNullableStringModel(model) && isBasicError(errors)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PersistAsyncSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(PersistAsyncSchema_default, __spreadValues({}, filteredProps));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PersistAsyncSchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(PersistAsyncSchema_default, __spreadValues({}, props));
       }
     case "validationAsync":
       if (isValidationAsyncSchema(schema2) && isNullableBasicModel(model) && isBasicError(errors)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ValidationAsyncSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ValidationAsyncSchema_default, __spreadValues({}, filteredProps));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ValidationAsyncSchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ValidationAsyncSchema_default, __spreadValues({}, props));
       }
     case "basic": {
       if (isBasicSchema(schema2) && isNullableBasicModel(model) && isBasicError(errors)) {
@@ -4313,7 +4340,7 @@ var GenericSchemaForm = (props) => {
           model,
           errors
         });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(BasicTypeSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(BasicTypeSchema_default, __spreadValues({}, filteredProps));
       } else {
         const filteredProps = __spreadProps(__spreadValues({
           infoMessage: null
@@ -4323,56 +4350,56 @@ var GenericSchemaForm = (props) => {
           errors
         });
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(BasicTypeSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(BasicTypeSchema_default, __spreadValues({}, filteredProps));
       }
     }
     case "object":
       if (isObjectSchema(schema2) && isNullableObjectModel(model)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ObjectSchema_default, __spreadValues({}, filteredProps), JSON.stringify(schema2));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ObjectSchema_default, __spreadValues({}, filteredProps), JSON.stringify(schema2));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ObjectSchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ObjectSchema_default, __spreadValues({}, props));
       }
     case "array":
       if (isArraySchema(schema2) && isNullableArrayModel(model) && isBasicError(errors)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ArraySchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ArraySchema_default, __spreadValues({}, filteredProps));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ArraySchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(ArraySchema_default, __spreadValues({}, props));
       }
     case "promotedOneOf":
       if (isOneOfObjectSchema(schema2) && isNullableObjectModel(model)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PromotedOneOfSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(PromotedOneOfSchema_default, __spreadValues({}, filteredProps));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PromotedOneOfSchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(PromotedOneOfSchema_default, __spreadValues({}, props));
       }
     case "oneOf":
       if (isOneOfSchema(schema2)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(OneOfSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(OneOfSchema_default, __spreadValues({}, filteredProps));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(OneOfSchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(OneOfSchema_default, __spreadValues({}, props));
       }
     case "allOf":
       if (isAllOfSchema(schema2) && isObjectModel(model)) {
         const filteredProps = __spreadProps(__spreadValues({}, schemaProps), { schema: schema2, model, errors });
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AllOfSchema_default, __spreadValues({}, filteredProps));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(AllOfSchema_default, __spreadValues({}, filteredProps));
       } else {
         logInvalidSchemaWarning();
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AllOfSchema_default, __spreadValues({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(AllOfSchema_default, __spreadValues({}, props));
       }
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, {});
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_jsx_runtime35.Fragment, {});
 };
 var GenericSchema_default = GenericSchemaForm;
 
 // src/jsonSchemaForm/JsonSchemaForm.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var JsonSchemaForm = (props) => {
   const schemaProps = __spreadValues({
     model: null,
@@ -4381,26 +4408,26 @@ var JsonSchemaForm = (props) => {
     baseUrl: ""
   }, props);
   if (useHasHttpClientProvider() || schemaProps.baseUrl == null) {
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(GenericSchema_default, __spreadValues({}, schemaProps));
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(GenericSchema_default, __spreadValues({}, schemaProps));
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     Providers,
     {
       baseUrl: schemaProps.baseUrl,
       onEvent: schemaProps.onEvent,
       onLog: schemaProps.onLog,
-      children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(GenericSchema_default, __spreadValues({}, schemaProps))
+      children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(GenericSchema_default, __spreadValues({}, schemaProps))
     }
   );
 };
 var JsonSchemaForm_default = JsonSchemaForm;
 var Providers = ({ baseUrl, onEvent, onLog, children }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(LogProvider, { flowId: "JsonSchemaForm", stepId: "JsonSchemaForm", onLog: onLog != null ? onLog : noop2, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(LogProvider, { flowId: "JsonSchemaForm", stepId: "JsonSchemaForm", onLog: onLog != null ? onLog : noop2, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     EventsContextProvider,
     {
       metadata: { flowId: "JsonSchemaForm", stepId: "JsonSchemaForm" },
       onEvent: onEvent != null ? onEvent : noop2,
-      children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(HttpClientProviderFromBaseUrl, { baseUrl, children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(HttpClientProviderFromBaseUrl, { baseUrl, children })
     }
   ) });
 };
@@ -4408,11 +4435,11 @@ var noop2 = () => {
 };
 
 // src/layout/form/DynamicForm.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var DynamicForm = (props) => {
   const form = props.component;
   const formSchema = form.schema;
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: getMarginBottom(form.margin || "md"), children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: getMarginBottom(form.margin || "md"), children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     JsonSchemaForm_default,
     {
       schema: formSchema,
@@ -4429,38 +4456,38 @@ var DynamicForm = (props) => {
 var DynamicForm_default = DynamicForm;
 
 // src/layout/heading/DynamicHeading.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var DynamicHeading = (props) => {
   const { text, size = "md", align = "left", margin = "md" } = props.component;
   const classes = getTextAlignmentAndMargin({ align, margin });
   switch (size) {
     case "xs":
-      return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h5", { className: classes, children: text });
+      return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("h5", { className: classes, children: text });
     case "sm":
-      return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h4", { className: classes, children: text });
+      return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("h4", { className: classes, children: text });
     case "lg":
-      return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h2", { className: classes, children: text });
+      return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("h2", { className: classes, children: text });
     case "xl":
-      return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h1", { className: classes, children: text });
+      return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("h1", { className: classes, children: text });
     case "md":
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("h3", { className: classes, children: text });
+      return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("h3", { className: classes, children: text });
   }
 };
 var DynamicHeading_default = DynamicHeading;
 
 // src/layout/info/DynamicInfo.tsx
 var import_components14 = require("@transferwise/components");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var DynamicInfo = ({ component }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: getTextAlignmentAndMargin(component), children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_components14.Markdown, { config: { link: { target: "_blank" } }, children: component.markdown }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: getTextAlignmentAndMargin(component), children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_components14.Markdown, { config: { link: { target: "_blank" } }, children: component.markdown }) });
 };
 var DynamicInfo_default = DynamicInfo;
 
 // src/layout/image/DynamicImage.tsx
 var import_components15 = require("@transferwise/components");
 var import_react19 = require("react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var DynamicImage = ({ component: image }) => {
   const { url, size, text, margin } = image;
   const httpClient = useHttpClient();
@@ -4477,7 +4504,7 @@ var DynamicImage = ({ component: image }) => {
   if (!imageSource) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: `df-image ${size || "xl"}`, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_components15.Image, __spreadValues({ className: `img-responsive ${getMarginBottom(margin || "lg")}` }, imageProps)) });
+  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)) });
 };
 var readImageBlobAsDataURL = (imageBlob) => {
   return new Promise((resolve, reject) => {
@@ -4510,28 +4537,28 @@ var getImageSource = async (httpClient, imageUrl) => {
 var DynamicImage_default = DynamicImage;
 
 // src/layout/DynamicLayout.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime41 = 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_runtime39.jsx)(DynamicHeading_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicHeading_default, { component }, getKey(component));
       case "paragraph":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicParagraph_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicParagraph_default, { component }, getKey(component));
       case "image":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicImage_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicImage_default, { component }, getKey(component));
       case "alert":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicAlert_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicAlert_default, { component }, getKey(component));
       case "review":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicReview_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicReview_default, { component, onAction }, getKey(component));
       case "divider":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicDivider_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicDivider_default, { component }, getKey(component));
       case "info":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicInfo_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicInfo_default, { component }, getKey(component));
       case "columns":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
           DynamicColumns_default,
           {
             component,
@@ -4545,7 +4572,7 @@ var DynamicLayout = (props) => {
           getKey(component)
         );
       case "form":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
           DynamicForm_default,
           {
             component,
@@ -4558,9 +4585,9 @@ var DynamicLayout = (props) => {
           getKey(component)
         );
       case "button":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicButton_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicButton_default, { component, onAction }, getKey(component));
       case "box":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
           DynamicBox_default,
           {
             component,
@@ -4574,31 +4601,31 @@ var DynamicLayout = (props) => {
           getKey(component)
         );
       case "decision":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicDecision_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicDecision_default, { component, onAction }, getKey(component));
       case "external":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicExternal_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicExternal_default, { component, onAction }, getKey(component));
       case "list":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicList_default, { component, onAction }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicList_default, { component, onAction }, getKey(component));
       case "loading-indicator":
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DynamicLoadingIndicator_default, { component }, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicLoadingIndicator_default, { component }, getKey(component));
       default:
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", {}, getKey(component));
+        return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", {}, getKey(component));
     }
   };
   if (useHasHttpClientProvider() || baseUrl == null) {
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: components.map(renderComponent) });
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_jsx_runtime41.Fragment, { children: components.map(renderComponent) });
   } else {
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(HttpClientProviderFromBaseUrl, { baseUrl, children: components.map(renderComponent) });
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HttpClientProviderFromBaseUrl, { baseUrl, children: components.map(renderComponent) });
   }
 };
 var DynamicLayout_default = DynamicLayout;
 
 // src/layout/list/DynamicList.tsx
 var import_components16 = require("@transferwise/components");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var DynamicList = ({ component }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: getMarginBottom(component.margin || "md"), children: [
-    component.title ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("h4", { className: "m-b-2", children: [
+  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: [
       " ",
       component.title,
       " "
@@ -4611,8 +4638,8 @@ function mapItemToSummary({ title, description, icon, status }) {
     key: `${title}/${description || ""}`,
     title,
     description
-  }, (icon == null ? void 0 : icon.name) ? { icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(DynamicIcon_default, { type: icon.name }) } : {}), status ? { status: statusMap[status] } : {});
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components16.Summary, __spreadValues({}, props));
+  }, (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));
 }
 var statusMap = {
   positive: "done",
@@ -4623,10 +4650,10 @@ var DynamicList_default = DynamicList;
 
 // src/layout/loadingIndicator/DynamicLoadingIndicator.tsx
 var import_components17 = require("@transferwise/components");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var DynamicLoadingIndicator = ({ component }) => {
   const { margin, size = "md" } = component;
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
     import_components17.Loader,
     {
       size,
@@ -4669,9 +4696,9 @@ function noop3() {
 }
 
 // src/layout/paragraph/DynamicParagraph.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
-var DynamicParagraph = ({ component }) => component.control === "copyable" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CopyableDynamicParagraph, { component }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(BasicDynamicParagraph, { component });
-var BasicDynamicParagraph = ({ component }) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("p", { className: getTextAlignmentAndMargin(component), children: [
+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: [
   " ",
   component.text,
   " "
@@ -4685,8 +4712,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_runtime42.jsxs)("div", { className: getTextAlignmentAndMargin(component), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: getTextAlignmentAndMargin(component), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       "input",
       {
         type: "text",
@@ -4696,7 +4723,7 @@ var CopyableDynamicParagraph = ({ component }) => {
         style: { textOverflow: "ellipsis" }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_components19.Button, { block: true, onClick: copy, children: formatMessage(DynamicParagraph_messages_default.copy) })
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_components19.Button, { block: true, onClick: copy, children: formatMessage(DynamicParagraph_messages_default.copy) })
   ] });
 };
 function noop4() {
@@ -4705,7 +4732,7 @@ var DynamicParagraph_default = DynamicParagraph;
 
 // src/layout/review/DynamicReview.tsx
 var import_components20 = require("@transferwise/components");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var mapFieldsToDefinitions = ({ label, value }, index) => {
   return { key: String(index), title: label, value };
 };
@@ -4716,7 +4743,7 @@ var DynamicReview = (props) => {
   const review = props.component;
   const margin = getMarginBottom(review.margin || "xs");
   const getReviewAction = (action2) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       "a",
       {
         href: action2.url,
@@ -4730,12 +4757,12 @@ var DynamicReview = (props) => {
       }
     );
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
-    review.title && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("h6", { className: "m-b-2", children: [
+  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: [
       review.title,
       review.action && getReviewAction(review.action)
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       import_components20.DefinitionList,
       {
         layout: getReviewLayout(review.orientation),
@@ -4747,7 +4774,7 @@ var DynamicReview = (props) => {
 var DynamicReview_default = DynamicReview;
 
 // src/jsonSchemaForm/basicTypeSchema/BasicTypeSchema.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var isNullish = (value) => isNull(value) || isUndefined(value);
 var getDefaultValue = (schema2) => {
   return schema2.type === "boolean" && isNullish(schema2.default) ? false : schema2.default;
@@ -4818,15 +4845,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_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [
-    props.schema.alert && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(DynamicAlert_default, { component: props.schema.alert }),
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: (0, import_classnames6.default)(formGroupClasses), children: [
-      showLabel && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "d-inline-block", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("label", { className: "control-label d-inline", htmlFor: id, children: props.schema.title }),
-        !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Help_default, { help: schemaHelp })
+  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 })
       ] }),
-      !showLabel && !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Help_default, { help: schemaHelp }),
-      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      !showLabel && !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Help_default, { help: schemaHelp }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
         SchemaFormControl_default,
         {
           id,
@@ -4838,7 +4865,7 @@ var BasicTypeSchema = (props) => {
           onBlur
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
         ControlFeedback_default,
         {
           changed,
@@ -4862,7 +4889,7 @@ BasicTypeSchema.defaultProps = {
 var BasicTypeSchema_default = BasicTypeSchema;
 
 // src/jsonSchemaForm/persistAsyncSchema/persistAsyncBasicSchema/PersistAsyncBasicSchema.tsx
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var getIdFromResponse = (idProperty, response) => {
   return response[idProperty];
 };
@@ -4886,10 +4913,11 @@ var PersistAsyncBasicSchema = (props) => {
   const [persistAsyncError, setPersistAsyncError] = (0, import_react22.useState)(null);
   const [fieldSubmitted, setFieldSubmitted] = (0, import_react22.useState)(false);
   const [abortController, setAbortController] = (0, import_react22.useState)(null);
+  const log = useLogger();
   (0, import_react22.useEffect)(() => {
     if (controlTypesWithPersistOnChange.has(
       // TODO: LOW avoid type assertion below -- control type may be nullish. consider ?? ''
-      getControlType(props.schema.persistAsync.schema)
+      getControlType(props.schema.persistAsync.schema, log)
     )) {
       persistAsyncIfValid();
     }
@@ -4953,7 +4981,7 @@ var PersistAsyncBasicSchema = (props) => {
       setPersistAsyncModel(newPersistAsyncModel);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     BasicTypeSchema_default,
     {
       required: props.required,
@@ -5164,18 +5192,18 @@ function useStepPolling(polling, onAction) {
 }
 
 // src/step/layoutStep/LayoutStep.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
-var getComponents = (step31, options) => {
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var getComponents = (step33, options) => {
   var _a;
-  if (!step31 || isEmpty(step31) || !step31.layout && !step31.type) {
+  if (!step33 || isEmpty(step33) || !step33.layout && !step33.type) {
     return [];
   }
-  const layout6 = convertStepToLayout(step31, options);
+  const layout6 = convertStepToLayout(step33, options);
   return inlineReferences({
     layout: layout6,
-    schemas: step31.schemas || [],
-    actions: step31.actions || [],
-    model: (_a = step31.model) != null ? _a : null
+    schemas: step33.schemas || [],
+    actions: step33.actions || [],
+    model: (_a = step33.model) != null ? _a : null
   });
 };
 var LayoutStep = (props) => {
@@ -5187,7 +5215,7 @@ var LayoutStep = (props) => {
     onEvent("Dynamic Flow - onAction supressed", { reason: "LayoutStep - loading state" });
   };
   useStepPolling(stepSpecification.polling, onAction);
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
     DynamicLayout_default,
     {
       components,
@@ -5233,15 +5261,15 @@ var CameraCapture_messages_default = (0, import_react_intl17.defineMessages)({
 // src/step/cameraStep/cameraCapture/components/index.tsx
 var import_components21 = require("@transferwise/components");
 var import_react_intl18 = require("react-intl");
-var import_jsx_runtime47 = require("react/jsx-runtime");
-var CaptureBottomBar = ({ onCapture }) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "bottom-bar", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(CaptureButton, { onClick: onCapture }) });
+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 ReviewBottomBar = ({
   onSubmit,
   onRetry
 }) => {
   const intl = (0, import_react_intl18.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "bottom-bar p-x-2", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "col-xs-12 col-md-6 col-md-offset-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+  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,
       {
         className: "m-b-1",
@@ -5252,7 +5280,7 @@ var ReviewBottomBar = ({
         children: intl.formatMessage(CameraCapture_messages_default.reviewSubmit)
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       import_components21.Button,
       {
         className: "m-b-2",
@@ -5266,14 +5294,14 @@ var ReviewBottomBar = ({
     )
   ] }) }) });
 };
-var CaptureButton = ({ onClick }) => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+var CaptureButton = ({ onClick }) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
   "button",
   {
     type: "button",
     className: "camera-capture-btn m-b-2",
     "data-testid": "camera-capture-button",
     onClick,
-    children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "camera-capture-btn-inner" })
+    children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { className: "camera-capture-btn-inner" })
   }
 );
 
@@ -5353,7 +5381,7 @@ var useVideoConstraints = (direction) => {
 
 // src/step/cameraStep/cameraCapture/overlay/Overlay.tsx
 var import_react28 = require("react");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var captureButtonHeight = 92;
 var reviewButtonsHeight = 120;
 var imageHeight = 40;
@@ -5382,18 +5410,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_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
-    imageUrl && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("img", { className: "camera-capture-img", src: imageUrl, alt: "" }),
-    title && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("h4", { className: "camera-capture-title", children: title }),
-    instructions && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("small", { className: "camera-capture-instructions", children: instructions })
+  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 })
   ] });
   const frameBottomMargin = captureButtonHeight + helperBoxHeight;
   if (reviewInstructions) {
     helperBoxHeight = frameBottomMargin - reviewButtonsHeight;
-    helperBox = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("small", { className: "camera-capture-instructions", children: reviewInstructions });
+    helperBox = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("small", { className: "camera-capture-instructions", children: reviewInstructions });
     const frameWithReviewInstructionsMinBottomMargin = reviewButtonsHeight + reviewInstructionsHeight;
     if (frameBottomMargin < frameWithReviewInstructionsMinBottomMargin) {
-      helperBox = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, {});
+      helperBox = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx_runtime50.Fragment, {});
     }
   }
   const framePosition = {
@@ -5411,14 +5439,14 @@ var Overlay = ({
       width: "90%"
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("svg", { ref: svgReference, xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("mask", { id: "mask", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("rect", { width: "100%", height: "100%", fill: "#fff" }),
-      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("image", __spreadValues({ href: overlay }, framePosition))
+  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))
     ] }) }),
-    overlay && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("rect", { width: "100%", height: "100%", mask: "url(#mask)", fillOpacity: "0.72" }),
-    outline && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("image", __spreadValues({ href: outline }, framePosition)),
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("foreignObject", { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", __spreadProps(__spreadValues({ className: "camera-capture-text-and-image-container" }, helperBoxPosition), { children: helperBox })) })
+    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 })) })
   ] });
 };
 var Overlay_default = Overlay;
@@ -5448,13 +5476,13 @@ var NoCameraAccess_messages_default = (0, import_react_intl19.defineMessages)({
 });
 
 // src/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.tsx
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var NoCameraAccess = ({ onAction }) => {
   const intl = (0, import_react_intl20.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { id: "no-camera-access", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "container p-t-5", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "col-md-6 col-md-offset-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("h2", { className: "text-xs-center m-b-3", children: intl.formatMessage(NoCameraAccess_messages_default.title) }),
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("p", { className: "text-xs-center m-b-5", children: intl.formatMessage(NoCameraAccess_messages_default.paragraph) }),
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_components22.Button, { block: true, onClick: onAction, children: intl.formatMessage(NoCameraAccess_messages_default.action) })
+  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) })
   ] }) }) }) });
 };
 var NoCameraAccess_default = NoCameraAccess;
@@ -5478,12 +5506,12 @@ var CameraNotSupported_messages_default = (0, import_react_intl21.defineMessages
 });
 
 // src/step/cameraStep/cameraCapture/screens/CameraNotSupported/CameraNotSupported.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var CameraNotSupported = () => {
   const intl = (0, import_react_intl22.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { id: "camera-not-supported", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "container p-t-5", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "row", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "col-md-6 col-md-offset-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("h2", { className: "text-xs-center m-b-3", children: intl.formatMessage(CameraNotSupported_messages_default.title) }),
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "text-xs-center m-b-5", children: intl.formatMessage(CameraNotSupported_messages_default.paragraph) })
+  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) })
   ] }) }) }) });
 };
 var CameraNotSupported_default = CameraNotSupported;
@@ -5508,7 +5536,7 @@ var getCameraStartedProperties = async (props, videoStream) => {
 };
 
 // src/step/cameraStep/cameraCapture/CameraCapture.tsx
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var CameraCapture = ({
   direction = "back",
   overlay = "",
@@ -5577,8 +5605,8 @@ var CameraCapture = ({
     setReviewImage(void 0);
   };
   const handleRetryCameraAccess = () => setMode("CAPTURE");
-  const captureScreen = /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
-    videoConstraints && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  const captureScreen = /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
+    videoConstraints && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       import_react_webcam.default,
       {
         ref: webcamReference,
@@ -5589,7 +5617,7 @@ var CameraCapture = ({
         onUserMedia: handleUserMedia
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       Overlay_default,
       {
         overlay,
@@ -5599,11 +5627,11 @@ var CameraCapture = ({
         instructions
       }
     ),
-    ready && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(CaptureBottomBar, { onCapture: () => void handleCapture() })
+    ready && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(CaptureBottomBar, { onCapture: () => void handleCapture() })
   ] });
-  const reviewScreen = /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("img", { className: "review-image", src: reviewImage == null ? void 0 : reviewImage.source, alt: "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  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)(
       Overlay_default,
       {
         overlay,
@@ -5613,19 +5641,19 @@ var CameraCapture = ({
         reviewInstructions: intl.formatMessage(CameraCapture_messages_default.reviewInstructions)
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ReviewBottomBar, { onSubmit: handleReviewSubmit, onRetry: handleReviewRetry })
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ReviewBottomBar, { onSubmit: handleReviewSubmit, onRetry: handleReviewRetry })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("section", { className: "camera-capture", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("section", { className: "camera-capture", children: [
     mode === "CAPTURE" && captureScreen,
     mode === "REVIEW" && reviewScreen,
-    mode === "NO_CAMERA_ACCESS" && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NoCameraAccess_default, { onAction: handleRetryCameraAccess }),
-    mode === "CAMERA_NOT_SUPPORTED" && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(CameraNotSupported_default, {})
+    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, {})
   ] });
 };
 var CameraCapture_default = CameraCapture;
 
 // src/step/cameraStep/CameraStep.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 function blobToBase64(blob) {
   return new Promise((resolve, _) => {
     const reader = new FileReader();
@@ -5634,11 +5662,11 @@ function blobToBase64(blob) {
   });
 }
 var CameraStep = (props) => {
-  const { step: step31, model, onModelChange, onAction } = props;
+  const { step: step33, model, onModelChange, onAction } = props;
   const onEvent = useEventDispatcher();
-  const objectSchema = getObjectSchema(step31);
-  const cameraSchema = getCameraSchema(step31);
-  const action2 = getFirstAction(step31);
+  const objectSchema = getObjectSchema(step33);
+  const cameraSchema = getCameraSchema(step33);
+  const action2 = getFirstAction(step33);
   const { title, image, cameraConfig } = cameraSchema;
   const { assets, direction, instructions } = cameraConfig || {};
   const { overlay, outline } = assets || {};
@@ -5663,7 +5691,7 @@ var CameraStep = (props) => {
       });
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     CameraCapture_default,
     {
       overlay,
@@ -5680,8 +5708,8 @@ var CameraStep = (props) => {
   );
 };
 var CameraStep_default = CameraStep;
-function getObjectSchema(step31) {
-  const nonHiddenSchemas = filterHiddenSchemas(step31.schemas || []);
+function getObjectSchema(step33) {
+  const nonHiddenSchemas = filterHiddenSchemas(step33.schemas || []);
   const objectSchema = nonHiddenSchemas[0];
   if (!objectSchema || !isObjectSchema(objectSchema)) {
     throw new Error(
@@ -5690,8 +5718,8 @@ function getObjectSchema(step31) {
   }
   return objectSchema;
 }
-function getCameraSchema(step31) {
-  const objectSchema = getObjectSchema(step31);
+function getCameraSchema(step33) {
+  const objectSchema = getObjectSchema(step33);
   const firstProperty = Object.values(objectSchema.properties)[0];
   if (!firstProperty) {
     throw new Error(
@@ -5700,15 +5728,15 @@ function getCameraSchema(step31) {
   }
   return firstProperty;
 }
-function getFirstAction(step31) {
+function getFirstAction(step33) {
   var _a, _b;
-  if (!step31.schemas || ((_a = filterHiddenSchemas(step31.schemas)) == null ? void 0 : _a.length) !== 1) {
+  if (!step33.schemas || ((_a = filterHiddenSchemas(step33.schemas)) == null ? void 0 : _a.length) !== 1) {
     throw new Error("camera step expects 1 non-hidden object schema");
   }
-  if (((_b = step31 == null ? void 0 : step31.actions) == null ? void 0 : _b.length) !== 1) {
+  if (((_b = step33 == null ? void 0 : step33.actions) == null ? void 0 : _b.length) !== 1) {
     throw new Error("camera step expects 1 action");
   }
-  return step31.actions[0];
+  return step33.actions[0];
 }
 
 // src/step/externalConfirmationStep/ExternalConfirmationStep.tsx
@@ -5740,12 +5768,12 @@ var ExternalConfirmationStep_messages_default = (0, import_react_intl24.defineMe
 });
 
 // src/step/externalConfirmationStep/ExternalConfirmationStep.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var noop5 = () => {
 };
 var ExternalConfirmationStep = ({ url, onClose }) => {
   const { formatMessage } = (0, import_react_intl25.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     DynamicLayout_default,
     {
       components: [
@@ -5810,24 +5838,24 @@ function getOrigin(url) {
 }
 
 // src/dynamicFlow/DynamicFlowStep.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var DynamicFlowStep = (props) => {
   var _a;
-  const { step: step31, globalError } = props;
-  const externalUrl = (_a = step31 == null ? void 0 : step31.external) == null ? void 0 : _a.url;
+  const { step: step33, globalError } = props;
+  const externalUrl = (_a = step33 == null ? void 0 : step33.external) == null ? void 0 : _a.url;
   const { requiresManualTrigger, dismissConfirmation } = useExternal(externalUrl);
-  if (step31 === void 0) {
+  if (step33 === void 0) {
     return null;
   }
   if (externalUrl && requiresManualTrigger) {
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ExternalConfirmationStep_default, { url: externalUrl, onClose: dismissConfirmation });
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ExternalConfirmationStep_default, { url: externalUrl, onClose: dismissConfirmation });
   }
-  if (getStepType(step31) === "camera") {
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(CameraStep_default, __spreadProps(__spreadValues({}, props), { step: step31 }));
+  if (getStepType(step33) === "camera") {
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(CameraStep_default, __spreadProps(__spreadValues({}, props), { step: step33 }));
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
-    globalError ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(DynamicAlert_default, { component: { context: "negative", markdown: globalError, margin: "lg" } }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(LayoutStep_default, __spreadProps(__spreadValues({}, props), { stepSpecification: step31 }))
+  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: step33 }))
   ] });
 };
 
@@ -5875,16 +5903,16 @@ var useDynamicFlowState = (initialStep) => {
     models: (initialStep == null ? void 0 : initialStep.model) ? buildInitialModels(initialStep.model, getAllSchemas(initialStep)) : {},
     etag: void 0
   });
-  const { step: step31, models, etag } = stepAndModels;
-  const setStepAndEtag = (step32, etag2) => {
+  const { step: step33, models, etag } = stepAndModels;
+  const setStepAndEtag = (step34, etag2) => {
     var _a2, _b2, _c, _d;
     setStepAndModels((previous) => ({
-      step: step32,
-      models: step32.model ? buildInitialModels(step32.model, getAllSchemas(step32)) : previous.models,
+      step: step34,
+      models: step34.model ? buildInitialModels(step34.model, getAllSchemas(step34)) : previous.models,
       etag: etag2
     }));
-    setFormErrors((_b2 = (_a2 = step32 == null ? void 0 : step32.errors) == null ? void 0 : _a2.validation) != null ? _b2 : null);
-    setGlobalError((_d = (_c = step32 == null ? void 0 : step32.errors) == null ? void 0 : _c.error) != null ? _d : null);
+    setFormErrors((_b2 = (_a2 = step34 == null ? void 0 : step34.errors) == null ? void 0 : _a2.validation) != null ? _b2 : null);
+    setGlobalError((_d = (_c = step34 == null ? void 0 : step34.errors) == null ? void 0 : _c.error) != null ? _d : null);
   };
   const setSchemaModel = (schemaId, objectModel, onModelsUpdated) => {
     setStepAndModels((previous) => {
@@ -5900,11 +5928,11 @@ var useDynamicFlowState = (initialStep) => {
       return updatedState;
     });
   };
-  const modelIsValid = (0, import_react32.useMemo)(() => areModelsValid(models, getAllSchemas(step31)), [models, step31]);
+  const modelIsValid = (0, import_react32.useMemo)(() => areModelsValid(models, getAllSchemas(step33)), [models, step33]);
   return {
     formErrors,
     globalError,
-    step: step31,
+    step: step33,
     models,
     etag,
     modelIsValid,
@@ -5924,9 +5952,9 @@ var buildInitialModels = (model, schemas = []) => {
     });
   }, {});
 };
-var getAllSchemas = (step31) => [
-  ...getAllSchemasInLayout((step31 == null ? void 0 : step31.layout) || []),
-  ...(step31 == null ? void 0 : step31.schemas) || []
+var getAllSchemas = (step33) => [
+  ...getAllSchemasInLayout((step33 == null ? void 0 : step33.layout) || []),
+  ...(step33 == null ? void 0 : step33.schemas) || []
 ];
 var getAllSchemasInLayout = (components) => components.flatMap((component) => {
   switch (component.type) {
@@ -5952,7 +5980,7 @@ var areModelsValid = (formModels, schemas = []) => {
 // src/dynamicFlow/utils/useLoader.tsx
 var import_components24 = require("@transferwise/components");
 var import_react33 = require("react");
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 function useLoader(loaderConfig, initialState) {
   const config = __spreadValues({
     size: import_components24.Size.EXTRA_LARGE,
@@ -5961,7 +5989,7 @@ function useLoader(loaderConfig, initialState) {
   }, loaderConfig);
   const [loadingState, setLoadingState] = (0, import_react33.useState)(initialState);
   const shouldDisplayLoader = config.initial && loadingState === "initial" || config.submission && loadingState === "submission";
-  const loader = shouldDisplayLoader ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+  const loader = shouldDisplayLoader ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
     import_components24.Loader,
     {
       size: config.size,
@@ -5995,10 +6023,10 @@ var ErrorBoundary_messages_default = (0, import_react_intl26.defineMessages)({
 });
 
 // src/dynamicFlow/utils/errorBoundary/ErrorBoundaryAlert.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var ErrorBoundaryAlert = ({ onDismiss }) => {
   const { formatMessage } = (0, import_react_intl27.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
     import_components25.Alert,
     {
       action: {
@@ -6014,7 +6042,7 @@ var ErrorBoundaryAlert = ({ onDismiss }) => {
 };
 
 // src/dynamicFlow/utils/errorBoundary/ErrorBoundary.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var noop6 = () => {
 };
 var ErrorBoundary = class extends import_react34.Component {
@@ -6035,8 +6063,8 @@ var ErrorBoundary = class extends import_react34.Component {
   render() {
     const { children } = this.props;
     const { hasError, isFatalError } = this.state;
-    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
-      hasError && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ErrorBoundaryAlert, { onDismiss: this.handleErrorReset }),
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_jsx_runtime59.Fragment, { children: [
+      hasError && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(ErrorBoundaryAlert, { onDismiss: this.handleErrorReset }),
       !isFatalError && children
     ] });
   }
@@ -6105,7 +6133,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_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var noop7 = () => {
 };
 var DynamicFlowComponent = ({
@@ -6124,7 +6152,7 @@ var DynamicFlowComponent = ({
   const {
     formErrors,
     globalError,
-    step: step31,
+    step: step33,
     models,
     etag,
     modelIsValid,
@@ -6138,15 +6166,15 @@ var DynamicFlowComponent = ({
     loaderConfig,
     initialStep ? "idle" : "initial"
   );
-  const logWarning = getLogger("warning", onLog, flowId, step31 == null ? void 0 : step31.key);
-  const logError = getLogger("error", onLog, flowId, step31 == null ? void 0 : step31.key);
-  const logCritical = getLogger("critical", onLog, flowId, step31 == null ? void 0 : step31.key);
+  const logWarning = getLogger("warning", onLog, flowId, step33 == null ? void 0 : step33.key);
+  const logError = getLogger("error", onLog, flowId, step33 == null ? void 0 : step33.key);
+  const logCritical = getLogger("critical", onLog, flowId, step33 == null ? void 0 : step33.key);
   const analyticsMetadata = (0, import_react35.useMemo)(
     () => {
       var _a;
-      return __spreadValues({ flowId, stepId: step31 == null ? void 0 : step31.key }, (_a = step31 == null ? void 0 : step31.analytics) != null ? _a : {});
+      return __spreadValues({ flowId, stepId: step33 == null ? void 0 : step33.key }, (_a = step33 == null ? void 0 : step33.analytics) != null ? _a : {});
     },
-    [flowId, step31]
+    [flowId, step33]
   );
   const dispatchEvent = (0, import_react35.useMemo)(
     () => getEventDispatcher(onEvent, analyticsMetadata),
@@ -6230,8 +6258,8 @@ var DynamicFlowComponent = ({
             return dispatchEventAndComplete(parsedResponse.result);
           case "step":
           default: {
-            const { step: step32, etag: etag2 } = parsedResponse;
-            return fetchType === "submission" ? updateStepAfterSubmission(step32, etag2) : updateStepAfterRefresh(step32, etag2);
+            const { step: step34, etag: etag2 } = parsedResponse;
+            return fetchType === "submission" ? updateStepAfterSubmission(step34, etag2) : updateStepAfterRefresh(step34, etag2);
           }
         }
       } catch (error) {
@@ -6246,8 +6274,8 @@ var DynamicFlowComponent = ({
     setLoadingState("idle");
     dispatchEvent("Dynamic Flow - Step Started", __spreadValues({ stepId: newStep.key }, newStep == null ? void 0 : newStep.analytics));
   };
-  const updateStepAfterRefresh = (step32, etag2) => {
-    setStepAndEtag(step32, etag2);
+  const updateStepAfterRefresh = (step34, etag2) => {
+    setStepAndEtag(step34, etag2);
     setLoadingState("idle");
     dispatchEvent("Dynamic Flow - Step Refreshed", { status: "success" });
   };
@@ -6308,7 +6336,7 @@ var DynamicFlowComponent = ({
   const refreshOnChangeIfNeeded = (props, updatedModels) => {
     const { triggerSchema } = props;
     if (shouldTriggerRefresh(props)) {
-      const url = triggerSchema.refreshFormUrl || (step31 == null ? void 0 : step31.refreshFormUrl);
+      const url = triggerSchema.refreshFormUrl || (step33 == null ? void 0 : step33.refreshFormUrl);
       const action2 = { url, method: "POST" };
       debouncedFetchRefresh(action2, combineModels2(updatedModels), etag, triggerSchema);
     }
@@ -6360,10 +6388,10 @@ var DynamicFlowComponent = ({
     }
     void fetchNextStep(action2);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(LogProvider, { flowId, stepId: step31 == null ? void 0 : step31.key, onLog, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(EventsContextProvider, { metadata: analyticsMetadata, onEvent, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(DynamicFlowProvider, { loading: loadingState !== "idle", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(HttpClientProvider, { httpClient, children: loader !== null ? loader : /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(LogProvider, { flowId, stepId: step33 == null ? void 0 : step33.key, onLog, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(EventsContextProvider, { metadata: analyticsMetadata, onEvent, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DynamicFlowProvider, { loading: loadingState !== "idle", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HttpClientProvider, { httpClient, children: loader !== null ? loader : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
     DynamicFlowStep,
     {
-      step: step31,
+      step: step33,
       model: combineModels2(models),
       submitted,
       globalError,
@@ -6376,7 +6404,7 @@ var DynamicFlowComponent = ({
     }
   ) }) }) }) });
 };
-var DynamicFlow = (props) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(ErrorBoundary_default, { onError: props.onError, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(DynamicFlowComponent, __spreadValues({}, props)) });
+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_default = DynamicFlow;
 var combineModels2 = (formModels) => {
   return Object.values(formModels).reduce((previous, model) => __spreadValues(__spreadValues({}, previous), model), {});
@@ -6401,6 +6429,8 @@ __export(components_exports, {
   columns: () => columns_default,
   copyable: () => copyable_default,
   decision: () => decision_default,
+  decisionFlags: () => decision_flags_default,
+  decisionIcons: () => decision_icons_default,
   heading: () => heading_default,
   image: () => image_default,
   info: () => info_default,
@@ -6634,6 +6664,17 @@ var step6 = {
             title: "",
             url: "external"
           }
+        },
+        {
+          title: "Currency flags are now supported as well",
+          disabled: false,
+          icon: {
+            name: "flag-eur"
+          },
+          action: {
+            title: "",
+            url: "external"
+          }
         }
       ]
     }
@@ -6641,8 +6682,69 @@ var step6 = {
 };
 var decision_default = step6;
 
-// src/fixtures/components/heading.ts
+// src/fixtures/components/decision-flags.ts
 var step7 = {
+  type: "form",
+  key: "Components/Decision Flags",
+  title: "Decision Component",
+  description: "A step with a decision Component.",
+  actions: [],
+  schemas: [],
+  layout: [
+    {
+      type: "heading",
+      size: "sm",
+      text: "Please continue using one of the following options:"
+    },
+    {
+      type: "decision",
+      options: availableCurrencyFlags.map((currencyCode) => {
+        return {
+          title: `${currencyCode.toUpperCase()}`,
+          icon: {
+            name: `flag-${currencyCode}`
+          },
+          action: { url: "/" }
+        };
+      })
+    }
+  ]
+};
+var decision_flags_default = step7;
+
+// src/fixtures/components/decision-icons.ts
+var icons2 = __toESM(require("@transferwise/icons"));
+var step8 = {
+  type: "form",
+  key: "Components/Decision Icons",
+  title: "Decision Component",
+  description: "A step with a decision Component.",
+  actions: [],
+  schemas: [],
+  layout: [
+    {
+      type: "heading",
+      size: "sm",
+      text: "Please continue using one of the following options:"
+    },
+    {
+      type: "decision",
+      options: Object.keys(icons2).map((iconName) => {
+        return {
+          title: `${iconName} Icon`,
+          icon: {
+            name: iconName
+          },
+          action: { url: "/" }
+        };
+      })
+    }
+  ]
+};
+var decision_icons_default = step8;
+
+// src/fixtures/components/heading.ts
+var step9 = {
   type: "form",
   key: "Components/Heading",
   title: "Heading Component",
@@ -6655,11 +6757,11 @@ var step7 = {
     size
   }))
 };
-var heading_default = step7;
+var heading_default = step9;
 
 // src/fixtures/components/image.ts
 var sizes = ["xs", "sm", "md", "lg", "xl"];
-var step8 = {
+var step10 = {
   type: "form",
   key: "Components/Image",
   title: "Image Component",
@@ -6680,10 +6782,10 @@ var step8 = {
     }
   ])
 };
-var image_default = step8;
+var image_default = step10;
 
 // src/fixtures/components/info.ts
-var step9 = {
+var step11 = {
   type: "form",
   key: "Components/Info",
   title: "Info Component",
@@ -6715,10 +6817,10 @@ But the best part? Bananas are biodegradable and environmentally-friendly, makin
     { type: "alert", markdown: "Links always open in a new tab.", context: "neutral" }
   ]
 };
-var info_default = step9;
+var info_default = step11;
 
 // src/fixtures/components/list.ts
-var step10 = {
+var step12 = {
   type: "form",
   key: "Components/List",
   title: "List Component",
@@ -6751,10 +6853,10 @@ var step10 = {
     }
   ]
 };
-var list_default = step10;
+var list_default = step12;
 
 // src/fixtures/components/loading-indicator.ts
-var step11 = {
+var step13 = {
   type: "form",
   key: "Components/Loading Indicator",
   title: "Loading Indicator Component",
@@ -6769,10 +6871,10 @@ var step11 = {
     }
   ]
 };
-var loading_indicator_default = step11;
+var loading_indicator_default = step13;
 
 // src/fixtures/components/paragraph.ts
-var step12 = {
+var step14 = {
   type: "form",
   key: "Components/Paragraph",
   title: "Paragraph Component",
@@ -6799,10 +6901,10 @@ var step12 = {
     }
   ]
 };
-var paragraph_default = step12;
+var paragraph_default = step14;
 
 // src/fixtures/components/review.ts
-var step13 = {
+var step15 = {
   type: "form",
   key: "Components/Review",
   title: "Review Component",
@@ -6861,7 +6963,7 @@ var step13 = {
     }
   ]
 };
-var review_default = step13;
+var review_default = step15;
 
 // src/fixtures/examples/index.ts
 var examples_exports = {};
@@ -6874,7 +6976,7 @@ __export(examples_exports, {
 });
 
 // src/fixtures/examples/camera-capture.ts
-var step14 = {
+var step16 = {
   key: "Examples/Camera Capture",
   title: "Camera Capture Example",
   type: "form",
@@ -6994,10 +7096,10 @@ var step14 = {
   },
   refreshFormUrl: "/"
 };
-var camera_capture_default = step14;
+var camera_capture_default = step16;
 
 // src/fixtures/examples/recipient.ts
-var step15 = {
+var step17 = {
   key: "Examples/Recipient Creation",
   type: "form",
   title: "Recipient Creation Example",
@@ -7309,10 +7411,10 @@ var step15 = {
     details: {}
   }
 };
-var recipient_default = step15;
+var recipient_default = step17;
 
 // src/fixtures/examples/recipient-update.ts
-var step16 = {
+var step18 = {
   key: "Examples/Recipient Update",
   type: "form",
   title: "Edit recipient",
@@ -7561,10 +7663,10 @@ var step16 = {
     }
   ]
 };
-var recipient_update_default = step16;
+var recipient_update_default = step18;
 
 // src/fixtures/examples/single-file-upload.ts
-var step17 = {
+var step19 = {
   key: "Examples/Single File Upload",
   type: "form",
   title: "Single File Upload Example",
@@ -7661,10 +7763,10 @@ var step17 = {
     frontSide: 0
   }
 };
-var single_file_upload_default = step17;
+var single_file_upload_default = step19;
 
 // src/fixtures/examples/step-validation-errors.ts
-var step18 = {
+var step20 = {
   key: "Examples/Step Validation Errors",
   title: "Step with validation errors",
   type: "form",
@@ -7738,7 +7840,7 @@ var step18 = {
     }
   ]
 };
-var step_validation_errors_default = step18;
+var step_validation_errors_default = step20;
 
 // src/fixtures/features/index.ts
 var features_exports = {};
@@ -7751,7 +7853,7 @@ __export(features_exports, {
 });
 
 // src/fixtures/features/action-response.ts
-var step19 = {
+var step21 = {
   key: "Features/Action Response",
   title: "Action Response",
   description: "",
@@ -7779,10 +7881,10 @@ var step19 = {
     }
   ]
 };
-var action_response_default = step19;
+var action_response_default = step21;
 
 // src/fixtures/features/external.ts
-var step20 = {
+var step22 = {
   type: "form",
   key: "Features/External",
   title: "External Feature",
@@ -7812,10 +7914,10 @@ var step20 = {
   actions: [],
   schemas: []
 };
-var external_default = step20;
+var external_default = step22;
 
 // src/fixtures/features/persist-async.ts
-var step21 = {
+var step23 = {
   type: "form",
   key: "Features/Persist Async",
   title: "Persist Async Feature",
@@ -7858,10 +7960,10 @@ var step21 = {
     }
   ]
 };
-var persist_async_default = step21;
+var persist_async_default = step23;
 
 // src/fixtures/features/polling.ts
-var step22 = {
+var step24 = {
   type: "form",
   key: "Features/Polling",
   title: "Polling Feature",
@@ -7893,10 +7995,10 @@ var step22 = {
   actions: [],
   schemas: []
 };
-var polling_default = step22;
+var polling_default = step24;
 
 // src/fixtures/features/validation-async.ts
-var step23 = {
+var step25 = {
   type: "form",
   key: "Features/Validation Async",
   title: "Validation Async Feature",
@@ -7933,7 +8035,7 @@ var step23 = {
     // name: 'Colin Robinson',
   }
 };
-var validation_async_default = step23;
+var validation_async_default = step25;
 
 // src/fixtures/layouts/index.ts
 var layouts_exports = {};
@@ -8201,7 +8303,7 @@ var layout3 = [
 var list_default2 = layout3;
 
 // src/fixtures/layouts/pay-in.ts
-var step24 = {
+var step26 = {
   key: "PAY_ID",
   type: "form",
   title: "Pay Using PayID",
@@ -8297,7 +8399,7 @@ var step24 = {
     }
   ]
 };
-var pay_in_default = step24;
+var pay_in_default = step26;
 
 // src/fixtures/layouts/review.ts
 var layout4 = [
@@ -8543,7 +8645,7 @@ var action = { action: { url: "/responses/success", method: "POST" } };
 var action_default = action;
 
 // src/fixtures/responses/action-response-final.ts
-var step25 = {
+var step27 = {
   type: "form",
   key: "action-response-final",
   title: "Action Response Final Step",
@@ -8566,14 +8668,14 @@ var step25 = {
     }
   ]
 };
-var action_response_final_default = step25;
+var action_response_final_default = step27;
 
 // src/fixtures/responses/exit.ts
 var exit = { id: "123456", name: "Bob Loblaw", country: "US" };
 var exit_default = exit;
 
 // src/fixtures/responses/recipient-update-final.ts
-var step26 = {
+var step28 = {
   type: "form",
   key: "recipient-update-final",
   title: "Recipient Update Final Step",
@@ -8596,7 +8698,7 @@ var step26 = {
     }
   ]
 };
-var recipient_update_final_default = step26;
+var recipient_update_final_default = step28;
 
 // src/fixtures/schemas/index.ts
 var schemas_exports = {};
@@ -8608,7 +8710,7 @@ __export(schemas_exports, {
 });
 
 // src/fixtures/schemas/basic-form.ts
-var step27 = {
+var step29 = {
   key: "Schemas/Basic Form",
   title: "Simple Form",
   description: "A simple form with text fields and a checkbox.",
@@ -8646,10 +8748,10 @@ var step27 = {
     }
   ]
 };
-var basic_form_default = step27;
+var basic_form_default = step29;
 
 // src/fixtures/schemas/number-and-integer.ts
-var step28 = {
+var step30 = {
   key: "Schemas/Number And Integer",
   title: "Number and Integer Schemas",
   description: "Number and Integer Schemas.",
@@ -8689,7 +8791,7 @@ var step28 = {
     }
   ]
 };
-var number_and_integer_default = step28;
+var number_and_integer_default = step30;
 
 // src/fixtures/schemas/one-of.ts
 var currencies = [
@@ -8754,7 +8856,7 @@ var currencies = [
   ["ZAR", "South African rand"],
   ["ZMW", "Zambian kwacha"]
 ];
-var step29 = {
+var step31 = {
   key: "Schemas/OneOf",
   title: "OneOf Schemas",
   description: "OneOf Schema using select, radio buttons and tabs.",
@@ -8771,6 +8873,7 @@ var step29 = {
         "account-type-radio": {
           title: 'Personal or Business Account? (oneOf schema with two options default to control: "radio")',
           analyticsId: "account-type-radio",
+          control: "radio",
           oneOf: [
             {
               title: "Personal",
@@ -8911,10 +9014,10 @@ var step29 = {
     }
   ]
 };
-var one_of_default = step29;
+var one_of_default = step31;
 
 // src/fixtures/schemas/string-formats.ts
-var step30 = {
+var step32 = {
   key: "Schemas/String Formats",
   title: "String Schema Formats",
   description: "String schemas with different formats (password, date, telephone).",
@@ -8975,7 +9078,7 @@ var step30 = {
     "date-lookup": "2023-01-01"
   }
 };
-var string_formats_default = step30;
+var string_formats_default = step32;
 
 // src/fixtures/utils/image-util.ts
 var getImageStep = (size) => {
@@ -9343,10 +9446,10 @@ var pl_default = {
   "dynamicFlows.CameraCapture.reviewRetry": "Nie, spr\xF3buj ponownie",
   "dynamicFlows.CameraCapture.reviewSubmit": "Tak, prze\u015Blij",
   "dynamicFlows.ControlFeedback.maxLength": "Prosimy wprowadzi\u0107 do {maxLength} znak\xF3w.",
-  "dynamicFlows.ControlFeedback.maximum": "Wprowad\u017A liczb\u0119 {maximum} lub mniejsz\u0105.",
+  "dynamicFlows.ControlFeedback.maximum": "Wprowad\u017A liczb\u0119 r\xF3wn\u0105 lub mniejsz\u0105 ni\u017C {maximum}.",
   "dynamicFlows.ControlFeedback.maximumDate": "Wprowad\u017A dat\u0119 nie p\xF3\u017Aniejsz\u0105 ni\u017C {maximum}.",
   "dynamicFlows.ControlFeedback.minLength": "Prosz\u0119 wpisa\u0107 co najmniej {minLength} znak\xF3w.",
-  "dynamicFlows.ControlFeedback.minimum": "Wprowad\u017A liczb\u0119 {minimum} lub wi\u0119ksz\u0105.",
+  "dynamicFlows.ControlFeedback.minimum": "Wprowad\u017A liczb\u0119 r\xF3wn\u0105 lub wi\u0119ksz\u0105 ni\u017C {minimum}.",
   "dynamicFlows.ControlFeedback.minimumDate": "Wprowad\u017A dat\u0119 nie wcze\u015Bniejsz\u0105 ni\u017C {minimum}.",
   "dynamicFlows.ControlFeedback.pattern": "Wprowad\u017A t\u0119 warto\u015B\u0107 w prawid\u0142owym formacie.",
   "dynamicFlows.ControlFeedback.patternDate": "Wprowad\u017A dat\u0119 w prawid\u0142owym formacie.",
@@ -9534,10 +9637,10 @@ var tr_default = {
 var zh_default = {
   "dynamicFlows.ArraySchema.maxItemsError": "\u8ACB\u6DFB\u52A0\u4E0D\u8D85\u904E{maxItems}\u9805\u3002",
   "dynamicFlows.ArraySchema.minItemsError": "\u8ACB\u81F3\u5C11\u6DFB\u52A0{minItems}\u9805\u3002",
-  "dynamicFlows.CameraCapture.CameraNotSupported.paragraph": "\u4F60\u76EE\u524D\u4F7F\u7528\u7684\u700F\u89BD\u5668\u4E0D\u652F\u6301\u76F8\u6A5F\u529F\u80FD\u3002\u8ACB\u5617\u8A66\u4F7F\u7528\u5176\u4ED6\u700F\u89BD\u5668\u6216\u5176\u4ED6\u88DD\u7F6E\uFF0C\u6216\u8005\u4F60\u53EF\u4EE5\u4E0B\u8F09\u6211\u5011\u7684\u61C9\u7528\u7A0B\u5F0F\u3002",
-  "dynamicFlows.CameraCapture.CameraNotSupported.title": "\u4E0D\u652F\u6301\u76F8\u6A5F\u529F\u80FD",
+  "dynamicFlows.CameraCapture.CameraNotSupported.paragraph": "\u4F60\u76EE\u524D\u4F7F\u7528\u7684\u700F\u89BD\u5668\u4E0D\u652F\u6301\u76F8\u6A5F\u3002\u8ACB\u5617\u8A66\u4F7F\u7528\u5176\u4ED6\u700F\u89BD\u5668\u6216\u5176\u4ED6\u88DD\u7F6E\uFF0C\u6216\u8005\u4F60\u53EF\u4EE5\u4E0B\u8F09\u6211\u5011\u7684\u61C9\u7528\u7A0B\u5F0F\u3002",
+  "dynamicFlows.CameraCapture.CameraNotSupported.title": "\u4E0D\u652F\u6301\u76F8\u6A5F",
   "dynamicFlows.CameraCapture.NoCameraAccess.action": "\u5141\u8A31\u53D6\u7528\u76F8\u6A5F",
-  "dynamicFlows.CameraCapture.NoCameraAccess.paragraph": "\u4F60\u53EF\u4EE5\u5728\u700F\u89BD\u5668\u7684\u8A2D\u5B9A\u4E2D\u958B\u555F\u76F8\u6A5F\u5B58\u53D6\u6B0A\u9650",
+  "dynamicFlows.CameraCapture.NoCameraAccess.paragraph": "\u4F60\u53EF\u4EE5\u5728\u700F\u89BD\u5668\u7684\u8A2D\u5B9A\u4E2D\u958B\u555F\u76F8\u6A5F\u5B58\u53D6\u6B0A\u9650\u3002",
   "dynamicFlows.CameraCapture.NoCameraAccess.title": "\u6211\u5011\u7121\u6CD5\u53D6\u7528\u4F60\u7684\u76F8\u6A5F",
   "dynamicFlows.CameraCapture.reviewInstructions": "\u4F60\u7684\u7167\u7247\u662F\u5426\u5B8C\u6574\u3001\u6E05\u6670\u53CA\u53EF\u8B80\uFF1F",
   "dynamicFlows.CameraCapture.reviewRetry": "\u5426\uFF0C\u518D\u8A66\u4E00\u6B21",
@@ -9552,13 +9655,13 @@ var zh_default = {
   "dynamicFlows.ControlFeedback.patternDate": "\u8ACB\u4EE5\u6B63\u78BA\u683C\u5F0F\u8F38\u5165\u65E5\u671F\u3002",
   "dynamicFlows.ControlFeedback.required": "\u8ACB\u586B\u5BEB\u6B64\u6B04\u4F4D\u3002",
   "dynamicFlows.ControlFeedback.type": "\u932F\u8AA4\u7684\u985E\u578B",
-  "dynamicFlows.DynamicExternal.retryTitle": "\u91CD\u65B0\u958B\u555F\u8996\u7A97",
+  "dynamicFlows.DynamicExternal.retryTitle": "\u91CD\u65B0\u6253\u958B\u8996\u7A97",
   "dynamicFlows.DynamicParagraph.copied": "\u8907\u88FD\u5230\u526A\u8CBC\u677F",
   "dynamicFlows.DynamicParagraph.copy": "\u8907\u88FD",
   "dynamicFlows.ErrorBoundary.errorAlert": "\u5662\uFF01\u51FA\u4E86\u4E9B\u554F\u984C...",
   "dynamicFlows.ErrorBoundary.retry": "\u91CD\u8A66",
   "dynamicFlows.ExternalConfirmation.cancel": "\u53D6\u6D88",
-  "dynamicFlows.ExternalConfirmation.description": "\u8ACB\u78BA\u8A8D\u4F60\u60F3\u5728\u700F\u89BD\u5668\u7684\u65B0\u5206\u9801\u4E2D\u958B\u555F**{origin}**\u3002",
+  "dynamicFlows.ExternalConfirmation.description": "\u8ACB\u78BA\u8A8D\u4F60\u662F\u5426\u8981\u5728\u700F\u89BD\u5668\u7684\u65B0\u5206\u9801\u6253\u958B**{origin}**\u3002",
   "dynamicFlows.ExternalConfirmation.open": "\u5728\u65B0\u5206\u9801\u4E2D\u958B\u555F",
   "dynamicFlows.ExternalConfirmation.title": "\u8ACB\u78BA\u8A8D",
   "dynamicFlows.Help.ariaLabel": "\u6309\u6B64\u67E5\u770B\u8A73\u60C5\u3002",