@wise/dynamic-flow-client 3.8.0 → 3.9.0-experimental-bd037e3

package/build/main.mjs

@@ -1131,7 +1131,7 @@ var translations = {
 var i18n_default = translations;
 
 // src/revamp/DynamicFlowWise.tsx
-import { useMemo as useMemo4 } from "react";
+import { forwardRef as forwardRef4, useMemo as useMemo4 } from "react";
 import { useIntl as useIntl8 } from "react-intl";
 
 // src/common/httpClientContext/HttpClientContext.tsx
@@ -7536,7 +7536,15 @@ var flattenZodErrors = (zodError) => zodError.flatMap((e) => {
 }).filter(Boolean);
 
 // src/revamp/DynamicFlowCore.tsx
-import { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo3, useRef as useRef2, useState as useState9 } from "react";
+import {
+  forwardRef as forwardRef3,
+  useCallback as useCallback2,
+  useEffect as useEffect5,
+  useImperativeHandle,
+  useMemo as useMemo3,
+  useRef as useRef2,
+  useState as useState9
+} from "react";
 import { useIntl as useIntl7 } from "react-intl";
 
 // src/common/errorBoundary/ErrorBoundary.tsx
@@ -8212,6 +8220,7 @@ var createNumberInputComponent = (numberInputProps, updateComponent) => {
     performPersistAsync,
     performRefresh,
     performValidationAsync,
+    onValueChange,
     summariser
   } = _a, rest = __objRest(_a, [
     "uid",
@@ -8220,6 +8229,7 @@ var createNumberInputComponent = (numberInputProps, updateComponent) => {
     "performPersistAsync",
     "performRefresh",
     "performValidationAsync",
+    "onValueChange",
     "summariser"
   ]);
   const performDebouncedRefresh = getDebouncedPerformRefresh(performRefresh);
@@ -8250,6 +8260,7 @@ var createNumberInputComponent = (numberInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       performDebouncedRefresh == null ? void 0 : performDebouncedRefresh();
+      onValueChange();
     },
     async getSubmittableValue() {
       var _a2;
@@ -8693,7 +8704,7 @@ var schemaHasValidationAsync = (schema) => Boolean("validationAsync" in schema &
 var numberSchemaToComponent = (schemaMapperProps, mapperProps) => {
   const { schema, model, localValue, required = false } = schemaMapperProps;
   const { autocompleteHint, validationMessages, default: defaultValue } = schema;
-  const { getErrorMessageFunctions, updateComponent, onRefresh } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, onRefresh, onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performPersistAsync, persistedState } = getPersistAsyncInitialState(
     schemaMapperProps,
@@ -8719,7 +8730,8 @@ var numberSchemaToComponent = (schemaMapperProps, mapperProps) => {
       validationState,
       performPersistAsync,
       performRefresh: getPerformRefresh(schema, onRefresh),
-      performValidationAsync
+      performValidationAsync,
+      onValueChange
     }),
     updateComponent
   );
@@ -8912,6 +8924,7 @@ var createIntegerInputComponent = (integerInputProps, updateComponent) => {
     performPersistAsync,
     performRefresh,
     performValidationAsync,
+    onValueChange,
     summariser
   } = _a, rest = __objRest(_a, [
     "uid",
@@ -8921,6 +8934,7 @@ var createIntegerInputComponent = (integerInputProps, updateComponent) => {
     "performPersistAsync",
     "performRefresh",
     "performValidationAsync",
+    "onValueChange",
     "summariser"
   ]);
   const performDebouncedRefresh = getDebouncedPerformRefresh(performRefresh);
@@ -8952,6 +8966,7 @@ var createIntegerInputComponent = (integerInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       performDebouncedRefresh == null ? void 0 : performDebouncedRefresh();
+      onValueChange();
     },
     async getSubmittableValue() {
       var _a2;
@@ -9004,7 +9019,7 @@ var createIntegerInputComponent = (integerInputProps, updateComponent) => {
 var integerSchemaToComponent = (schemaMapperProps, mapperProps) => {
   const { schema, localValue, model, required = false } = schemaMapperProps;
   const { autocompleteHint, validationMessages, default: defaultValue } = schema;
-  const { getErrorMessageFunctions, updateComponent, onRefresh } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, onRefresh, onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performPersistAsync, persistedState } = getPersistAsyncInitialState(
     schemaMapperProps,
@@ -9031,7 +9046,8 @@ var integerSchemaToComponent = (schemaMapperProps, mapperProps) => {
       validationState,
       performPersistAsync,
       performRefresh: getPerformRefresh(schema, onRefresh),
-      performValidationAsync
+      performValidationAsync,
+      onValueChange
     }),
     updateComponent
   );
@@ -9094,6 +9110,7 @@ var createSelectInputComponent = (selectProps, updateComponent) => {
     options,
     performPersistAsync,
     performRefresh,
+    onValueChange,
     summariser
   } = _a, rest = __objRest(_a, [
     "uid",
@@ -9102,6 +9119,7 @@ var createSelectInputComponent = (selectProps, updateComponent) => {
     "options",
     "performPersistAsync",
     "performRefresh",
+    "onValueChange",
     "summariser"
   ]);
   const children = options.map((option) => option.component);
@@ -9162,6 +9180,7 @@ var createSelectInputComponent = (selectProps, updateComponent) => {
         draft.selectedIndex = updatedIndex;
       });
       performRefresh == null ? void 0 : performRefresh();
+      onValueChange();
     },
     validate() {
       var _a2, _b;
@@ -9182,6 +9201,7 @@ var createSelectInputComponent = (selectProps, updateComponent) => {
       if (isValid2 && updatedIndex !== null) {
         persist(this.persistedState, this.getLocalValue()).catch(() => {
         });
+        onValueChange();
       }
     },
     async getSubmittableValue() {
@@ -9225,7 +9245,7 @@ var oneOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
       )
     };
   });
-  const { getErrorMessageFunctions, updateComponent, trackEvent, onRefresh } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, trackEvent, onRefresh, onValueChange } = mapperProps;
   const { default: defaultValue, validationMessages } = schema;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performPersistAsync, persistedState } = getPersistAsyncInitialState(
@@ -9242,6 +9262,7 @@ var oneOfSchemaToComponent = (schemaMapperProps, mapperProps) => {
       persistedState,
       performPersistAsync,
       performRefresh: getPerformRefresh(schema, onRefresh),
+      onValueChange,
       trackEvent
     }),
     updateComponent
@@ -9261,6 +9282,7 @@ var createDateInputComponent = (textInputProps, updateComponent) => {
     performPersistAsync,
     performRefresh,
     performValidationAsync,
+    onValueChange,
     summariser,
     value
   } = _a, rest = __objRest(_a, [
@@ -9270,6 +9292,7 @@ var createDateInputComponent = (textInputProps, updateComponent) => {
     "performPersistAsync",
     "performRefresh",
     "performValidationAsync",
+    "onValueChange",
     "summariser",
     "value"
   ]);
@@ -9300,6 +9323,7 @@ var createDateInputComponent = (textInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       performRefresh == null ? void 0 : performRefresh();
+      onValueChange();
     },
     async getSubmittableValue() {
       var _a2;
@@ -9359,7 +9383,7 @@ var stringSchemaToDateInputComponent = (schemaMapperProps, mapperProps) => {
     minimum: minimumDate,
     maximum: maximumDate
   } = schema;
-  const { getErrorMessageFunctions, updateComponent, onRefresh } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, onRefresh, onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(schema.validationMessages);
   const { performPersistAsync, persistedState } = getPersistAsyncInitialState(
     schemaMapperProps,
@@ -9387,7 +9411,8 @@ var stringSchemaToDateInputComponent = (schemaMapperProps, mapperProps) => {
       validationState,
       performPersistAsync,
       performRefresh: getPerformRefresh(schema, onRefresh),
-      performValidationAsync
+      performValidationAsync,
+      onValueChange
     }),
     updateComponent
   );
@@ -9411,6 +9436,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
     value,
     performPersistAsync,
     performRefresh,
+    onValueChange,
     summariser
   } = _a, rest = __objRest(_a, [
     "uid",
@@ -9420,6 +9446,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
     "value",
     "performPersistAsync",
     "performRefresh",
+    "onValueChange",
     "summariser"
   ]);
   const update = getInputUpdateFunction(uid, updateComponent);
@@ -9449,6 +9476,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       performRefresh == null ? void 0 : performRefresh();
+      onValueChange();
     },
     async getSubmittableValue() {
       const file = this.getLocalValue();
@@ -9478,6 +9506,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
         draft.errors = [];
         draft.value = file;
       });
+      onValueChange();
       const submission = format === "base64" && file ? await toBase64(file) : file;
       await persist(this.persistedState, submission).catch((error) => {
         update((draft) => {
@@ -9487,6 +9516,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
         });
         throw error;
       });
+      onValueChange();
     },
     async getSubmittableValue() {
       return this.persistedState.submission;
@@ -9498,7 +9528,7 @@ var createUploadInputComponent = (uploadInputProps, updateComponent) => {
 var stringSchemaToUploadInputComponent = (schemaMapperProps, mapperProps) => {
   const { schema, localValue, model, required = false } = schemaMapperProps;
   const { accepts, autocompleteHint, maxSize, validationMessages } = schema;
-  const { getErrorMessageFunctions, updateComponent, onRefresh } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, onRefresh, onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performPersistAsync } = getPersistAsyncInitialState(schemaMapperProps, mapperProps);
   const persistedState = performPersistAsync ? getInitialPersistedState(null, model) : getInitialPersistedState();
@@ -9514,7 +9544,8 @@ var stringSchemaToUploadInputComponent = (schemaMapperProps, mapperProps) => {
       value,
       persistedState,
       performPersistAsync,
-      performRefresh: getPerformRefresh(schema, onRefresh)
+      performRefresh: getPerformRefresh(schema, onRefresh),
+      onValueChange
     }),
     updateComponent
   );
@@ -9529,6 +9560,7 @@ var createTextInputComponent = (textInputProps, updateComponent) => {
     performPersistAsync,
     performRefresh,
     performValidationAsync,
+    onValueChange,
     summariser,
     value
   } = _a, rest = __objRest(_a, [
@@ -9538,6 +9570,7 @@ var createTextInputComponent = (textInputProps, updateComponent) => {
     "performPersistAsync",
     "performRefresh",
     "performValidationAsync",
+    "onValueChange",
     "summariser",
     "value"
   ]);
@@ -9570,6 +9603,7 @@ var createTextInputComponent = (textInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       performDebouncedRefresh == null ? void 0 : performDebouncedRefresh();
+      onValueChange();
     },
     async getSubmittableValue() {
       var _a2;
@@ -9629,7 +9663,7 @@ var stringSchemaToTextInputComponent = (schemaMapperProps, mapperProps) => {
     format,
     validationMessages
   } = schema;
-  const { getErrorMessageFunctions, updateComponent, onRefresh } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, onRefresh, onValueChange } = mapperProps;
   const controlForLegacyFormat = getControlForLegacyFormat(format);
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performPersistAsync, persistedState } = getPersistAsyncInitialState(
@@ -9659,7 +9693,8 @@ var stringSchemaToTextInputComponent = (schemaMapperProps, mapperProps) => {
       validationState,
       performPersistAsync,
       performRefresh: getPerformRefresh(schema, onRefresh),
-      performValidationAsync
+      performValidationAsync,
+      onValueChange
     }),
     updateComponent
   );
@@ -9712,6 +9747,7 @@ var createRepeatableComponent = (repeatableProps, updateComponent) => {
     checks,
     components,
     summary,
+    onValueChange,
     createEditableComponent,
     summariser
   } = _a, componentProps = __objRest(_a, [
@@ -9720,6 +9756,7 @@ var createRepeatableComponent = (repeatableProps, updateComponent) => {
     "checks",
     "components",
     "summary",
+    "onValueChange",
     "createEditableComponent",
     "summariser"
   ]);
@@ -9775,6 +9812,7 @@ var createRepeatableComponent = (repeatableProps, updateComponent) => {
         draft.editableComponent = null;
         draft.editableIndex = null;
       });
+      onValueChange();
       return true;
     },
     onRemove() {
@@ -9786,6 +9824,7 @@ var createRepeatableComponent = (repeatableProps, updateComponent) => {
         draft.editableComponent = null;
         draft.editableIndex = null;
       });
+      onValueChange();
     },
     getChildren() {
       return this.editableComponent !== null ? [...this.components, this.editableComponent] : this.components;
@@ -9846,6 +9885,7 @@ var arraySchemaToRepeatableComponent = (schemaMapperProps, mapperProps) => {
     },
     mapperProps
   );
+  const { onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(schema.validationMessages);
   return createRepeatableComponent(
     __spreadProps(__spreadValues({}, mapCommonSchemaProps(schemaMapperProps)), {
@@ -9858,7 +9898,8 @@ var arraySchemaToRepeatableComponent = (schemaMapperProps, mapperProps) => {
       components: components != null ? components : [],
       editItemTitle,
       summary,
-      createEditableComponent
+      createEditableComponent,
+      onValueChange
     }),
     mapperProps.updateComponent
   );
@@ -9881,7 +9922,7 @@ var getRandomInt = () => Math.floor(Math.random() * 1e8);
 
 // src/revamp/domain/components/MultiUploadInputComponent.ts
 var createMultiUploadInputComponent = (uploadInputProps, updateComponent) => {
-  const _a = uploadInputProps, { uid, id, checks, format, performPersistAsync, summariser } = _a, rest = __objRest(_a, ["uid", "id", "checks", "format", "performPersistAsync", "summariser"]);
+  const _a = uploadInputProps, { uid, id, checks, format, performPersistAsync, onValueChange, summariser } = _a, rest = __objRest(_a, ["uid", "id", "checks", "format", "performPersistAsync", "onValueChange", "summariser"]);
   const update = getInputUpdateFunction(uid, updateComponent);
   const getValidationErrors = getLocalValueValidator(checks);
   const getAndSetValidationErrors = (currentValue) => {
@@ -9920,6 +9961,7 @@ var createMultiUploadInputComponent = (uploadInputProps, updateComponent) => {
         draft.value = [...this.value, file];
         draft.errors = [];
       });
+      onValueChange();
     },
     async getSubmittableValue() {
       const files = this.getLocalValue();
@@ -9947,6 +9989,7 @@ var createMultiUploadInputComponent = (uploadInputProps, updateComponent) => {
       await uploadComponent.onUpload.call(this, file, fileId);
       const submission = format === "blob" ? file : await toBase64(file);
       await persist(submission, fileId);
+      onValueChange();
     },
     async onDelete(fileId) {
       var _a2;
@@ -9978,6 +10021,7 @@ var arraySchemaToMultiUploadComponent = (schemaMapperProps, mapperProps) => {
   const persistAsyncConfig = getPersistAsyncConfig(schema.items);
   const format = getFormat(schema.items);
   const combinedSchemaProps = __spreadProps(__spreadValues({}, schemaMapperProps), { persistAsyncConfig, schema: uploadSchema });
+  const { onValueChange } = mapperProps;
   const { performPersistAsync } = getPersistAsyncInitialState(combinedSchemaProps, mapperProps);
   const value = performPersistAsync ? getValueForPersistAsync(localValue) : [];
   const persistedState = performPersistAsync && isArray(model) ? model.map((itemModel) => getInitialPersistedState(null, itemModel)) : [];
@@ -9995,7 +10039,8 @@ var arraySchemaToMultiUploadComponent = (schemaMapperProps, mapperProps) => {
       required,
       value,
       persistedState,
-      performPersistAsync
+      performPersistAsync,
+      onValueChange
     }),
     mapperProps.updateComponent
   );
@@ -10046,6 +10091,7 @@ var createBooleanInputComponent = (booleanInputProps, updateComponent) => {
     performPersistAsync,
     performRefresh,
     performValidationAsync,
+    onValueChange,
     summariser
   } = _a, rest = __objRest(_a, [
     "uid",
@@ -10054,6 +10100,7 @@ var createBooleanInputComponent = (booleanInputProps, updateComponent) => {
     "performPersistAsync",
     "performRefresh",
     "performValidationAsync",
+    "onValueChange",
     "summariser"
   ]);
   const update = getInputUpdateFunction(uid, updateComponent);
@@ -10075,6 +10122,7 @@ var createBooleanInputComponent = (booleanInputProps, updateComponent) => {
         draft.value = updatedValue;
       });
       performRefresh == null ? void 0 : performRefresh();
+      onValueChange();
     },
     async getSubmittableValue() {
       return this.getLocalValue();
@@ -10121,7 +10169,7 @@ var createBooleanInputComponent = (booleanInputProps, updateComponent) => {
 var booleanSchemaToComponent = (schemaMapperProps, mapperProps) => {
   const { schema, localValue, model } = schemaMapperProps;
   const { default: defaultValue } = schema;
-  const { updateComponent, onRefresh } = mapperProps;
+  const { updateComponent, onRefresh, onValueChange } = mapperProps;
   const performRefresh = getPerformRefresh(schema, onRefresh);
   const { performPersistAsync, persistedState } = getPersistAsyncInitialState(
     schemaMapperProps,
@@ -10141,7 +10189,8 @@ var booleanSchemaToComponent = (schemaMapperProps, mapperProps) => {
       validationState,
       performPersistAsync,
       performRefresh,
-      performValidationAsync
+      performValidationAsync,
+      onValueChange
     }),
     updateComponent
   );
@@ -10160,7 +10209,7 @@ var getValidModel = (model, defaultValue) => {
 var blobSchemaToComponent = (schemaMapperProps, mapperProps) => {
   const { schema, localValue, model, required = false } = schemaMapperProps;
   const { accepts, maxSize, validationMessages } = schema;
-  const { getErrorMessageFunctions, updateComponent } = mapperProps;
+  const { getErrorMessageFunctions, updateComponent, onValueChange } = mapperProps;
   const errorMessageFunctions = getErrorMessageFunctions(validationMessages);
   const { performPersistAsync } = getPersistAsyncInitialState(schemaMapperProps, mapperProps);
   const persistedState = performPersistAsync ? getInitialPersistedState(null, model) : getInitialPersistedState();
@@ -10175,7 +10224,8 @@ var blobSchemaToComponent = (schemaMapperProps, mapperProps) => {
       value,
       persistedState,
       performPersistAsync,
-      checks: schema.hidden ? [] : [getRequiredCheck(required, errorMessageFunctions)]
+      checks: schema.hidden ? [] : [getRequiredCheck(required, errorMessageFunctions)],
+      onValueChange
     }),
     updateComponent
   );
@@ -11864,7 +11914,7 @@ function useStableCallback(handler) {
 
 // src/revamp/DynamicFlowCore.tsx
 import { jsx as jsx56 } from "react/jsx-runtime";
-function DynamicFlowCore(props) {
+var DynamicFlowCore = forwardRef3(function DynamicFlowCore2(props, ref) {
   const _a = props, { flowId, initialAction, initialStep, renderers, displayStepTitle = true } = _a, rest = __objRest(_a, ["flowId", "initialAction", "initialStep", "renderers", "displayStepTitle"]);
   const httpClient = useStableCallback(rest.httpClient);
   const onCompletion = useStableCallback(rest.onCompletion);
@@ -11896,6 +11946,20 @@ function DynamicFlowCore(props) {
       trackCoreEvent("Step Shown", { isFirstStep: true });
     }
   }, []);
+  useImperativeHandle(
+    ref,
+    () => ({
+      getValue: async () => {
+        var _a2, _b;
+        return (_b = await ((_a2 = stepComponentRef.current) == null ? void 0 : _a2.getSubmittableValue())) != null ? _b : null;
+      },
+      validate: () => {
+        var _a2, _b;
+        return (_b = (_a2 = stepComponentRef.current) == null ? void 0 : _a2.validate()) != null ? _b : false;
+      }
+    }),
+    []
+  );
   const initialiseWithStep = useCallback2(
     (newStep, etag) => {
       var _a2, _b, _c;
@@ -11929,7 +11993,9 @@ function DynamicFlowCore(props) {
           logEvent,
           httpClient,
           onAction,
-          onRefresh
+          onRefresh,
+          onValueChange: ref ? () => trackEvent("Value Changed") : () => {
+          }
         });
         setStepComponent(() => {
           stepComponentRef.current = newStepComponent;
@@ -12067,21 +12133,22 @@ function DynamicFlowCore(props) {
     [renderers]
   );
   return /* @__PURE__ */ jsx56(ErrorBoundary_default, { onError: closeWithError, children: stepComponent ? render(stepComponent) : null });
-}
+});
+var DynamicFlowCore_default = DynamicFlowCore;
 
 // src/revamp/DynamicFlowWise.tsx
 import { jsx as jsx57 } from "react/jsx-runtime";
 var defaultRenderers = getWiseRenderers();
-function DynamicFlowWise(props) {
+var DynamicFragmentWise = forwardRef4(function DynamicFragmentWise2(props, ref) {
   const { httpClient, renderers = [] } = props;
   const { locale } = useIntl8();
   const wiseHttpClient = useMemo4(
     () => makeWiseHttpClient(httpClient, locale),
     [httpClient, locale]
   );
-  return /* @__PURE__ */ jsx57(HttpClientProvider, { httpClient: wiseHttpClient, children: /* @__PURE__ */ jsx57(DynamicFlowCore, __spreadProps(__spreadValues({}, props), { renderers: [...renderers, ...defaultRenderers] })) });
-}
-var DynamicFlowWise_default = DynamicFlowWise;
+  return /* @__PURE__ */ jsx57(HttpClientProvider, { httpClient: wiseHttpClient, children: /* @__PURE__ */ jsx57(DynamicFlowCore_default, __spreadProps(__spreadValues({}, props), { ref, renderers: [...renderers, ...defaultRenderers] })) });
+});
+var DynamicFlowWise_default = DynamicFragmentWise;
 var makeWiseHttpClient = (httpClient, locale) => async (input, init) => httpClient(
   input,
   mergeRequestInit(init, { credentials: "include", headers: { "accept-language": locale } })