@ionic/react 7.5.1-dev.11697139276.10eb94b8 → 7.5.1-dev.11697219113.17f86185

package/dist/index.js

@@ -113,6 +113,18 @@ const IonLifeCycleContext = /*@__PURE__*/ React.createContext({
     ionViewDidLeave: () => {
         return;
     },
+    cleanupIonViewWillEnter: () => {
+        return;
+    },
+    cleanupIonViewDidEnter: () => {
+        return;
+    },
+    cleanupIonViewWillLeave: () => {
+        return;
+    },
+    cleanupIonViewDidLeave: () => {
+        return;
+    },
 });
 const DefaultIonLifeCycleContext = class {
     constructor() {
@@ -120,6 +132,10 @@ const DefaultIonLifeCycleContext = class {
         this.ionViewDidEnterCallbacks = [];
         this.ionViewWillLeaveCallbacks = [];
         this.ionViewDidLeaveCallbacks = [];
+        this.ionViewWillEnterDestructorCallbacks = [];
+        this.ionViewDidEnterDestructorCallbacks = [];
+        this.ionViewWillLeaveDestructorCallbacks = [];
+        this.ionViewDidLeaveDestructorCallbacks = [];
     }
     onIonViewWillEnter(callback) {
         if (callback.id) {
@@ -135,8 +151,59 @@ const DefaultIonLifeCycleContext = class {
             this.ionViewWillEnterCallbacks.push(callback);
         }
     }
+    teardownCallback(callback, callbacks) {
+        // Find any destructors that have been registered for the callback
+        const matches = callbacks.filter((x) => x.id === callback.id);
+        if (matches.length !== 0) {
+            // Execute the destructor for each matching item
+            matches.forEach((match) => {
+                if (match && typeof match.destructor === 'function') {
+                    match.destructor();
+                }
+            });
+            // Remove all matching items from the array
+            callbacks = callbacks.filter((x) => x.id !== callback.id);
+        }
+    }
+    /**
+     * Tears down the user-provided ionViewWillEnter lifecycle callback.
+     * This is the same behavior as React's useEffect hook. The callback
+     * is invoked when the component is unmounted.
+     */
+    cleanupIonViewWillEnter(callback) {
+        this.teardownCallback(callback, this.ionViewWillEnterDestructorCallbacks);
+    }
+    /**
+     * Tears down the user-provided ionViewDidEnter lifecycle callback.
+     * This is the same behavior as React's useEffect hook. The callback
+     * is invoked when the component is unmounted.
+     */
+    cleanupIonViewDidEnter(callback) {
+        this.teardownCallback(callback, this.ionViewDidEnterDestructorCallbacks);
+    }
+    /**
+     * Tears down the user-provided ionViewWillLeave lifecycle callback.
+     * This is the same behavior as React's useEffect hook. The callback
+     * is invoked when the component is unmounted.
+     */
+    cleanupIonViewWillLeave(callback) {
+        this.teardownCallback(callback, this.ionViewWillLeaveDestructorCallbacks);
+    }
+    /**
+     * Tears down the user-provided ionViewDidLeave lifecycle callback.
+     * This is the same behavior as React's useEffect hook. The callback
+     * is invoked when the component is unmounted.
+     */
+    cleanupIonViewDidLeave(callback) {
+        this.teardownCallback(callback, this.ionViewDidLeaveDestructorCallbacks);
+    }
     ionViewWillEnter() {
-        this.ionViewWillEnterCallbacks.forEach((cb) => cb());
+        this.ionViewWillEnterCallbacks.forEach((cb) => {
+            const destructor = cb();
+            if (cb.id) {
+                this.ionViewWillEnterDestructorCallbacks.push({ id: cb.id, destructor });
+            }
+        });
     }
     onIonViewDidEnter(callback) {
         if (callback.id) {
@@ -153,7 +220,12 @@ const DefaultIonLifeCycleContext = class {
         }
     }
     ionViewDidEnter() {
-        this.ionViewDidEnterCallbacks.forEach((cb) => cb());
+        this.ionViewDidEnterCallbacks.forEach((cb) => {
+            const destructor = cb();
+            if (cb.id) {
+                this.ionViewDidEnterDestructorCallbacks.push({ id: cb.id, destructor });
+            }
+        });
     }
     onIonViewWillLeave(callback) {
         if (callback.id) {
@@ -170,7 +242,12 @@ const DefaultIonLifeCycleContext = class {
         }
     }
     ionViewWillLeave() {
-        this.ionViewWillLeaveCallbacks.forEach((cb) => cb());
+        this.ionViewWillLeaveCallbacks.forEach((cb) => {
+            const destructor = cb();
+            if (cb.id) {
+                this.ionViewWillLeaveDestructorCallbacks.push({ id: cb.id, destructor });
+            }
+        });
     }
     onIonViewDidLeave(callback) {
         if (callback.id) {
@@ -187,7 +264,12 @@ const DefaultIonLifeCycleContext = class {
         }
     }
     ionViewDidLeave() {
-        this.ionViewDidLeaveCallbacks.forEach((cb) => cb());
+        this.ionViewDidLeaveCallbacks.forEach((cb) => {
+            const destructor = cb();
+            if (cb.id) {
+                this.ionViewDidLeaveDestructorCallbacks.push({ id: cb.id, destructor });
+            }
+        });
         this.componentCanBeDestroyed();
     }
     onComponentCanBeDestroyed(callback) {
@@ -246,6 +328,9 @@ const useIonViewWillEnter = (callback, deps = []) => {
     useEffect(() => {
         callback.id = id.current;
         context.onIonViewWillEnter(callback);
+        return () => {
+            context.cleanupIonViewWillEnter(callback);
+        };
     }, deps);
 };
 const useIonViewDidEnter = (callback, deps = []) => {
@@ -255,6 +340,9 @@ const useIonViewDidEnter = (callback, deps = []) => {
     useEffect(() => {
         callback.id = id.current;
         context.onIonViewDidEnter(callback);
+        return () => {
+            context.cleanupIonViewDidEnter(callback);
+        };
     }, deps);
 };
 const useIonViewWillLeave = (callback, deps = []) => {
@@ -264,6 +352,9 @@ const useIonViewWillLeave = (callback, deps = []) => {
     useEffect(() => {
         callback.id = id.current;
         context.onIonViewWillLeave(callback);
+        return () => {
+            context.cleanupIonViewWillLeave(callback);
+        };
     }, deps);
 };
 const useIonViewDidLeave = (callback, deps = []) => {
@@ -273,6 +364,9 @@ const useIonViewDidLeave = (callback, deps = []) => {
     useEffect(() => {
         callback.id = id.current;
         context.onIonViewDidLeave(callback);
+        return () => {
+            context.cleanupIonViewDidLeave(callback);
+        };
     }, deps);
 };