@wise/dynamic-flow-client-internal 3.14.0-export-map-experimental-58f00fb → 3.14.0
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.
- package/build/main.js +279 -366
- package/build/main.min.js +1 -1
- package/build/main.mjs +278 -365
- package/package.json +12 -6
- package/build/dynamicFlow/DynamicFlow.js +0 -104
- package/build/dynamicFlow/DynamicFlow.test.js +0 -116
- package/build/i18n/index.js +0 -62
- package/build/index.js +0 -5
- package/build/stories/DynamicFlow.story.js +0 -52
- package/build/stories/DynamicFragment.story.js +0 -132
- package/build/stories/Editable.story.js +0 -70
- package/build/stories/Examples.story.js +0 -29
- package/build/stories/Features.story.js +0 -33
- package/build/stories/utils/DynamicFlowSideBySide.js +0 -30
- package/build/stories/utils/fixtureHttpClient.js +0 -119
- package/build/stories/visual-tests/generated.story.js +0 -216
- package/build/stories/visual-tests/layouts.story.js +0 -108
- package/build/stories/visual-tests/schemas.story.js +0 -84
- package/build/stories/visual-tests/step.story.js +0 -30
- package/build/test-utils/NeptuneProviders.js +0 -23
- package/build/test-utils/rtl-utils.js +0 -20
- package/build/tests/renderers/RadioInputRendererComponent.test.js +0 -76
- package/build/tests/renderers/value-utils.test.js +0 -33
- package/build/types/stories/visual-tests/generated.story.d.ts +0 -39
- package/build/types/stories/visual-tests/layouts.story.d.ts +0 -21
- package/build/types/stories/visual-tests/schemas.story.d.ts +0 -17
- package/build/types/stories/visual-tests/step.story.d.ts +0 -8
package/build/main.js
CHANGED
|
@@ -66,7 +66,7 @@ var require_classnames = __commonJS({
|
|
|
66
66
|
(function() {
|
|
67
67
|
"use strict";
|
|
68
68
|
var hasOwn = {}.hasOwnProperty;
|
|
69
|
-
function
|
|
69
|
+
function classNames6() {
|
|
70
70
|
var classes = "";
|
|
71
71
|
for (var i = 0; i < arguments.length; i++) {
|
|
72
72
|
var arg = arguments[i];
|
|
@@ -84,7 +84,7 @@ var require_classnames = __commonJS({
|
|
|
84
84
|
return "";
|
|
85
85
|
}
|
|
86
86
|
if (Array.isArray(arg)) {
|
|
87
|
-
return
|
|
87
|
+
return classNames6.apply(null, arg);
|
|
88
88
|
}
|
|
89
89
|
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
|
|
90
90
|
return arg.toString();
|
|
@@ -107,14 +107,14 @@ var require_classnames = __commonJS({
|
|
|
107
107
|
return value + newClass;
|
|
108
108
|
}
|
|
109
109
|
if (typeof module2 !== "undefined" && module2.exports) {
|
|
110
|
-
|
|
111
|
-
module2.exports =
|
|
110
|
+
classNames6.default = classNames6;
|
|
111
|
+
module2.exports = classNames6;
|
|
112
112
|
} else if (typeof define === "function" && typeof define.amd === "object" && define.amd) {
|
|
113
113
|
define("classnames", [], function() {
|
|
114
|
-
return
|
|
114
|
+
return classNames6;
|
|
115
115
|
});
|
|
116
116
|
} else {
|
|
117
|
-
window.classNames =
|
|
117
|
+
window.classNames = classNames6;
|
|
118
118
|
}
|
|
119
119
|
})();
|
|
120
120
|
}
|
|
@@ -713,7 +713,7 @@ var translations = languages.reduce(
|
|
|
713
713
|
var i18n_default = translations;
|
|
714
714
|
|
|
715
715
|
// src/dynamicFlow/DynamicFlow.tsx
|
|
716
|
-
var
|
|
716
|
+
var import_react15 = require("react");
|
|
717
717
|
var import_react_intl13 = require("react-intl");
|
|
718
718
|
var import_dynamic_flow_client2 = require("@wise/dynamic-flow-client");
|
|
719
719
|
|
|
@@ -770,98 +770,11 @@ var AlertRenderer = {
|
|
|
770
770
|
};
|
|
771
771
|
var AlertRenderer_default = AlertRenderer;
|
|
772
772
|
|
|
773
|
-
//
|
|
774
|
-
var
|
|
775
|
-
|
|
776
|
-
// ../../node_modules/.pnpm/@radix-ui+react-use-layout-effect@1.0.1_@types+react@18.3.3_react@18.3.1/node_modules/@radix-ui/react-use-layout-effect/dist/index.mjs
|
|
777
|
-
var import_react2 = require("react");
|
|
778
|
-
var $9f79659886946c16$export$e5c5a5f917a5871c = Boolean(globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) ? import_react2.useLayoutEffect : () => {
|
|
779
|
-
};
|
|
780
|
-
|
|
781
|
-
// ../../node_modules/.pnpm/@radix-ui+react-id@1.0.1_@types+react@18.3.3_react@18.3.1/node_modules/@radix-ui/react-id/dist/index.mjs
|
|
782
|
-
var $1746a345f3d73bb7$var$useReactId = $2AODx$react["useId".toString()] || (() => void 0);
|
|
783
|
-
var $1746a345f3d73bb7$var$count = 0;
|
|
784
|
-
function $1746a345f3d73bb7$export$f680877a34711e37(deterministicId) {
|
|
785
|
-
const [id, setId] = $2AODx$react.useState($1746a345f3d73bb7$var$useReactId());
|
|
786
|
-
$9f79659886946c16$export$e5c5a5f917a5871c(() => {
|
|
787
|
-
if (!deterministicId)
|
|
788
|
-
setId(
|
|
789
|
-
(reactId) => reactId !== null && reactId !== void 0 ? reactId : String($1746a345f3d73bb7$var$count++)
|
|
790
|
-
);
|
|
791
|
-
}, [
|
|
792
|
-
deterministicId
|
|
793
|
-
]);
|
|
794
|
-
return deterministicId || (id ? `radix-${id}` : "");
|
|
795
|
-
}
|
|
796
|
-
|
|
797
|
-
// ../../node_modules/.pnpm/@wise+forms@0.3.4_@transferwise+components@46.37.0_@transferwise+icons@3.13.0_react@18.3.1__@_lhivqbosx5xdelixwbny3eajv4/node_modules/@wise/forms/dist/index.mjs
|
|
798
|
-
var import_components2 = require("@transferwise/components");
|
|
799
|
-
var import_classnames = __toESM(require_classnames(), 1);
|
|
800
|
-
var import_react3 = require("react");
|
|
801
|
-
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
802
|
-
var InputIdContext = /* @__PURE__ */ (0, import_react3.createContext)(void 0);
|
|
803
|
-
var InputIdContextProvider = InputIdContext.Provider;
|
|
804
|
-
var FormControlDescribedByContext = /* @__PURE__ */ (0, import_react3.createContext)(void 0);
|
|
805
|
-
var FormControlDescribedByProvider = FormControlDescribedByContext.Provider;
|
|
806
|
-
var FormControlInvalidContext = /* @__PURE__ */ (0, import_react3.createContext)(void 0);
|
|
807
|
-
var FormControlInvalidProvider = FormControlInvalidContext.Provider;
|
|
808
|
-
var Label = ({
|
|
809
|
-
id,
|
|
810
|
-
htmlFor,
|
|
811
|
-
className,
|
|
812
|
-
children
|
|
813
|
-
}) => {
|
|
814
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("label", {
|
|
815
|
-
id,
|
|
816
|
-
htmlFor,
|
|
817
|
-
className: (0, import_classnames.default)("control-label d-flex flex-column gap-y-1 m-b-0", className),
|
|
818
|
-
children
|
|
819
|
-
});
|
|
820
|
-
};
|
|
821
|
-
var Field = ({
|
|
822
|
-
id,
|
|
823
|
-
label,
|
|
824
|
-
hint,
|
|
825
|
-
error,
|
|
826
|
-
className,
|
|
827
|
-
children
|
|
828
|
-
}) => {
|
|
829
|
-
const hasError = Boolean(error);
|
|
830
|
-
const hasHint = Boolean(hint) && !hasError;
|
|
831
|
-
const fallbackInputId = $1746a345f3d73bb7$export$f680877a34711e37();
|
|
832
|
-
const inputId = id !== null ? id != null ? id : fallbackInputId : void 0;
|
|
833
|
-
const descriptionId = $1746a345f3d73bb7$export$f680877a34711e37();
|
|
834
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(InputIdContextProvider, {
|
|
835
|
-
value: inputId,
|
|
836
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(FormControlDescribedByProvider, {
|
|
837
|
-
value: hasError || hasHint ? descriptionId : void 0,
|
|
838
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(FormControlInvalidProvider, {
|
|
839
|
-
value: hasError,
|
|
840
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", {
|
|
841
|
-
className: (0, import_classnames.default)("form-group d-block", {
|
|
842
|
-
"has-error": hasError,
|
|
843
|
-
"has-info": hasHint
|
|
844
|
-
}, className),
|
|
845
|
-
children: [/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Label, {
|
|
846
|
-
htmlFor: inputId,
|
|
847
|
-
children: [label, children]
|
|
848
|
-
}), hasHint && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_components2.InlineAlert, {
|
|
849
|
-
type: import_components2.Sentiment.NEUTRAL,
|
|
850
|
-
id: descriptionId,
|
|
851
|
-
children: hint
|
|
852
|
-
}), hasError && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_components2.InlineAlert, {
|
|
853
|
-
type: import_components2.Sentiment.NEGATIVE,
|
|
854
|
-
id: descriptionId,
|
|
855
|
-
children: error
|
|
856
|
-
})]
|
|
857
|
-
})
|
|
858
|
-
})
|
|
859
|
-
})
|
|
860
|
-
});
|
|
861
|
-
};
|
|
773
|
+
// ../renderers/src/components/FieldInput.tsx
|
|
774
|
+
var import_components3 = require("@transferwise/components");
|
|
862
775
|
|
|
863
776
|
// ../renderers/src/components/Help.tsx
|
|
864
|
-
var
|
|
777
|
+
var import_components2 = require("@transferwise/components");
|
|
865
778
|
var import_react_intl2 = require("react-intl");
|
|
866
779
|
|
|
867
780
|
// ../renderers/src/messages/help.messages.ts
|
|
@@ -875,14 +788,14 @@ var help_messages_default = (0, import_react_intl.defineMessages)({
|
|
|
875
788
|
});
|
|
876
789
|
|
|
877
790
|
// ../renderers/src/components/Help.tsx
|
|
878
|
-
var
|
|
791
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
879
792
|
function Help({ help }) {
|
|
880
793
|
const intl = (0, import_react_intl2.useIntl)();
|
|
881
|
-
return /* @__PURE__ */ (0,
|
|
882
|
-
|
|
794
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
795
|
+
import_components2.Info,
|
|
883
796
|
{
|
|
884
797
|
className: "m-l-1",
|
|
885
|
-
content: /* @__PURE__ */ (0,
|
|
798
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_components2.Markdown, { config: { link: { target: "_blank" } }, children: help }),
|
|
886
799
|
presentation: "POPOVER",
|
|
887
800
|
size: "sm",
|
|
888
801
|
"aria-label": intl.formatMessage(help_messages_default.helpAria)
|
|
@@ -892,46 +805,46 @@ function Help({ help }) {
|
|
|
892
805
|
var Help_default = Help;
|
|
893
806
|
|
|
894
807
|
// ../renderers/src/components/LabelContentWithHelp.tsx
|
|
895
|
-
var
|
|
808
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
896
809
|
function LabelContentWithHelp({ text, help }) {
|
|
897
|
-
return /* @__PURE__ */ (0,
|
|
810
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
|
|
898
811
|
text,
|
|
899
|
-
/* @__PURE__ */ (0,
|
|
812
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Help_default, { help })
|
|
900
813
|
] });
|
|
901
814
|
}
|
|
902
815
|
|
|
903
816
|
// ../renderers/src/components/FieldInput.tsx
|
|
904
|
-
var
|
|
817
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
905
818
|
function FieldInput({ id, children, label, error, description, help }) {
|
|
906
|
-
const labelContent = label && help ? /* @__PURE__ */ (0,
|
|
907
|
-
return /* @__PURE__ */ (0,
|
|
819
|
+
const labelContent = label && help ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(LabelContentWithHelp, { text: label, help }) : label;
|
|
820
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_components3.Field, { id, label: labelContent, hint: description, error, children });
|
|
908
821
|
}
|
|
909
822
|
var FieldInput_default = FieldInput;
|
|
910
823
|
|
|
911
824
|
// ../renderers/src/BooleanInputRenderer.tsx
|
|
912
825
|
var import_components4 = require("@transferwise/components");
|
|
913
|
-
var
|
|
826
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
914
827
|
var BooleanInputRenderer = {
|
|
915
828
|
canRenderType: "input-boolean",
|
|
916
829
|
render: (props) => {
|
|
917
830
|
const _a = props, { id, control, label = "", description, help, error, type, value } = _a, rest = __objRest(_a, ["id", "control", "label", "description", "help", "error", "type", "value"]);
|
|
918
831
|
const checkboxProps = __spreadProps(__spreadValues({}, rest), { label, secondary: description, checked: value });
|
|
919
|
-
return /* @__PURE__ */ (0,
|
|
832
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FieldInput_default, { id, label: "", description: "", error, help, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_components4.Checkbox, __spreadValues({ id }, checkboxProps)) });
|
|
920
833
|
}
|
|
921
834
|
};
|
|
922
835
|
var BooleanInputRenderer_default = BooleanInputRenderer;
|
|
923
836
|
|
|
924
837
|
// ../renderers/src/BoxRenderer.tsx
|
|
925
|
-
var
|
|
926
|
-
var
|
|
838
|
+
var import_classnames = __toESM(require_classnames());
|
|
839
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
927
840
|
var BoxRenderer = {
|
|
928
841
|
canRenderType: "box",
|
|
929
842
|
render: ({ border, children, margin, width }) => {
|
|
930
843
|
const hasFixedWidth = width !== "xl";
|
|
931
|
-
const contents = /* @__PURE__ */ (0,
|
|
844
|
+
const contents = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
932
845
|
"div",
|
|
933
846
|
{
|
|
934
|
-
className: (0,
|
|
847
|
+
className: (0, import_classnames.default)({
|
|
935
848
|
"df-box-renderer-border": border,
|
|
936
849
|
[`df-box-renderer-width-${width}`]: hasFixedWidth,
|
|
937
850
|
[getMargin(margin)]: !hasFixedWidth
|
|
@@ -939,7 +852,7 @@ var BoxRenderer = {
|
|
|
939
852
|
children
|
|
940
853
|
}
|
|
941
854
|
);
|
|
942
|
-
return hasFixedWidth ? /* @__PURE__ */ (0,
|
|
855
|
+
return hasFixedWidth ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: (0, import_classnames.default)("df-box-renderer-fixed-width", getMargin(margin)), children: contents }) : contents;
|
|
943
856
|
}
|
|
944
857
|
};
|
|
945
858
|
var BoxRenderer_default = BoxRenderer;
|
|
@@ -948,21 +861,21 @@ var BoxRenderer_default = BoxRenderer;
|
|
|
948
861
|
var import_components5 = require("@transferwise/components");
|
|
949
862
|
|
|
950
863
|
// ../renderers/src/step/StepRendererContext.tsx
|
|
951
|
-
var
|
|
952
|
-
var StepRendererContext = (0,
|
|
864
|
+
var import_react2 = require("react");
|
|
865
|
+
var StepRendererContext = (0, import_react2.createContext)({ loadingState: "idle", trackEvent: () => {
|
|
953
866
|
} });
|
|
954
867
|
var StepRendererContextProvider = StepRendererContext.Provider;
|
|
955
868
|
var useLoadingContext = () => {
|
|
956
|
-
const { loadingState } = (0,
|
|
869
|
+
const { loadingState } = (0, import_react2.useContext)(StepRendererContext);
|
|
957
870
|
return { loadingState, isLoading: loadingState !== "idle" };
|
|
958
871
|
};
|
|
959
872
|
var useTrackEvent = () => {
|
|
960
|
-
const { trackEvent } = (0,
|
|
873
|
+
const { trackEvent } = (0, import_react2.useContext)(StepRendererContext);
|
|
961
874
|
return trackEvent;
|
|
962
875
|
};
|
|
963
876
|
|
|
964
877
|
// ../renderers/src/ButtonRenderer.tsx
|
|
965
|
-
var
|
|
878
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
966
879
|
var ButtonRenderer = {
|
|
967
880
|
canRenderType: "button",
|
|
968
881
|
render: ButtonRendererComponent
|
|
@@ -980,7 +893,7 @@ function ButtonRendererComponent({
|
|
|
980
893
|
const priority = mapControl(control);
|
|
981
894
|
const type = priority === "tertiary" ? void 0 : mapContext(context);
|
|
982
895
|
const { isLoading } = useLoadingContext();
|
|
983
|
-
return /* @__PURE__ */ (0,
|
|
896
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
984
897
|
import_components5.Button,
|
|
985
898
|
{
|
|
986
899
|
block: true,
|
|
@@ -1031,20 +944,20 @@ var mapSize = (size) => {
|
|
|
1031
944
|
var ButtonRenderer_default = ButtonRenderer;
|
|
1032
945
|
|
|
1033
946
|
// ../renderers/src/ColumnsRenderer.tsx
|
|
1034
|
-
var
|
|
1035
|
-
var
|
|
947
|
+
var import_classnames2 = __toESM(require_classnames());
|
|
948
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
1036
949
|
var ColumnsRenderer = {
|
|
1037
950
|
canRenderType: "columns",
|
|
1038
|
-
render: ({ bias, margin, startChildren, endChildren }) => /* @__PURE__ */ (0,
|
|
951
|
+
render: ({ bias, margin, startChildren, endChildren }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
1039
952
|
"div",
|
|
1040
953
|
{
|
|
1041
|
-
className: (0,
|
|
954
|
+
className: (0, import_classnames2.default)("df-columns-renderer-container", getMargin(margin), {
|
|
1042
955
|
"df-columns-renderer-bias-start": bias === "start",
|
|
1043
956
|
"df-columns-renderer-bias-end": bias === "end"
|
|
1044
957
|
}),
|
|
1045
958
|
children: [
|
|
1046
|
-
/* @__PURE__ */ (0,
|
|
1047
|
-
/* @__PURE__ */ (0,
|
|
959
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "df-columns-renderer-column", children: startChildren }),
|
|
960
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "df-columns-renderer-column", children: endChildren })
|
|
1048
961
|
]
|
|
1049
962
|
}
|
|
1050
963
|
)
|
|
@@ -1083,7 +996,7 @@ var dateToDateString = (date) => {
|
|
|
1083
996
|
};
|
|
1084
997
|
|
|
1085
998
|
// ../renderers/src/components/VariableDateInput.tsx
|
|
1086
|
-
var
|
|
999
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
1087
1000
|
function VariableDateInput({
|
|
1088
1001
|
control,
|
|
1089
1002
|
inputProps
|
|
@@ -1099,7 +1012,7 @@ function VariableDateInput({
|
|
|
1099
1012
|
onFocus
|
|
1100
1013
|
} = inputProps;
|
|
1101
1014
|
if (control === "date-lookup") {
|
|
1102
|
-
return /* @__PURE__ */ (0,
|
|
1015
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1103
1016
|
import_components6.DateLookup,
|
|
1104
1017
|
{
|
|
1105
1018
|
value: dateStringToDateOrNull(inputProps.value),
|
|
@@ -1115,7 +1028,7 @@ function VariableDateInput({
|
|
|
1115
1028
|
}
|
|
1116
1029
|
);
|
|
1117
1030
|
}
|
|
1118
|
-
return /* @__PURE__ */ (0,
|
|
1031
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
1119
1032
|
import_components6.DateInput,
|
|
1120
1033
|
__spreadProps(__spreadValues({}, inputProps), {
|
|
1121
1034
|
dayAutoComplete: getAutocompleteString(autoComplete, "day"),
|
|
@@ -1132,7 +1045,7 @@ var getAutocompleteString = (value, suffix) => {
|
|
|
1132
1045
|
var VariableDateInput_default = VariableDateInput;
|
|
1133
1046
|
|
|
1134
1047
|
// ../renderers/src/DateInputRenderer.tsx
|
|
1135
|
-
var
|
|
1048
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1136
1049
|
var DateInputRenderer = {
|
|
1137
1050
|
canRenderType: "input-date",
|
|
1138
1051
|
render: (props) => {
|
|
@@ -1157,7 +1070,7 @@ var DateInputRenderer = {
|
|
|
1157
1070
|
]);
|
|
1158
1071
|
const value = initialValue != null ? initialValue : "";
|
|
1159
1072
|
const inputProps = __spreadProps(__spreadValues({}, rest), { value, id });
|
|
1160
|
-
return /* @__PURE__ */ (0,
|
|
1073
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(FieldInput_default, { id, label, description, error, help, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(VariableDateInput_default, { control, inputProps }) });
|
|
1161
1074
|
}
|
|
1162
1075
|
};
|
|
1163
1076
|
var DateInputRenderer_default = DateInputRenderer;
|
|
@@ -1166,20 +1079,20 @@ var DateInputRenderer_default = DateInputRenderer;
|
|
|
1166
1079
|
var import_components8 = require("@transferwise/components");
|
|
1167
1080
|
|
|
1168
1081
|
// ../../node_modules/.pnpm/@wise+art@2.7.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index.esm.js
|
|
1169
|
-
var
|
|
1170
|
-
var
|
|
1082
|
+
var import_react3 = require("react");
|
|
1083
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
1171
1084
|
var unknownFlagName = "wise";
|
|
1172
1085
|
var Flag = ({
|
|
1173
1086
|
code,
|
|
1174
1087
|
intrinsicSize = 64
|
|
1175
1088
|
}) => {
|
|
1176
|
-
const [fallback, setFallback] = (0,
|
|
1177
|
-
(0,
|
|
1089
|
+
const [fallback, setFallback] = (0, import_react3.useState)(null);
|
|
1090
|
+
(0, import_react3.useEffect)(() => {
|
|
1178
1091
|
setFallback(null);
|
|
1179
1092
|
}, [code]);
|
|
1180
1093
|
const detailed = intrinsicSize >= 150;
|
|
1181
1094
|
const name = fallback !== "unknown" ? `${code.toLowerCase()}${fallback == null && detailed ? "-detailed" : ""}` : unknownFlagName;
|
|
1182
|
-
return /* @__PURE__ */ (0,
|
|
1095
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("img", {
|
|
1183
1096
|
src: `https://wise.com/web-art/assets/flags/${name}.svg`,
|
|
1184
1097
|
alt: "",
|
|
1185
1098
|
width: intrinsicSize,
|
|
@@ -1270,19 +1183,19 @@ var Assets;
|
|
|
1270
1183
|
})(Assets || (Assets = {}));
|
|
1271
1184
|
|
|
1272
1185
|
// ../renderers/src/components/icon/FlagIcon.tsx
|
|
1273
|
-
var
|
|
1186
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
1274
1187
|
var isFlagIcon = (name) => name.startsWith("flag-");
|
|
1275
1188
|
function FlagIcon({ name }) {
|
|
1276
1189
|
if (!isFlagIcon(name)) {
|
|
1277
1190
|
return null;
|
|
1278
1191
|
}
|
|
1279
1192
|
const code = name.substring(5);
|
|
1280
|
-
return /* @__PURE__ */ (0,
|
|
1193
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Flag, { code });
|
|
1281
1194
|
}
|
|
1282
1195
|
|
|
1283
1196
|
// ../renderers/src/components/icon/NamedIcon.tsx
|
|
1284
1197
|
var icons = __toESM(require("@transferwise/icons"));
|
|
1285
|
-
var
|
|
1198
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
1286
1199
|
var isNamedIcon = (name) => {
|
|
1287
1200
|
const iconName = toCapitalisedCamelCase(name);
|
|
1288
1201
|
return Object.keys(icons).includes(iconName);
|
|
@@ -1293,19 +1206,19 @@ function NamedIcon({ name }) {
|
|
|
1293
1206
|
}
|
|
1294
1207
|
const iconName = toCapitalisedCamelCase(name);
|
|
1295
1208
|
const Icon = icons[iconName];
|
|
1296
|
-
return /* @__PURE__ */ (0,
|
|
1209
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Icon, { size: 24 });
|
|
1297
1210
|
}
|
|
1298
1211
|
var toCapitalisedCamelCase = (value) => value.split("-").map(capitaliseFirstChar).join("");
|
|
1299
1212
|
var capitaliseFirstChar = (value) => `${value[0].toUpperCase()}${value.slice(1)}`;
|
|
1300
1213
|
|
|
1301
1214
|
// ../renderers/src/components/icon/DynamicIcon.tsx
|
|
1302
|
-
var
|
|
1215
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
1303
1216
|
function DynamicIcon({ name }) {
|
|
1304
1217
|
if (isFlagIcon(name)) {
|
|
1305
|
-
return /* @__PURE__ */ (0,
|
|
1218
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FlagIcon, { name });
|
|
1306
1219
|
}
|
|
1307
1220
|
if (isNamedIcon(name)) {
|
|
1308
|
-
return /* @__PURE__ */ (0,
|
|
1221
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(NamedIcon, { name });
|
|
1309
1222
|
}
|
|
1310
1223
|
return null;
|
|
1311
1224
|
}
|
|
@@ -1313,25 +1226,25 @@ var DynamicIcon_default = DynamicIcon;
|
|
|
1313
1226
|
|
|
1314
1227
|
// ../renderers/src/components/icon/NavigationOptionMedia.tsx
|
|
1315
1228
|
var import_components7 = require("@transferwise/components");
|
|
1316
|
-
var
|
|
1229
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
1317
1230
|
function NavigationOptionMedia({ icon, image }) {
|
|
1318
1231
|
if (!isNullish(icon)) {
|
|
1319
1232
|
if ("name" in icon) {
|
|
1320
|
-
return /* @__PURE__ */ (0,
|
|
1233
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_components7.Avatar, { type: import_components7.AvatarType.ICON, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DynamicIcon_default, { name: icon.name }) });
|
|
1321
1234
|
}
|
|
1322
1235
|
if (icon.text) {
|
|
1323
|
-
return /* @__PURE__ */ (0,
|
|
1236
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_components7.Avatar, { type: import_components7.AvatarType.INITIALS, children: icon.text });
|
|
1324
1237
|
}
|
|
1325
1238
|
}
|
|
1326
1239
|
if (image == null ? void 0 : image.url) {
|
|
1327
1240
|
const { url, accessibilityDescription } = image;
|
|
1328
|
-
return /* @__PURE__ */ (0,
|
|
1241
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("img", { src: url, alt: accessibilityDescription });
|
|
1329
1242
|
}
|
|
1330
1243
|
return null;
|
|
1331
1244
|
}
|
|
1332
1245
|
|
|
1333
1246
|
// ../renderers/src/DecisionRenderer.tsx
|
|
1334
|
-
var
|
|
1247
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
1335
1248
|
var DecisionRenderer = {
|
|
1336
1249
|
canRenderType: "decision",
|
|
1337
1250
|
render: DecisionRendererComponent
|
|
@@ -1339,13 +1252,13 @@ var DecisionRenderer = {
|
|
|
1339
1252
|
var DecisionRenderer_default = DecisionRenderer;
|
|
1340
1253
|
function DecisionRendererComponent({ margin, options }) {
|
|
1341
1254
|
const { isLoading } = useLoadingContext();
|
|
1342
|
-
return /* @__PURE__ */ (0,
|
|
1255
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_components8.NavigationOptionsList, { children: options.map(({ description, disabled, icon, image, title, onClick }) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1343
1256
|
import_components8.NavigationOption,
|
|
1344
1257
|
{
|
|
1345
1258
|
title,
|
|
1346
1259
|
content: description,
|
|
1347
1260
|
disabled: isLoading || disabled,
|
|
1348
|
-
media: /* @__PURE__ */ (0,
|
|
1261
|
+
media: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(NavigationOptionMedia, { icon, image }),
|
|
1349
1262
|
showMediaCircle: false,
|
|
1350
1263
|
showMediaAtAllSizes: true,
|
|
1351
1264
|
onClick
|
|
@@ -1355,36 +1268,36 @@ function DecisionRendererComponent({ margin, options }) {
|
|
|
1355
1268
|
}
|
|
1356
1269
|
|
|
1357
1270
|
// ../renderers/src/DividerRenderer.tsx
|
|
1358
|
-
var
|
|
1271
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1359
1272
|
var DividerRenderer = {
|
|
1360
1273
|
canRenderType: "divider",
|
|
1361
|
-
render: ({ margin }) => /* @__PURE__ */ (0,
|
|
1274
|
+
render: ({ margin }) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("hr", { className: `m-t-0 ${getMargin(margin)}` })
|
|
1362
1275
|
};
|
|
1363
1276
|
var DividerRenderer_default = DividerRenderer;
|
|
1364
1277
|
|
|
1365
1278
|
// ../renderers/src/FormRenderer.tsx
|
|
1366
|
-
var
|
|
1279
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1367
1280
|
var FormRenderer = {
|
|
1368
1281
|
canRenderType: "form",
|
|
1369
|
-
render: ({ children, margin }) => /* @__PURE__ */ (0,
|
|
1282
|
+
render: ({ children, margin }) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: getMargin(margin), children })
|
|
1370
1283
|
};
|
|
1371
1284
|
var FormRenderer_default = FormRenderer;
|
|
1372
1285
|
|
|
1373
1286
|
// ../renderers/src/FormSectionRenderer.tsx
|
|
1374
1287
|
var import_components9 = require("@transferwise/components");
|
|
1375
|
-
var
|
|
1288
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
1376
1289
|
var FormSectionRenderer = {
|
|
1377
1290
|
canRenderType: "form-section",
|
|
1378
|
-
render: ({ title, description, children }) => /* @__PURE__ */ (0,
|
|
1291
|
+
render: ({ title, description, children }) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("fieldset", { children: [
|
|
1379
1292
|
title && // TODO - once section headers support help, we could show help in here
|
|
1380
|
-
/* @__PURE__ */ (0,
|
|
1293
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
1381
1294
|
import_components9.Header,
|
|
1382
1295
|
{
|
|
1383
1296
|
as: "h2",
|
|
1384
1297
|
title
|
|
1385
1298
|
}
|
|
1386
1299
|
),
|
|
1387
|
-
description && /* @__PURE__ */ (0,
|
|
1300
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { children: description }),
|
|
1388
1301
|
children
|
|
1389
1302
|
] })
|
|
1390
1303
|
};
|
|
@@ -1392,32 +1305,32 @@ var FormSectionRenderer_default = FormSectionRenderer;
|
|
|
1392
1305
|
|
|
1393
1306
|
// ../renderers/src/HeadingRenderer.tsx
|
|
1394
1307
|
var import_components10 = require("@transferwise/components");
|
|
1395
|
-
var
|
|
1308
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
1396
1309
|
var HeadingRenderer = {
|
|
1397
1310
|
canRenderType: "heading",
|
|
1398
|
-
render: (props) => /* @__PURE__ */ (0,
|
|
1311
|
+
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Heading, __spreadValues({}, props))
|
|
1399
1312
|
};
|
|
1400
1313
|
function Heading(props) {
|
|
1401
1314
|
const { text, size, align, margin, control } = props;
|
|
1402
1315
|
const className = getTextAlignmentAndMargin({ align, margin });
|
|
1403
|
-
return control === "display" ? /* @__PURE__ */ (0,
|
|
1316
|
+
return control === "display" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DisplayHeading, { size, text, className }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(StandardHeading, { size, text, className });
|
|
1404
1317
|
}
|
|
1405
1318
|
function DisplayHeading({ size, text, className }) {
|
|
1406
|
-
return /* @__PURE__ */ (0,
|
|
1319
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_components10.Display, { type: getDisplayType(size), className, children: text });
|
|
1407
1320
|
}
|
|
1408
1321
|
function StandardHeading({ size, text, className }) {
|
|
1409
1322
|
switch (size) {
|
|
1410
1323
|
case "xs":
|
|
1411
|
-
return /* @__PURE__ */ (0,
|
|
1324
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h5", { className, children: text });
|
|
1412
1325
|
case "sm":
|
|
1413
|
-
return /* @__PURE__ */ (0,
|
|
1326
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h4", { className, children: text });
|
|
1414
1327
|
case "lg":
|
|
1415
|
-
return /* @__PURE__ */ (0,
|
|
1328
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h2", { className, children: text });
|
|
1416
1329
|
case "xl":
|
|
1417
|
-
return /* @__PURE__ */ (0,
|
|
1330
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h1", { className, children: text });
|
|
1418
1331
|
case "md":
|
|
1419
1332
|
default:
|
|
1420
|
-
return /* @__PURE__ */ (0,
|
|
1333
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h3", { className, children: text });
|
|
1421
1334
|
}
|
|
1422
1335
|
}
|
|
1423
1336
|
var getDisplayType = (size) => {
|
|
@@ -1437,7 +1350,7 @@ var HeadingRenderer_default = HeadingRenderer;
|
|
|
1437
1350
|
|
|
1438
1351
|
// ../renderers/src/ImageRenderer.tsx
|
|
1439
1352
|
var import_components11 = require("@transferwise/components");
|
|
1440
|
-
var
|
|
1353
|
+
var import_react4 = require("react");
|
|
1441
1354
|
|
|
1442
1355
|
// ../renderers/src/utils/api-utils.ts
|
|
1443
1356
|
function isRelativePath(url = "") {
|
|
@@ -1447,10 +1360,10 @@ function isRelativePath(url = "") {
|
|
|
1447
1360
|
}
|
|
1448
1361
|
|
|
1449
1362
|
// ../renderers/src/ImageRenderer.tsx
|
|
1450
|
-
var
|
|
1363
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
1451
1364
|
var ImageRenderer = {
|
|
1452
1365
|
canRenderType: "image",
|
|
1453
|
-
render: (props) => /* @__PURE__ */ (0,
|
|
1366
|
+
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ImageRendererComponent, __spreadValues({}, props))
|
|
1454
1367
|
};
|
|
1455
1368
|
var ImageRenderer_default = ImageRenderer;
|
|
1456
1369
|
function ImageRendererComponent({
|
|
@@ -1459,12 +1372,12 @@ function ImageRendererComponent({
|
|
|
1459
1372
|
size,
|
|
1460
1373
|
url
|
|
1461
1374
|
}) {
|
|
1462
|
-
const [imageSource, setImageSource] = (0,
|
|
1375
|
+
const [imageSource, setImageSource] = (0, import_react4.useState)("");
|
|
1463
1376
|
const httpClient = useRendererHttpClient();
|
|
1464
|
-
(0,
|
|
1377
|
+
(0, import_react4.useEffect)(() => {
|
|
1465
1378
|
void getImageSource(httpClient, url).then(setImageSource);
|
|
1466
1379
|
}, [url, httpClient]);
|
|
1467
|
-
return /* @__PURE__ */ (0,
|
|
1380
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: `df-image ${size || "md"}`, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1468
1381
|
import_components11.Image,
|
|
1469
1382
|
{
|
|
1470
1383
|
className: `img-responsive ${getMargin(margin)}`,
|
|
@@ -1509,7 +1422,7 @@ var getImageSource = async (httpClient, imageUrl) => {
|
|
|
1509
1422
|
|
|
1510
1423
|
// ../renderers/src/InstructionsRenderer.tsx
|
|
1511
1424
|
var import_components12 = require("@transferwise/components");
|
|
1512
|
-
var
|
|
1425
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1513
1426
|
var doContext = ["positive", "neutral"];
|
|
1514
1427
|
var dontContext = ["warning", "negative"];
|
|
1515
1428
|
var InstructionsRenderer = {
|
|
@@ -1517,9 +1430,9 @@ var InstructionsRenderer = {
|
|
|
1517
1430
|
render: ({ items, margin, title }) => {
|
|
1518
1431
|
const dos = items.filter((item) => doContext.includes(item.context)).map(({ text }) => text);
|
|
1519
1432
|
const donts = items.filter((item) => dontContext.includes(item.context)).map(({ text }) => text);
|
|
1520
|
-
return /* @__PURE__ */ (0,
|
|
1521
|
-
title ? /* @__PURE__ */ (0,
|
|
1522
|
-
/* @__PURE__ */ (0,
|
|
1433
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: getMargin(margin), children: [
|
|
1434
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_components12.Header, { title }) : null,
|
|
1435
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_components12.InstructionsList, { dos, donts })
|
|
1523
1436
|
] });
|
|
1524
1437
|
}
|
|
1525
1438
|
};
|
|
@@ -1536,12 +1449,12 @@ var onWheel = (event) => {
|
|
|
1536
1449
|
};
|
|
1537
1450
|
|
|
1538
1451
|
// ../renderers/src/IntegerInputRenderer.tsx
|
|
1539
|
-
var
|
|
1452
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1540
1453
|
var IntegerInputRenderer = {
|
|
1541
1454
|
canRenderType: "input-integer",
|
|
1542
1455
|
render: (props) => {
|
|
1543
1456
|
const _a = props, { id, label, error, description, help, type, value, onChange } = _a, rest = __objRest(_a, ["id", "label", "error", "description", "help", "type", "value", "onChange"]);
|
|
1544
|
-
return /* @__PURE__ */ (0,
|
|
1457
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FieldInput_default, { id, label, description, error, help, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1545
1458
|
import_components13.Input,
|
|
1546
1459
|
__spreadValues({
|
|
1547
1460
|
id,
|
|
@@ -1563,10 +1476,10 @@ var IntegerInputRenderer_default = IntegerInputRenderer;
|
|
|
1563
1476
|
|
|
1564
1477
|
// ../renderers/src/LoadingIndicatorRenderer.tsx
|
|
1565
1478
|
var import_components14 = require("@transferwise/components");
|
|
1566
|
-
var
|
|
1479
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1567
1480
|
var LoadingIndicatorRenderer = {
|
|
1568
1481
|
canRenderType: "loading-indicator",
|
|
1569
|
-
render: ({ margin, size }) => /* @__PURE__ */ (0,
|
|
1482
|
+
render: ({ margin, size }) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1570
1483
|
import_components14.Loader,
|
|
1571
1484
|
{
|
|
1572
1485
|
size,
|
|
@@ -1579,27 +1492,27 @@ var LoadingIndicatorRenderer_default = LoadingIndicatorRenderer;
|
|
|
1579
1492
|
|
|
1580
1493
|
// ../renderers/src/MarkdownRenderer.tsx
|
|
1581
1494
|
var import_components15 = require("@transferwise/components");
|
|
1582
|
-
var
|
|
1495
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1583
1496
|
var MarkdownRenderer = {
|
|
1584
1497
|
canRenderType: "markdown",
|
|
1585
|
-
render: ({ content, align, margin }) => /* @__PURE__ */ (0,
|
|
1498
|
+
render: ({ content, align, margin }) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: getTextAlignmentAndMargin({ align, margin }), children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_components15.Markdown, { config: { link: { target: "_blank" } }, children: content }) })
|
|
1586
1499
|
};
|
|
1587
1500
|
var MarkdownRenderer_default = MarkdownRenderer;
|
|
1588
1501
|
|
|
1589
1502
|
// ../renderers/src/ModalRenderer.tsx
|
|
1590
1503
|
var import_components16 = require("@transferwise/components");
|
|
1591
|
-
var
|
|
1592
|
-
var
|
|
1504
|
+
var import_react5 = require("react");
|
|
1505
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1593
1506
|
var ModalRenderer = {
|
|
1594
1507
|
canRenderType: "modal",
|
|
1595
|
-
render: (props) => /* @__PURE__ */ (0,
|
|
1508
|
+
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DFModal, __spreadValues({}, props))
|
|
1596
1509
|
};
|
|
1597
1510
|
var ModalRenderer_default = ModalRenderer;
|
|
1598
1511
|
function DFModal({ content, margin, trigger }) {
|
|
1599
|
-
const [visible, setVisible] = (0,
|
|
1600
|
-
return /* @__PURE__ */ (0,
|
|
1601
|
-
/* @__PURE__ */ (0,
|
|
1602
|
-
/* @__PURE__ */ (0,
|
|
1512
|
+
const [visible, setVisible] = (0, import_react5.useState)(false);
|
|
1513
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: getMargin(margin), children: [
|
|
1514
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_components16.Button, { priority: "tertiary", block: true, onClick: () => setVisible(true), children: trigger.title }),
|
|
1515
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1603
1516
|
import_components16.Modal,
|
|
1604
1517
|
{
|
|
1605
1518
|
scroll: "content",
|
|
@@ -1617,16 +1530,16 @@ var import_components18 = require("@transferwise/components");
|
|
|
1617
1530
|
|
|
1618
1531
|
// ../renderers/src/SelectInputRenderer/OptionMedia.tsx
|
|
1619
1532
|
var import_components17 = require("@transferwise/components");
|
|
1620
|
-
var
|
|
1533
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1621
1534
|
function OptionMedia({ icon, image }) {
|
|
1622
1535
|
if (image == null ? void 0 : image.url) {
|
|
1623
|
-
return /* @__PURE__ */ (0,
|
|
1536
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("img", { src: image.url, alt: image.accessibilityDescription || "", width: "64px" });
|
|
1624
1537
|
}
|
|
1625
1538
|
if (icon && "name" in icon) {
|
|
1626
|
-
return /* @__PURE__ */ (0,
|
|
1539
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_components17.Avatar, { type: import_components17.AvatarType.ICON, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DynamicIcon_default, { name: icon.name }) });
|
|
1627
1540
|
}
|
|
1628
1541
|
if (icon && "text" in icon) {
|
|
1629
|
-
return /* @__PURE__ */ (0,
|
|
1542
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_components17.Avatar, { type: import_components17.AvatarType.INITIALS, children: icon.text });
|
|
1630
1543
|
}
|
|
1631
1544
|
return null;
|
|
1632
1545
|
}
|
|
@@ -1645,15 +1558,15 @@ var multi_select_messages_default = (0, import_react_intl3.defineMessages)({
|
|
|
1645
1558
|
});
|
|
1646
1559
|
|
|
1647
1560
|
// ../renderers/src/MultiSelectInputRenderer.tsx
|
|
1648
|
-
var
|
|
1649
|
-
var
|
|
1561
|
+
var import_react6 = require("react");
|
|
1562
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1650
1563
|
var MultiSelectInputRenderer = {
|
|
1651
1564
|
canRenderType: "input-multi-select",
|
|
1652
|
-
render: (props) => /* @__PURE__ */ (0,
|
|
1565
|
+
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(MultiSelectInputRendererComponent, __spreadValues({}, props))
|
|
1653
1566
|
};
|
|
1654
1567
|
function MultiSelectInputRendererComponent(props) {
|
|
1655
1568
|
const { formatMessage } = (0, import_react_intl4.useIntl)();
|
|
1656
|
-
const [stagedIndices, setStagedIndices] = (0,
|
|
1569
|
+
const [stagedIndices, setStagedIndices] = (0, import_react6.useState)();
|
|
1657
1570
|
const {
|
|
1658
1571
|
id,
|
|
1659
1572
|
description,
|
|
@@ -1690,11 +1603,11 @@ function MultiSelectInputRendererComponent(props) {
|
|
|
1690
1603
|
const contentProps = {
|
|
1691
1604
|
title: option.title,
|
|
1692
1605
|
description: option.description,
|
|
1693
|
-
icon: /* @__PURE__ */ (0,
|
|
1606
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(OptionMedia, { icon: option.icon, image: option.image })
|
|
1694
1607
|
};
|
|
1695
|
-
return /* @__PURE__ */ (0,
|
|
1608
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_components18.SelectInputOptionContent, __spreadValues({}, contentProps));
|
|
1696
1609
|
};
|
|
1697
|
-
return /* @__PURE__ */ (0,
|
|
1610
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(FieldInput_default, { id, label, help, description, error, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1698
1611
|
import_components18.SelectInput,
|
|
1699
1612
|
{
|
|
1700
1613
|
id,
|
|
@@ -1735,8 +1648,8 @@ var import_components20 = require("@transferwise/components");
|
|
|
1735
1648
|
|
|
1736
1649
|
// ../renderers/src/components/UploadFieldInput.tsx
|
|
1737
1650
|
var import_components19 = require("@transferwise/components");
|
|
1738
|
-
var
|
|
1739
|
-
var
|
|
1651
|
+
var import_classnames3 = __toESM(require_classnames());
|
|
1652
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1740
1653
|
function UploadFieldInput({
|
|
1741
1654
|
id,
|
|
1742
1655
|
children,
|
|
@@ -1745,18 +1658,18 @@ function UploadFieldInput({
|
|
|
1745
1658
|
error,
|
|
1746
1659
|
help
|
|
1747
1660
|
}) {
|
|
1748
|
-
const labelContent = label && help ? /* @__PURE__ */ (0,
|
|
1661
|
+
const labelContent = label && help ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(LabelContentWithHelp, { text: label, help }) : label;
|
|
1749
1662
|
const descriptionId = description ? `${id}-description` : void 0;
|
|
1750
|
-
return /* @__PURE__ */ (0,
|
|
1663
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
1751
1664
|
"div",
|
|
1752
1665
|
{
|
|
1753
|
-
className: (0,
|
|
1666
|
+
className: (0, import_classnames3.default)("form-group d-block", {
|
|
1754
1667
|
"has-error": !!error
|
|
1755
1668
|
}),
|
|
1756
1669
|
children: [
|
|
1757
|
-
/* @__PURE__ */ (0,
|
|
1670
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("label", { htmlFor: id, className: "control-label", children: labelContent }),
|
|
1758
1671
|
children,
|
|
1759
|
-
error && /* @__PURE__ */ (0,
|
|
1672
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_components19.InlineAlert, { type: "negative", id: descriptionId, children: error })
|
|
1760
1673
|
]
|
|
1761
1674
|
}
|
|
1762
1675
|
);
|
|
@@ -1788,7 +1701,7 @@ var getFileType = (base64Url) => {
|
|
|
1788
1701
|
var getRandomId = () => Math.random().toString(36).substring(2);
|
|
1789
1702
|
|
|
1790
1703
|
// ../renderers/src/MultiUploadInputRenderer.tsx
|
|
1791
|
-
var
|
|
1704
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1792
1705
|
var MultiUploadInputRenderer = {
|
|
1793
1706
|
canRenderType: "input-upload-multi",
|
|
1794
1707
|
render: (props) => {
|
|
@@ -1815,7 +1728,7 @@ var MultiUploadInputRenderer = {
|
|
|
1815
1728
|
};
|
|
1816
1729
|
const onDeleteFile = async (fileId) => onDelete(String(fileId));
|
|
1817
1730
|
const descriptionId = description ? `${id}-description` : void 0;
|
|
1818
|
-
return /* @__PURE__ */ (0,
|
|
1731
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(UploadFieldInput_default, { id, label, description, error, help, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1819
1732
|
import_components20.UploadInput,
|
|
1820
1733
|
{
|
|
1821
1734
|
id,
|
|
@@ -1838,12 +1751,12 @@ var MultiUploadInputRenderer_default = MultiUploadInputRenderer;
|
|
|
1838
1751
|
|
|
1839
1752
|
// ../renderers/src/NumberInputRenderer.tsx
|
|
1840
1753
|
var import_components21 = require("@transferwise/components");
|
|
1841
|
-
var
|
|
1754
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1842
1755
|
var NumberInputRenderer = {
|
|
1843
1756
|
canRenderType: "input-number",
|
|
1844
1757
|
render: (props) => {
|
|
1845
1758
|
const _a = props, { id, label, error, description, help, type, value, onChange } = _a, rest = __objRest(_a, ["id", "label", "error", "description", "help", "type", "value", "onChange"]);
|
|
1846
|
-
return /* @__PURE__ */ (0,
|
|
1759
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(FieldInput_default, { id, label, description, error, help, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1847
1760
|
import_components21.Input,
|
|
1848
1761
|
__spreadValues({
|
|
1849
1762
|
id,
|
|
@@ -1866,16 +1779,16 @@ var import_react_intl6 = require("react-intl");
|
|
|
1866
1779
|
|
|
1867
1780
|
// ../renderers/src/hooks/useSnackBarIfAvailable.ts
|
|
1868
1781
|
var import_components22 = require("@transferwise/components");
|
|
1869
|
-
var
|
|
1782
|
+
var import_react7 = require("react");
|
|
1870
1783
|
function useSnackBarIfAvailable() {
|
|
1871
|
-
const context = (0,
|
|
1784
|
+
const context = (0, import_react7.useContext)(import_components22.SnackbarContext);
|
|
1872
1785
|
return context ? context.createSnackbar : () => {
|
|
1873
1786
|
};
|
|
1874
1787
|
}
|
|
1875
1788
|
|
|
1876
1789
|
// ../renderers/src/ParagraphRenderer.tsx
|
|
1877
1790
|
var import_components23 = require("@transferwise/components");
|
|
1878
|
-
var
|
|
1791
|
+
var import_classnames4 = __toESM(require_classnames());
|
|
1879
1792
|
|
|
1880
1793
|
// ../renderers/src/messages/paragraph.messages.ts
|
|
1881
1794
|
var import_react_intl5 = require("react-intl");
|
|
@@ -1893,17 +1806,17 @@ var paragraph_messages_default = (0, import_react_intl5.defineMessages)({
|
|
|
1893
1806
|
});
|
|
1894
1807
|
|
|
1895
1808
|
// ../renderers/src/ParagraphRenderer.tsx
|
|
1896
|
-
var
|
|
1809
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1897
1810
|
var ParagraphRenderer = {
|
|
1898
1811
|
canRenderType: "paragraph",
|
|
1899
|
-
render: (props) => /* @__PURE__ */ (0,
|
|
1812
|
+
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Paragraph, __spreadValues({}, props))
|
|
1900
1813
|
};
|
|
1901
1814
|
function Paragraph({ align, control, margin, text }) {
|
|
1902
1815
|
const className = getTextAlignmentAndMargin({ align, margin });
|
|
1903
|
-
return control === "copyable" ? /* @__PURE__ */ (0,
|
|
1816
|
+
return control === "copyable" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(CopyableParagraph, { className, align, text }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(StandardParagraph, { className, text });
|
|
1904
1817
|
}
|
|
1905
1818
|
function StandardParagraph({ text, className }) {
|
|
1906
|
-
return /* @__PURE__ */ (0,
|
|
1819
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className, children: text });
|
|
1907
1820
|
}
|
|
1908
1821
|
function CopyableParagraph({
|
|
1909
1822
|
text,
|
|
@@ -1917,24 +1830,24 @@ function CopyableParagraph({
|
|
|
1917
1830
|
});
|
|
1918
1831
|
};
|
|
1919
1832
|
const inputAlignmentClasses = getTextAlignmentAndMargin({ align, margin: "sm" });
|
|
1920
|
-
return /* @__PURE__ */ (0,
|
|
1921
|
-
/* @__PURE__ */ (0,
|
|
1833
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className, children: [
|
|
1834
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1922
1835
|
import_components23.Input,
|
|
1923
1836
|
{
|
|
1924
1837
|
type: "text",
|
|
1925
1838
|
value: text,
|
|
1926
1839
|
readOnly: true,
|
|
1927
|
-
className: (0,
|
|
1840
|
+
className: (0, import_classnames4.default)("text-ellipsis", inputAlignmentClasses)
|
|
1928
1841
|
}
|
|
1929
1842
|
),
|
|
1930
|
-
/* @__PURE__ */ (0,
|
|
1843
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_components23.Button, { block: true, onClick: copy, children: formatMessage(paragraph_messages_default.copy) })
|
|
1931
1844
|
] });
|
|
1932
1845
|
}
|
|
1933
1846
|
var ParagraphRenderer_default = ParagraphRenderer;
|
|
1934
1847
|
|
|
1935
1848
|
// ../renderers/src/RepeatableRenderer.tsx
|
|
1936
1849
|
var import_components24 = require("@transferwise/components");
|
|
1937
|
-
var
|
|
1850
|
+
var import_react8 = require("react");
|
|
1938
1851
|
var import_icons = require("@transferwise/icons");
|
|
1939
1852
|
var import_react_intl8 = require("react-intl");
|
|
1940
1853
|
|
|
@@ -1964,11 +1877,11 @@ var repeatable_messages_default = (0, import_react_intl7.defineMessages)({
|
|
|
1964
1877
|
});
|
|
1965
1878
|
|
|
1966
1879
|
// ../renderers/src/RepeatableRenderer.tsx
|
|
1967
|
-
var
|
|
1968
|
-
var
|
|
1880
|
+
var import_classnames5 = __toESM(require_classnames());
|
|
1881
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1969
1882
|
var RepeatableRenderer = {
|
|
1970
1883
|
canRenderType: "repeatable",
|
|
1971
|
-
render: (props) => /* @__PURE__ */ (0,
|
|
1884
|
+
render: (props) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Repeatable, __spreadValues({}, props))
|
|
1972
1885
|
};
|
|
1973
1886
|
function Repeatable(props) {
|
|
1974
1887
|
const {
|
|
@@ -1985,7 +1898,7 @@ function Repeatable(props) {
|
|
|
1985
1898
|
onRemove
|
|
1986
1899
|
} = props;
|
|
1987
1900
|
const { formatMessage } = (0, import_react_intl8.useIntl)();
|
|
1988
|
-
const [openModalType, setOpenModalType] = (0,
|
|
1901
|
+
const [openModalType, setOpenModalType] = (0, import_react8.useState)(null);
|
|
1989
1902
|
const onAddItem = () => {
|
|
1990
1903
|
onAdd();
|
|
1991
1904
|
setOpenModalType("add");
|
|
@@ -2007,40 +1920,40 @@ function Repeatable(props) {
|
|
|
2007
1920
|
const onCancelEdit = () => {
|
|
2008
1921
|
setOpenModalType(null);
|
|
2009
1922
|
};
|
|
2010
|
-
return /* @__PURE__ */ (0,
|
|
2011
|
-
title && /* @__PURE__ */ (0,
|
|
2012
|
-
description && /* @__PURE__ */ (0,
|
|
2013
|
-
/* @__PURE__ */ (0,
|
|
1923
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
|
|
1924
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_components24.Header, { title }),
|
|
1925
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { children: description }),
|
|
1926
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
2014
1927
|
"div",
|
|
2015
1928
|
{
|
|
2016
|
-
className: (0,
|
|
1929
|
+
className: (0, import_classnames5.default)("form-group", {
|
|
2017
1930
|
"has-error": error
|
|
2018
1931
|
}),
|
|
2019
1932
|
children: [
|
|
2020
|
-
items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ (0,
|
|
2021
|
-
/* @__PURE__ */ (0,
|
|
1933
|
+
items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ItemSummaryOption, { item, onClick: () => onEditItem(index) }, item.id)),
|
|
1934
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2022
1935
|
import_components24.NavigationOption,
|
|
2023
1936
|
{
|
|
2024
|
-
media: /* @__PURE__ */ (0,
|
|
1937
|
+
media: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_icons.Plus, {}),
|
|
2025
1938
|
title: addItemTitle || formatMessage(repeatable_messages_default.addItemTitle),
|
|
2026
1939
|
showMediaAtAllSizes: true,
|
|
2027
1940
|
onClick: () => onAddItem()
|
|
2028
1941
|
}
|
|
2029
1942
|
),
|
|
2030
|
-
error && /* @__PURE__ */ (0,
|
|
1943
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_components24.InlineAlert, { type: "negative", children: error })
|
|
2031
1944
|
]
|
|
2032
1945
|
}
|
|
2033
1946
|
),
|
|
2034
|
-
/* @__PURE__ */ (0,
|
|
1947
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2035
1948
|
import_components24.Modal,
|
|
2036
1949
|
{
|
|
2037
1950
|
open: openModalType !== null,
|
|
2038
1951
|
title: (openModalType === "add" ? addItemTitle : editItemTitle) || formatMessage(repeatable_messages_default.addItemTitle),
|
|
2039
|
-
body: /* @__PURE__ */ (0,
|
|
2040
|
-
/* @__PURE__ */ (0,
|
|
2041
|
-
/* @__PURE__ */ (0,
|
|
2042
|
-
/* @__PURE__ */ (0,
|
|
2043
|
-
/* @__PURE__ */ (0,
|
|
1952
|
+
body: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
|
|
1953
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "m-b-2", children: editableItem }),
|
|
1954
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { children: [
|
|
1955
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_components24.Button, { priority: "primary", block: true, className: "m-b-2", onClick: () => onSaveItem(), children: formatMessage(repeatable_messages_default.addItem) }),
|
|
1956
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_components24.Button, { priority: "secondary", type: "negative", block: true, onClick: () => onRemoveItem(), children: formatMessage(repeatable_messages_default.removeItem) })
|
|
2044
1957
|
] })
|
|
2045
1958
|
] }),
|
|
2046
1959
|
onClose: () => onCancelEdit()
|
|
@@ -2052,10 +1965,10 @@ function ItemSummaryOption({
|
|
|
2052
1965
|
item,
|
|
2053
1966
|
onClick
|
|
2054
1967
|
}) {
|
|
2055
|
-
return /* @__PURE__ */ (0,
|
|
1968
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2056
1969
|
import_components24.NavigationOption,
|
|
2057
1970
|
{
|
|
2058
|
-
media: /* @__PURE__ */ (0,
|
|
1971
|
+
media: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(NavigationOptionMedia, __spreadValues({}, item)),
|
|
2059
1972
|
title: item.title,
|
|
2060
1973
|
content: item.description,
|
|
2061
1974
|
showMediaAtAllSizes: true,
|
|
@@ -2092,13 +2005,13 @@ var generic_error_messages_default = (0, import_react_intl9.defineMessages)({
|
|
|
2092
2005
|
});
|
|
2093
2006
|
|
|
2094
2007
|
// ../renderers/src/SearchRenderer/ErrorResult.tsx
|
|
2095
|
-
var
|
|
2008
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
2096
2009
|
function ErrorResult({ state }) {
|
|
2097
2010
|
const intl = (0, import_react_intl10.useIntl)();
|
|
2098
|
-
return /* @__PURE__ */ (0,
|
|
2011
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("p", { className: "m-t-2", children: [
|
|
2099
2012
|
intl.formatMessage(generic_error_messages_default.genericError),
|
|
2100
2013
|
"\xA0",
|
|
2101
|
-
/* @__PURE__ */ (0,
|
|
2014
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
2102
2015
|
"a",
|
|
2103
2016
|
{
|
|
2104
2017
|
href: "/",
|
|
@@ -2113,8 +2026,8 @@ function ErrorResult({ state }) {
|
|
|
2113
2026
|
}
|
|
2114
2027
|
|
|
2115
2028
|
// ../renderers/src/SearchRenderer/BlockSearchRendererComponent.tsx
|
|
2116
|
-
var
|
|
2117
|
-
var
|
|
2029
|
+
var import_react9 = require("react");
|
|
2030
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
2118
2031
|
function BlockSearchRendererComponent({
|
|
2119
2032
|
id,
|
|
2120
2033
|
isLoading,
|
|
@@ -2124,10 +2037,10 @@ function BlockSearchRendererComponent({
|
|
|
2124
2037
|
state,
|
|
2125
2038
|
title
|
|
2126
2039
|
}) {
|
|
2127
|
-
const [hasSearched, setHasSearched] = (0,
|
|
2040
|
+
const [hasSearched, setHasSearched] = (0, import_react9.useState)(false);
|
|
2128
2041
|
const trackEvent = useTrackEvent();
|
|
2129
|
-
return /* @__PURE__ */ (0,
|
|
2130
|
-
/* @__PURE__ */ (0,
|
|
2042
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: getMargin(margin), children: [
|
|
2043
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FieldInput_default, { id, description: "", error: "", help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2131
2044
|
import_components25.Input,
|
|
2132
2045
|
{
|
|
2133
2046
|
id,
|
|
@@ -2144,7 +2057,7 @@ function BlockSearchRendererComponent({
|
|
|
2144
2057
|
}
|
|
2145
2058
|
}
|
|
2146
2059
|
) }),
|
|
2147
|
-
isLoading ? /* @__PURE__ */ (0,
|
|
2060
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_jsx_runtime36.Fragment, { children: "Loading..." }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SearchResultContent, { state, onChange })
|
|
2148
2061
|
] });
|
|
2149
2062
|
}
|
|
2150
2063
|
function SearchResultContent({
|
|
@@ -2153,29 +2066,29 @@ function SearchResultContent({
|
|
|
2153
2066
|
}) {
|
|
2154
2067
|
switch (state.type) {
|
|
2155
2068
|
case "error":
|
|
2156
|
-
return /* @__PURE__ */ (0,
|
|
2069
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ErrorResult, { state });
|
|
2157
2070
|
case "results":
|
|
2158
|
-
return /* @__PURE__ */ (0,
|
|
2071
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(SearchResults, { state, onChange });
|
|
2159
2072
|
case "noResults":
|
|
2160
|
-
return /* @__PURE__ */ (0,
|
|
2073
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(EmptySearchResult, { state });
|
|
2161
2074
|
case "pending":
|
|
2162
2075
|
default:
|
|
2163
2076
|
return null;
|
|
2164
2077
|
}
|
|
2165
2078
|
}
|
|
2166
2079
|
function EmptySearchResult({ state }) {
|
|
2167
|
-
return /* @__PURE__ */ (0,
|
|
2080
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_components25.Markdown, { className: "m-t-2", config: { link: { target: "_blank" } }, children: state.message });
|
|
2168
2081
|
}
|
|
2169
2082
|
function SearchResults({
|
|
2170
2083
|
state
|
|
2171
2084
|
}) {
|
|
2172
2085
|
const trackEvent = useTrackEvent();
|
|
2173
|
-
return /* @__PURE__ */ (0,
|
|
2086
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_components25.NavigationOptionsList, { children: state.results.map((result) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
2174
2087
|
import_components25.NavigationOption,
|
|
2175
2088
|
{
|
|
2176
2089
|
title: result.title,
|
|
2177
2090
|
content: result.description,
|
|
2178
|
-
media: /* @__PURE__ */ (0,
|
|
2091
|
+
media: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(NavigationOptionMedia, __spreadValues({}, result)),
|
|
2179
2092
|
showMediaCircle: false,
|
|
2180
2093
|
showMediaAtAllSizes: true,
|
|
2181
2094
|
onClick: () => {
|
|
@@ -2193,8 +2106,8 @@ var BlockSearchRendererComponent_default = BlockSearchRendererComponent;
|
|
|
2193
2106
|
// ../renderers/src/SearchRenderer/InlineSearchRendererComponent.tsx
|
|
2194
2107
|
var import_components26 = require("@transferwise/components");
|
|
2195
2108
|
var import_icons2 = require("@transferwise/icons");
|
|
2196
|
-
var
|
|
2197
|
-
var
|
|
2109
|
+
var import_react10 = require("react");
|
|
2110
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2198
2111
|
function InlineSearchRenderer({
|
|
2199
2112
|
id,
|
|
2200
2113
|
isLoading,
|
|
@@ -2203,21 +2116,21 @@ function InlineSearchRenderer({
|
|
|
2203
2116
|
state,
|
|
2204
2117
|
title
|
|
2205
2118
|
}) {
|
|
2206
|
-
const [hasSearched, setHasSearched] = (0,
|
|
2119
|
+
const [hasSearched, setHasSearched] = (0, import_react10.useState)(false);
|
|
2207
2120
|
const trackEvent = useTrackEvent();
|
|
2208
|
-
return /* @__PURE__ */ (0,
|
|
2121
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(FieldInput_default, { id, description: "", error: "", help: "", label: title, children: [
|
|
2209
2122
|
id,
|
|
2210
|
-
/* @__PURE__ */ (0,
|
|
2123
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
2211
2124
|
import_components26.Typeahead,
|
|
2212
2125
|
{
|
|
2213
2126
|
id: "typeahead-input-id",
|
|
2214
2127
|
name: "typeahead-input-name",
|
|
2215
2128
|
size: "md",
|
|
2216
2129
|
maxHeight: 100,
|
|
2217
|
-
footer: /* @__PURE__ */ (0,
|
|
2130
|
+
footer: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TypeaheadFooter, { state, isLoading }),
|
|
2218
2131
|
multiple: false,
|
|
2219
2132
|
clearable: false,
|
|
2220
|
-
addon: /* @__PURE__ */ (0,
|
|
2133
|
+
addon: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_icons2.Search, { size: 24 }),
|
|
2221
2134
|
options: state.type === "results" ? state.results.map(mapResultToTypeaheadOption) : [],
|
|
2222
2135
|
minQueryLength: 1,
|
|
2223
2136
|
onChange: (values) => {
|
|
@@ -2254,29 +2167,29 @@ function mapResultToTypeaheadOption(result) {
|
|
|
2254
2167
|
}
|
|
2255
2168
|
function TypeaheadFooter({ state, isLoading }) {
|
|
2256
2169
|
if (state.type === "noResults") {
|
|
2257
|
-
return /* @__PURE__ */ (0,
|
|
2170
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_components26.Markdown, { className: "m-t-2 m-x-2", config: { link: { target: "_blank" } }, children: state.message });
|
|
2258
2171
|
}
|
|
2259
2172
|
if (state.type === "error") {
|
|
2260
|
-
return /* @__PURE__ */ (0,
|
|
2173
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "m-t-2 m-x-2", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ErrorResult, { state }) });
|
|
2261
2174
|
}
|
|
2262
2175
|
if (state.type === "pending" || isLoading) {
|
|
2263
|
-
return /* @__PURE__ */ (0,
|
|
2176
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: "m-t-2 m-x-2", children: "Loading..." });
|
|
2264
2177
|
}
|
|
2265
2178
|
return null;
|
|
2266
2179
|
}
|
|
2267
2180
|
var InlineSearchRendererComponent_default = InlineSearchRenderer;
|
|
2268
2181
|
|
|
2269
2182
|
// ../renderers/src/SearchRenderer/SearchRenderer.tsx
|
|
2270
|
-
var
|
|
2183
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2271
2184
|
var SearchRenderer = {
|
|
2272
2185
|
canRenderType: "search",
|
|
2273
|
-
render: (props) => props.control === "inline" ? /* @__PURE__ */ (0,
|
|
2186
|
+
render: (props) => props.control === "inline" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(InlineSearchRendererComponent_default, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(BlockSearchRendererComponent_default, __spreadValues({}, props))
|
|
2274
2187
|
};
|
|
2275
2188
|
var SearchRenderer_default = SearchRenderer;
|
|
2276
2189
|
|
|
2277
2190
|
// ../renderers/src/SelectInputRenderer/RadioInputRendererComponent.tsx
|
|
2278
2191
|
var import_components27 = require("@transferwise/components");
|
|
2279
|
-
var
|
|
2192
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2280
2193
|
function RadioInputRendererComponent(props) {
|
|
2281
2194
|
const {
|
|
2282
2195
|
id,
|
|
@@ -2290,8 +2203,8 @@ function RadioInputRendererComponent(props) {
|
|
|
2290
2203
|
selectedIndex,
|
|
2291
2204
|
onSelect
|
|
2292
2205
|
} = props;
|
|
2293
|
-
return /* @__PURE__ */ (0,
|
|
2294
|
-
/* @__PURE__ */ (0,
|
|
2206
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
|
|
2207
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FieldInput_default, { id, label, help, description, error, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2295
2208
|
import_components27.RadioGroup,
|
|
2296
2209
|
{
|
|
2297
2210
|
name: id,
|
|
@@ -2300,7 +2213,7 @@ function RadioInputRendererComponent(props) {
|
|
|
2300
2213
|
value: index,
|
|
2301
2214
|
secondary: option.description,
|
|
2302
2215
|
disabled: option.disabled || disabled,
|
|
2303
|
-
avatar: /* @__PURE__ */ (0,
|
|
2216
|
+
avatar: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(OptionMedia, { icon: option.icon, image: option.image })
|
|
2304
2217
|
})),
|
|
2305
2218
|
selectedValue: selectedIndex != null ? selectedIndex : void 0,
|
|
2306
2219
|
onChange: onSelect
|
|
@@ -2313,8 +2226,8 @@ function RadioInputRendererComponent(props) {
|
|
|
2313
2226
|
|
|
2314
2227
|
// ../renderers/src/SelectInputRenderer/TabInputRendererComponent.tsx
|
|
2315
2228
|
var import_components28 = require("@transferwise/components");
|
|
2316
|
-
var
|
|
2317
|
-
var
|
|
2229
|
+
var import_react11 = require("react");
|
|
2230
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2318
2231
|
function TabInputRendererComponent(props) {
|
|
2319
2232
|
const {
|
|
2320
2233
|
id,
|
|
@@ -2328,13 +2241,13 @@ function TabInputRendererComponent(props) {
|
|
|
2328
2241
|
selectedIndex,
|
|
2329
2242
|
onSelect
|
|
2330
2243
|
} = props;
|
|
2331
|
-
(0,
|
|
2244
|
+
(0, import_react11.useEffect)(() => {
|
|
2332
2245
|
if (!isValidIndex(selectedIndex, options.length)) {
|
|
2333
2246
|
onSelect(0);
|
|
2334
2247
|
}
|
|
2335
2248
|
}, [selectedIndex, onSelect, options.length]);
|
|
2336
|
-
return /* @__PURE__ */ (0,
|
|
2337
|
-
/* @__PURE__ */ (0,
|
|
2249
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
2250
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(FieldInput_default, { id, label, help, description, error, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
2338
2251
|
import_components28.Tabs,
|
|
2339
2252
|
{
|
|
2340
2253
|
name: id,
|
|
@@ -2343,7 +2256,7 @@ function TabInputRendererComponent(props) {
|
|
|
2343
2256
|
title: option.title,
|
|
2344
2257
|
// if we pass null, we get some props-types console errors
|
|
2345
2258
|
// eslint-disable-next-line react/jsx-no-useless-fragment
|
|
2346
|
-
content: /* @__PURE__ */ (0,
|
|
2259
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_jsx_runtime40.Fragment, {}),
|
|
2347
2260
|
disabled: option.disabled || disabled
|
|
2348
2261
|
})),
|
|
2349
2262
|
onTabSelect: onSelect
|
|
@@ -2359,22 +2272,22 @@ var import_components30 = require("@transferwise/components");
|
|
|
2359
2272
|
|
|
2360
2273
|
// ../renderers/src/SelectInputRenderer/SelectTriggerMedia.tsx
|
|
2361
2274
|
var import_components29 = require("@transferwise/components");
|
|
2362
|
-
var
|
|
2275
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2363
2276
|
function SelectTriggerMedia({ icon, image }) {
|
|
2364
2277
|
if (image == null ? void 0 : image.url) {
|
|
2365
2278
|
return null;
|
|
2366
2279
|
}
|
|
2367
2280
|
if (icon && "name" in icon) {
|
|
2368
|
-
return /* @__PURE__ */ (0,
|
|
2281
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components29.Avatar, { type: import_components29.AvatarType.ICON, size: 24, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DynamicIcon_default, { name: icon.name }) });
|
|
2369
2282
|
}
|
|
2370
2283
|
if (icon && "text" in icon) {
|
|
2371
|
-
return /* @__PURE__ */ (0,
|
|
2284
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_components29.Avatar, { type: import_components29.AvatarType.ICON, size: 24, children: icon.text });
|
|
2372
2285
|
}
|
|
2373
2286
|
return null;
|
|
2374
2287
|
}
|
|
2375
2288
|
|
|
2376
2289
|
// ../renderers/src/SelectInputRenderer/SelectInputRendererComponent.tsx
|
|
2377
|
-
var
|
|
2290
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2378
2291
|
function SelectInputRendererComponent(props) {
|
|
2379
2292
|
const {
|
|
2380
2293
|
id,
|
|
@@ -2409,16 +2322,16 @@ function SelectInputRendererComponent(props) {
|
|
|
2409
2322
|
const contentProps = withinTrigger ? {
|
|
2410
2323
|
title: option.title,
|
|
2411
2324
|
note: option.description,
|
|
2412
|
-
icon: /* @__PURE__ */ (0,
|
|
2325
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SelectTriggerMedia, { icon: option.icon, image: option.image })
|
|
2413
2326
|
} : {
|
|
2414
2327
|
title: option.title,
|
|
2415
2328
|
description: option.description,
|
|
2416
|
-
icon: /* @__PURE__ */ (0,
|
|
2329
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(OptionMedia, { icon: option.icon, image: option.image })
|
|
2417
2330
|
};
|
|
2418
|
-
return /* @__PURE__ */ (0,
|
|
2331
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_components30.SelectInputOptionContent, __spreadValues({}, contentProps));
|
|
2419
2332
|
};
|
|
2420
|
-
return /* @__PURE__ */ (0,
|
|
2421
|
-
/* @__PURE__ */ (0,
|
|
2333
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
|
|
2334
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(FieldInput_default, { id, label, help, description, error, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
2422
2335
|
import_components30.SelectInput,
|
|
2423
2336
|
{
|
|
2424
2337
|
name: id,
|
|
@@ -2437,18 +2350,18 @@ function SelectInputRendererComponent(props) {
|
|
|
2437
2350
|
}
|
|
2438
2351
|
|
|
2439
2352
|
// ../renderers/src/SelectInputRenderer/SegmentedInputRendererComponent.tsx
|
|
2440
|
-
var
|
|
2353
|
+
var import_react12 = require("react");
|
|
2441
2354
|
var import_components31 = require("@transferwise/components");
|
|
2442
|
-
var
|
|
2355
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2443
2356
|
function SegmentedInputRendererComponent(props) {
|
|
2444
2357
|
const { id, children, description, error, help, label, options, selectedIndex, onSelect } = props;
|
|
2445
|
-
(0,
|
|
2358
|
+
(0, import_react12.useEffect)(() => {
|
|
2446
2359
|
if (!isValidIndex2(selectedIndex, options.length)) {
|
|
2447
2360
|
onSelect(0);
|
|
2448
2361
|
}
|
|
2449
2362
|
}, [selectedIndex, onSelect, options.length]);
|
|
2450
|
-
return /* @__PURE__ */ (0,
|
|
2451
|
-
/* @__PURE__ */ (0,
|
|
2363
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
|
|
2364
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(FieldInput_default, { id, label, help, description, error, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
2452
2365
|
import_components31.SegmentedControl,
|
|
2453
2366
|
{
|
|
2454
2367
|
name: `${id}-segmented-control`,
|
|
@@ -2463,26 +2376,26 @@ function SegmentedInputRendererComponent(props) {
|
|
|
2463
2376
|
onChange: (value) => onSelect(Number(value))
|
|
2464
2377
|
}
|
|
2465
2378
|
) }),
|
|
2466
|
-
/* @__PURE__ */ (0,
|
|
2379
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { id: `${id}-children`, children })
|
|
2467
2380
|
] });
|
|
2468
2381
|
}
|
|
2469
2382
|
var isValidIndex2 = (index, options) => index !== null && index >= 0 && index < options;
|
|
2470
2383
|
|
|
2471
2384
|
// ../renderers/src/SelectInputRenderer/SelectInputRenderer.tsx
|
|
2472
|
-
var
|
|
2385
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2473
2386
|
var SelectInputRenderer = {
|
|
2474
2387
|
canRenderType: "input-select",
|
|
2475
2388
|
render: (props) => {
|
|
2476
2389
|
switch (props.control) {
|
|
2477
2390
|
case "radio":
|
|
2478
|
-
return /* @__PURE__ */ (0,
|
|
2391
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(RadioInputRendererComponent, __spreadValues({}, props));
|
|
2479
2392
|
case "tab":
|
|
2480
|
-
return props.options.length > 3 ? /* @__PURE__ */ (0,
|
|
2393
|
+
return props.options.length > 3 ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SelectInputRendererComponent, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(TabInputRendererComponent, __spreadValues({}, props));
|
|
2481
2394
|
case "segmented":
|
|
2482
|
-
return props.options.length > 3 ? /* @__PURE__ */ (0,
|
|
2395
|
+
return props.options.length > 3 ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SelectInputRendererComponent, __spreadValues({}, props)) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SegmentedInputRendererComponent, __spreadValues({}, props));
|
|
2483
2396
|
case "select":
|
|
2484
2397
|
default:
|
|
2485
|
-
return /* @__PURE__ */ (0,
|
|
2398
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SelectInputRendererComponent, __spreadValues({}, props));
|
|
2486
2399
|
}
|
|
2487
2400
|
}
|
|
2488
2401
|
};
|
|
@@ -2490,17 +2403,17 @@ var SelectInputRenderer_default = SelectInputRenderer;
|
|
|
2490
2403
|
|
|
2491
2404
|
// ../renderers/src/StatusListRenderer.tsx
|
|
2492
2405
|
var import_components32 = require("@transferwise/components");
|
|
2493
|
-
var
|
|
2406
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2494
2407
|
var StatusListRenderer = {
|
|
2495
2408
|
canRenderType: "status-list",
|
|
2496
|
-
render: ({ margin, items, title }) => /* @__PURE__ */ (0,
|
|
2497
|
-
title ? /* @__PURE__ */ (0,
|
|
2498
|
-
items.map(({ description, icon, status, title: itemTitle }) => /* @__PURE__ */ (0,
|
|
2409
|
+
render: ({ margin, items, title }) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: getMargin(margin), children: [
|
|
2410
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_components32.Header, { title }) : null,
|
|
2411
|
+
items.map(({ description, icon, status, title: itemTitle }) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2499
2412
|
import_components32.Summary,
|
|
2500
2413
|
{
|
|
2501
2414
|
title: itemTitle,
|
|
2502
2415
|
description,
|
|
2503
|
-
icon: icon && "name" in icon ? /* @__PURE__ */ (0,
|
|
2416
|
+
icon: icon && "name" in icon ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(DynamicIcon_default, { name: icon.name }) : null,
|
|
2504
2417
|
status: mapStatus(status)
|
|
2505
2418
|
},
|
|
2506
2419
|
`${title}/${description || ""}`
|
|
@@ -2517,31 +2430,31 @@ var mapStatus = (status) => {
|
|
|
2517
2430
|
|
|
2518
2431
|
// ../renderers/src/components/VariableTextInput.tsx
|
|
2519
2432
|
var import_components33 = require("@transferwise/components");
|
|
2520
|
-
var
|
|
2433
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
2521
2434
|
function VariableTextInput({
|
|
2522
2435
|
control,
|
|
2523
2436
|
inputProps
|
|
2524
2437
|
}) {
|
|
2525
2438
|
switch (control) {
|
|
2526
2439
|
case "password":
|
|
2527
|
-
return /* @__PURE__ */ (0,
|
|
2440
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TextInput, __spreadValues({ type: "password" }, inputProps));
|
|
2528
2441
|
case "email":
|
|
2529
|
-
return /* @__PURE__ */ (0,
|
|
2442
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TextInput, __spreadValues({ type: "email" }, inputProps));
|
|
2530
2443
|
case "textarea":
|
|
2531
|
-
return /* @__PURE__ */ (0,
|
|
2444
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TextAreaInput, __spreadValues({}, inputProps));
|
|
2532
2445
|
case "numeric":
|
|
2533
|
-
return /* @__PURE__ */ (0,
|
|
2446
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(NumericInput, __spreadValues({ type: "number" }, inputProps));
|
|
2534
2447
|
case "phone-number":
|
|
2535
|
-
return /* @__PURE__ */ (0,
|
|
2448
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(PhoneNumberInput, __spreadValues({}, inputProps));
|
|
2536
2449
|
default:
|
|
2537
|
-
return /* @__PURE__ */ (0,
|
|
2450
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(TextInput, __spreadValues({ type: "text" }, inputProps));
|
|
2538
2451
|
}
|
|
2539
2452
|
}
|
|
2540
2453
|
function TextInput(_a) {
|
|
2541
2454
|
var _b = _a, { id, displayFormat, onChange } = _b, rest = __objRest(_b, ["id", "displayFormat", "onChange"]);
|
|
2542
2455
|
if (typeof displayFormat === "string") {
|
|
2543
2456
|
const inputProps = __spreadValues({ id, name: id, className: "form-control" }, rest);
|
|
2544
|
-
return /* @__PURE__ */ (0,
|
|
2457
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2545
2458
|
import_components33.InputWithDisplayFormat,
|
|
2546
2459
|
__spreadValues({
|
|
2547
2460
|
displayPattern: displayFormat,
|
|
@@ -2549,29 +2462,29 @@ function TextInput(_a) {
|
|
|
2549
2462
|
}, inputProps)
|
|
2550
2463
|
);
|
|
2551
2464
|
}
|
|
2552
|
-
return /* @__PURE__ */ (0,
|
|
2465
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components33.Input, __spreadValues({ id, name: id, onChange: (e) => onChange(e.target.value) }, rest));
|
|
2553
2466
|
}
|
|
2554
2467
|
function TextAreaInput(_a) {
|
|
2555
2468
|
var _b = _a, { id, displayFormat, onChange } = _b, rest = __objRest(_b, ["id", "displayFormat", "onChange"]);
|
|
2556
2469
|
const textAreaProps = __spreadValues({ id, name: id }, rest);
|
|
2557
|
-
return typeof displayFormat === "string" ? /* @__PURE__ */ (0,
|
|
2470
|
+
return typeof displayFormat === "string" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2558
2471
|
import_components33.TextareaWithDisplayFormat,
|
|
2559
2472
|
__spreadValues({
|
|
2560
2473
|
displayPattern: displayFormat,
|
|
2561
2474
|
onChange: (newValue) => onChange(newValue)
|
|
2562
2475
|
}, textAreaProps)
|
|
2563
|
-
) : /* @__PURE__ */ (0,
|
|
2476
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components33.TextArea, __spreadValues({ onChange: (e) => onChange(e.target.value) }, textAreaProps));
|
|
2564
2477
|
}
|
|
2565
2478
|
function NumericInput(_a) {
|
|
2566
2479
|
var _b = _a, { id, displayFormat, onChange } = _b, rest = __objRest(_b, ["id", "displayFormat", "onChange"]);
|
|
2567
2480
|
const numericProps = __spreadValues({ id, name: id, onWheel }, rest);
|
|
2568
|
-
return typeof displayFormat === "string" ? /* @__PURE__ */ (0,
|
|
2481
|
+
return typeof displayFormat === "string" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2569
2482
|
import_components33.InputWithDisplayFormat,
|
|
2570
2483
|
__spreadValues({
|
|
2571
2484
|
displayPattern: displayFormat,
|
|
2572
2485
|
onChange: (newValue) => onChange(numericValueOrNull(newValue))
|
|
2573
2486
|
}, numericProps)
|
|
2574
|
-
) : /* @__PURE__ */ (0,
|
|
2487
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2575
2488
|
import_components33.Input,
|
|
2576
2489
|
__spreadValues({
|
|
2577
2490
|
onChange: ({ target: { value: newValue } }) => onChange(numericValueOrNull(newValue))
|
|
@@ -2580,12 +2493,12 @@ function NumericInput(_a) {
|
|
|
2580
2493
|
}
|
|
2581
2494
|
function PhoneNumberInput(_a) {
|
|
2582
2495
|
var _b = _a, { value } = _b, rest = __objRest(_b, ["value"]);
|
|
2583
|
-
return /* @__PURE__ */ (0,
|
|
2496
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_components33.PhoneNumberInput, __spreadValues({ initialValue: value }, rest));
|
|
2584
2497
|
}
|
|
2585
2498
|
var VariableTextInput_default = VariableTextInput;
|
|
2586
2499
|
|
|
2587
2500
|
// ../renderers/src/TextInputRenderer.tsx
|
|
2588
|
-
var
|
|
2501
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
2589
2502
|
var TextInputRenderer = {
|
|
2590
2503
|
canRenderType: "input-text",
|
|
2591
2504
|
render: (props) => {
|
|
@@ -2610,14 +2523,14 @@ var TextInputRenderer = {
|
|
|
2610
2523
|
]);
|
|
2611
2524
|
const value = initialValue != null ? initialValue : "";
|
|
2612
2525
|
const inputProps = __spreadProps(__spreadValues({}, rest), { value, id });
|
|
2613
|
-
return /* @__PURE__ */ (0,
|
|
2526
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(FieldInput_default, { id, label, description, error, help, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(VariableTextInput_default, { control, inputProps }) });
|
|
2614
2527
|
}
|
|
2615
2528
|
};
|
|
2616
2529
|
var TextInputRenderer_default = TextInputRenderer;
|
|
2617
2530
|
|
|
2618
2531
|
// ../renderers/src/UploadInputRenderer.tsx
|
|
2619
2532
|
var import_components34 = require("@transferwise/components");
|
|
2620
|
-
var
|
|
2533
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
2621
2534
|
var UploadInputRenderer = {
|
|
2622
2535
|
canRenderType: "input-upload",
|
|
2623
2536
|
render: (props) => {
|
|
@@ -2633,7 +2546,7 @@ var UploadInputRenderer = {
|
|
|
2633
2546
|
};
|
|
2634
2547
|
return (
|
|
2635
2548
|
// We don't pass help here as there is no sensible place to display it
|
|
2636
|
-
/* @__PURE__ */ (0,
|
|
2549
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)(UploadFieldInput_default, { id, label: void 0, description: void 0, error, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
2637
2550
|
import_components34.UploadInput,
|
|
2638
2551
|
{
|
|
2639
2552
|
id,
|
|
@@ -2688,7 +2601,7 @@ var LargeUploadRenderer = {
|
|
|
2688
2601
|
throw e;
|
|
2689
2602
|
}
|
|
2690
2603
|
};
|
|
2691
|
-
return /* @__PURE__ */ (0,
|
|
2604
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(FieldInput_default, { id, label, description, error, help, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
2692
2605
|
import_components34.Upload,
|
|
2693
2606
|
__spreadProps(__spreadValues({}, uploadProps), {
|
|
2694
2607
|
usAccept: getAcceptsString(accepts),
|
|
@@ -2703,7 +2616,7 @@ var LargeUploadRenderer = {
|
|
|
2703
2616
|
|
|
2704
2617
|
// ../renderers/src/ReviewRenderer.tsx
|
|
2705
2618
|
var import_components35 = require("@transferwise/components");
|
|
2706
|
-
var
|
|
2619
|
+
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
2707
2620
|
var ReviewRenderer = {
|
|
2708
2621
|
canRenderType: "review",
|
|
2709
2622
|
render: ({ callToAction, control, fields, margin, title }) => {
|
|
@@ -2715,9 +2628,9 @@ var ReviewRenderer = {
|
|
|
2715
2628
|
callToAction.onClick();
|
|
2716
2629
|
}
|
|
2717
2630
|
} : void 0;
|
|
2718
|
-
return /* @__PURE__ */ (0,
|
|
2719
|
-
(title || callToAction) && /* @__PURE__ */ (0,
|
|
2720
|
-
/* @__PURE__ */ (0,
|
|
2631
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: getMargin(margin), children: [
|
|
2632
|
+
(title || callToAction) && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_components35.Header, { title: title != null ? title : "", action }),
|
|
2633
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: margin, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
2721
2634
|
import_components35.DefinitionList,
|
|
2722
2635
|
{
|
|
2723
2636
|
layout: orientation,
|
|
@@ -2749,21 +2662,21 @@ var mapControlToDefinitionListLayout = (control) => {
|
|
|
2749
2662
|
};
|
|
2750
2663
|
var getFieldValue = (value, help, orientation) => {
|
|
2751
2664
|
if (help) {
|
|
2752
|
-
return orientation === "HORIZONTAL_RIGHT_ALIGNED" ? /* @__PURE__ */ (0,
|
|
2753
|
-
/* @__PURE__ */ (0,
|
|
2665
|
+
return orientation === "HORIZONTAL_RIGHT_ALIGNED" ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
|
|
2666
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Help_default, { help }),
|
|
2754
2667
|
" ",
|
|
2755
2668
|
value
|
|
2756
|
-
] }) : /* @__PURE__ */ (0,
|
|
2669
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
|
|
2757
2670
|
value,
|
|
2758
2671
|
" ",
|
|
2759
|
-
/* @__PURE__ */ (0,
|
|
2672
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Help_default, { help })
|
|
2760
2673
|
] });
|
|
2761
2674
|
}
|
|
2762
2675
|
return value;
|
|
2763
2676
|
};
|
|
2764
2677
|
|
|
2765
2678
|
// ../renderers/src/step/StepRenderer.tsx
|
|
2766
|
-
var
|
|
2679
|
+
var import_react14 = require("react");
|
|
2767
2680
|
|
|
2768
2681
|
// ../renderers/src/step/ExternalConfirmationDialog.tsx
|
|
2769
2682
|
var import_react_intl12 = require("react-intl");
|
|
@@ -2795,17 +2708,17 @@ var external_confirmation_messages_default = (0, import_react_intl11.defineMessa
|
|
|
2795
2708
|
|
|
2796
2709
|
// ../renderers/src/step/ExternalConfirmationDialog.tsx
|
|
2797
2710
|
var import_components36 = require("@transferwise/components");
|
|
2798
|
-
var
|
|
2711
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
2799
2712
|
function ExternalConfirmationDialog({
|
|
2800
2713
|
external,
|
|
2801
2714
|
onClose
|
|
2802
2715
|
}) {
|
|
2803
2716
|
const { formatMessage } = (0, import_react_intl12.useIntl)();
|
|
2804
|
-
return /* @__PURE__ */ (0,
|
|
2805
|
-
/* @__PURE__ */ (0,
|
|
2806
|
-
/* @__PURE__ */ (0,
|
|
2807
|
-
/* @__PURE__ */ (0,
|
|
2808
|
-
/* @__PURE__ */ (0,
|
|
2717
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "df-box-renderer-fixed-width", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "df-box-renderer-width-lg", children: [
|
|
2718
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("h2", { className: "text-xs-center m-b-5", children: formatMessage(external_confirmation_messages_default.title) }),
|
|
2719
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components36.Markdown, { config: { link: { target: "_blank" } }, className: "text-xs-center m-b-5", children: formatMessage(external_confirmation_messages_default.description, { origin: getOrigin(external.url) }) }),
|
|
2720
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "df-box-renderer-fixed-width", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "df-box-renderer-width-lg", children: [
|
|
2721
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
2809
2722
|
import_components36.Button,
|
|
2810
2723
|
{
|
|
2811
2724
|
block: true,
|
|
@@ -2819,7 +2732,7 @@ function ExternalConfirmationDialog({
|
|
|
2819
2732
|
children: formatMessage(external_confirmation_messages_default.open)
|
|
2820
2733
|
}
|
|
2821
2734
|
),
|
|
2822
|
-
/* @__PURE__ */ (0,
|
|
2735
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_components36.Button, { block: true, className: "m-b-2", priority: "tertiary", size: "md", onClick: onClose, children: formatMessage(external_confirmation_messages_default.cancel) })
|
|
2823
2736
|
] }) })
|
|
2824
2737
|
] }) });
|
|
2825
2738
|
}
|
|
@@ -2832,12 +2745,12 @@ function getOrigin(url) {
|
|
|
2832
2745
|
}
|
|
2833
2746
|
|
|
2834
2747
|
// ../renderers/src/step/useExternal.tsx
|
|
2835
|
-
var
|
|
2748
|
+
var import_react13 = require("react");
|
|
2836
2749
|
function useExternal(url) {
|
|
2837
|
-
const [externalWindow, setExternalWindow] = (0,
|
|
2838
|
-
const [hasDismissed, setHasDismissed] = (0,
|
|
2750
|
+
const [externalWindow, setExternalWindow] = (0, import_react13.useState)(null);
|
|
2751
|
+
const [hasDismissed, setHasDismissed] = (0, import_react13.useState)(false);
|
|
2839
2752
|
const dismissConfirmation = () => setHasDismissed(true);
|
|
2840
|
-
(0,
|
|
2753
|
+
(0, import_react13.useEffect)(() => {
|
|
2841
2754
|
if (url) {
|
|
2842
2755
|
setHasDismissed(false);
|
|
2843
2756
|
setExternalWindow(window.open(url, "_blank"));
|
|
@@ -2850,9 +2763,9 @@ function useExternal(url) {
|
|
|
2850
2763
|
// ../renderers/src/step/BackButton.tsx
|
|
2851
2764
|
var import_components37 = require("@transferwise/components");
|
|
2852
2765
|
var import_icons3 = require("@transferwise/icons");
|
|
2853
|
-
var
|
|
2766
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
2854
2767
|
function BackButton({ title, onClick }) {
|
|
2855
|
-
return /* @__PURE__ */ (0,
|
|
2768
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
2856
2769
|
"a",
|
|
2857
2770
|
{
|
|
2858
2771
|
href: "/",
|
|
@@ -2863,8 +2776,8 @@ function BackButton({ title, onClick }) {
|
|
|
2863
2776
|
onClick();
|
|
2864
2777
|
},
|
|
2865
2778
|
children: [
|
|
2866
|
-
/* @__PURE__ */ (0,
|
|
2867
|
-
/* @__PURE__ */ (0,
|
|
2779
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "sr-only", children: title }),
|
|
2780
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_components37.Avatar, { type: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_icons3.ArrowLeft, { size: "24" }) })
|
|
2868
2781
|
]
|
|
2869
2782
|
}
|
|
2870
2783
|
);
|
|
@@ -2873,23 +2786,23 @@ var BackButton_default = BackButton;
|
|
|
2873
2786
|
|
|
2874
2787
|
// ../renderers/src/step/StepRenderer.tsx
|
|
2875
2788
|
var import_components38 = require("@transferwise/components");
|
|
2876
|
-
var
|
|
2789
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
2877
2790
|
var StepRenderer = {
|
|
2878
2791
|
canRenderType: "step",
|
|
2879
2792
|
render: StepRendererComponent
|
|
2880
2793
|
};
|
|
2881
2794
|
function StepRendererComponent(props) {
|
|
2882
2795
|
const { back, description, error, external, loadingState, title, trackEvent, children } = props;
|
|
2883
|
-
const value = (0,
|
|
2796
|
+
const value = (0, import_react14.useMemo)(() => ({ loadingState, trackEvent }), [loadingState, trackEvent]);
|
|
2884
2797
|
const { requiresUserConfirmation, dismissConfirmation } = useExternal(external == null ? void 0 : external.url);
|
|
2885
2798
|
if ((external == null ? void 0 : external.url) && requiresUserConfirmation) {
|
|
2886
|
-
return /* @__PURE__ */ (0,
|
|
2799
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(ExternalConfirmationDialog, { external, onClose: dismissConfirmation });
|
|
2887
2800
|
}
|
|
2888
|
-
return /* @__PURE__ */ (0,
|
|
2889
|
-
back ? /* @__PURE__ */ (0,
|
|
2890
|
-
title ? /* @__PURE__ */ (0,
|
|
2891
|
-
description ? /* @__PURE__ */ (0,
|
|
2892
|
-
error ? /* @__PURE__ */ (0,
|
|
2801
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(StepRendererContextProvider, { value, children: [
|
|
2802
|
+
back ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(BackButton_default, __spreadValues({}, back)) : null,
|
|
2803
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("h2", { className: "text-xs-center m-b-2", children: title }) : void 0,
|
|
2804
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "text-xs-center m-b-2", children: description }) : void 0,
|
|
2805
|
+
error ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_components38.Alert, { type: "negative", className: "m-b-2", message: error }) : void 0,
|
|
2893
2806
|
children
|
|
2894
2807
|
] });
|
|
2895
2808
|
}
|
|
@@ -2929,30 +2842,30 @@ var getWiseRenderers = () => [
|
|
|
2929
2842
|
];
|
|
2930
2843
|
|
|
2931
2844
|
// src/dynamicFlow/DynamicFlow.tsx
|
|
2932
|
-
var
|
|
2845
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
2933
2846
|
var wiseRenderers = getWiseRenderers();
|
|
2934
2847
|
function DynamicFlowLegacy(props) {
|
|
2935
2848
|
const { customFetch = globalThis.fetch } = props;
|
|
2936
2849
|
const coreProps = __spreadProps(__spreadValues({}, props), { httpClient: customFetch });
|
|
2937
|
-
return /* @__PURE__ */ (0,
|
|
2850
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_dynamic_flow_client2.DynamicFlow, __spreadValues({}, coreProps));
|
|
2938
2851
|
}
|
|
2939
2852
|
function DynamicFlowRevamp(props) {
|
|
2940
2853
|
const { customFetch = globalThis.fetch, renderers } = props;
|
|
2941
2854
|
const httpClient = useWiseHttpClient(customFetch);
|
|
2942
|
-
const mergedRenderers = (0,
|
|
2855
|
+
const mergedRenderers = (0, import_react15.useMemo)(() => [...renderers != null ? renderers : [], ...wiseRenderers], [renderers]);
|
|
2943
2856
|
const coreProps = __spreadProps(__spreadValues({}, props), { httpClient, renderers: mergedRenderers });
|
|
2944
|
-
return /* @__PURE__ */ (0,
|
|
2857
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(RendererHttpClientProvider, { httpClient, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_dynamic_flow_client2.DynamicFlowCoreRevamp, __spreadValues({}, coreProps)) });
|
|
2945
2858
|
}
|
|
2946
|
-
var DynamicFragment = (0,
|
|
2859
|
+
var DynamicFragment = (0, import_react15.forwardRef)(function DynamicFragment2(props, ref) {
|
|
2947
2860
|
const { customFetch = globalThis.fetch, renderers } = props;
|
|
2948
2861
|
const httpClient = useWiseHttpClient(customFetch);
|
|
2949
|
-
const mergedRenderers = (0,
|
|
2862
|
+
const mergedRenderers = (0, import_react15.useMemo)(() => [...renderers != null ? renderers : [], ...wiseRenderers], [renderers]);
|
|
2950
2863
|
const coreProps = __spreadProps(__spreadValues({}, props), { httpClient, renderers: mergedRenderers });
|
|
2951
|
-
return /* @__PURE__ */ (0,
|
|
2864
|
+
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(RendererHttpClientProvider, { httpClient, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_dynamic_flow_client2.DynamicFragmentCore, __spreadProps(__spreadValues({}, coreProps), { ref })) });
|
|
2952
2865
|
});
|
|
2953
2866
|
var useWiseHttpClient = (httpClient) => {
|
|
2954
2867
|
const { locale } = (0, import_react_intl13.useIntl)();
|
|
2955
|
-
return (0,
|
|
2868
|
+
return (0, import_react15.useCallback)(
|
|
2956
2869
|
async (input, init = {}) => {
|
|
2957
2870
|
const headers = new Headers(init.headers);
|
|
2958
2871
|
headers.set("accept-language", locale);
|