chayns-api 3.4.4 → 3.5.0-beta.0

package/dist/cjs/hooks/useDialogState.js

@@ -5,34 +5,95 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useDialogState = exports.useDialogData = void 0;
 var _reactCompilerRuntime = require("react-compiler-runtime");
+var _react = require("react");
 var _context = require("./context");
+const closeRequestListeners = [];
+let hostListenerId = null;
+const dispatchCloseRequest = data => {
+  let isPropagationStopped = false;
+  const event = {
+    reason: data.reason,
+    stopPropagation: () => {
+      isPropagationStopped = true;
+    }
+  };
+  const listeners = [...closeRequestListeners].reverse();
+  for (const listener of listeners) {
+    listener(event);
+    if (isPropagationStopped) {
+      break;
+    }
+  }
+};
+const createAddCloseRequestListener = functions => listener => {
+  closeRequestListeners.push(listener);
+  if (closeRequestListeners.length === 1) {
+    if (!hostListenerId) {
+      var _functions$addDialogC, _functions$addDialogC2;
+      hostListenerId = (_functions$addDialogC = (_functions$addDialogC2 = functions.addDialogCloseRequestListener) === null || _functions$addDialogC2 === void 0 ? void 0 : _functions$addDialogC2.call(functions, dispatchCloseRequest)) !== null && _functions$addDialogC !== void 0 ? _functions$addDialogC : null;
+    }
+  }
+  return () => {
+    const index = closeRequestListeners.indexOf(listener);
+    if (index === -1) {
+      return;
+    }
+    closeRequestListeners.splice(index, 1);
+    if (closeRequestListeners.length === 0) {
+      if (hostListenerId) {
+        void hostListenerId.then(id => {
+          var _functions$removeDial;
+          return (_functions$removeDial = functions.removeDialogCloseRequestListener) === null || _functions$removeDial === void 0 ? void 0 : _functions$removeDial.call(functions, id);
+        });
+        hostListenerId = null;
+      }
+    }
+  };
+};
 const useDialogState = () => {
-  const $ = (0, _reactCompilerRuntime.c)(5);
+  const $ = (0, _reactCompilerRuntime.c)(9);
   const setResult = (0, _context.useFunctionsSelector)(_temp);
   const sendData = (0, _context.useFunctionsSelector)(_temp2);
   const addDataListener = (0, _context.useFunctionsSelector)(_temp3);
-  const isClosingRequested = (0, _context.useValuesSelector)(_temp4);
+  const addDialogCloseRequestListener = (0, _context.useFunctionsSelector)(_temp4);
+  const removeDialogCloseRequestListener = (0, _context.useFunctionsSelector)(_temp5);
+  const isClosingRequested = (0, _context.useValuesSelector)(_temp6);
   let t0;
-  if ($[0] !== addDataListener || $[1] !== isClosingRequested || $[2] !== sendData || $[3] !== setResult) {
-    t0 = {
+  if ($[0] !== addDialogCloseRequestListener || $[1] !== removeDialogCloseRequestListener) {
+    t0 = createAddCloseRequestListener({
+      addDialogCloseRequestListener,
+      removeDialogCloseRequestListener
+    });
+    $[0] = addDialogCloseRequestListener;
+    $[1] = removeDialogCloseRequestListener;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  const addCloseRequestListener = t0;
+  let t1;
+  if ($[3] !== addCloseRequestListener || $[4] !== addDataListener || $[5] !== isClosingRequested || $[6] !== sendData || $[7] !== setResult) {
+    t1 = {
       setResult,
       sendData,
       addDataListener,
-      isClosingRequested
+      isClosingRequested,
+      addCloseRequestListener
     };
-    $[0] = addDataListener;
-    $[1] = isClosingRequested;
-    $[2] = sendData;
-    $[3] = setResult;
-    $[4] = t0;
+    $[3] = addCloseRequestListener;
+    $[4] = addDataListener;
+    $[5] = isClosingRequested;
+    $[6] = sendData;
+    $[7] = setResult;
+    $[8] = t1;
   } else {
-    t0 = $[4];
+    t1 = $[8];
   }
-  return t0;
+  return t1;
 };
 exports.useDialogState = useDialogState;
 const useDialogData = () => {
-  return (0, _context.useValuesSelector)(_temp5);
+  return (0, _context.useValuesSelector)(_temp7);
 };
 exports.useDialogData = useDialogData;
 function _temp(f) {
@@ -44,11 +105,17 @@ function _temp2(f_0) {
 function _temp3(f_1) {
   return f_1.addDialogHostEventListener;
 }
-function _temp4(v) {
+function _temp4(f_2) {
+  return f_2.addDialogCloseRequestListener;
+}
+function _temp5(f_3) {
+  return f_3.removeDialogCloseRequestListener;
+}
+function _temp6(v) {
   var _v$dialog$isClosingRe, _v$dialog;
   return (_v$dialog$isClosingRe = (_v$dialog = v.dialog) === null || _v$dialog === void 0 ? void 0 : _v$dialog.isClosingRequested) !== null && _v$dialog$isClosingRe !== void 0 ? _v$dialog$isClosingRe : false;
 }
-function _temp5(v) {
+function _temp7(v) {
   var _v$dialog2;
   return (_v$dialog2 = v.dialog) === null || _v$dialog2 === void 0 ? void 0 : _v$dialog2.dialogInput;
 }

package/dist/cjs/wrapper/AppWrapper.js

@@ -736,6 +736,13 @@ class AppWrapper {
         this.notImplemented('addDialogHostEventListener');
       }
     },
+    addDialogCloseRequestListener: async () => {
+      this.notImplemented('addDialogCloseRequestListener');
+      return -1;
+    },
+    removeDialogCloseRequestListener: async () => {
+      this.notImplemented('removeDialogCloseRequestListener');
+    },
     addAnonymousAccount: async () => {
       return this.appCall(302);
     },

package/dist/cjs/wrapper/FrameWrapper.js

@@ -300,6 +300,22 @@ class FrameWrapper {
       if (!this.initialized) await this.ready;
       return this.exposedFunctions.removeDialogHostEventListener(id);
     },
+    addDialogCloseRequestListener: async callback => {
+      if (!this.initialized) await this.ready;
+      try {
+        return await this.exposedFunctions.addDialogCloseRequestListener(comlink.proxy(data => {
+          callback(data);
+        }));
+      } catch {
+        console.warn('[chayns-api] addDialogCloseRequestListener is not supported by the host');
+        return -1;
+      }
+    },
+    removeDialogCloseRequestListener: async id => {
+      var _this$exposedFunction, _this$exposedFunction2;
+      if (!this.initialized) await this.ready;
+      return (_this$exposedFunction = (_this$exposedFunction2 = this.exposedFunctions).removeDialogCloseRequestListener) === null || _this$exposedFunction === void 0 ? void 0 : _this$exposedFunction.call(_this$exposedFunction2, id);
+    },
     removeDialogClientEventListener: async () => {},
     addAnonymousAccount: async () => {
       if (!this.initialized) await this.ready;

package/dist/esm/hooks/useDialogState.js

@@ -1,31 +1,92 @@
 import { c as _c } from "react-compiler-runtime";
+import { useMemo } from 'react';
 import { useFunctionsSelector, useValuesSelector } from './context';
+const closeRequestListeners = [];
+let hostListenerId = null;
+const dispatchCloseRequest = data => {
+  let isPropagationStopped = false;
+  const event = {
+    reason: data.reason,
+    stopPropagation: () => {
+      isPropagationStopped = true;
+    }
+  };
+  const listeners = [...closeRequestListeners].reverse();
+  for (const listener of listeners) {
+    listener(event);
+    if (isPropagationStopped) {
+      break;
+    }
+  }
+};
+const createAddCloseRequestListener = functions => listener => {
+  closeRequestListeners.push(listener);
+  if (closeRequestListeners.length === 1) {
+    if (!hostListenerId) {
+      var _functions$addDialogC, _functions$addDialogC2;
+      hostListenerId = (_functions$addDialogC = (_functions$addDialogC2 = functions.addDialogCloseRequestListener) === null || _functions$addDialogC2 === void 0 ? void 0 : _functions$addDialogC2.call(functions, dispatchCloseRequest)) !== null && _functions$addDialogC !== void 0 ? _functions$addDialogC : null;
+    }
+  }
+  return () => {
+    const index = closeRequestListeners.indexOf(listener);
+    if (index === -1) {
+      return;
+    }
+    closeRequestListeners.splice(index, 1);
+    if (closeRequestListeners.length === 0) {
+      if (hostListenerId) {
+        void hostListenerId.then(id => {
+          var _functions$removeDial;
+          return (_functions$removeDial = functions.removeDialogCloseRequestListener) === null || _functions$removeDial === void 0 ? void 0 : _functions$removeDial.call(functions, id);
+        });
+        hostListenerId = null;
+      }
+    }
+  };
+};
 export const useDialogState = () => {
-  const $ = _c(5);
+  const $ = _c(9);
   const setResult = useFunctionsSelector(_temp);
   const sendData = useFunctionsSelector(_temp2);
   const addDataListener = useFunctionsSelector(_temp3);
-  const isClosingRequested = useValuesSelector(_temp4);
+  const addDialogCloseRequestListener = useFunctionsSelector(_temp4);
+  const removeDialogCloseRequestListener = useFunctionsSelector(_temp5);
+  const isClosingRequested = useValuesSelector(_temp6);
   let t0;
-  if ($[0] !== addDataListener || $[1] !== isClosingRequested || $[2] !== sendData || $[3] !== setResult) {
-    t0 = {
+  if ($[0] !== addDialogCloseRequestListener || $[1] !== removeDialogCloseRequestListener) {
+    t0 = createAddCloseRequestListener({
+      addDialogCloseRequestListener,
+      removeDialogCloseRequestListener
+    });
+    $[0] = addDialogCloseRequestListener;
+    $[1] = removeDialogCloseRequestListener;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  const addCloseRequestListener = t0;
+  let t1;
+  if ($[3] !== addCloseRequestListener || $[4] !== addDataListener || $[5] !== isClosingRequested || $[6] !== sendData || $[7] !== setResult) {
+    t1 = {
       setResult,
       sendData,
       addDataListener,
-      isClosingRequested
+      isClosingRequested,
+      addCloseRequestListener
     };
-    $[0] = addDataListener;
-    $[1] = isClosingRequested;
-    $[2] = sendData;
-    $[3] = setResult;
-    $[4] = t0;
+    $[3] = addCloseRequestListener;
+    $[4] = addDataListener;
+    $[5] = isClosingRequested;
+    $[6] = sendData;
+    $[7] = setResult;
+    $[8] = t1;
   } else {
-    t0 = $[4];
+    t1 = $[8];
   }
-  return t0;
+  return t1;
 };
 export const useDialogData = () => {
-  return useValuesSelector(_temp5);
+  return useValuesSelector(_temp7);
 };
 function _temp(f) {
   return f.setDialogResult;
@@ -36,11 +97,17 @@ function _temp2(f_0) {
 function _temp3(f_1) {
   return f_1.addDialogHostEventListener;
 }
-function _temp4(v) {
+function _temp4(f_2) {
+  return f_2.addDialogCloseRequestListener;
+}
+function _temp5(f_3) {
+  return f_3.removeDialogCloseRequestListener;
+}
+function _temp6(v) {
   var _v$dialog$isClosingRe, _v$dialog;
   return (_v$dialog$isClosingRe = (_v$dialog = v.dialog) === null || _v$dialog === void 0 ? void 0 : _v$dialog.isClosingRequested) !== null && _v$dialog$isClosingRe !== void 0 ? _v$dialog$isClosingRe : false;
 }
-function _temp5(v) {
+function _temp7(v) {
   var _v$dialog2;
   return (_v$dialog2 = v.dialog) === null || _v$dialog2 === void 0 ? void 0 : _v$dialog2.dialogInput;
 }

package/dist/esm/wrapper/AppWrapper.js

@@ -699,6 +699,13 @@ export class AppWrapper {
           this.notImplemented('addDialogHostEventListener');
         }
       },
+      addDialogCloseRequestListener: async () => {
+        this.notImplemented('addDialogCloseRequestListener');
+        return -1;
+      },
+      removeDialogCloseRequestListener: async () => {
+        this.notImplemented('removeDialogCloseRequestListener');
+      },
       addAnonymousAccount: async () => {
         return this.appCall(302);
       },

package/dist/esm/wrapper/FrameWrapper.js

@@ -296,6 +296,22 @@ export class FrameWrapper {
         if (!this.initialized) await this.ready;
         return this.exposedFunctions.removeDialogHostEventListener(id);
       },
+      addDialogCloseRequestListener: async callback => {
+        if (!this.initialized) await this.ready;
+        try {
+          return await this.exposedFunctions.addDialogCloseRequestListener(comlink.proxy(data => {
+            callback(data);
+          }));
+        } catch {
+          console.warn('[chayns-api] addDialogCloseRequestListener is not supported by the host');
+          return -1;
+        }
+      },
+      removeDialogCloseRequestListener: async id => {
+        var _this$exposedFunction, _this$exposedFunction2;
+        if (!this.initialized) await this.ready;
+        return (_this$exposedFunction = (_this$exposedFunction2 = this.exposedFunctions).removeDialogCloseRequestListener) === null || _this$exposedFunction === void 0 ? void 0 : _this$exposedFunction.call(_this$exposedFunction2, id);
+      },
       removeDialogClientEventListener: async () => {},
       addAnonymousAccount: async () => {
         if (!this.initialized) await this.ready;

package/dist/esm/wrapper/StaticChaynsApi.js

@@ -73,6 +73,8 @@ class StaticChaynsApi {
     _defineProperty(this, "dispatchEventToDialogHost", void 0);
     _defineProperty(this, "addDialogHostEventListener", void 0);
     _defineProperty(this, "removeDialogHostEventListener", void 0);
+    _defineProperty(this, "addDialogCloseRequestListener", void 0);
+    _defineProperty(this, "removeDialogCloseRequestListener", void 0);
     _defineProperty(this, "addAnonymousAccount", void 0);
     _defineProperty(this, "addAccessTokenChangeListener", void 0);
     _defineProperty(this, "removeAccessTokenChangeListener", void 0);

package/dist/types/types/IChaynsReact.d.ts

@@ -339,11 +339,24 @@ export type ChaynsApiDevice = {
     isTouch: boolean;
     screenSize: ScreenSize;
 };
+export type DialogCloseRequestReason = 'backdrop' | 'esc';
+export interface DialogCloseRequestEvent {
+    reason: DialogCloseRequestReason;
+    /** Prevents subsequent close request listeners from being invoked. Must be called synchronously. */
+    stopPropagation: () => void;
+}
 export type DialogHookResult = {
     isClosingRequested: boolean;
     setResult: ChaynsReactFunctions["setDialogResult"];
     sendData: ChaynsReactFunctions["dispatchEventToDialogHost"];
     addDataListener: ChaynsReactFunctions["addDialogHostEventListener"];
+    /**
+     * Adds a listener which is invoked instead of closing the dialog when the user clicks the backdrop or presses escape.
+     * While at least one listener is registered the dialog will not be closed automatically.
+     * Listeners are invoked in reverse registration order (LIFO) until stopPropagation is called.
+     * @returns function to remove the listener
+     */
+    addCloseRequestListener: (listener: (event: DialogCloseRequestEvent) => void) => () => void;
 };
 /**
  * @ignore
@@ -503,6 +516,12 @@ export interface ChaynsReactFunctions {
     addDialogHostEventListener: (callback: (data: object) => void) => Promise<number>;
     /** Removes listeners which were added via addDialogHostEventListener */
     removeDialogHostEventListener: (id: number) => Promise<void>;
+    /** Allows the dialog to listen for close requests (backdrop click, escape) while close interception is enabled */
+    addDialogCloseRequestListener?: (callback: (data: {
+        reason: DialogCloseRequestReason;
+    }) => void) => Promise<number>;
+    /** Removes listeners which were added via addDialogCloseRequestListener */
+    removeDialogCloseRequestListener?: (id: number) => Promise<void>;
     addAnonymousAccount: () => Promise<AnonymousAccountResult>;
     addAccessTokenChangeListener: (options: {
         external?: boolean;

package/dist/types/wrapper/StaticChaynsApi.d.ts

@@ -63,6 +63,8 @@ declare class StaticChaynsApi implements ChaynsReactFunctions {
     dispatchEventToDialogHost: ChaynsReactFunctions['dispatchEventToDialogHost'];
     addDialogHostEventListener: ChaynsReactFunctions['addDialogHostEventListener'];
     removeDialogHostEventListener: ChaynsReactFunctions['removeDialogHostEventListener'];
+    addDialogCloseRequestListener: ChaynsReactFunctions['addDialogCloseRequestListener'];
+    removeDialogCloseRequestListener: ChaynsReactFunctions['removeDialogCloseRequestListener'];
     addAnonymousAccount: ChaynsReactFunctions['addAnonymousAccount'];
     addAccessTokenChangeListener: ChaynsReactFunctions['addAccessTokenChangeListener'];
     removeAccessTokenChangeListener: ChaynsReactFunctions['removeAccessTokenChangeListener'];

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "chayns-api",
-    "version": "3.4.4",
+    "version": "3.5.0-beta.0",
     "description": "new chayns api",
     "main": "dist/cjs/index.js",
     "module": "dist/esm/index.js",