@wise/dynamic-flow-client 4.18.1 → 4.18.3

package/build/main.js

@@ -1958,7 +1958,7 @@ var selectInputComponentToProps = (component, rendererMapperProps) => {
   const _a = inputComponentToProps(component, "input-select"), { value } = _a, props = __objRest(_a, ["value"]);
   return __spreadProps(__spreadValues(__spreadValues({}, props), rendererMapperProps), {
     autoComplete,
-    options,
+    options: options.map((option) => __spreadValues(__spreadValues({}, option), mapMediaToLegacyProps(option.media))),
     selectedIndex,
     onSelect: onSelect.bind(component),
     children: rendererMapperProps.render(childrenProps),
@@ -2978,7 +2978,6 @@ var debounce = (callback, waitMs) => {
       clearTimer();
     }
   };
-  debouncedFn.isPending = () => timeoutId !== null;
   return debouncedFn;
 };
 
@@ -3503,23 +3502,51 @@ var isOrWasValid = (getErrors, previous, current) => {
 };
 
 // src/revamp/domain/features/schema-on-change/getDebouncedSchemaOnChange.ts
+var debounceDelay = 1e3;
 var getDebouncedSchemaOnChange = (onChange, getValidationErrors) => {
   if (!onChange) {
     return void 0;
   }
-  const debouncedOnChange = debounce(onChange, 1e3);
-  return onChange.behaviorType === "refresh" ? getSelectiveDebouncedSchemaOnChange(debouncedOnChange, getValidationErrors) : debouncedOnChange;
+  const performOnChange = onChange.behaviorType === "refresh" ? getSelectiveDebouncedSchemaOnChange(onChange, getValidationErrors) : debounce(onChange, debounceDelay);
+  return performOnChange;
 };
-var getSelectiveDebouncedSchemaOnChange = (debouncedOnChange, getValidationErrors) => {
-  const debouncedFn = (prevValue, updatedValue) => {
-    if (isOrWasValid(getValidationErrors, prevValue, updatedValue) || (debouncedOnChange == null ? void 0 : debouncedOnChange.isPending())) {
-      debouncedOnChange == null ? void 0 : debouncedOnChange();
+var getSelectiveDebouncedSchemaOnChange = (onChange, getValidationErrors) => {
+  let behaviorControl = { abort: () => {
+  } };
+  let timeoutId = null;
+  const clearTimer = () => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
     }
+    timeoutId = null;
   };
-  debouncedFn.flush = () => debouncedOnChange.flush();
-  debouncedFn.cancel = () => debouncedOnChange.cancel();
-  debouncedFn.isPending = () => debouncedOnChange.isPending();
-  return debouncedFn;
+  const flush = () => {
+    if (timeoutId !== null) {
+      void onChange().then((bc) => {
+        behaviorControl = bc;
+      });
+      clearTimer();
+    }
+  };
+  const debouncedOnChange = (prevValue, updatedValue) => {
+    var _a;
+    const valid = isOrWasValid(getValidationErrors, prevValue, updatedValue);
+    const isPending = timeoutId !== null;
+    if (valid || isPending) {
+      (_a = behaviorControl.abort) == null ? void 0 : _a.call(behaviorControl);
+      clearTimer();
+      timeoutId = setTimeout(() => flush(), debounceDelay);
+    }
+  };
+  debouncedOnChange.cancel = () => {
+    var _a;
+    clearTimer();
+    (_a = behaviorControl.abort) == null ? void 0 : _a.call(behaviorControl);
+  };
+  debouncedOnChange.flush = () => {
+    flush();
+  };
+  return debouncedOnChange;
 };
 
 // src/revamp/domain/features/validation/validation-functions.ts
@@ -3688,9 +3715,7 @@ var getSchemaOnChange = (schema, onBehavior) => {
   var _a, _b;
   const behavior = (_b = (_a = getBehaviorFromSchemaOnChange(schema)) != null ? _a : getBehaviorFromSchemaRefreshStepOnChange(schema)) != null ? _b : void 0;
   if (behavior) {
-    const onChange = () => {
-      void onBehavior(behavior);
-    };
+    const onChange = async () => onBehavior(behavior);
     onChange.behaviorType = behavior.type;
     return onChange;
   }
@@ -4064,9 +4089,9 @@ var schemaHasValidationAsync = (schema) => Boolean("validationAsync" in schema &
 
 // src/revamp/domain/features/summary/summary-utils.ts
 var getSummariser = (schema) => (value) => {
-  const { summary, icon, image } = schema;
+  const { summary, icon, image, media } = schema;
   const stringValueOrNull = isString(value) ? value : null;
-  return summaryIfProvides(summary, { value: stringValueOrNull, icon, image });
+  return summaryIfProvides(summary, { value: stringValueOrNull, icon, image, media });
 };
 var getConstSummary = (schema, model) => {
   const { summary, icon, image, media } = schema;
@@ -4795,7 +4820,7 @@ var createMultiSelectComponent = (multiSelectProps, updateComponent) => {
         draft.selectedIndices = indices;
         draft.errors = [];
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       const errors = getValidationErrors(this.getLocalValue());
       this._update((draft) => {
         draft.errors = errors;
@@ -5067,7 +5092,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
         draft.value = updatedValue;
         draft.base64Value = base64Value;
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       onValueChange();
       await (onPersistAsync == null ? void 0 : onPersistAsync().catch((e) => {
         this._update((draft) => {
@@ -5185,7 +5210,7 @@ var createBooleanInputComponent = (booleanInputProps, updateComponent) => {
         draft.errors = [];
         draft.value = updatedValue;
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       void (onPersistAsync == null ? void 0 : onPersistAsync().catch(() => {
       }));
       validateAsync == null ? void 0 : validateAsync(this, this.getLocalValue()).catch(() => {
@@ -5613,7 +5638,7 @@ var createSelectInputComponent = (selectProps, updateComponent) => {
         draft.errors = [];
         draft.selectedIndex = updatedIndex;
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       onValueChange();
     },
     validate() {
@@ -5750,7 +5775,7 @@ var createDateInputComponent = (textInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       if (isOrWasValid(getValidationErrors, prevValue, updatedValue)) {
-        schemaOnChange == null ? void 0 : schemaOnChange();
+        void (schemaOnChange == null ? void 0 : schemaOnChange());
       }
       onValueChange();
       if (getValidationErrors(updatedValue).length === 0) {
@@ -6098,7 +6123,7 @@ var createPersistAsyncComponent = (props, performPersistAsync, schemaOnChange, u
           draft.submission = resolvedNull;
           draft.errors = [];
         });
-        schemaOnChange == null ? void 0 : schemaOnChange();
+        void (schemaOnChange == null ? void 0 : schemaOnChange());
         return resolvedNull;
       }
       const { signal } = newAbortController;
@@ -6107,7 +6132,7 @@ var createPersistAsyncComponent = (props, performPersistAsync, schemaOnChange, u
           draft.lastResponse = token;
           draft.errors = [];
         });
-        schemaOnChange == null ? void 0 : schemaOnChange();
+        void (schemaOnChange == null ? void 0 : schemaOnChange());
         return token;
       }).catch((error) => {
         if (error instanceof DOMException && error.name === "AbortError") {
@@ -7044,8 +7069,12 @@ function useDynamicFlowCore(props) {
       }
       case "refresh": {
         rootComponentRef.current.dismissAllModals();
-        await onRefresh({ refreshUrl: behavior.url, analytics: behavior.analytics });
-        break;
+        void onRefresh({ refreshUrl: behavior.url, analytics: behavior.analytics });
+        return {
+          abort: () => {
+            abortControllerRef.current.abort();
+          }
+        };
       }
       case "link": {
         onLink(behavior.url);
@@ -7073,6 +7102,8 @@ function useDynamicFlowCore(props) {
       case "none":
         break;
     }
+    return { abort: () => {
+    } };
   }, []);
   const onAction = (0, import_react3.useCallback)(async (action, model) => {
     var _a2, _b, _c, _d, _e, _f;

package/build/main.mjs

@@ -1915,7 +1915,7 @@ var selectInputComponentToProps = (component, rendererMapperProps) => {
   const _a = inputComponentToProps(component, "input-select"), { value } = _a, props = __objRest(_a, ["value"]);
   return __spreadProps(__spreadValues(__spreadValues({}, props), rendererMapperProps), {
     autoComplete,
-    options,
+    options: options.map((option) => __spreadValues(__spreadValues({}, option), mapMediaToLegacyProps(option.media))),
     selectedIndex,
     onSelect: onSelect.bind(component),
     children: rendererMapperProps.render(childrenProps),
@@ -2935,7 +2935,6 @@ var debounce = (callback, waitMs) => {
       clearTimer();
     }
   };
-  debouncedFn.isPending = () => timeoutId !== null;
   return debouncedFn;
 };
 
@@ -3460,23 +3459,51 @@ var isOrWasValid = (getErrors, previous, current) => {
 };
 
 // src/revamp/domain/features/schema-on-change/getDebouncedSchemaOnChange.ts
+var debounceDelay = 1e3;
 var getDebouncedSchemaOnChange = (onChange, getValidationErrors) => {
   if (!onChange) {
     return void 0;
   }
-  const debouncedOnChange = debounce(onChange, 1e3);
-  return onChange.behaviorType === "refresh" ? getSelectiveDebouncedSchemaOnChange(debouncedOnChange, getValidationErrors) : debouncedOnChange;
+  const performOnChange = onChange.behaviorType === "refresh" ? getSelectiveDebouncedSchemaOnChange(onChange, getValidationErrors) : debounce(onChange, debounceDelay);
+  return performOnChange;
 };
-var getSelectiveDebouncedSchemaOnChange = (debouncedOnChange, getValidationErrors) => {
-  const debouncedFn = (prevValue, updatedValue) => {
-    if (isOrWasValid(getValidationErrors, prevValue, updatedValue) || (debouncedOnChange == null ? void 0 : debouncedOnChange.isPending())) {
-      debouncedOnChange == null ? void 0 : debouncedOnChange();
+var getSelectiveDebouncedSchemaOnChange = (onChange, getValidationErrors) => {
+  let behaviorControl = { abort: () => {
+  } };
+  let timeoutId = null;
+  const clearTimer = () => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
     }
+    timeoutId = null;
   };
-  debouncedFn.flush = () => debouncedOnChange.flush();
-  debouncedFn.cancel = () => debouncedOnChange.cancel();
-  debouncedFn.isPending = () => debouncedOnChange.isPending();
-  return debouncedFn;
+  const flush = () => {
+    if (timeoutId !== null) {
+      void onChange().then((bc) => {
+        behaviorControl = bc;
+      });
+      clearTimer();
+    }
+  };
+  const debouncedOnChange = (prevValue, updatedValue) => {
+    var _a;
+    const valid = isOrWasValid(getValidationErrors, prevValue, updatedValue);
+    const isPending = timeoutId !== null;
+    if (valid || isPending) {
+      (_a = behaviorControl.abort) == null ? void 0 : _a.call(behaviorControl);
+      clearTimer();
+      timeoutId = setTimeout(() => flush(), debounceDelay);
+    }
+  };
+  debouncedOnChange.cancel = () => {
+    var _a;
+    clearTimer();
+    (_a = behaviorControl.abort) == null ? void 0 : _a.call(behaviorControl);
+  };
+  debouncedOnChange.flush = () => {
+    flush();
+  };
+  return debouncedOnChange;
 };
 
 // src/revamp/domain/features/validation/validation-functions.ts
@@ -3645,9 +3672,7 @@ var getSchemaOnChange = (schema, onBehavior) => {
   var _a, _b;
   const behavior = (_b = (_a = getBehaviorFromSchemaOnChange(schema)) != null ? _a : getBehaviorFromSchemaRefreshStepOnChange(schema)) != null ? _b : void 0;
   if (behavior) {
-    const onChange = () => {
-      void onBehavior(behavior);
-    };
+    const onChange = async () => onBehavior(behavior);
     onChange.behaviorType = behavior.type;
     return onChange;
   }
@@ -4021,9 +4046,9 @@ var schemaHasValidationAsync = (schema) => Boolean("validationAsync" in schema &
 
 // src/revamp/domain/features/summary/summary-utils.ts
 var getSummariser = (schema) => (value) => {
-  const { summary, icon, image } = schema;
+  const { summary, icon, image, media } = schema;
   const stringValueOrNull = isString(value) ? value : null;
-  return summaryIfProvides(summary, { value: stringValueOrNull, icon, image });
+  return summaryIfProvides(summary, { value: stringValueOrNull, icon, image, media });
 };
 var getConstSummary = (schema, model) => {
   const { summary, icon, image, media } = schema;
@@ -4752,7 +4777,7 @@ var createMultiSelectComponent = (multiSelectProps, updateComponent) => {
         draft.selectedIndices = indices;
         draft.errors = [];
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       const errors = getValidationErrors(this.getLocalValue());
       this._update((draft) => {
         draft.errors = errors;
@@ -5024,7 +5049,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
         draft.value = updatedValue;
         draft.base64Value = base64Value;
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       onValueChange();
       await (onPersistAsync == null ? void 0 : onPersistAsync().catch((e) => {
         this._update((draft) => {
@@ -5142,7 +5167,7 @@ var createBooleanInputComponent = (booleanInputProps, updateComponent) => {
         draft.errors = [];
         draft.value = updatedValue;
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       void (onPersistAsync == null ? void 0 : onPersistAsync().catch(() => {
       }));
       validateAsync == null ? void 0 : validateAsync(this, this.getLocalValue()).catch(() => {
@@ -5570,7 +5595,7 @@ var createSelectInputComponent = (selectProps, updateComponent) => {
         draft.errors = [];
         draft.selectedIndex = updatedIndex;
       });
-      schemaOnChange == null ? void 0 : schemaOnChange();
+      void (schemaOnChange == null ? void 0 : schemaOnChange());
       onValueChange();
     },
     validate() {
@@ -5707,7 +5732,7 @@ var createDateInputComponent = (textInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       if (isOrWasValid(getValidationErrors, prevValue, updatedValue)) {
-        schemaOnChange == null ? void 0 : schemaOnChange();
+        void (schemaOnChange == null ? void 0 : schemaOnChange());
       }
       onValueChange();
       if (getValidationErrors(updatedValue).length === 0) {
@@ -6055,7 +6080,7 @@ var createPersistAsyncComponent = (props, performPersistAsync, schemaOnChange, u
           draft.submission = resolvedNull;
           draft.errors = [];
         });
-        schemaOnChange == null ? void 0 : schemaOnChange();
+        void (schemaOnChange == null ? void 0 : schemaOnChange());
         return resolvedNull;
       }
       const { signal } = newAbortController;
@@ -6064,7 +6089,7 @@ var createPersistAsyncComponent = (props, performPersistAsync, schemaOnChange, u
           draft.lastResponse = token;
           draft.errors = [];
         });
-        schemaOnChange == null ? void 0 : schemaOnChange();
+        void (schemaOnChange == null ? void 0 : schemaOnChange());
         return token;
       }).catch((error) => {
         if (error instanceof DOMException && error.name === "AbortError") {
@@ -7001,8 +7026,12 @@ function useDynamicFlowCore(props) {
       }
       case "refresh": {
         rootComponentRef.current.dismissAllModals();
-        await onRefresh({ refreshUrl: behavior.url, analytics: behavior.analytics });
-        break;
+        void onRefresh({ refreshUrl: behavior.url, analytics: behavior.analytics });
+        return {
+          abort: () => {
+            abortControllerRef.current.abort();
+          }
+        };
       }
       case "link": {
         onLink(behavior.url);
@@ -7030,6 +7059,8 @@ function useDynamicFlowCore(props) {
       case "none":
         break;
     }
+    return { abort: () => {
+    } };
   }, []);
   const onAction = useCallback2(async (action, model) => {
     var _a2, _b, _c, _d, _e, _f;

package/build/types/revamp/domain/components/utils/debounce.d.ts

@@ -2,6 +2,5 @@ export interface DebouncedFunc<T extends (...args: Parameters<T>) => ReturnType<
     (...args: Parameters<T>): void;
     cancel: () => void;
     flush: () => void;
-    isPending: () => boolean;
 }
 export declare const debounce: <T extends (...args: Parameters<T>) => ReturnType<T>>(callback: T, waitMs: number) => DebouncedFunc<T>;

package/build/types/revamp/domain/features/schema-on-change/getDebouncedSchemaOnChange.d.ts

@@ -4,7 +4,6 @@ type DebouncedSchemaOnChange<V extends LocalValue> = {
     (prevValue: V, updatedValue: V): void;
     cancel: () => void;
     flush: () => void;
-    isPending: () => boolean;
 };
 export declare const getDebouncedSchemaOnChange: <V extends LocalValue>(onChange: SchemaOnChange | undefined, getValidationErrors: (value: V) => string[]) => DebouncedSchemaOnChange<V> | undefined;
 export {};

package/build/types/revamp/domain/features/schema-on-change/getSchemaOnChange.d.ts

@@ -1,7 +1,7 @@
 import { Schema } from '@wise/dynamic-flow-types/build/next';
 import { Behavior, OnBehavior } from '../../types';
 export type SchemaOnChange = {
-    (): void;
+    (): ReturnType<OnBehavior>;
     behaviorType: Behavior['type'];
 };
 export declare const getSchemaOnChange: (schema: Schema, onBehavior: OnBehavior) => SchemaOnChange | undefined;

package/build/types/revamp/domain/types.d.ts

@@ -153,7 +153,10 @@ export type BaseInputComponent<LV extends LocalValue> = BaseSchemaComponent<LV>
     onFocus: () => void;
 };
 export type UpdateComponent = () => void;
-export type OnBehavior = (behavior: Behavior) => Promise<void>;
+export type OnBehavior = (behavior: Behavior) => Promise<BehaviorController>;
+export type BehaviorController = {
+    abort: () => void;
+};
 export type OnPoll = (url: string, errorBehavior: Behavior, signal: AbortSignal) => Promise<boolean>;
 export type OnLink = (url: string) => boolean;
 export type OnValueChange = () => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/dynamic-flow-client",
-  "version": "4.18.1",
+  "version": "4.18.3",
   "description": "Dynamic Flow web client",
   "license": "Apache-2.0",
   "main": "./build/main.js",