@wise/dynamic-flow-client 4.19.0 → 4.19.1

package/build/main.js

@@ -2308,6 +2308,10 @@ var createRootDomainComponent = (updateComponent) => {
     getTrackEvent() {
       return this.stepComponent ? this.stepComponent.trackEvent : null;
     },
+    isBusy() {
+      const loadingState = this.getLoadingState();
+      return loadingState === "submitting" || loadingState === "refreshing";
+    },
     hasStep() {
       return Boolean(this.stepComponent);
     },
@@ -7183,6 +7187,7 @@ function useDynamicFlowCore(props) {
   (0, import_react3.useEffect)(() => {
     trackCoreEvent("Initiated");
     if (!initialStep && initialAction) {
+      rootComponentRef.current.setLoadingState("submitting");
       void onAction(__spreadValues({ method: "GET" }, initialAction), null);
     }
     if (initialStep && !initialAction) {
@@ -7280,14 +7285,18 @@ function useDynamicFlowCore(props) {
   const onBehavior = (0, import_react3.useCallback)(async (behavior) => {
     switch (behavior.type) {
       case "action": {
-        rootComponentRef.current.setLoadingState("submitting");
+        if (rootComponentRef.current.isBusy()) {
+          return { abort: () => {
+          } };
+        }
         rootComponentRef.current.dismissAllModals();
+        const { action } = behavior;
+        const skipValidation = action.method === "GET" || Boolean(action.skipValidation);
+        const canSubmit = skipValidation || rootComponentRef.current.validate();
         try {
-          const { action } = behavior;
-          const model = await rootComponentRef.current.getSubmittableValue();
-          const skipValidation = action.method === "GET" || Boolean(action.skipValidation);
-          const canSubmit = skipValidation || rootComponentRef.current.validate();
           if (canSubmit) {
+            rootComponentRef.current.setLoadingState("submitting");
+            const model = await rootComponentRef.current.getSubmittableValue();
             void onAction(action, model);
           } else {
             rootComponentRef.current.setLoadingState("idle");
@@ -7304,6 +7313,7 @@ function useDynamicFlowCore(props) {
       case "non-merging-action": {
         rootComponentRef.current.dismissAllModals();
         const { action } = behavior;
+        rootComponentRef.current.setLoadingState("submitting");
         void onAction(action, null);
         break;
       }
@@ -7348,7 +7358,6 @@ function useDynamicFlowCore(props) {
   const onAction = (0, import_react3.useCallback)(async (action, model) => {
     var _a2, _b, _c, _d, _e, _f;
     try {
-      rootComponentRef.current.setLoadingState("submitting");
       const command = await executeSubmission({
         action,
         model,

package/build/main.mjs

@@ -2265,6 +2265,10 @@ var createRootDomainComponent = (updateComponent) => {
     getTrackEvent() {
       return this.stepComponent ? this.stepComponent.trackEvent : null;
     },
+    isBusy() {
+      const loadingState = this.getLoadingState();
+      return loadingState === "submitting" || loadingState === "refreshing";
+    },
     hasStep() {
       return Boolean(this.stepComponent);
     },
@@ -7140,6 +7144,7 @@ function useDynamicFlowCore(props) {
   useEffect(() => {
     trackCoreEvent("Initiated");
     if (!initialStep && initialAction) {
+      rootComponentRef.current.setLoadingState("submitting");
       void onAction(__spreadValues({ method: "GET" }, initialAction), null);
     }
     if (initialStep && !initialAction) {
@@ -7237,14 +7242,18 @@ function useDynamicFlowCore(props) {
   const onBehavior = useCallback2(async (behavior) => {
     switch (behavior.type) {
       case "action": {
-        rootComponentRef.current.setLoadingState("submitting");
+        if (rootComponentRef.current.isBusy()) {
+          return { abort: () => {
+          } };
+        }
         rootComponentRef.current.dismissAllModals();
+        const { action } = behavior;
+        const skipValidation = action.method === "GET" || Boolean(action.skipValidation);
+        const canSubmit = skipValidation || rootComponentRef.current.validate();
         try {
-          const { action } = behavior;
-          const model = await rootComponentRef.current.getSubmittableValue();
-          const skipValidation = action.method === "GET" || Boolean(action.skipValidation);
-          const canSubmit = skipValidation || rootComponentRef.current.validate();
           if (canSubmit) {
+            rootComponentRef.current.setLoadingState("submitting");
+            const model = await rootComponentRef.current.getSubmittableValue();
             void onAction(action, model);
           } else {
             rootComponentRef.current.setLoadingState("idle");
@@ -7261,6 +7270,7 @@ function useDynamicFlowCore(props) {
       case "non-merging-action": {
         rootComponentRef.current.dismissAllModals();
         const { action } = behavior;
+        rootComponentRef.current.setLoadingState("submitting");
         void onAction(action, null);
         break;
       }
@@ -7305,7 +7315,6 @@ function useDynamicFlowCore(props) {
   const onAction = useCallback2(async (action, model) => {
     var _a2, _b, _c, _d, _e, _f;
     try {
-      rootComponentRef.current.setLoadingState("submitting");
       const command = await executeSubmission({
         action,
         model,

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

@@ -16,6 +16,7 @@ export type RootDomainComponent = BaseComponent & {
     getSchemaComponents: () => SchemaComponent[];
     getSubmittableValue: () => Promise<Model>;
     getSubmittableValueSync: () => Model;
+    isBusy: () => boolean;
     validate: () => boolean;
     getTrackEvent: () => AnalyticsEventDispatcher<string> | null;
     setLoadingState: (loadingState: LoadingState) => void;

package/build/types/test-utils/index.d.ts

@@ -1,2 +1,2 @@
-export { getMockHttpClient, respondWith, respondWithEtag, respondWithEmptyOk, respondWithEmptyAndEtag, } from './fetch-utils';
+export { getMockHttpClient, respondWith, respondWithDelay, respondWithEtag, respondWithEmptyOk, respondWithEmptyAndEtag, } from './fetch-utils';
 export { renderWithProviders } from './rtl-utils';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/dynamic-flow-client",
-  "version": "4.19.0",
+  "version": "4.19.1",
   "description": "Dynamic Flow web client",
   "license": "Apache-2.0",
   "main": "./build/main.js",
@@ -37,13 +37,13 @@
     "@babel/preset-react": "7.27.1",
     "@babel/preset-typescript": "7.27.1",
     "@chromatic-com/storybook": "4.1.1",
-    "@formatjs/cli": "^6.7.2",
-    "@storybook/addon-a11y": "^9.1.8",
-    "@storybook/addon-docs": "^9.1.8",
-    "@storybook/addon-links": "^9.1.8",
-    "@storybook/react-vite": "9.1.8",
+    "@formatjs/cli": "^6.7.3",
+    "@storybook/addon-a11y": "^9.1.10",
+    "@storybook/addon-docs": "^9.1.10",
+    "@storybook/addon-links": "^9.1.10",
+    "@storybook/react-vite": "9.1.10",
     "@testing-library/dom": "10.4.1",
-    "@testing-library/jest-dom": "6.8.0",
+    "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.0",
     "@testing-library/user-event": "14.6.1",
     "@transferwise/components": "46.111.0",
@@ -51,17 +51,17 @@
     "@transferwise/icons": "3.22.4",
     "@transferwise/neptune-css": "14.25.0",
     "@types/jest": "30.0.0",
-    "@types/node": "22.18.6",
-    "@types/react": "18.3.24",
+    "@types/node": "22.18.8",
+    "@types/react": "18.3.25",
     "@types/react-dom": "18.3.7",
     "@types/react-intl": "3.0.0",
-    "@wise/art": "2.24.6",
+    "@wise/art": "2.24.7",
     "@wise/components-theming": "^1.7.0",
-    "babel-jest": "30.1.2",
+    "babel-jest": "30.2.0",
     "esbuild": "0.25.9",
-    "eslint-plugin-storybook": "9.1.8",
-    "jest": "30.1.3",
-    "jest-environment-jsdom": "30.1.2",
+    "eslint-plugin-storybook": "9.1.10",
+    "jest": "30.2.0",
+    "jest-environment-jsdom": "30.2.0",
     "jest-fetch-mock": "^3.0.3",
     "jest-watch-typeahead": "^3.0.1",
     "npm-run-all2": "8.0.4",
@@ -71,15 +71,15 @@
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-intl": "6.8.9",
-    "storybook": "^9.1.8",
-    "stylelint": "16.24.0",
+    "storybook": "^9.1.10",
+    "stylelint": "16.25.0",
     "stylelint-config-standard": "36.0.1",
     "stylelint-no-unsupported-browser-features": "8.0.4",
     "stylelint-value-no-unknown-custom-properties": "6.0.1",
     "tsx": "4.20.6",
-    "typescript": "5.9.2",
-    "@wise/dynamic-flow-renderers": "0.0.0",
-    "@wise/dynamic-flow-fixtures": "0.0.1"
+    "typescript": "5.9.3",
+    "@wise/dynamic-flow-fixtures": "0.0.1",
+    "@wise/dynamic-flow-renderers": "0.0.0"
   },
   "peerDependencies": {
     "@transferwise/components": "^46.104.0",