@wise/dynamic-flow-client-internal 4.17.1 → 4.18.0-modal-renderer-exposed-b166873

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/build/main.js +219 -222
  2. package/build/main.mjs +149 -152
  3. package/package.json +17 -17
package/build/main.js CHANGED
@@ -1786,8 +1786,18 @@ function DFModal({ content, margin, trigger }) {
1786
1786
  ] });
1787
1787
  }
1788
1788
 
1789
- // ../renderers/src/MultiSelectInputRenderer.tsx
1789
+ // ../renderers/src/ModalRenderer.tsx
1790
1790
  var import_components21 = require("@transferwise/components");
1791
+ var import_jsx_runtime35 = require("react/jsx-runtime");
1792
+ var ModalRenderer = {
1793
+ canRenderType: "modal",
1794
+ render: ({ title, children, open, onClose }) => {
1795
+ return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_components21.Modal, { open, title, body: children, onClose });
1796
+ }
1797
+ };
1798
+
1799
+ // ../renderers/src/MultiSelectInputRenderer.tsx
1800
+ var import_components22 = require("@transferwise/components");
1791
1801
  var import_react5 = require("react");
1792
1802
  var import_react_intl6 = require("react-intl");
1793
1803
 
@@ -1802,10 +1812,10 @@ var multi_select_messages_default = (0, import_react_intl5.defineMessages)({
1802
1812
  });
1803
1813
 
1804
1814
  // ../renderers/src/MultiSelectInputRenderer.tsx
1805
- var import_jsx_runtime35 = require("react/jsx-runtime");
1815
+ var import_jsx_runtime36 = require("react/jsx-runtime");
1806
1816
  var MultiSelectInputRenderer = {
1807
1817
  canRenderType: "input-multi-select",
1808
- render: (props) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MultiSelectInputRendererComponent, __spreadValues({}, props))
1818
+ render: (props) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MultiSelectInputRendererComponent, __spreadValues({}, props))
1809
1819
  };
1810
1820
  function MultiSelectInputRendererComponent(props) {
1811
1821
  const { formatMessage } = (0, import_react_intl6.useIntl)();
@@ -1847,12 +1857,12 @@ function MultiSelectInputRendererComponent(props) {
1847
1857
  const contentProps = {
1848
1858
  title: option.title,
1849
1859
  description: option.description,
1850
- icon: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(OptionMedia, { icon: option.icon, image: option.image, preferAvatar: false })
1860
+ icon: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(OptionMedia, { icon: option.icon, image: option.image, preferAvatar: false })
1851
1861
  };
1852
- return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_components21.SelectInputOptionContent, __spreadValues({}, contentProps));
1862
+ return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_components22.SelectInputOptionContent, __spreadValues({}, contentProps));
1853
1863
  };
1854
1864
  const extraProps = { autoComplete };
1855
- return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
1865
+ return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
1856
1866
  FieldInput_default,
1857
1867
  {
1858
1868
  id,
@@ -1860,8 +1870,8 @@ function MultiSelectInputRendererComponent(props) {
1860
1870
  help,
1861
1871
  description,
1862
1872
  validation: validationState,
1863
- children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
1864
- import_components21.SelectInput,
1873
+ children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
1874
+ import_components22.SelectInput,
1865
1875
  __spreadValues({
1866
1876
  id,
1867
1877
  items: options.map((option, index) => {
@@ -1900,12 +1910,12 @@ function MultiSelectInputRendererComponent(props) {
1900
1910
  var MultiSelectInputRenderer_default = MultiSelectInputRenderer;
1901
1911
 
1902
1912
  // ../renderers/src/MultiUploadInputRenderer.tsx
1903
- var import_components23 = require("@transferwise/components");
1913
+ var import_components24 = require("@transferwise/components");
1904
1914
 
1905
1915
  // ../renderers/src/components/UploadFieldInput.tsx
1906
- var import_components22 = require("@transferwise/components");
1916
+ var import_components23 = require("@transferwise/components");
1907
1917
  var import_classnames4 = __toESM(require("classnames"));
1908
- var import_jsx_runtime36 = require("react/jsx-runtime");
1918
+ var import_jsx_runtime37 = require("react/jsx-runtime");
1909
1919
  function UploadFieldInput({
1910
1920
  id,
1911
1921
  children,
@@ -1914,18 +1924,18 @@ function UploadFieldInput({
1914
1924
  help,
1915
1925
  validation
1916
1926
  }) {
1917
- const labelContent = label && help ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(LabelContentWithHelp, { text: label, help }) : label;
1927
+ const labelContent = label && help ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(LabelContentWithHelp, { text: label, help }) : label;
1918
1928
  const descriptionId = description ? `${id}-description` : void 0;
1919
- return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
1929
+ return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
1920
1930
  "div",
1921
1931
  {
1922
1932
  className: (0, import_classnames4.default)("form-group d-block", {
1923
1933
  "has-error": (validation == null ? void 0 : validation.status) === "invalid"
1924
1934
  }),
1925
1935
  children: [
1926
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("label", { htmlFor: id, className: "control-label", children: labelContent }),
1936
+ /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("label", { htmlFor: id, className: "control-label", children: labelContent }),
1927
1937
  children,
1928
- (validation == null ? void 0 : validation.status) === "invalid" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_components22.InlineAlert, { type: "negative", id: descriptionId, children: validation.message })
1938
+ (validation == null ? void 0 : validation.status) === "invalid" && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_components23.InlineAlert, { type: "negative", id: descriptionId, children: validation.message })
1929
1939
  ]
1930
1940
  }
1931
1941
  );
@@ -1933,7 +1943,7 @@ function UploadFieldInput({
1933
1943
  var UploadFieldInput_default = UploadFieldInput;
1934
1944
 
1935
1945
  // ../renderers/src/utils/file-utils.ts
1936
- var getAcceptsString = (accepts) => Array.isArray(accepts) && accepts.length >= 1 ? accepts.join(",") : "*";
1946
+ var acceptsToFileTypes = (accepts) => Array.isArray(accepts) && accepts.length >= 1 ? accepts : "*";
1937
1947
  var toKilobytes = (sizeInBytes) => {
1938
1948
  const ONE_KB_IN_BYTES = 1024;
1939
1949
  return Math.floor(sizeInBytes / ONE_KB_IN_BYTES);
@@ -1954,7 +1964,7 @@ var getFileType = (base64Url) => {
1954
1964
  };
1955
1965
 
1956
1966
  // ../renderers/src/MultiUploadInputRenderer.tsx
1957
- var import_jsx_runtime37 = require("react/jsx-runtime");
1967
+ var import_jsx_runtime38 = require("react/jsx-runtime");
1958
1968
  var MultiUploadInputRenderer = {
1959
1969
  canRenderType: "input-upload-multi",
1960
1970
  render: (props) => {
@@ -1979,7 +1989,7 @@ var MultiUploadInputRenderer = {
1979
1989
  };
1980
1990
  const onDeleteFile = async (fileId) => onRemoveFile(value.findIndex((file) => file.id === fileId));
1981
1991
  const descriptionId = description ? `${id}-description` : void 0;
1982
- return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
1992
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
1983
1993
  UploadFieldInput_default,
1984
1994
  {
1985
1995
  id,
@@ -1987,14 +1997,14 @@ var MultiUploadInputRenderer = {
1987
1997
  description,
1988
1998
  validation: validationState,
1989
1999
  help,
1990
- children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
1991
- import_components23.UploadInput,
2000
+ children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
2001
+ import_components24.UploadInput,
1992
2002
  {
1993
2003
  id,
1994
2004
  "aria-describedby": descriptionId,
1995
2005
  description,
1996
2006
  disabled,
1997
- fileTypes: getAcceptsString(accepts),
2007
+ fileTypes: acceptsToFileTypes(accepts),
1998
2008
  maxFiles: maxItems,
1999
2009
  multiple: true,
2000
2010
  sizeLimit: maxSize ? toKilobytes(maxSize) : void 0,
@@ -2010,8 +2020,8 @@ var MultiUploadInputRenderer = {
2010
2020
  var MultiUploadInputRenderer_default = MultiUploadInputRenderer;
2011
2021
 
2012
2022
  // ../renderers/src/NumberInputRenderer.tsx
2013
- var import_components24 = require("@transferwise/components");
2014
- var import_jsx_runtime38 = require("react/jsx-runtime");
2023
+ var import_components25 = require("@transferwise/components");
2024
+ var import_jsx_runtime39 = require("react/jsx-runtime");
2015
2025
  var NumberInputRenderer = {
2016
2026
  canRenderType: "input-number",
2017
2027
  render: (props) => {
@@ -2025,7 +2035,7 @@ var NumberInputRenderer = {
2025
2035
  "maximum",
2026
2036
  "minimum"
2027
2037
  );
2028
- return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
2038
+ return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
2029
2039
  FieldInput_default,
2030
2040
  {
2031
2041
  id,
@@ -2033,8 +2043,8 @@ var NumberInputRenderer = {
2033
2043
  description,
2034
2044
  validation: validationState,
2035
2045
  help,
2036
- children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_components24.InputGroup, { addonStart: getInputGroupAddonStart({ icon, image }), children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
2037
- import_components24.Input,
2046
+ children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_components25.InputGroup, { addonStart: getInputGroupAddonStart({ icon, image }), children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
2047
+ import_components25.Input,
2038
2048
  __spreadValues({
2039
2049
  id,
2040
2050
  name: id,
@@ -2057,16 +2067,16 @@ var NumberInputRenderer_default = NumberInputRenderer;
2057
2067
  var import_react_intl8 = require("react-intl");
2058
2068
 
2059
2069
  // ../renderers/src/hooks/useSnackBarIfAvailable.ts
2060
- var import_components25 = require("@transferwise/components");
2070
+ var import_components26 = require("@transferwise/components");
2061
2071
  var import_react6 = require("react");
2062
2072
  function useSnackBarIfAvailable() {
2063
- const context = (0, import_react6.useContext)(import_components25.SnackbarContext);
2073
+ const context = (0, import_react6.useContext)(import_components26.SnackbarContext);
2064
2074
  return context ? context.createSnackbar : () => {
2065
2075
  };
2066
2076
  }
2067
2077
 
2068
2078
  // ../renderers/src/ParagraphRenderer.tsx
2069
- var import_components26 = require("@transferwise/components");
2079
+ var import_components27 = require("@transferwise/components");
2070
2080
  var import_classnames5 = __toESM(require("classnames"));
2071
2081
 
2072
2082
  // ../renderers/src/messages/paragraph.messages.ts
@@ -2085,17 +2095,17 @@ var paragraph_messages_default = (0, import_react_intl7.defineMessages)({
2085
2095
  });
2086
2096
 
2087
2097
  // ../renderers/src/ParagraphRenderer.tsx
2088
- var import_jsx_runtime39 = require("react/jsx-runtime");
2098
+ var import_jsx_runtime40 = require("react/jsx-runtime");
2089
2099
  var ParagraphRenderer = {
2090
2100
  canRenderType: "paragraph",
2091
- render: (props) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Paragraph, __spreadValues({}, props))
2101
+ render: (props) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Paragraph, __spreadValues({}, props))
2092
2102
  };
2093
2103
  function Paragraph({ align, control, margin, text }) {
2094
2104
  const className = getTextAlignmentAndMargin({ align, margin });
2095
- return control === "copyable" ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(CopyableParagraph, { className, align, text }) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(StandardParagraph, { className, text });
2105
+ return control === "copyable" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(CopyableParagraph, { className, align, text }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(StandardParagraph, { className, text });
2096
2106
  }
2097
2107
  function StandardParagraph({ text, className }) {
2098
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: `np-text-body-large ${className}`, children: text });
2108
+ return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: `np-text-body-large ${className}`, children: text });
2099
2109
  }
2100
2110
  function CopyableParagraph({
2101
2111
  text,
@@ -2109,9 +2119,9 @@ function CopyableParagraph({
2109
2119
  });
2110
2120
  };
2111
2121
  const inputAlignmentClasses = getTextAlignmentAndMargin({ align, margin: "sm" });
2112
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className, children: [
2113
- /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
2114
- import_components26.Input,
2122
+ return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className, children: [
2123
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
2124
+ import_components27.Input,
2115
2125
  {
2116
2126
  type: "text",
2117
2127
  value: text,
@@ -2119,13 +2129,13 @@ function CopyableParagraph({
2119
2129
  className: (0, import_classnames5.default)("text-ellipsis", inputAlignmentClasses)
2120
2130
  }
2121
2131
  ),
2122
- /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_components26.Button, { block: true, onClick: copy, children: formatMessage(paragraph_messages_default.copy) })
2132
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components27.Button, { block: true, onClick: copy, children: formatMessage(paragraph_messages_default.copy) })
2123
2133
  ] });
2124
2134
  }
2125
2135
  var ParagraphRenderer_default = ParagraphRenderer;
2126
2136
 
2127
2137
  // ../renderers/src/RepeatableRenderer.tsx
2128
- var import_components27 = require("@transferwise/components");
2138
+ var import_components28 = require("@transferwise/components");
2129
2139
  var import_icons = require("@transferwise/icons");
2130
2140
  var import_classnames6 = __toESM(require("classnames"));
2131
2141
  var import_react7 = require("react");
@@ -2157,10 +2167,10 @@ var repeatable_messages_default = (0, import_react_intl9.defineMessages)({
2157
2167
  });
2158
2168
 
2159
2169
  // ../renderers/src/RepeatableRenderer.tsx
2160
- var import_jsx_runtime40 = require("react/jsx-runtime");
2170
+ var import_jsx_runtime41 = require("react/jsx-runtime");
2161
2171
  var RepeatableRenderer = {
2162
2172
  canRenderType: "repeatable",
2163
- render: (props) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Repeatable, __spreadValues({}, props))
2173
+ render: (props) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Repeatable, __spreadValues({}, props))
2164
2174
  };
2165
2175
  function Repeatable(props) {
2166
2176
  const {
@@ -2199,40 +2209,40 @@ function Repeatable(props) {
2199
2209
  const onCancelEdit = () => {
2200
2210
  setOpenModalType(null);
2201
2211
  };
2202
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
2203
- title && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components27.Header, { title }),
2204
- description && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { children: description }),
2205
- /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
2212
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
2213
+ title && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components28.Header, { title }),
2214
+ description && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { children: description }),
2215
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
2206
2216
  "div",
2207
2217
  {
2208
2218
  className: (0, import_classnames6.default)("form-group", {
2209
2219
  "has-error": (validationState == null ? void 0 : validationState.status) === "invalid"
2210
2220
  }),
2211
2221
  children: [
2212
- items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ItemSummaryOption, { item, onClick: () => onEditItem(index) }, item.id)),
2213
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
2214
- import_components27.NavigationOption,
2222
+ items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ItemSummaryOption, { item, onClick: () => onEditItem(index) }, item.id)),
2223
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
2224
+ import_components28.NavigationOption,
2215
2225
  {
2216
- media: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_icons.Plus, {}),
2226
+ media: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_icons.Plus, {}),
2217
2227
  title: addItemTitle || formatMessage(repeatable_messages_default.addItemTitle),
2218
2228
  showMediaAtAllSizes: true,
2219
2229
  onClick: () => onAddItem()
2220
2230
  }
2221
2231
  ),
2222
- (validationState == null ? void 0 : validationState.status) === "invalid" && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components27.InlineAlert, { type: "negative", children: validationState.message })
2232
+ (validationState == null ? void 0 : validationState.status) === "invalid" && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components28.InlineAlert, { type: "negative", children: validationState.message })
2223
2233
  ]
2224
2234
  }
2225
2235
  ),
2226
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
2227
- import_components27.Modal,
2236
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
2237
+ import_components28.Modal,
2228
2238
  {
2229
2239
  open: openModalType !== null,
2230
2240
  title: (openModalType === "add" ? addItemTitle : editItemTitle) || formatMessage(repeatable_messages_default.addItemTitle),
2231
- body: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
2232
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "m-b-2", children: editableItem }),
2233
- /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { children: [
2234
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components27.Button, { priority: "primary", block: true, className: "m-b-2", onClick: () => onSaveItem(), children: formatMessage(repeatable_messages_default.addItem) }),
2235
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_components27.Button, { priority: "secondary", type: "negative", block: true, onClick: () => onRemoveItem(), children: formatMessage(repeatable_messages_default.removeItem) })
2241
+ body: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
2242
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "m-b-2", children: editableItem }),
2243
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { children: [
2244
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components28.Button, { priority: "primary", block: true, className: "m-b-2", onClick: () => onSaveItem(), children: formatMessage(repeatable_messages_default.addItem) }),
2245
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components28.Button, { priority: "secondary", type: "negative", block: true, onClick: () => onRemoveItem(), children: formatMessage(repeatable_messages_default.removeItem) })
2236
2246
  ] })
2237
2247
  ] }),
2238
2248
  onClose: () => onCancelEdit()
@@ -2244,10 +2254,10 @@ function ItemSummaryOption({
2244
2254
  item,
2245
2255
  onClick
2246
2256
  }) {
2247
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
2248
- import_components27.NavigationOption,
2257
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
2258
+ import_components28.NavigationOption,
2249
2259
  {
2250
- media: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(OptionMedia, __spreadProps(__spreadValues({}, item), { preferAvatar: false })),
2260
+ media: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(OptionMedia, __spreadProps(__spreadValues({}, item), { preferAvatar: false })),
2251
2261
  title: item.title,
2252
2262
  content: item.description,
2253
2263
  showMediaAtAllSizes: true,
@@ -2258,7 +2268,7 @@ function ItemSummaryOption({
2258
2268
  var RepeatableRenderer_default = RepeatableRenderer;
2259
2269
 
2260
2270
  // ../renderers/src/ReviewRenderer.tsx
2261
- var import_components28 = require("@transferwise/components");
2271
+ var import_components29 = require("@transferwise/components");
2262
2272
 
2263
2273
  // ../renderers/src/utils/getHeaderAction.tsx
2264
2274
  var getHeaderAction = (callToAction) => {
@@ -2282,15 +2292,15 @@ var getHeaderAction = (callToAction) => {
2282
2292
  };
2283
2293
 
2284
2294
  // ../renderers/src/ReviewRenderer.tsx
2285
- var import_jsx_runtime41 = require("react/jsx-runtime");
2295
+ var import_jsx_runtime42 = require("react/jsx-runtime");
2286
2296
  var ReviewRenderer = {
2287
2297
  canRenderType: "review",
2288
2298
  render: ({ callToAction, control, fields, margin, title, trackEvent }) => {
2289
2299
  const orientation = mapControlToDefinitionListLayout(control);
2290
- return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: getMargin(margin), children: [
2291
- (title || callToAction) && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components28.Header, { title: title != null ? title : "", action: getHeaderAction(callToAction) }),
2292
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
2293
- import_components28.DefinitionList,
2300
+ return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: getMargin(margin), children: [
2301
+ (title || callToAction) && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_components29.Header, { title: title != null ? title : "", action: getHeaderAction(callToAction) }),
2302
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
2303
+ import_components29.DefinitionList,
2294
2304
  {
2295
2305
  layout: orientation,
2296
2306
  definitions: fields.map(
@@ -2328,21 +2338,21 @@ var mapControlToDefinitionListLayout = (control) => {
2328
2338
  };
2329
2339
  var getFieldValue = (value, help, orientation, onClick) => {
2330
2340
  if (help) {
2331
- return orientation === "HORIZONTAL_RIGHT_ALIGNED" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
2332
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Help_default, { help, onClick }),
2341
+ return orientation === "HORIZONTAL_RIGHT_ALIGNED" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
2342
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Help_default, { help, onClick }),
2333
2343
  " ",
2334
2344
  value
2335
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
2345
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
2336
2346
  value,
2337
2347
  " ",
2338
- /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Help_default, { help, onClick })
2348
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Help_default, { help, onClick })
2339
2349
  ] });
2340
2350
  }
2341
2351
  return value;
2342
2352
  };
2343
2353
 
2344
2354
  // ../renderers/src/SearchRenderer/BlockSearchRendererComponent.tsx
2345
- var import_components30 = require("@transferwise/components");
2355
+ var import_components31 = require("@transferwise/components");
2346
2356
  var import_react8 = require("react");
2347
2357
  var import_react_intl14 = require("react-intl");
2348
2358
 
@@ -2380,8 +2390,8 @@ var generic_error_messages_default = (0, import_react_intl12.defineMessages)({
2380
2390
  });
2381
2391
 
2382
2392
  // ../renderers/src/SearchRenderer/ErrorResult.tsx
2383
- var import_components29 = require("@transferwise/components");
2384
- var import_jsx_runtime42 = require("react/jsx-runtime");
2393
+ var import_components30 = require("@transferwise/components");
2394
+ var import_jsx_runtime43 = require("react/jsx-runtime");
2385
2395
  function ErrorResult({ state }) {
2386
2396
  const intl = (0, import_react_intl13.useIntl)();
2387
2397
  const buttonVisualProps = {
@@ -2389,11 +2399,11 @@ function ErrorResult({ state }) {
2389
2399
  size: "sm",
2390
2400
  style: { marginTop: "-2px", padding: "0", width: "auto", display: "inline" }
2391
2401
  };
2392
- return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("p", { className: "m-t-2", children: [
2402
+ return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("p", { className: "m-t-2", children: [
2393
2403
  intl.formatMessage(generic_error_messages_default.genericError),
2394
2404
  "\xA0",
2395
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
2396
- import_components29.Button,
2405
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
2406
+ import_components30.Button,
2397
2407
  __spreadProps(__spreadValues({}, buttonVisualProps), {
2398
2408
  onClick: () => {
2399
2409
  state.onRetry();
@@ -2405,7 +2415,7 @@ function ErrorResult({ state }) {
2405
2415
  }
2406
2416
 
2407
2417
  // ../renderers/src/SearchRenderer/BlockSearchRendererComponent.tsx
2408
- var import_jsx_runtime43 = require("react/jsx-runtime");
2418
+ var import_jsx_runtime44 = require("react/jsx-runtime");
2409
2419
  function BlockSearchRendererComponent({
2410
2420
  id,
2411
2421
  isLoading,
@@ -2418,9 +2428,9 @@ function BlockSearchRendererComponent({
2418
2428
  }) {
2419
2429
  const [hasSearched, setHasSearched] = (0, import_react8.useState)(false);
2420
2430
  const { formatMessage } = (0, import_react_intl14.useIntl)();
2421
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: getMargin(margin), children: [
2422
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(FieldInput_default, { id, description: "", validation: void 0, help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
2423
- import_components30.Input,
2431
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: getMargin(margin), children: [
2432
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(FieldInput_default, { id, description: "", validation: void 0, help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
2433
+ import_components31.Input,
2424
2434
  {
2425
2435
  id,
2426
2436
  name: id,
@@ -2436,7 +2446,7 @@ function BlockSearchRendererComponent({
2436
2446
  }
2437
2447
  }
2438
2448
  ) }),
2439
- isLoading ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_jsx_runtime43.Fragment, { children: formatMessage(search_messages_default.loading) }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(SearchResultContent, { state, trackEvent })
2449
+ isLoading ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_jsx_runtime44.Fragment, { children: formatMessage(search_messages_default.loading) }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SearchResultContent, { state, trackEvent })
2440
2450
  ] });
2441
2451
  }
2442
2452
  function SearchResultContent({
@@ -2445,27 +2455,27 @@ function SearchResultContent({
2445
2455
  }) {
2446
2456
  switch (state.type) {
2447
2457
  case "error":
2448
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ErrorResult, { state });
2458
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ErrorResult, { state });
2449
2459
  case "results":
2450
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(SearchResults, { state, trackEvent });
2460
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SearchResults, { state, trackEvent });
2451
2461
  case "noResults":
2452
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(EmptySearchResult, { state });
2462
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(EmptySearchResult, { state });
2453
2463
  case "pending":
2454
2464
  default:
2455
2465
  return null;
2456
2466
  }
2457
2467
  }
2458
2468
  function EmptySearchResult({ state }) {
2459
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components30.Markdown, { className: "m-t-2", config: { link: { target: "_blank" } }, children: state.message });
2469
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_components31.Markdown, { className: "m-t-2", config: { link: { target: "_blank" } }, children: state.message });
2460
2470
  }
2461
2471
  function SearchResults({
2462
2472
  state,
2463
2473
  trackEvent
2464
2474
  }) {
2465
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components30.NavigationOptionsList, { children: state.results.map((result) => {
2475
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_components31.NavigationOptionsList, { children: state.results.map((result) => {
2466
2476
  const { icon, image } = result;
2467
- return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
2468
- import_components30.NavigationOption,
2477
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
2478
+ import_components31.NavigationOption,
2469
2479
  {
2470
2480
  title: result.title,
2471
2481
  content: result.description,
@@ -2486,11 +2496,11 @@ function SearchResults({
2486
2496
  var BlockSearchRendererComponent_default = BlockSearchRendererComponent;
2487
2497
 
2488
2498
  // ../renderers/src/SearchRenderer/InlineSearchRendererComponent.tsx
2489
- var import_components31 = require("@transferwise/components");
2499
+ var import_components32 = require("@transferwise/components");
2490
2500
  var import_icons2 = require("@transferwise/icons");
2491
2501
  var import_react9 = require("react");
2492
2502
  var import_react_intl15 = require("react-intl");
2493
- var import_jsx_runtime44 = require("react/jsx-runtime");
2503
+ var import_jsx_runtime45 = require("react/jsx-runtime");
2494
2504
  function InlineSearchRenderer({
2495
2505
  id,
2496
2506
  isLoading,
@@ -2502,18 +2512,18 @@ function InlineSearchRenderer({
2502
2512
  }) {
2503
2513
  const [hasSearched, setHasSearched] = (0, import_react9.useState)(false);
2504
2514
  const intl = (0, import_react_intl15.useIntl)();
2505
- return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(FieldInput_default, { id, description: "", validation: void 0, help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
2506
- import_components31.Typeahead,
2515
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(FieldInput_default, { id, description: "", validation: void 0, help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
2516
+ import_components32.Typeahead,
2507
2517
  {
2508
2518
  id: "typeahead-input-id",
2509
2519
  intl,
2510
2520
  name: "typeahead-input-name",
2511
2521
  size: "md",
2512
2522
  maxHeight: 100,
2513
- footer: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(TypeaheadFooter, { state, isLoading }),
2523
+ footer: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(TypeaheadFooter, { state, isLoading }),
2514
2524
  multiple: false,
2515
2525
  clearable: false,
2516
- addon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_icons2.Search, { size: 24 }),
2526
+ addon: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_icons2.Search, { size: 24 }),
2517
2527
  options: state.type === "results" ? state.results.map(mapResultToTypeaheadOption) : [],
2518
2528
  minQueryLength: 1,
2519
2529
  onChange: (values) => {
@@ -2550,34 +2560,34 @@ function mapResultToTypeaheadOption(result) {
2550
2560
  function TypeaheadFooter({ state, isLoading }) {
2551
2561
  const { formatMessage } = (0, import_react_intl15.useIntl)();
2552
2562
  if (state.type === "noResults") {
2553
- return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_components31.Markdown, { className: "m-t-2 m-x-2", config: { link: { target: "_blank" } }, children: state.message });
2563
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_components32.Markdown, { className: "m-t-2 m-x-2", config: { link: { target: "_blank" } }, children: state.message });
2554
2564
  }
2555
2565
  if (state.type === "error") {
2556
- return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "m-t-2 m-x-2", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ErrorResult, { state }) });
2566
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "m-t-2 m-x-2", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(ErrorResult, { state }) });
2557
2567
  }
2558
2568
  if (state.type === "pending" || isLoading) {
2559
- return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("p", { className: "m-t-2 m-x-2", children: formatMessage(search_messages_default.loading) });
2569
+ return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "m-t-2 m-x-2", children: formatMessage(search_messages_default.loading) });
2560
2570
  }
2561
2571
  return null;
2562
2572
  }
2563
2573
  var InlineSearchRendererComponent_default = InlineSearchRenderer;
2564
2574
 
2565
2575
  // ../renderers/src/SearchRenderer/SearchRenderer.tsx
2566
- var import_jsx_runtime45 = require("react/jsx-runtime");
2576
+ var import_jsx_runtime46 = require("react/jsx-runtime");
2567
2577
  var SearchRenderer = {
2568
2578
  canRenderType: "search",
2569
- render: (props) => props.control === "inline" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(InlineSearchRendererComponent_default, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(BlockSearchRendererComponent_default, __spreadValues({}, props))
2579
+ render: (props) => props.control === "inline" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(InlineSearchRendererComponent_default, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(BlockSearchRendererComponent_default, __spreadValues({}, props))
2570
2580
  };
2571
2581
  var SearchRenderer_default = SearchRenderer;
2572
2582
 
2573
2583
  // ../renderers/src/SectionRenderer.tsx
2574
- var import_components32 = require("@transferwise/components");
2575
- var import_jsx_runtime46 = require("react/jsx-runtime");
2584
+ var import_components33 = require("@transferwise/components");
2585
+ var import_jsx_runtime47 = require("react/jsx-runtime");
2576
2586
  var SectionRenderer = {
2577
2587
  canRenderType: "section",
2578
2588
  render: ({ children, callToAction, margin, title }) => {
2579
- return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("section", { className: getMargin(margin), children: [
2580
- (title || callToAction) && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components32.Header, { title: title != null ? title : "", action: getHeaderAction(callToAction) }),
2589
+ return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("section", { className: getMargin(margin), children: [
2590
+ (title || callToAction) && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_components33.Header, { title: title != null ? title : "", action: getHeaderAction(callToAction) }),
2581
2591
  children
2582
2592
  ] });
2583
2593
  }
@@ -2585,8 +2595,8 @@ var SectionRenderer = {
2585
2595
  var SectionRenderer_default = SectionRenderer;
2586
2596
 
2587
2597
  // ../renderers/src/SelectInputRenderer/RadioInputRendererComponent.tsx
2588
- var import_components33 = require("@transferwise/components");
2589
- var import_jsx_runtime47 = require("react/jsx-runtime");
2598
+ var import_components34 = require("@transferwise/components");
2599
+ var import_jsx_runtime48 = require("react/jsx-runtime");
2590
2600
  function RadioInputRendererComponent(props) {
2591
2601
  const {
2592
2602
  id,
@@ -2600,8 +2610,8 @@ function RadioInputRendererComponent(props) {
2600
2610
  validationState,
2601
2611
  onSelect
2602
2612
  } = props;
2603
- return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_jsx_runtime47.Fragment, { children: [
2604
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
2613
+ return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
2614
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
2605
2615
  FieldInput_default,
2606
2616
  {
2607
2617
  id,
@@ -2609,8 +2619,8 @@ function RadioInputRendererComponent(props) {
2609
2619
  help,
2610
2620
  description,
2611
2621
  validation: validationState,
2612
- children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
2613
- import_components33.RadioGroup,
2622
+ children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
2623
+ import_components34.RadioGroup,
2614
2624
  {
2615
2625
  name: id,
2616
2626
  radios: options.map((option, index) => ({
@@ -2618,7 +2628,7 @@ function RadioInputRendererComponent(props) {
2618
2628
  value: index,
2619
2629
  secondary: option.description,
2620
2630
  disabled: option.disabled || disabled,
2621
- avatar: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(OptionMedia, { icon: option.icon, image: option.image, preferAvatar: false })
2631
+ avatar: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(OptionMedia, { icon: option.icon, image: option.image, preferAvatar: false })
2622
2632
  })),
2623
2633
  selectedValue: selectedIndex != null ? selectedIndex : void 0,
2624
2634
  onChange: onSelect
@@ -2632,9 +2642,9 @@ function RadioInputRendererComponent(props) {
2632
2642
  }
2633
2643
 
2634
2644
  // ../renderers/src/SelectInputRenderer/TabInputRendererComponent.tsx
2635
- var import_components34 = require("@transferwise/components");
2645
+ var import_components35 = require("@transferwise/components");
2636
2646
  var import_react10 = require("react");
2637
- var import_jsx_runtime48 = require("react/jsx-runtime");
2647
+ var import_jsx_runtime49 = require("react/jsx-runtime");
2638
2648
  function TabInputRendererComponent(props) {
2639
2649
  const {
2640
2650
  id,
@@ -2653,8 +2663,8 @@ function TabInputRendererComponent(props) {
2653
2663
  onSelect(0);
2654
2664
  }
2655
2665
  }, [selectedIndex, onSelect, options.length]);
2656
- return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
2657
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
2666
+ return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
2667
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
2658
2668
  FieldInput_default,
2659
2669
  {
2660
2670
  id,
@@ -2662,8 +2672,8 @@ function TabInputRendererComponent(props) {
2662
2672
  help,
2663
2673
  description,
2664
2674
  validation: validationState,
2665
- children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
2666
- import_components34.Tabs,
2675
+ children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
2676
+ import_components35.Tabs,
2667
2677
  {
2668
2678
  name: id,
2669
2679
  selected: selectedIndex != null ? selectedIndex : 0,
@@ -2671,7 +2681,7 @@ function TabInputRendererComponent(props) {
2671
2681
  title: option.title,
2672
2682
  // if we pass null, we get some props-types console errors
2673
2683
  // eslint-disable-next-line react/jsx-no-useless-fragment
2674
- content: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, {}),
2684
+ content: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_jsx_runtime49.Fragment, {}),
2675
2685
  disabled: option.disabled || disabled
2676
2686
  })),
2677
2687
  onTabSelect: onSelect
@@ -2685,8 +2695,8 @@ function TabInputRendererComponent(props) {
2685
2695
  var isValidIndex = (index, options) => index !== null && index >= 0 && index < options;
2686
2696
 
2687
2697
  // ../renderers/src/SelectInputRenderer/SelectInputRendererComponent.tsx
2688
- var import_components35 = require("@transferwise/components");
2689
- var import_jsx_runtime49 = require("react/jsx-runtime");
2698
+ var import_components36 = require("@transferwise/components");
2699
+ var import_jsx_runtime50 = require("react/jsx-runtime");
2690
2700
  function SelectInputRendererComponent(props) {
2691
2701
  const {
2692
2702
  id,
@@ -2726,13 +2736,13 @@ function SelectInputRendererComponent(props) {
2726
2736
  } : {
2727
2737
  title: option.title,
2728
2738
  description: option.description,
2729
- icon: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(OptionMedia, { icon: option.icon, image: option.image, preferAvatar: false })
2739
+ icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(OptionMedia, { icon: option.icon, image: option.image, preferAvatar: false })
2730
2740
  };
2731
- return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_components35.SelectInputOptionContent, __spreadValues({}, contentProps));
2741
+ return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components36.SelectInputOptionContent, __spreadValues({}, contentProps));
2732
2742
  };
2733
2743
  const extraProps = { autoComplete };
2734
- return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
2735
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
2744
+ return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
2745
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
2736
2746
  FieldInput_default,
2737
2747
  {
2738
2748
  id,
@@ -2740,8 +2750,8 @@ function SelectInputRendererComponent(props) {
2740
2750
  help,
2741
2751
  description,
2742
2752
  validation: validationState,
2743
- children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
2744
- import_components35.SelectInput,
2753
+ children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
2754
+ import_components36.SelectInput,
2745
2755
  __spreadValues({
2746
2756
  name: id,
2747
2757
  placeholder,
@@ -2762,8 +2772,8 @@ function SelectInputRendererComponent(props) {
2762
2772
 
2763
2773
  // ../renderers/src/SelectInputRenderer/SegmentedInputRendererComponent.tsx
2764
2774
  var import_react11 = require("react");
2765
- var import_components36 = require("@transferwise/components");
2766
- var import_jsx_runtime50 = require("react/jsx-runtime");
2775
+ var import_components37 = require("@transferwise/components");
2776
+ var import_jsx_runtime51 = require("react/jsx-runtime");
2767
2777
  function SegmentedInputRendererComponent(props) {
2768
2778
  const {
2769
2779
  id,
@@ -2781,8 +2791,8 @@ function SegmentedInputRendererComponent(props) {
2781
2791
  onSelect(0);
2782
2792
  }
2783
2793
  }, [selectedIndex, onSelect, options.length]);
2784
- return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
2785
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
2794
+ return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
2795
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
2786
2796
  FieldInput_default,
2787
2797
  {
2788
2798
  id,
@@ -2790,8 +2800,8 @@ function SegmentedInputRendererComponent(props) {
2790
2800
  help,
2791
2801
  description,
2792
2802
  validation: validationState,
2793
- children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
2794
- import_components36.SegmentedControl,
2803
+ children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
2804
+ import_components37.SegmentedControl,
2795
2805
  {
2796
2806
  name: `${id}-segmented-control`,
2797
2807
  value: String(selectedIndex),
@@ -2807,44 +2817,44 @@ function SegmentedInputRendererComponent(props) {
2807
2817
  )
2808
2818
  }
2809
2819
  ),
2810
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { id: `${id}-children`, children })
2820
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { id: `${id}-children`, children })
2811
2821
  ] });
2812
2822
  }
2813
2823
  var isValidIndex2 = (index, options) => index !== null && index >= 0 && index < options;
2814
2824
 
2815
2825
  // ../renderers/src/SelectInputRenderer/SelectInputRenderer.tsx
2816
- var import_jsx_runtime51 = require("react/jsx-runtime");
2826
+ var import_jsx_runtime52 = require("react/jsx-runtime");
2817
2827
  var SelectInputRenderer = {
2818
2828
  canRenderType: "input-select",
2819
2829
  render: (props) => {
2820
2830
  switch (props.control) {
2821
2831
  case "radio":
2822
- return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(RadioInputRendererComponent, __spreadValues({}, props));
2832
+ return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(RadioInputRendererComponent, __spreadValues({}, props));
2823
2833
  case "tab":
2824
- return props.options.length > 3 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SelectInputRendererComponent, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TabInputRendererComponent, __spreadValues({}, props));
2834
+ return props.options.length > 3 ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SelectInputRendererComponent, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(TabInputRendererComponent, __spreadValues({}, props));
2825
2835
  case "segmented":
2826
- return props.options.length > 3 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SelectInputRendererComponent, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SegmentedInputRendererComponent, __spreadValues({}, props));
2836
+ return props.options.length > 3 ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SelectInputRendererComponent, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SegmentedInputRendererComponent, __spreadValues({}, props));
2827
2837
  case "select":
2828
2838
  default:
2829
- return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SelectInputRendererComponent, __spreadValues({}, props));
2839
+ return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SelectInputRendererComponent, __spreadValues({}, props));
2830
2840
  }
2831
2841
  }
2832
2842
  };
2833
2843
  var SelectInputRenderer_default = SelectInputRenderer;
2834
2844
 
2835
2845
  // ../renderers/src/StatusListRenderer.tsx
2836
- var import_components37 = require("@transferwise/components");
2837
- var import_jsx_runtime52 = require("react/jsx-runtime");
2846
+ var import_components38 = require("@transferwise/components");
2847
+ var import_jsx_runtime53 = require("react/jsx-runtime");
2838
2848
  var StatusListRenderer = {
2839
2849
  canRenderType: "status-list",
2840
- render: ({ margin, items, title }) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: getMargin(margin), children: [
2841
- title ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_components37.Header, { title, className: "m-b-2" }) : null,
2842
- items.map(({ callToAction, description, icon, status, title: itemTitle }) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
2843
- import_components37.Summary,
2850
+ render: ({ margin, items, title }) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: getMargin(margin), children: [
2851
+ title ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_components38.Header, { title, className: "m-b-2" }) : null,
2852
+ items.map(({ callToAction, description, icon, status, title: itemTitle }) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
2853
+ import_components38.Summary,
2844
2854
  {
2845
2855
  title: itemTitle,
2846
2856
  description,
2847
- icon: icon && "name" in icon ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(DynamicIcon_default, { name: icon.name }) : null,
2857
+ icon: icon && "name" in icon ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DynamicIcon_default, { name: icon.name }) : null,
2848
2858
  status: mapStatus(status),
2849
2859
  action: getSummaryAction(callToAction)
2850
2860
  },
@@ -2896,11 +2906,11 @@ var useCustomTheme = (theme, trackEvent) => {
2896
2906
  };
2897
2907
 
2898
2908
  // ../renderers/src/step/BackButton.tsx
2899
- var import_components38 = require("@transferwise/components");
2909
+ var import_components39 = require("@transferwise/components");
2900
2910
  var import_icons3 = require("@transferwise/icons");
2901
- var import_jsx_runtime53 = require("react/jsx-runtime");
2911
+ var import_jsx_runtime54 = require("react/jsx-runtime");
2902
2912
  function BackButton({ title, onClick }) {
2903
- return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "m-b-2", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
2913
+ return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "m-b-2", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
2904
2914
  "button",
2905
2915
  {
2906
2916
  type: "button",
@@ -2909,8 +2919,8 @@ function BackButton({ title, onClick }) {
2909
2919
  "aria-label": title,
2910
2920
  onClick,
2911
2921
  children: [
2912
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "sr-only", children: title }),
2913
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_components38.AvatarView, { interactive: true, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_icons3.ArrowLeft, { size: "24" }) })
2922
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "sr-only", children: title }),
2923
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_components39.AvatarView, { interactive: true, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_icons3.ArrowLeft, { size: "24" }) })
2914
2924
  ]
2915
2925
  }
2916
2926
  ) });
@@ -2918,7 +2928,7 @@ function BackButton({ title, onClick }) {
2918
2928
  var BackButton_default = BackButton;
2919
2929
 
2920
2930
  // ../renderers/src/step/SplashCelebrationStepRenderer.tsx
2921
- var import_jsx_runtime54 = require("react/jsx-runtime");
2931
+ var import_jsx_runtime55 = require("react/jsx-runtime");
2922
2932
  var SplashCelebrationStepRenderer = {
2923
2933
  canRenderType: "step",
2924
2934
  canRender: ({ control }) => control === "splash-celebration",
@@ -2927,14 +2937,14 @@ var SplashCelebrationStepRenderer = {
2927
2937
  function SplashCelebrationStepRendererComponent(props) {
2928
2938
  const { back, children, trackEvent } = props;
2929
2939
  useCustomTheme("forest-green", trackEvent);
2930
- return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "splash-screen m-t-5", children: [
2931
- back ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(BackButton_default, __spreadValues({}, back)) : null,
2940
+ return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "splash-screen m-t-5", children: [
2941
+ back ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(BackButton_default, __spreadValues({}, back)) : null,
2932
2942
  children
2933
2943
  ] });
2934
2944
  }
2935
2945
 
2936
2946
  // ../renderers/src/step/SplashStepRenderer.tsx
2937
- var import_jsx_runtime55 = require("react/jsx-runtime");
2947
+ var import_jsx_runtime56 = require("react/jsx-runtime");
2938
2948
  var SplashStepRenderer = {
2939
2949
  canRenderType: "step",
2940
2950
  canRender: ({ control }) => control === "splash",
@@ -2942,63 +2952,63 @@ var SplashStepRenderer = {
2942
2952
  };
2943
2953
  function SplashStepRendererComponent(props) {
2944
2954
  const { back, children } = props;
2945
- return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "splash-screen m-t-5", children: [
2946
- back ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(BackButton_default, __spreadValues({}, back)) : null,
2955
+ return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "splash-screen m-t-5", children: [
2956
+ back ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(BackButton_default, __spreadValues({}, back)) : null,
2947
2957
  children
2948
2958
  ] });
2949
2959
  }
2950
2960
 
2951
2961
  // ../renderers/src/step/StepRenderer.tsx
2952
- var import_components39 = require("@transferwise/components");
2953
- var import_jsx_runtime56 = require("react/jsx-runtime");
2962
+ var import_components40 = require("@transferwise/components");
2963
+ var import_jsx_runtime57 = require("react/jsx-runtime");
2954
2964
  var StepRenderer = {
2955
2965
  canRenderType: "step",
2956
2966
  render: StepRendererComponent
2957
2967
  };
2958
2968
  function StepRendererComponent(props) {
2959
2969
  const { back, description, error, title, children } = props;
2960
- return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
2961
- back ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(BackButton_default, __spreadValues({}, back)) : null,
2962
- title || description ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "m-b-4", children: [
2963
- title ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_components39.Title, { as: "h1", type: "title-section", className: "text-xs-center m-b-2", children: title }) : void 0,
2964
- description ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: "text-xs-center np-text-body-large", children: description }) : void 0
2970
+ return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
2971
+ back ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(BackButton_default, __spreadValues({}, back)) : null,
2972
+ title || description ? /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "m-b-4", children: [
2973
+ title ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_components40.Title, { as: "h1", type: "title-section", className: "text-xs-center m-b-2", children: title }) : void 0,
2974
+ description ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: "text-xs-center np-text-body-large", children: description }) : void 0
2965
2975
  ] }) : void 0,
2966
- error ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_components39.Alert, { type: "negative", className: "m-b-2", message: error }) : void 0,
2976
+ error ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_components40.Alert, { type: "negative", className: "m-b-2", message: error }) : void 0,
2967
2977
  children
2968
2978
  ] });
2969
2979
  }
2970
2980
 
2971
2981
  // ../renderers/src/TabsRenderer.tsx
2972
- var import_components40 = require("@transferwise/components");
2982
+ var import_components41 = require("@transferwise/components");
2973
2983
  var import_react13 = require("react");
2974
- var import_jsx_runtime57 = require("react/jsx-runtime");
2984
+ var import_jsx_runtime58 = require("react/jsx-runtime");
2975
2985
  var TabsRenderer = {
2976
2986
  canRenderType: "tabs",
2977
2987
  render: (props) => {
2978
2988
  switch (props.control) {
2979
2989
  case "segmented":
2980
2990
  if (props.tabs.length > 3) {
2981
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TabsRendererComponent, __spreadValues({}, props));
2991
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TabsRendererComponent, __spreadValues({}, props));
2982
2992
  }
2983
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(SegmentedTabsRendererComponent, __spreadValues({}, props));
2993
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(SegmentedTabsRendererComponent, __spreadValues({}, props));
2984
2994
  case "chips":
2985
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ChipsTabsRendererComponent, __spreadValues({}, props));
2995
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(ChipsTabsRendererComponent, __spreadValues({}, props));
2986
2996
  default:
2987
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TabsRendererComponent, __spreadValues({}, props));
2997
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TabsRendererComponent, __spreadValues({}, props));
2988
2998
  }
2989
2999
  }
2990
3000
  };
2991
3001
  function TabsRendererComponent({ uid, margin, tabs }) {
2992
3002
  const [selectedIndex, setSelectedIndex] = (0, import_react13.useState)(0);
2993
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
2994
- import_components40.Tabs,
3003
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
3004
+ import_components41.Tabs,
2995
3005
  {
2996
3006
  name: uid,
2997
3007
  selected: selectedIndex != null ? selectedIndex : 0,
2998
3008
  tabs: tabs.map((option) => ({
2999
3009
  title: option.title,
3000
3010
  disabled: false,
3001
- content: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "m-t-2", children: [
3011
+ content: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "m-t-2", children: [
3002
3012
  " ",
3003
3013
  option.children,
3004
3014
  " "
@@ -3011,9 +3021,9 @@ function TabsRendererComponent({ uid, margin, tabs }) {
3011
3021
  function SegmentedTabsRendererComponent({ uid, margin, tabs }) {
3012
3022
  var _a;
3013
3023
  const [selectedIndex, setSelectedIndex] = (0, import_react13.useState)(0);
3014
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: getMargin(margin), children: [
3015
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
3016
- import_components40.SegmentedControl,
3024
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: getMargin(margin), children: [
3025
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
3026
+ import_components41.SegmentedControl,
3017
3027
  {
3018
3028
  name: uid,
3019
3029
  value: String(selectedIndex),
@@ -3027,31 +3037,31 @@ function SegmentedTabsRendererComponent({ uid, margin, tabs }) {
3027
3037
  onChange: (value) => setSelectedIndex(Number(value))
3028
3038
  }
3029
3039
  ),
3030
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { id: `${uid}-children`, className: "m-t-2", children: (_a = tabs[selectedIndex]) == null ? void 0 : _a.children })
3040
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { id: `${uid}-children`, className: "m-t-2", children: (_a = tabs[selectedIndex]) == null ? void 0 : _a.children })
3031
3041
  ] });
3032
3042
  }
3033
3043
  function ChipsTabsRendererComponent({ margin, tabs }) {
3034
3044
  var _a;
3035
3045
  const [selectedIndex, setSelectedIndex] = (0, import_react13.useState)(0);
3036
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: getMargin(margin), children: [
3037
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "chips-container", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
3038
- import_components40.Chips,
3046
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: getMargin(margin), children: [
3047
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "chips-container", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
3048
+ import_components41.Chips,
3039
3049
  {
3040
3050
  chips: tabs.map((tab, index) => ({ label: tab.title, value: index })),
3041
3051
  selected: selectedIndex,
3042
3052
  onChange: ({ selectedValue }) => setSelectedIndex(Number(selectedValue))
3043
3053
  }
3044
3054
  ) }),
3045
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "m-t-2", children: (_a = tabs[selectedIndex]) == null ? void 0 : _a.children })
3055
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "m-t-2", children: (_a = tabs[selectedIndex]) == null ? void 0 : _a.children })
3046
3056
  ] });
3047
3057
  }
3048
3058
 
3049
3059
  // ../renderers/src/TextInputRenderer.tsx
3050
- var import_components42 = require("@transferwise/components");
3060
+ var import_components43 = require("@transferwise/components");
3051
3061
 
3052
3062
  // ../renderers/src/components/VariableTextInput.tsx
3053
- var import_components41 = require("@transferwise/components");
3054
- var import_jsx_runtime58 = require("react/jsx-runtime");
3063
+ var import_components42 = require("@transferwise/components");
3064
+ var import_jsx_runtime59 = require("react/jsx-runtime");
3055
3065
  var commonKeys = [
3056
3066
  "autoComplete",
3057
3067
  "autoCapitalize",
@@ -3070,12 +3080,12 @@ function VariableTextInput(inputProps) {
3070
3080
  const commonProps = __spreadProps(__spreadValues({}, pick(inputProps, ...commonKeys)), { name: id });
3071
3081
  switch (control) {
3072
3082
  case "email":
3073
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TextInput, __spreadProps(__spreadValues({}, commonProps), { type: "email", onChange }));
3083
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TextInput, __spreadProps(__spreadValues({}, commonProps), { type: "email", onChange }));
3074
3084
  case "password":
3075
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TextInput, __spreadProps(__spreadValues({}, commonProps), { type: "password", onChange }));
3085
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TextInput, __spreadProps(__spreadValues({}, commonProps), { type: "password", onChange }));
3076
3086
  case "numeric": {
3077
3087
  const numericProps = __spreadProps(__spreadValues({}, commonProps), { type: "number", onWheel });
3078
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
3088
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
3079
3089
  TextInput,
3080
3090
  __spreadProps(__spreadValues({}, numericProps), {
3081
3091
  onChange: (newValue) => {
@@ -3086,21 +3096,21 @@ function VariableTextInput(inputProps) {
3086
3096
  );
3087
3097
  }
3088
3098
  case "phone-number":
3089
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components41.PhoneNumberInput, __spreadProps(__spreadValues({ initialValue: value }, commonProps), { onChange }));
3099
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_components42.PhoneNumberInput, __spreadProps(__spreadValues({ initialValue: value }, commonProps), { onChange }));
3090
3100
  default: {
3091
- return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TextInput, __spreadProps(__spreadValues({}, commonProps), { type: "text", onChange }));
3101
+ return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TextInput, __spreadProps(__spreadValues({}, commonProps), { type: "text", onChange }));
3092
3102
  }
3093
3103
  }
3094
3104
  }
3095
3105
  function TextInput(props) {
3096
3106
  const _a = props, { control, displayFormat, onChange } = _a, commonProps = __objRest(_a, ["control", "displayFormat", "onChange"]);
3097
- const InputWithPattern = control === "textarea" ? import_components41.TextareaWithDisplayFormat : import_components41.InputWithDisplayFormat;
3098
- const InputWithoutPattern = control === "textarea" ? import_components41.TextArea : import_components41.Input;
3099
- return displayFormat ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(InputWithPattern, __spreadProps(__spreadValues({ displayPattern: displayFormat }, commonProps), { onChange })) : /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(InputWithoutPattern, __spreadProps(__spreadValues({}, commonProps), { onChange: (e) => onChange(e.target.value) }));
3107
+ const InputWithPattern = control === "textarea" ? import_components42.TextareaWithDisplayFormat : import_components42.InputWithDisplayFormat;
3108
+ const InputWithoutPattern = control === "textarea" ? import_components42.TextArea : import_components42.Input;
3109
+ return displayFormat ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(InputWithPattern, __spreadProps(__spreadValues({ displayPattern: displayFormat }, commonProps), { onChange })) : /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(InputWithoutPattern, __spreadProps(__spreadValues({}, commonProps), { onChange: (e) => onChange(e.target.value) }));
3100
3110
  }
3101
3111
 
3102
3112
  // ../renderers/src/TextInputRenderer.tsx
3103
- var import_jsx_runtime59 = require("react/jsx-runtime");
3113
+ var import_jsx_runtime60 = require("react/jsx-runtime");
3104
3114
  var TextInputRenderer = {
3105
3115
  canRenderType: "input-text",
3106
3116
  render: (props) => {
@@ -3135,7 +3145,7 @@ var TextInputRenderer = {
3135
3145
  }
3136
3146
  }
3137
3147
  });
3138
- return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
3148
+ return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
3139
3149
  FieldInput_default,
3140
3150
  {
3141
3151
  id,
@@ -3143,7 +3153,7 @@ var TextInputRenderer = {
3143
3153
  description,
3144
3154
  validation: validationState,
3145
3155
  help,
3146
- children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_components42.InputGroup, { addonStart: getInputGroupAddonStart({ icon, image }), children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(VariableTextInput, __spreadValues({}, inputProps)) })
3156
+ children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_components43.InputGroup, { addonStart: getInputGroupAddonStart({ icon, image }), children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(VariableTextInput, __spreadValues({}, inputProps)) })
3147
3157
  }
3148
3158
  );
3149
3159
  }
@@ -3151,13 +3161,13 @@ var TextInputRenderer = {
3151
3161
  var TextInputRenderer_default = TextInputRenderer;
3152
3162
 
3153
3163
  // ../renderers/src/UploadInputRenderer.tsx
3154
- var import_components43 = require("@transferwise/components");
3164
+ var import_components44 = require("@transferwise/components");
3155
3165
 
3156
3166
  // ../renderers/src/utils/getRandomId.ts
3157
3167
  var getRandomId = () => Math.random().toString(36).substring(2);
3158
3168
 
3159
3169
  // ../renderers/src/UploadInputRenderer.tsx
3160
- var import_jsx_runtime60 = require("react/jsx-runtime");
3170
+ var import_jsx_runtime61 = require("react/jsx-runtime");
3161
3171
  var UploadInputRenderer = {
3162
3172
  canRenderType: "input-upload",
3163
3173
  render: (props) => {
@@ -3173,20 +3183,20 @@ var UploadInputRenderer = {
3173
3183
  };
3174
3184
  return (
3175
3185
  // We don't pass help here as there is no sensible place to display it
3176
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
3186
+ /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
3177
3187
  UploadFieldInput_default,
3178
3188
  {
3179
3189
  id,
3180
3190
  label: void 0,
3181
3191
  description: void 0,
3182
3192
  validation: validationState,
3183
- children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
3184
- import_components43.UploadInput,
3193
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
3194
+ import_components44.UploadInput,
3185
3195
  {
3186
3196
  id,
3187
3197
  description,
3188
3198
  disabled,
3189
- fileTypes: getAcceptsString(accepts),
3199
+ fileTypes: acceptsToFileTypes(accepts),
3190
3200
  sizeLimit: maxSize ? toKilobytes(maxSize) : void 0,
3191
3201
  uploadButtonTitle: title,
3192
3202
  onDeleteFile,
@@ -3235,7 +3245,9 @@ var LargeUploadRenderer = {
3235
3245
  throw e;
3236
3246
  }
3237
3247
  };
3238
- return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
3248
+ const filetypes = acceptsToFileTypes(accepts);
3249
+ const usAccept = filetypes === "*" ? "*" : filetypes.join(",");
3250
+ return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
3239
3251
  FieldInput_default,
3240
3252
  {
3241
3253
  id,
@@ -3243,10 +3255,10 @@ var LargeUploadRenderer = {
3243
3255
  description,
3244
3256
  validation: validationState,
3245
3257
  help,
3246
- children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
3247
- import_components43.Upload,
3258
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
3259
+ import_components44.Upload,
3248
3260
  __spreadProps(__spreadValues({}, uploadProps), {
3249
- usAccept: getAcceptsString(accepts),
3261
+ usAccept,
3250
3262
  usDisabled: disabled,
3251
3263
  onSuccess: onUploadFile,
3252
3264
  onFailure: async () => onUpload(null),
@@ -3279,6 +3291,7 @@ var getWiseRenderers = () => [
3279
3291
  ListRenderer_default,
3280
3292
  LoadingIndicatorRenderer_default,
3281
3293
  MarkdownRenderer_default,
3294
+ ModalRenderer,
3282
3295
  ModalLayoutRenderer_default,
3283
3296
  MultiSelectInputRenderer_default,
3284
3297
  MultiUploadInputRenderer_default,
@@ -3298,20 +3311,10 @@ var getWiseRenderers = () => [
3298
3311
  StepRenderer
3299
3312
  ];
3300
3313
 
3301
- // ../renderers/src/ModalContentRenderer.tsx
3302
- var import_components44 = require("@transferwise/components");
3303
- var import_jsx_runtime61 = require("react/jsx-runtime");
3304
- var ModalContentRenderer = {
3305
- canRenderType: "modal",
3306
- render: ({ title, children, open, onClose }) => {
3307
- return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_components44.Modal, { open, title, body: children, onClose });
3308
- }
3309
- };
3310
-
3311
3314
  // src/dynamicFlow/telemetry/app-version.ts
3312
3315
  var appVersion = (
3313
3316
  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
3314
- typeof process !== "undefined" ? "4.17.1" : "0.0.0"
3317
+ typeof process !== "undefined" ? "4.17.2" : "0.0.0"
3315
3318
  );
3316
3319
 
3317
3320
  // src/dynamicFlow/telemetry/getLogEvent.ts
@@ -3370,10 +3373,7 @@ function DynamicFlowRevamp(props) {
3370
3373
  onThemeChange
3371
3374
  } = props;
3372
3375
  const httpClient = useWiseHttpClient(customFetch);
3373
- const mergedRenderers = (0, import_react14.useMemo)(
3374
- () => [ModalContentRenderer, ...renderers != null ? renderers : [], ...wiseRenderers],
3375
- [renderers]
3376
- );
3376
+ const mergedRenderers = (0, import_react14.useMemo)(() => [...renderers != null ? renderers : [], ...wiseRenderers], [renderers]);
3377
3377
  const logEvent = (0, import_react14.useMemo)(() => getLogEvent(onLog), [onLog]);
3378
3378
  const trackEvent = (0, import_react14.useMemo)(
3379
3379
  () => getTrackEvent(onEvent, onAnalytics, onThemeChange),
@@ -3400,10 +3400,7 @@ var DynamicForm = (0, import_react14.forwardRef)(function DynamicForm2(props, re
3400
3400
  onThemeChange
3401
3401
  } = props;
3402
3402
  const httpClient = useWiseHttpClient(customFetch);
3403
- const mergedRenderers = (0, import_react14.useMemo)(
3404
- () => [ModalContentRenderer, ...renderers != null ? renderers : [], ...wiseRenderers],
3405
- [renderers]
3406
- );
3403
+ const mergedRenderers = (0, import_react14.useMemo)(() => [...renderers != null ? renderers : [], ...wiseRenderers], [renderers]);
3407
3404
  const logEvent = (0, import_react14.useMemo)(() => getLogEvent(onLog), [onLog]);
3408
3405
  const trackEvent = (0, import_react14.useMemo)(
3409
3406
  () => getTrackEvent(onEvent, onAnalytics, onThemeChange),