@wise/dynamic-flow-client-internal 5.19.4-exp-scroll-to-errors-d7a48a2 → 5.19.4-exp-scroll-flag-849755e

package/build/main.js

@@ -934,13 +934,14 @@ function FieldInput({
   description,
   help,
   loadingState = "idle",
-  inlineAlert
+  inlineAlert,
+  isFeatureEnabled
 }) {
   const labelContent = label && help ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LabelContentWithHelp, { text: label, help }) : label;
   const message = validation == null ? void 0 : validation.message;
   const ref = (0, import_react4.useRef)(null);
   (0, import_react4.useEffect)(() => {
-    if (message) {
+    if (message && isFeatureEnabled("scrollToErrors")) {
       scrollToIfNotVisible(ref.current);
     }
   }, [message]);
@@ -1044,6 +1045,7 @@ var CheckboxComponent = (props) => {
       help,
       inlineAlert: rest.inlineAlert,
       loadingState: rest.fieldLoadingState,
+      isFeatureEnabled: rest.isFeatureEnabled,
       children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_components11.Checkbox, __spreadValues({ id }, checkboxProps))
     }
   );
@@ -1241,6 +1243,7 @@ var DateInputRenderer = {
         inlineAlert: props.inlineAlert,
         loadingState: props.fieldLoadingState,
         help,
+        isFeatureEnabled: props.isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(VariableDateInput_default, { control, inputProps })
       }
     );
@@ -1930,6 +1933,7 @@ var IntegerInputRenderer = {
         inlineAlert: props.inlineAlert,
         loadingState: props.fieldLoadingState,
         help,
+        isFeatureEnabled: props.isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_components23.InputGroup, { addonStart: getInputGroupAddonStart(media), children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
           import_components23.Input,
           __spreadValues({
@@ -2193,6 +2197,7 @@ function MoneyInputRendererComponent(props) {
       description,
       validation: validationState,
       help,
+      isFeatureEnabled: props.isFeatureEnabled,
       children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         import_components31.MoneyInput,
         {
@@ -2277,6 +2282,7 @@ function InlineComponent(props) {
       help,
       description,
       validation: validationState,
+      isFeatureEnabled: props.isFeatureEnabled,
       children: options.map((option, index) => {
         var _a;
         const {
@@ -2389,6 +2395,7 @@ function DefaultComponent(props) {
       help,
       description,
       validation: validationState,
+      isFeatureEnabled: props.isFeatureEnabled,
       children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
         import_components33.SelectInput,
         __spreadValues({
@@ -2450,6 +2457,7 @@ function InlineCheckboxComponent(props) {
       help,
       description,
       validation: validationState,
+      isFeatureEnabled: props.isFeatureEnabled,
       children: options.map((option, index) => {
         var _a;
         const {
@@ -2496,9 +2504,9 @@ var MultiSelectInputRenderer = {
 var import_components36 = require("@transferwise/components");
 
 // ../renderers/src/components/UploadFieldInput.tsx
-var import_react13 = require("react");
 var import_components35 = require("@transferwise/components");
 var import_classnames4 = __toESM(require_classnames());
+var import_react13 = require("react");
 var import_jsx_runtime57 = require("react/jsx-runtime");
 function UploadFieldInput({
   id,
@@ -2506,14 +2514,15 @@ function UploadFieldInput({
   label,
   description,
   help,
-  validation
+  validation,
+  isFeatureEnabled
 }) {
   const labelContent = label && help ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(LabelContentWithHelp, { text: label, help }) : label;
   const descriptionId = description ? `${id}-description` : void 0;
   const message = validation == null ? void 0 : validation.message;
   const ref = (0, import_react13.useRef)(null);
   (0, import_react13.useEffect)(() => {
-    if (message) {
+    if (message && isFeatureEnabled("scrollToErrors")) {
       scrollToIfNotVisible(ref.current);
     }
   }, [message]);
@@ -2578,6 +2587,7 @@ var MultiUploadInputRenderer = {
       uploadLabel,
       validationState,
       value,
+      isFeatureEnabled,
       onInsertFile,
       onRemoveFile
     } = props;
@@ -2595,6 +2605,7 @@ var MultiUploadInputRenderer = {
         description,
         validation: validationState,
         help,
+        isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
           import_components36.UploadInput,
           {
@@ -2648,6 +2659,7 @@ var NumberInputRenderer = {
         inlineAlert: props.inlineAlert,
         loadingState: props.fieldLoadingState,
         help,
+        isFeatureEnabled: props.isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_components37.InputGroup, { addonStart: getInputGroupAddonStart(media), children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
           import_components37.Input,
           __spreadValues({
@@ -3096,29 +3108,41 @@ function BlockSearchRendererComponent({
   query,
   state,
   title,
+  isFeatureEnabled,
   trackEvent,
   onChange
 }) {
   const [hasSearched, setHasSearched] = (0, import_react16.useState)(false);
   const { formatMessage } = (0, import_react_intl22.useIntl)();
   return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: getMargin(margin), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(FieldInput_default, { id, description: "", validation: void 0, help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_components45.InputGroup, { addonStart: { content: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_icons3.Search, { size: 24 }) }, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-      import_components45.Input,
+    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      FieldInput_default,
       {
         id,
-        name: id,
-        placeholder: hint,
-        type: "text",
-        value: query,
-        onChange: ({ currentTarget: { value } }) => {
-          if (!hasSearched) {
-            setHasSearched(true);
-            trackEvent("Search Started");
+        description: "",
+        validation: void 0,
+        help: "",
+        label: title,
+        isFeatureEnabled,
+        children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_components45.InputGroup, { addonStart: { content: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_icons3.Search, { size: 24 }) }, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+          import_components45.Input,
+          {
+            id,
+            name: id,
+            placeholder: hint,
+            type: "text",
+            value: query,
+            onChange: ({ currentTarget: { value } }) => {
+              if (!hasSearched) {
+                setHasSearched(true);
+                trackEvent("Search Started");
+              }
+              onChange(value);
+            }
           }
-          onChange(value);
-        }
+        ) })
       }
-    ) }) }),
+    ),
     isLoading ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("span", { children: formatMessage(search_messages_default.loading) }) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(SearchResultContent, { state, trackEvent })
   ] });
 }
@@ -3191,46 +3215,58 @@ function InlineSearchRenderer({
   onChange,
   state,
   title,
+  isFeatureEnabled,
   trackEvent
 }) {
   const [hasSearched, setHasSearched] = (0, import_react17.useState)(false);
   const intl = (0, import_react_intl23.useIntl)();
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(FieldInput_default, { id, description: "", validation: void 0, help: "", label: title, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
-    import_components46.Typeahead,
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: getMargin(margin), children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+    FieldInput_default,
     {
-      id: "typeahead-input-id",
-      intl,
-      name: "typeahead-input-name",
-      size: "md",
-      placeholder: hint,
-      maxHeight: 100,
-      footer: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(TypeaheadFooter, { state, isLoading }),
-      multiple: false,
-      clearable: false,
-      addon: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_icons4.Search, { size: 24 }),
-      options: state.type === "results" ? state.results.map(mapResultToTypeaheadOption) : [],
-      minQueryLength: 1,
-      onChange: (values) => {
-        if (values.length > 0) {
-          const [updatedValue] = values;
-          const { value: result } = updatedValue;
-          if (result) {
-            trackEvent("Search Result Selected", __spreadValues({
-              type: result.type
-            }, result.type === "action" ? { actionId: result.id } : {}));
-            result.onClick();
+      id,
+      description: "",
+      validation: void 0,
+      help: "",
+      label: title,
+      isFeatureEnabled,
+      children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+        import_components46.Typeahead,
+        {
+          id: "typeahead-input-id",
+          intl,
+          name: "typeahead-input-name",
+          size: "md",
+          placeholder: hint,
+          maxHeight: 100,
+          footer: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(TypeaheadFooter, { state, isLoading }),
+          multiple: false,
+          clearable: false,
+          addon: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_icons4.Search, { size: 24 }),
+          options: state.type === "results" ? state.results.map(mapResultToTypeaheadOption) : [],
+          minQueryLength: 1,
+          onChange: (values) => {
+            if (values.length > 0) {
+              const [updatedValue] = values;
+              const { value: result } = updatedValue;
+              if (result) {
+                trackEvent("Search Result Selected", __spreadValues({
+                  type: result.type
+                }, result.type === "action" ? { actionId: result.id } : {}));
+                result.onClick();
+              }
+            }
+          },
+          onInputChange: (query) => {
+            if (!hasSearched) {
+              setHasSearched(true);
+              trackEvent("Search Started");
+            }
+            onChange(query);
           }
         }
-      },
-      onInputChange: (query) => {
-        if (!hasSearched) {
-          setHasSearched(true);
-          trackEvent("Search Started");
-        }
-        onChange(query);
-      }
+      )
     }
-  ) }) });
+  ) });
 }
 function mapResultToTypeaheadOption(result) {
   return {
@@ -3318,6 +3354,7 @@ function RadioInputRendererComponent(props) {
     options,
     selectedIndex,
     validationState,
+    isFeatureEnabled,
     onSelect
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
@@ -3329,6 +3366,7 @@ function RadioInputRendererComponent(props) {
         help,
         description,
         validation: validationState,
+        isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
           import_components48.RadioGroup,
           {
@@ -3366,6 +3404,7 @@ function TabInputRendererComponent(props) {
     options,
     selectedIndex,
     validationState,
+    isFeatureEnabled,
     onSelect
   } = props;
   (0, import_react18.useEffect)(() => {
@@ -3382,6 +3421,7 @@ function TabInputRendererComponent(props) {
         help,
         description,
         validation: validationState,
+        isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
           import_components49.Tabs,
           {
@@ -3460,6 +3500,7 @@ function SelectInputRendererComponent(props) {
         help,
         description,
         validation: validationState,
+        isFeatureEnabled: props.isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
           import_components50.SelectInput,
           __spreadValues({
@@ -3494,6 +3535,7 @@ function SegmentedInputRendererComponent(props) {
     options,
     selectedIndex,
     validationState,
+    isFeatureEnabled,
     onSelect
   } = props;
   (0, import_react19.useEffect)(() => {
@@ -3510,6 +3552,7 @@ function SegmentedInputRendererComponent(props) {
         help,
         description,
         validation: validationState,
+        isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
           import_components51.SegmentedControl,
           {
@@ -4094,6 +4137,7 @@ var TextInputRenderer = {
         inlineAlert: props.inlineAlert,
         loadingState: props.fieldLoadingState,
         help,
+        isFeatureEnabled: props.isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_components61.InputGroup, { addonStart: getInputGroupAddonStart(media), children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(VariableTextInput, __spreadValues({}, inputProps)) })
       }
     );
@@ -4112,7 +4156,18 @@ var import_jsx_runtime88 = require("react/jsx-runtime");
 var UploadInputRenderer = {
   canRenderType: "input-upload",
   render: (props) => {
-    const { id, accepts, title, description, disabled, maxSize, validationState, value, onUpload } = props;
+    const {
+      id,
+      accepts,
+      title,
+      description,
+      disabled,
+      maxSize,
+      validationState,
+      value,
+      isFeatureEnabled,
+      onUpload
+    } = props;
     const onUploadFile = async (formData) => {
       const file = formData.get("file");
       return onUpload(file).then(() => ({
@@ -4131,6 +4186,7 @@ var UploadInputRenderer = {
           label: void 0,
           description: void 0,
           validation: validationState,
+          isFeatureEnabled,
           children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
             import_components62.UploadInput,
             {
@@ -4205,6 +4261,7 @@ var LargeUploadRenderer = {
         description,
         validation: validationState,
         help,
+        isFeatureEnabled: rest.isFeatureEnabled,
         children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
           import_components62.Upload,
           __spreadProps(__spreadValues({}, uploadProps), {