@wise/dynamic-flow-client 5.17.0 → 5.17.2

package/build/main.mjs

@@ -2152,7 +2152,7 @@ var debounce = (callback, waitMs) => {
   let timeoutId = null;
   let lastArgs = null;
   const clearTimer = () => {
-    if (timeoutId) {
+    if (timeoutId !== null) {
       clearTimeout(timeoutId);
       timeoutId = null;
     }
@@ -2981,7 +2981,7 @@ var executeRequest = async (props) => {
       url,
       {
         method,
-        body: body ? JSON.stringify(body) : void 0,
+        body: body != null ? JSON.stringify(body) : void 0,
         headers: { "Content-Type": "application/json" }
       }
     ],
@@ -3375,6 +3375,7 @@ var createNumberInputComponent = (props, onComponentUpdate) => {
     "summariser"
   ]);
   const update = getInputUpdateFunction(onComponentUpdate);
+  const onValueChangeDebounced = debounce(onValueChange, 1e3);
   const getValidationErrors = getLocalValueValidator(checks);
   const performOnChange = getDebouncedSchemaOnChange(schemaOnChange, getValidationErrors);
   const validateAsync = performValidationAsync ? getDebouncedComponentValidationAsync(update, performValidationAsync) : void 0;
@@ -3391,6 +3392,7 @@ var createNumberInputComponent = (props, onComponentUpdate) => {
         }));
         validateAsync == null ? void 0 : validateAsync.flush();
       }
+      onValueChangeDebounced.flush();
     },
     onFocus() {
     },
@@ -3407,7 +3409,7 @@ var createNumberInputComponent = (props, onComponentUpdate) => {
       if (isValid) {
         validateAsync == null ? void 0 : validateAsync(component, updatedValue);
       }
-      onValueChange();
+      onValueChangeDebounced();
     },
     async getSubmittableValue() {
       return component.getSubmittableValueSync();
@@ -3600,11 +3602,14 @@ var getRequiredCheck = (required, messageFunctions) => (value) => {
   if (isArray(value) && value.length === 0) {
     return messageFunctions.required();
   }
-  if (value === "") {
-    return messageFunctions.required();
-  }
   return isNullish(value) ? messageFunctions.required() : null;
 };
+var getStringRequiredCheck = (required, messageFunctions) => (value) => {
+  if (!required) {
+    return null;
+  }
+  return isNullish(value) || value === "" ? messageFunctions.required() : null;
+};
 var getValidDateCheck = (required, messageFunctions) => (value) => {
   if (required && !isValidDate(value)) {
     return messageFunctions.required();
@@ -3866,9 +3871,16 @@ var schemaHasPlaceholder = (schema) => Boolean("placeholder" in schema && schema
 
 // src/domain/mappers/schema/numberSchemaToComponent.ts
 var numberSchemaToComponent = (schemaMapperProps, mapperProps) => {
-  const { schema, model, localValue, required = false, onPersistAsync } = schemaMapperProps;
+  const {
+    schema,
+    model,
+    localValue,
+    required = false,
+    onPersistAsync,
+    onValueChange
+  } = schemaMapperProps;
   const { autocompleteHint, validationMessages, default: defaultValue, maximum, minimum } = schema;
-  const { getErrorMessageFunctions, onComponentUpdate, onBehavior, onValueChange } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate, onBehavior } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performValidationAsync, validationAsyncState } = getValidationAsyncInitialState(
     schemaMapperProps,
@@ -3973,7 +3985,7 @@ var createAllOfComponent = (props) => {
 
 // src/domain/mappers/schema/allOfSchemaToComponent.ts
 var allOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
-  const { uid, schema, localValue, model, required, validationErrors } = schemaMapperProps;
+  const { uid, schema, localValue, model, required, validationErrors, onValueChange } = schemaMapperProps;
   const { allOf } = schema;
   const components = allOf.map(
     (childSchema, index) => mapSchemaToComponent(
@@ -3983,7 +3995,8 @@ var allOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
         model,
         localValue,
         required,
-        validationErrors
+        validationErrors,
+        onValueChange
       },
       mapperProps
     )
@@ -4121,7 +4134,8 @@ var arraySchemaToRepeatableComponent = (schemaMapperProps, mapperProps) => {
     schema,
     model: initialModel,
     required = false,
-    validationErrors
+    validationErrors,
+    onValueChange
   } = schemaMapperProps;
   const { items, addItemTitle, editItemTitle, maxItems, minItems, summary } = schema;
   const value = isArray(localValue) ? localValue : [];
@@ -4133,7 +4147,8 @@ var arraySchemaToRepeatableComponent = (schemaMapperProps, mapperProps) => {
         model: item,
         localValue: value == null ? void 0 : value[index],
         // TODO tests for this
-        validationErrors
+        validationErrors,
+        onValueChange
       },
       mapperProps
     )
@@ -4145,11 +4160,11 @@ var arraySchemaToRepeatableComponent = (schemaMapperProps, mapperProps) => {
       localValue: editableValue,
       model: localValueToJsonElement(editableValue),
       validationErrors: void 0,
-      required: true
+      required: true,
+      onValueChange
     },
     mapperProps
   );
-  const { onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(schema.validationMessages);
   return createRepeatableComponent(
     __spreadProps(__spreadValues({}, mapCommonSchemaProps(schemaMapperProps)), {
@@ -4433,7 +4448,7 @@ var schemaHasValidationMessages = (schema) => Boolean("validationMessages" in sc
 var arraySchemaToMultiUploadComponent = (schemaMapperProps, mapperProps) => {
   var _a;
   const { getErrorMessageFunctions } = mapperProps;
-  const { localValue, model, schema, required = false } = schemaMapperProps;
+  const { localValue, model, schema, required = false, onValueChange } = schemaMapperProps;
   const uploadSchema = getUploadSchema(schema.items);
   const { accepts, cameraConfig, maxSize } = uploadSchema;
   const { minItems, maxItems, title, validationMessages } = schema;
@@ -4454,7 +4469,6 @@ var arraySchemaToMultiUploadComponent = (schemaMapperProps, mapperProps) => {
     persistAsyncConfig,
     schema: __spreadProps(__spreadValues({}, uploadSchema), { hidden: (_a = schema.hidden) != null ? _a : uploadSchema.hidden, alert: schema.alert })
   });
-  const { onValueChange } = mapperProps;
   const performPersistAsync = persistAsyncConfig ? getPerformPersistAsyncFn(combinedSchemaProps.schema, persistAsyncConfig, mapperProps) : void 0;
   const value = performPersistAsync ? getValueForPersistAsync(localValue) : [];
   const persistedState = performPersistAsync && isArray(model) ? model.map((itemModel) => getInitialPersistedState(null, itemModel)) : [];
@@ -4605,7 +4619,8 @@ var arraySchemaToMultiSelectComponent = (schemaMapperProps, mapperProps) => {
     schema,
     model,
     required = false,
-    validationErrors: initialError
+    validationErrors: initialError,
+    onValueChange
   } = schemaMapperProps;
   const initialModel = model != null ? model : null;
   const options = schema.items.oneOf.map((childSchema, index) => {
@@ -4629,14 +4644,15 @@ var arraySchemaToMultiSelectComponent = (schemaMapperProps, mapperProps) => {
           model: initialModel,
           localValue,
           validationErrors: initialError,
-          required
+          required,
+          onValueChange
         },
         mapperProps
       )
     };
   });
   const { maxItems, minItems, title, validationMessages } = schema;
-  const { getErrorMessageFunctions, onBehavior, onValueChange, onComponentUpdate } = mapperProps;
+  const { getErrorMessageFunctions, onBehavior, onComponentUpdate } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performValidationAsync, validationAsyncState } = getValidationAsyncInitialState(
     schemaMapperProps,
@@ -4730,7 +4746,8 @@ var arraySchemaToTupleComponent = (schemaMapperProps, mapperProps) => {
     schema,
     model: initialModel,
     required = false,
-    validationErrors
+    validationErrors,
+    onValueChange
   } = schemaMapperProps;
   const { items } = schema;
   const components = items.map(
@@ -4743,7 +4760,8 @@ var arraySchemaToTupleComponent = (schemaMapperProps, mapperProps) => {
           model: isArray(initialModel) ? (_a = initialModel[index]) != null ? _a : null : null,
           localValue: isArray(localValue) ? (_b = localValue[index]) != null ? _b : null : null,
           validationErrors: isArray(validationErrors) ? validationErrors[index] : void 0,
-          required
+          required,
+          onValueChange
         },
         mapperProps
       );
@@ -4867,9 +4885,16 @@ var createUploadInputComponent = (props, onComponentUpdate) => {
 
 // src/domain/mappers/schema/blobSchemaToComponent.ts
 var blobSchemaToComponent = (schemaMapperProps, mapperProps) => {
-  const { schema, localValue, model, required = false, onPersistAsync } = schemaMapperProps;
+  const {
+    schema,
+    localValue,
+    model,
+    required = false,
+    onPersistAsync,
+    onValueChange
+  } = schemaMapperProps;
   const { accepts, cameraConfig, maxSize, source, validationMessages } = schema;
-  const { getErrorMessageFunctions, onComponentUpdate, onValueChange } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const validLocalValue = isFile(localValue) ? localValue : null;
   const value = onPersistAsync && model !== null ? validLocalValue : null;
@@ -4957,9 +4982,9 @@ var createBooleanInputComponent = (props, onComponentUpdate) => {
 
 // src/domain/mappers/schema/booleanSchemaToComponent.ts
 var booleanSchemaToComponent = (schemaMapperProps, mapperProps) => {
-  const { schema, localValue, model, onPersistAsync } = schemaMapperProps;
+  const { schema, localValue, model, onPersistAsync, onValueChange } = schemaMapperProps;
   const { default: defaultValue, additionalText, inlineAlert, supportingValues } = schema;
-  const { onComponentUpdate, onBehavior, onValueChange } = mapperProps;
+  const { onComponentUpdate, onBehavior } = mapperProps;
   const schemaOnChange = getSchemaOnChange(schema, onBehavior);
   const { performValidationAsync, validationAsyncState } = getValidationAsyncInitialState(
     schemaMapperProps,
@@ -5060,6 +5085,7 @@ var createIntegerInputComponent = (props, onComponentUpdate) => {
     "summariser"
   ]);
   const update = getInputUpdateFunction(onComponentUpdate);
+  const onValueChangeDebounced = debounce(onValueChange, 1e3);
   const getValidationErrors = getLocalValueValidator(checks);
   const performOnChange = getDebouncedSchemaOnChange(schemaOnChange, getValidationErrors);
   const validateAsync = performValidationAsync ? getDebouncedComponentValidationAsync(update, performValidationAsync) : void 0;
@@ -5077,6 +5103,7 @@ var createIntegerInputComponent = (props, onComponentUpdate) => {
         }));
         validateAsync == null ? void 0 : validateAsync.flush();
       }
+      onValueChangeDebounced.flush();
     },
     onFocus() {
     },
@@ -5093,7 +5120,7 @@ var createIntegerInputComponent = (props, onComponentUpdate) => {
       if (isValid) {
         validateAsync == null ? void 0 : validateAsync(component, updatedValue);
       }
-      onValueChange();
+      onValueChangeDebounced();
     },
     async getSubmittableValue() {
       return component.getSubmittableValueSync();
@@ -5121,9 +5148,16 @@ var createIntegerInputComponent = (props, onComponentUpdate) => {
 
 // src/domain/mappers/schema/integerSchemaToComponent.ts
 var integerSchemaToComponent = (schemaMapperProps, mapperProps) => {
-  const { schema, localValue, model, required = false, onPersistAsync } = schemaMapperProps;
+  const {
+    schema,
+    localValue,
+    model,
+    required = false,
+    onPersistAsync,
+    onValueChange
+  } = schemaMapperProps;
   const { autocompleteHint, validationMessages, default: defaultValue, maximum, minimum } = schema;
-  const { getErrorMessageFunctions, onComponentUpdate, onBehavior, onValueChange } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate, onBehavior } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performValidationAsync, validationAsyncState } = getValidationAsyncInitialState(
     schemaMapperProps,
@@ -5445,7 +5479,7 @@ var objectSchemaToObjectComponent = (schemaMapperProps, mapperProps) => {
   }));
 };
 var createComponentMap = (schemaMapperProps, mapperProps, uidPrefix) => {
-  const { uid, localValue, schema, model, validationErrors } = schemaMapperProps;
+  const { uid, localValue, schema, model, validationErrors, onValueChange } = schemaMapperProps;
   const { $id, displayOrder, properties, required } = schema;
   const initialReducerValue = {};
   return displayOrder.reduce((acc, propName) => {
@@ -5462,7 +5496,8 @@ var createComponentMap = (schemaMapperProps, mapperProps, uidPrefix) => {
           model: isObjectModel(model) ? model[propName] : null,
           localValue: isObjectLocalValue(localValue) ? localValue[propName] : null,
           required: (_a = required == null ? void 0 : required.includes(propName)) != null ? _a : false,
-          validationErrors: isObject(validationErrors) ? validationErrors[propName] : void 0
+          validationErrors: isObject(validationErrors) ? validationErrors[propName] : void 0,
+          onValueChange
         },
         mapperProps
       )
@@ -5680,7 +5715,8 @@ var oneOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
     schema,
     model,
     validationErrors: initialError,
-    required = false
+    required = false,
+    onValueChange
   } = schemaMapperProps;
   const initialModel = (_a = model != null ? model : schema.default) != null ? _a : null;
   const options = schema.oneOf.map((childSchema, index) => {
@@ -5715,13 +5751,14 @@ var oneOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
           model: initialModel,
           localValue,
           validationErrors: initialError,
-          required
+          required,
+          onValueChange
         },
         mapperProps
       )
     };
   });
-  const { getErrorMessageFunctions, onComponentUpdate, trackEvent, onBehavior, onValueChange } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate, trackEvent, onBehavior } = mapperProps;
   const { validationMessages } = schema;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   return createSelectInputComponent(
@@ -5999,7 +6036,14 @@ var mapStringSchemaSuggestions = (suggestions, logEvent) => {
 // src/domain/mappers/schema/stringSchemaToComponent/stringSchemaToDateInputComponent.ts
 var stringSchemaToDateInputComponent = (schemaMapperProps, mapperProps) => {
   var _a;
-  const { schema, localValue, model, required = false, onPersistAsync } = schemaMapperProps;
+  const {
+    schema,
+    localValue,
+    model,
+    required = false,
+    onPersistAsync,
+    onValueChange
+  } = schemaMapperProps;
   const {
     autocompleteHint,
     default: defaultValue,
@@ -6007,7 +6051,7 @@ var stringSchemaToDateInputComponent = (schemaMapperProps, mapperProps) => {
     maximum: maximumDate,
     suggestions
   } = schema;
-  const { getErrorMessageFunctions, onComponentUpdate, onBehavior, onValueChange } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate, onBehavior } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(schema.validationMessages);
   const { performValidationAsync, validationAsyncState } = getValidationAsyncInitialState(
     schemaMapperProps,
@@ -6020,7 +6064,7 @@ var stringSchemaToDateInputComponent = (schemaMapperProps, mapperProps) => {
     __spreadProps(__spreadValues({}, mapCommonSchemaProps(schemaMapperProps)), {
       autoComplete: getAutocompleteString(autocompleteHint),
       checks: schema.hidden ? [] : [
-        getRequiredCheck(required, errorMessageFunctions),
+        getStringRequiredCheck(required, errorMessageFunctions),
         getValidDateCheck(required, errorMessageFunctions),
         getAboveMaximumDateCheck(schema, errorMessageFunctions),
         getBelowMinimumDateCheck(schema, errorMessageFunctions)
@@ -6056,9 +6100,9 @@ var getValidDate = (model) => {
 // src/domain/mappers/schema/stringSchemaToComponent/stringSchemaToUploadInputComponent.ts
 var stringSchemaToUploadInputComponent = (schemaMapperProps, mapperProps) => {
   var _a;
-  const { schema, localValue, model, required = false } = schemaMapperProps;
+  const { schema, localValue, model, required = false, onValueChange } = schemaMapperProps;
   const { accepts, autocompleteHint, cameraConfig, hidden, maxSize, source, validationMessages } = schema;
-  const { getErrorMessageFunctions, onComponentUpdate, onBehavior, onValueChange } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate, onBehavior } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const validLocalValue = isFile(localValue) ? localValue : null;
   const value = (_a = getFileFromModel(model)) != null ? _a : validLocalValue;
@@ -6109,6 +6153,7 @@ var createTextInputComponent = (props, onComponentUpdate) => {
     "value"
   ]);
   const update = getInputUpdateFunction(onComponentUpdate);
+  const onValueChangeDebounced = debounce(onValueChange, 1e3);
   const getValidationErrors = getLocalValueValidator(checks);
   const performOnChange = getDebouncedSchemaOnChange(schemaOnChange, getValidationErrors);
   const validateAsync = performValidationAsync ? getDebouncedComponentValidationAsync(update, performValidationAsync) : void 0;
@@ -6126,6 +6171,7 @@ var createTextInputComponent = (props, onComponentUpdate) => {
         }));
         validateAsync == null ? void 0 : validateAsync.flush();
       }
+      onValueChangeDebounced.flush();
     },
     onFocus() {
     },
@@ -6145,7 +6191,7 @@ var createTextInputComponent = (props, onComponentUpdate) => {
       if (!updatedValue) {
         validateAsync == null ? void 0 : validateAsync.cancel();
       }
-      onValueChange();
+      onValueChangeDebounced();
     },
     async getSubmittableValue() {
       return component.getSubmittableValueSync();
@@ -6172,7 +6218,14 @@ var createTextInputComponent = (props, onComponentUpdate) => {
 
 // src/domain/mappers/schema/stringSchemaToComponent/stringSchemaToTextInputComponent.ts
 var stringSchemaToTextInputComponent = (schemaMapperProps, mapperProps) => {
-  const { schema, localValue, model, required = false, onPersistAsync } = schemaMapperProps;
+  const {
+    schema,
+    localValue,
+    model,
+    required = false,
+    onPersistAsync,
+    onValueChange
+  } = schemaMapperProps;
   const {
     autocapitalization,
     autocompleteHint,
@@ -6186,7 +6239,7 @@ var stringSchemaToTextInputComponent = (schemaMapperProps, mapperProps) => {
     suggestions,
     validationMessages
   } = schema;
-  const { getErrorMessageFunctions, onComponentUpdate, onBehavior, onValueChange, logEvent } = mapperProps;
+  const { getErrorMessageFunctions, onComponentUpdate, onBehavior, logEvent } = mapperProps;
   const controlForLegacyFormat = getControlForLegacyFormat(format);
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performValidationAsync, validationAsyncState } = getValidationAsyncInitialState(
@@ -6201,7 +6254,7 @@ var stringSchemaToTextInputComponent = (schemaMapperProps, mapperProps) => {
       autocapitalization,
       autoComplete: getAutocompleteString(autocompleteHint),
       checks: schema.hidden ? [] : [
-        getRequiredCheck(required, errorMessageFunctions),
+        getStringRequiredCheck(required, errorMessageFunctions),
         getAboveMaxLengthCheck(schema, errorMessageFunctions),
         getBelowMinLengthCheck(schema, errorMessageFunctions),
         getNotAdheringToPatternCheck(schema, errorMessageFunctions, { logEvent })
@@ -6300,6 +6353,8 @@ var mapSchemaToComponent = (schemaMapperProps, mapperProps) => {
 };
 
 // src/domain/mappers/mapStepSchemas.ts
+var noop2 = () => {
+};
 var mapStepSchemas = (uid, step, stepLocalValue, mapperProps) => {
   return step.schemas.map(
     (schema, i) => {
@@ -6312,7 +6367,8 @@ var mapStepSchemas = (uid, step, stepLocalValue, mapperProps) => {
           model: (_a = step.model) != null ? _a : null,
           localValue: stepLocalValue,
           validationErrors: (_b = step.errors) == null ? void 0 : _b.validation,
-          required: true
+          required: true,
+          onValueChange: noop2
         },
         mapperProps
       );
@@ -6981,8 +7037,7 @@ var createFlowController = (props) => {
     onNotification,
     onError,
     onEvent,
-    onLog,
-    onValueChange
+    onLog
   } = props;
   const httpClient = getHttpClientWithCapabilities(props.httpClient, nativeSubflowHandlers);
   const rootComponent = createRootDomainComponent(
@@ -7023,8 +7078,7 @@ var createFlowController = (props) => {
     httpClient,
     onBehavior,
     onLink,
-    onPoll,
-    onValueChange
+    onPoll
   });
   const createStepComponent2 = (newStep, etag, localValue) => {
     rootComponent.stop();
@@ -7348,6 +7402,7 @@ var createFlowController = (props) => {
     switch (command.type) {
       case "replace-step":
         createStep(command.step, command.etag);
+        trackCoreEvent("Step Shown", { isFirstStep: false });
         return true;
       case "behavior":
         void onBehavior(command.behavior);
@@ -8738,8 +8793,6 @@ function useStableCallback(handler) {
 // src/useDynamicFlow.tsx
 import { jsx as jsx8 } from "react/jsx-runtime";
 var className = "dynamic-flow";
-var noop2 = () => {
-};
 function useDynamicFlow(props) {
   var _a, _b;
   const { flowId, renderers } = props;
@@ -8761,7 +8814,6 @@ function useDynamicFlow(props) {
   const onError = useStableCallback(props.onError);
   const onEvent = useStableCallback(props.onEvent);
   const onLog = useStableCallback(props.onLog);
-  const onValueChange = noop2;
   const { formatMessage, locale } = useIntl2();
   const getErrorMessageFunctions = useMemo(
     () => getSchemaErrorMessageFunction(formatMessage, locale),
@@ -8783,7 +8835,6 @@ function useDynamicFlow(props) {
     onError,
     onEvent,
     onLog,
-    onValueChange,
     scrollToTop
   }));
   const render = useMemo(