@ionic/core 7.4.3-dev.11696264821.1755dd6a → 7.4.3-dev.11696355648.1f181be0

package/components/animation.js

@@ -159,7 +159,6 @@ const createAnimation = (animationId) => {
   const id = animationId;
   const onFinishCallbacks = [];
   const onFinishOneTimeCallbacks = [];
-  const onStopOneTimeCallbacks = [];
   const elements = [];
   const childAnimations = [];
   const stylesheets = [];
@@ -217,28 +216,6 @@ const createAnimation = (animationId) => {
   const isRunning = () => {
     return numAnimationsRunning !== 0 && !paused;
   };
-  /**
-   * @internal
-   * Remove a callback from a chosen callback array
-   * @param callbackToRemove: A reference to the callback that should be removed
-   * @param callbackObjects: An array of callbacks that callbackToRemove should be removed from.
-   */
-  const clearCallback = (callbackToRemove, callbackObjects) => {
-    const index = callbackObjects.findIndex((callbackObject) => callbackObject.c === callbackToRemove);
-    if (index > -1) {
-      callbackObjects.splice(index, 1);
-    }
-  };
-  /**
-   * @internal
-   * Add a callback to be fired when an animation is stopped/cancelled.
-   * @param callback: A reference to the callback that should be fired
-   * @param opts: Any options associated with this particular callback
-   */
-  const onStop = (callback, opts) => {
-    onStopOneTimeCallbacks.push({ c: callback, o: opts });
-    return ani;
-  };
   const onFinish = (callback, opts) => {
     const callbacks = (opts === null || opts === void 0 ? void 0 : opts.oneTimeCallback) ? onFinishOneTimeCallbacks : onFinishCallbacks;
     callbacks.push({ c: callback, o: opts });
@@ -907,33 +884,7 @@ const createAnimation = (animationId) => {
         numAnimationsRunning = childAnimations.length + 1;
         shouldCalculateNumAnimations = false;
       }
-      /**
-       * When one of these callbacks fires we
-       * need to clear the other's callback otherwise
-       * you can potentially get these callbacks
-       * firing multiple times if the play method
-       * is subsequently called.
-       * Example:
-       * animation.play() (onStop and onFinish callbacks are registered)
-       * animation.stop() (onStop callback is fired, onFinish is not)
-       * animation.play() (onStop and onFinish callbacks are registered)
-       * Total onStop callbacks: 1
-       * Total onFinish callbacks: 2
-       */
-      const onStopCallback = () => {
-        clearCallback(onFinishCallback, onFinishOneTimeCallbacks);
-        resolve();
-      };
-      const onFinishCallback = () => {
-        clearCallback(onStopCallback, onStopOneTimeCallbacks);
-        resolve();
-      };
-      /**
-       * The play method resolves when an animation
-       * run either finishes or is cancelled.
-       */
-      onFinish(onFinishCallback, { oneTimeCallback: true });
-      onStop(onStopCallback, { oneTimeCallback: true });
+      onFinish(() => resolve(), { oneTimeCallback: true });
       childAnimations.forEach((animation) => {
         animation.play();
       });
@@ -946,14 +897,6 @@ const createAnimation = (animationId) => {
       paused = false;
     });
   };
-  /**
-   * Stops an animation and resets it state to the
-   * beginning. This does not fire any onFinish
-   * callbacks because the animation did not finish.
-   * However, since the animation was not destroyed
-   * (i.e. the animation could run again) we do not
-   * clear the onFinish callbacks.
-   */
   const stop = () => {
     childAnimations.forEach((animation) => {
       animation.stop();
@@ -963,8 +906,6 @@ const createAnimation = (animationId) => {
       initialized = false;
     }
     resetFlags();
-    onStopOneTimeCallbacks.forEach((onStopCallback) => onStopCallback.c(0, ani));
-    onStopOneTimeCallbacks.length = 0;
   };
   const from = (property, value) => {
     const firstFrame = _keyframes[0];

package/components/ion-menu.js

@@ -33,14 +33,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
     this.lastOnEnd = 0;
     this.blocker = GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
     this.didLoad = false;
-    /**
-     * Flag used to determine if an open/close
-     * operation was cancelled. For example, if
-     * an app calls "menu.open" then disables the menu
-     * part way through the animation, then this would
-     * be considered a cancelled operation.
-     */
-    this.operationCancelled = false;
     this.isAnimating = false;
     this._isOpen = false;
     this.inheritedAttributes = {};
@@ -309,15 +301,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
     this.beforeAnimation(shouldOpen);
     await this.loadAnimation();
     await this.startAnimation(shouldOpen, animated);
-    /**
-     * If the animation was cancelled then
-     * return false because the operation
-     * did not succeed.
-     */
-    if (this.operationCancelled) {
-      this.operationCancelled = false;
-      return false;
-    }
     this.afterAnimation(shouldOpen);
     return true;
   }
@@ -354,23 +337,18 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
     const easingReverse = mode === 'ios' ? iosEasingReverse : mdEasingReverse;
     const ani = this.animation
       .direction(isReversed ? 'reverse' : 'normal')
-      .easing(isReversed ? easingReverse : easing);
+      .easing(isReversed ? easingReverse : easing)
+      .onFinish(() => {
+      if (ani.getDirection() === 'reverse') {
+        ani.direction('normal');
+      }
+    });
     if (animated) {
       await ani.play();
     }
     else {
       ani.play({ sync: true });
     }
-    /**
-     * We run this after the play invocation
-     * instead of using ani.onFinish so that
-     * multiple onFinish callbacks do not get
-     * run if an animation is played, stopped,
-     * and then played again.
-     */
-    if (ani.getDirection() === 'reverse') {
-      ani.direction('normal');
-    }
   }
   _isActive() {
     return !this.disabled && !this.isPaneVisible;
@@ -507,6 +485,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
   }
   afterAnimation(isOpen) {
     var _a;
+    assert(this.isAnimating, '_before() should be called while animating');
     // keep opening/closing the menu disabled for a touch more yet
     // only add listeners/css if it's enabled and isOpen
     // and only remove listeners/css if it's not open
@@ -565,29 +544,10 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
     if (this.gesture) {
       this.gesture.enable(isActive && this.swipeGesture);
     }
-    /**
-     * If the menu is disabled but it is still open
-     * then we should close the menu immediately.
-     * Additionally, if the menu is in the process
-     * of animating {open, close} and the menu is disabled
-     * then it should still be closed immediately.
-     */
-    if (!isActive) {
-      /**
-       * It is possible to disable the menu while
-       * it is mid-animation. When this happens, we
-       * need to set the operationCancelled flag
-       * so that this._setOpen knows to return false
-       * and not run the "afterAnimation" callback.
-       */
-      if (this.isAnimating) {
-        this.operationCancelled = true;
-      }
-      /**
-       * If the menu is disabled then we should
-       * forcibly close the menu even if it is open.
-       */
-      this.afterAnimation(false);
+    // Close menu immediately
+    if (!isActive && this._isOpen) {
+      // close if this menu is open, and should not be enabled
+      this.forceClosing();
     }
     if (doc === null || doc === void 0 ? void 0 : doc.contains(this.el)) {
       /**
@@ -600,6 +560,14 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
         menuController._setActiveMenu(this);
       }
     }
+    assert(!this.isAnimating, 'can not be animating');
+  }
+  forceClosing() {
+    assert(this._isOpen, 'menu cannot be closed');
+    this.isAnimating = true;
+    const ani = this.animation.direction('reverse');
+    ani.play({ sync: true });
+    this.afterAnimation(false);
   }
   render() {
     const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;

package/components/ion-segment.js

@@ -2,6 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { proxyCustomElement, HTMLElement, createEvent, writeTask, h, Host } from '@stencil/core/internal/client';
+import { r as raf } from './helpers.js';
 import { i as isRTL } from './dir.js';
 import { c as createColorClasses, h as hostContext } from './theme.js';
 import { b as getIonMode } from './ionic-global.js';
@@ -86,29 +87,7 @@ const Segment = /*@__PURE__*/ proxyCustomElement(class Segment extends HTMLEleme
      * Used by `ion-segment-button` to determine if the button should be checked.
      */
     this.ionSelect.emit({ value });
-    if (this.scrollable) {
-      const buttons = this.getButtons();
-      const activeButton = buttons.find((button) => button.value === value);
-      if (activeButton !== undefined) {
-        /**
-         * Scrollable segment buttons should be
-         * centered within the view including
-         * buttons that are partially offscreen.
-         */
-        activeButton.scrollIntoView({
-          behavior: 'smooth',
-          inline: 'center',
-          /**
-           * Segment should scroll on the
-           * horizontal axis. `block: 'nearest'`
-           * ensures that the vertical axis
-           * does not scroll if the segment
-           * as a whole is already in view.
-           */
-          block: 'nearest',
-        });
-      }
-    }
+    this.scrollActiveButtonIntoView();
   }
   disabledChanged() {
     this.gestureChanged();
@@ -130,6 +109,13 @@ const Segment = /*@__PURE__*/ proxyCustomElement(class Segment extends HTMLEleme
   }
   async componentDidLoad() {
     this.setCheckedClasses();
+    /**
+     * We need to wait for the buttons to all be rendered
+     * before we can scroll.
+     */
+    raf(() => {
+      this.scrollActiveButtonIntoView();
+    });
     this.gesture = (await import('./index3.js')).createGesture({
       el: this.el,
       gestureName: 'segment',
@@ -258,6 +244,32 @@ const Segment = /*@__PURE__*/ proxyCustomElement(class Segment extends HTMLEleme
       buttons[next].classList.add('segment-button-after-checked');
     }
   }
+  scrollActiveButtonIntoView() {
+    const { scrollable, value } = this;
+    if (scrollable) {
+      const buttons = this.getButtons();
+      const activeButton = buttons.find((button) => button.value === value);
+      if (activeButton !== undefined) {
+        /**
+         * Scrollable segment buttons should be
+         * centered within the view including
+         * buttons that are partially offscreen.
+         */
+        activeButton.scrollIntoView({
+          behavior: 'smooth',
+          inline: 'center',
+          /**
+           * Segment should scroll on the
+           * horizontal axis. `block: 'nearest'`
+           * ensures that the vertical axis
+           * does not scroll if the segment
+           * as a whole is already in view.
+           */
+          block: 'nearest',
+        });
+      }
+    }
+  }
   setNextIndex(detail, isEnd = false) {
     const rtl = isRTL(this.el);
     const activated = this.activated;

package/dist/cjs/{animation-c8bdd3c7.js → animation-2bb33618.js}

@@ -161,7 +161,6 @@ const createAnimation = (animationId) => {
   const id = animationId;
   const onFinishCallbacks = [];
   const onFinishOneTimeCallbacks = [];
-  const onStopOneTimeCallbacks = [];
   const elements = [];
   const childAnimations = [];
   const stylesheets = [];
@@ -219,28 +218,6 @@ const createAnimation = (animationId) => {
   const isRunning = () => {
     return numAnimationsRunning !== 0 && !paused;
   };
-  /**
-   * @internal
-   * Remove a callback from a chosen callback array
-   * @param callbackToRemove: A reference to the callback that should be removed
-   * @param callbackObjects: An array of callbacks that callbackToRemove should be removed from.
-   */
-  const clearCallback = (callbackToRemove, callbackObjects) => {
-    const index = callbackObjects.findIndex((callbackObject) => callbackObject.c === callbackToRemove);
-    if (index > -1) {
-      callbackObjects.splice(index, 1);
-    }
-  };
-  /**
-   * @internal
-   * Add a callback to be fired when an animation is stopped/cancelled.
-   * @param callback: A reference to the callback that should be fired
-   * @param opts: Any options associated with this particular callback
-   */
-  const onStop = (callback, opts) => {
-    onStopOneTimeCallbacks.push({ c: callback, o: opts });
-    return ani;
-  };
   const onFinish = (callback, opts) => {
     const callbacks = (opts === null || opts === void 0 ? void 0 : opts.oneTimeCallback) ? onFinishOneTimeCallbacks : onFinishCallbacks;
     callbacks.push({ c: callback, o: opts });
@@ -909,33 +886,7 @@ const createAnimation = (animationId) => {
         numAnimationsRunning = childAnimations.length + 1;
         shouldCalculateNumAnimations = false;
       }
-      /**
-       * When one of these callbacks fires we
-       * need to clear the other's callback otherwise
-       * you can potentially get these callbacks
-       * firing multiple times if the play method
-       * is subsequently called.
-       * Example:
-       * animation.play() (onStop and onFinish callbacks are registered)
-       * animation.stop() (onStop callback is fired, onFinish is not)
-       * animation.play() (onStop and onFinish callbacks are registered)
-       * Total onStop callbacks: 1
-       * Total onFinish callbacks: 2
-       */
-      const onStopCallback = () => {
-        clearCallback(onFinishCallback, onFinishOneTimeCallbacks);
-        resolve();
-      };
-      const onFinishCallback = () => {
-        clearCallback(onStopCallback, onStopOneTimeCallbacks);
-        resolve();
-      };
-      /**
-       * The play method resolves when an animation
-       * run either finishes or is cancelled.
-       */
-      onFinish(onFinishCallback, { oneTimeCallback: true });
-      onStop(onStopCallback, { oneTimeCallback: true });
+      onFinish(() => resolve(), { oneTimeCallback: true });
       childAnimations.forEach((animation) => {
         animation.play();
       });
@@ -948,14 +899,6 @@ const createAnimation = (animationId) => {
       paused = false;
     });
   };
-  /**
-   * Stops an animation and resets it state to the
-   * beginning. This does not fire any onFinish
-   * callbacks because the animation did not finish.
-   * However, since the animation was not destroyed
-   * (i.e. the animation could run again) we do not
-   * clear the onFinish callbacks.
-   */
   const stop = () => {
     childAnimations.forEach((animation) => {
       animation.stop();
@@ -965,8 +908,6 @@ const createAnimation = (animationId) => {
       initialized = false;
     }
     resetFlags();
-    onStopOneTimeCallbacks.forEach((onStopCallback) => onStopCallback.c(0, ani));
-    onStopOneTimeCallbacks.length = 0;
   };
   const from = (property, value) => {
     const firstFrame = _keyframes[0];

package/dist/cjs/{index-e50a18ba.js → index-5121bb90.js}

@@ -6,7 +6,7 @@
 const hardwareBackButton = require('./hardware-back-button-b67c8e75.js');
 const helpers = require('./helpers-ea4ccbcb.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 
 /**
  * baseAnimation

package/dist/cjs/{index-c388851f.js → index-b183138a.js}

@@ -12,8 +12,8 @@ const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
 const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
 const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
 
-const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-fd592869.js'); });
-const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-a6040d41.js'); });
+const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-4b93903d.js'); });
+const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-79f3a215.js'); });
 // TODO(FW-2832): types
 const transition = (opts) => {
   return new Promise((resolve, reject) => {

package/dist/cjs/index.cjs.js

@@ -5,16 +5,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const animation = require('./animation-c8bdd3c7.js');
-const index = require('./index-c388851f.js');
-const ios_transition = require('./ios.transition-fd592869.js');
-const md_transition = require('./md.transition-a6040d41.js');
+const animation = require('./animation-2bb33618.js');
+const index = require('./index-b183138a.js');
+const ios_transition = require('./ios.transition-4b93903d.js');
+const md_transition = require('./md.transition-79f3a215.js');
 const cubicBezier = require('./cubic-bezier-6b9222ad.js');
 const index$1 = require('./index-0ee995e4.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
 const helpers = require('./helpers-ea4ccbcb.js');
 const config = require('./config-d5882735.js');
-const index$2 = require('./index-e50a18ba.js');
+const index$2 = require('./index-5121bb90.js');
 const overlays = require('./overlays-d3a13e61.js');
 require('./index-306a7476.js');
 require('./index-6f887430.js');

package/dist/cjs/ion-action-sheet.cjs.entry.js

@@ -12,7 +12,7 @@ const lockController = require('./lock-controller-4ae2eb59.js');
 const overlays = require('./overlays-d3a13e61.js');
 const theme = require('./theme-fbc56b3b.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 require('./haptic-c5f6b4d5.js');
 require('./capacitor-2ffba62a.js');
 require('./index-306a7476.js');

package/dist/cjs/ion-alert.cjs.entry.js

@@ -13,7 +13,7 @@ const lockController = require('./lock-controller-4ae2eb59.js');
 const overlays = require('./overlays-d3a13e61.js');
 const theme = require('./theme-fbc56b3b.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 require('./haptic-c5f6b4d5.js');
 require('./capacitor-2ffba62a.js');
 require('./index-306a7476.js');

package/dist/cjs/ion-app_8.cjs.entry.js

@@ -14,7 +14,7 @@ const index$1 = require('./index-10873539.js');
 const keyboardController = require('./keyboard-controller-50beb83a.js');
 const cubicBezier = require('./cubic-bezier-6b9222ad.js');
 const frameworkDelegate = require('./framework-delegate-c0873a6f.js');
-const index$2 = require('./index-c388851f.js');
+const index$2 = require('./index-b183138a.js');
 require('./index-cc7dfb7c.js');
 require('./index-306a7476.js');
 require('./keyboard-fd7db491.js');

package/dist/cjs/ion-datetime_3.cjs.entry.js

@@ -16,7 +16,7 @@ const ionicGlobal = require('./ionic-global-14a0604b.js');
 const data = require('./data-db832785.js');
 const lockController = require('./lock-controller-4ae2eb59.js');
 const overlays = require('./overlays-d3a13e61.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 const haptic = require('./haptic-c5f6b4d5.js');
 require('./index-306a7476.js');
 require('./framework-delegate-c0873a6f.js');

package/dist/cjs/ion-loading.cjs.entry.js

@@ -12,7 +12,7 @@ const lockController = require('./lock-controller-4ae2eb59.js');
 const overlays = require('./overlays-d3a13e61.js');
 const theme = require('./theme-fbc56b3b.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 require('./index-306a7476.js');
 require('./framework-delegate-c0873a6f.js');
 require('./hardware-back-button-b67c8e75.js');

package/dist/cjs/ion-menu_3.cjs.entry.js

@@ -10,13 +10,13 @@ const cubicBezier = require('./cubic-bezier-6b9222ad.js');
 const index$2 = require('./index-306a7476.js');
 const gestureController = require('./gesture-controller-b46721be.js');
 const helpers = require('./helpers-ea4ccbcb.js');
-const index$1 = require('./index-e50a18ba.js');
+const index$1 = require('./index-5121bb90.js');
 const overlays = require('./overlays-d3a13e61.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
 const theme = require('./theme-fbc56b3b.js');
 const index$3 = require('./index-d8d1fc0b.js');
 require('./hardware-back-button-b67c8e75.js');
-require('./animation-c8bdd3c7.js');
+require('./animation-2bb33618.js');
 require('./framework-delegate-c0873a6f.js');
 require('./index-cc7dfb7c.js');
 
@@ -40,14 +40,6 @@ const Menu = class {
     this.lastOnEnd = 0;
     this.blocker = gestureController.GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
     this.didLoad = false;
-    /**
-     * Flag used to determine if an open/close
-     * operation was cancelled. For example, if
-     * an app calls "menu.open" then disables the menu
-     * part way through the animation, then this would
-     * be considered a cancelled operation.
-     */
-    this.operationCancelled = false;
     this.isAnimating = false;
     this._isOpen = false;
     this.inheritedAttributes = {};
@@ -313,15 +305,6 @@ const Menu = class {
     this.beforeAnimation(shouldOpen);
     await this.loadAnimation();
     await this.startAnimation(shouldOpen, animated);
-    /**
-     * If the animation was cancelled then
-     * return false because the operation
-     * did not succeed.
-     */
-    if (this.operationCancelled) {
-      this.operationCancelled = false;
-      return false;
-    }
     this.afterAnimation(shouldOpen);
     return true;
   }
@@ -358,23 +341,18 @@ const Menu = class {
     const easingReverse = mode === 'ios' ? iosEasingReverse : mdEasingReverse;
     const ani = this.animation
       .direction(isReversed ? 'reverse' : 'normal')
-      .easing(isReversed ? easingReverse : easing);
+      .easing(isReversed ? easingReverse : easing)
+      .onFinish(() => {
+      if (ani.getDirection() === 'reverse') {
+        ani.direction('normal');
+      }
+    });
     if (animated) {
       await ani.play();
     }
     else {
       ani.play({ sync: true });
     }
-    /**
-     * We run this after the play invocation
-     * instead of using ani.onFinish so that
-     * multiple onFinish callbacks do not get
-     * run if an animation is played, stopped,
-     * and then played again.
-     */
-    if (ani.getDirection() === 'reverse') {
-      ani.direction('normal');
-    }
   }
   _isActive() {
     return !this.disabled && !this.isPaneVisible;
@@ -511,6 +489,7 @@ const Menu = class {
   }
   afterAnimation(isOpen) {
     var _a;
+    helpers.assert(this.isAnimating, '_before() should be called while animating');
     // keep opening/closing the menu disabled for a touch more yet
     // only add listeners/css if it's enabled and isOpen
     // and only remove listeners/css if it's not open
@@ -569,29 +548,10 @@ const Menu = class {
     if (this.gesture) {
       this.gesture.enable(isActive && this.swipeGesture);
     }
-    /**
-     * If the menu is disabled but it is still open
-     * then we should close the menu immediately.
-     * Additionally, if the menu is in the process
-     * of animating {open, close} and the menu is disabled
-     * then it should still be closed immediately.
-     */
-    if (!isActive) {
-      /**
-       * It is possible to disable the menu while
-       * it is mid-animation. When this happens, we
-       * need to set the operationCancelled flag
-       * so that this._setOpen knows to return false
-       * and not run the "afterAnimation" callback.
-       */
-      if (this.isAnimating) {
-        this.operationCancelled = true;
-      }
-      /**
-       * If the menu is disabled then we should
-       * forcibly close the menu even if it is open.
-       */
-      this.afterAnimation(false);
+    // Close menu immediately
+    if (!isActive && this._isOpen) {
+      // close if this menu is open, and should not be enabled
+      this.forceClosing();
     }
     if (index$2.doc === null || index$2.doc === void 0 ? void 0 : index$2.doc.contains(this.el)) {
       /**
@@ -604,6 +564,14 @@ const Menu = class {
         index$1.menuController._setActiveMenu(this);
       }
     }
+    helpers.assert(!this.isAnimating, 'can not be animating');
+  }
+  forceClosing() {
+    helpers.assert(this._isOpen, 'menu cannot be closed');
+    this.isAnimating = true;
+    const ani = this.animation.direction('reverse');
+    ani.play({ sync: true });
+    this.afterAnimation(false);
   }
   render() {
     const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;

package/dist/cjs/ion-modal.cjs.entry.js

@@ -14,10 +14,10 @@ const index$4 = require('./index-cc7dfb7c.js');
 const capacitor = require('./capacitor-2ffba62a.js');
 const overlays = require('./overlays-d3a13e61.js');
 const theme = require('./theme-fbc56b3b.js');
-const index$5 = require('./index-c388851f.js');
+const index$5 = require('./index-b183138a.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
 const keyboard = require('./keyboard-38f2bb7b.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 const cubicBezier = require('./cubic-bezier-6b9222ad.js');
 const index$1 = require('./index-0ee995e4.js');
 const index = require('./index-306a7476.js');

package/dist/cjs/ion-nav_2.cjs.entry.js

@@ -8,7 +8,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-6f887430.js');
 const cubicBezier = require('./cubic-bezier-6b9222ad.js');
 const helpers = require('./helpers-ea4ccbcb.js');
-const index$1 = require('./index-c388851f.js');
+const index$1 = require('./index-b183138a.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
 const frameworkDelegate = require('./framework-delegate-c0873a6f.js');
 

package/dist/cjs/ion-popover.cjs.entry.js

@@ -13,8 +13,8 @@ const index$1 = require('./index-cc7dfb7c.js');
 const overlays = require('./overlays-d3a13e61.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
 const theme = require('./theme-fbc56b3b.js');
-const index$2 = require('./index-c388851f.js');
-const animation = require('./animation-c8bdd3c7.js');
+const index$2 = require('./index-b183138a.js');
+const animation = require('./animation-2bb33618.js');
 require('./index-306a7476.js');
 require('./hardware-back-button-b67c8e75.js');
 

package/dist/cjs/ion-refresher_2.cjs.entry.js

@@ -11,7 +11,7 @@ const index$1 = require('./index-10873539.js');
 const helpers = require('./helpers-ea4ccbcb.js');
 const haptic = require('./haptic-c5f6b4d5.js');
 const ionicGlobal = require('./ionic-global-14a0604b.js');
-const animation = require('./animation-c8bdd3c7.js');
+const animation = require('./animation-2bb33618.js');
 const config = require('./config-d5882735.js');
 const index$2 = require('./index-d8d1fc0b.js');
 const spinnerConfigs = require('./spinner-configs-f7b5105b.js');