@ionic/core 7.4.3-dev.11695994917.15d3036b → 7.4.3-dev.11696260184.1e4ad047

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/components/animation.js +60 -1
  2. package/components/ion-menu.js +51 -19
  3. package/components/popover.js +4 -3
  4. package/dist/cjs/{animation-2bb33618.js → animation-c8bdd3c7.js} +60 -1
  5. package/dist/cjs/{index-b183138a.js → index-c388851f.js} +2 -2
  6. package/dist/cjs/{index-5121bb90.js → index-e50a18ba.js} +1 -1
  7. package/dist/cjs/index.cjs.js +5 -5
  8. package/dist/cjs/ion-action-sheet.cjs.entry.js +1 -1
  9. package/dist/cjs/ion-alert.cjs.entry.js +1 -1
  10. package/dist/cjs/ion-app_8.cjs.entry.js +1 -1
  11. package/dist/cjs/ion-datetime_3.cjs.entry.js +1 -1
  12. package/dist/cjs/ion-loading.cjs.entry.js +1 -1
  13. package/dist/cjs/ion-menu_3.cjs.entry.js +53 -21
  14. package/dist/cjs/ion-modal.cjs.entry.js +2 -2
  15. package/dist/cjs/ion-nav_2.cjs.entry.js +1 -1
  16. package/dist/cjs/ion-popover.cjs.entry.js +6 -5
  17. package/dist/cjs/ion-refresher_2.cjs.entry.js +1 -1
  18. package/dist/cjs/ion-toast.cjs.entry.js +1 -1
  19. package/dist/cjs/{ios.transition-4b93903d.js → ios.transition-fd592869.js} +2 -2
  20. package/dist/cjs/{md.transition-79f3a215.js → md.transition-a6040d41.js} +2 -2
  21. package/dist/collection/components/menu/menu.js +51 -19
  22. package/dist/collection/components/popover/utils.js +4 -3
  23. package/dist/collection/utils/animation/animation.js +60 -1
  24. package/dist/docs.json +1 -1
  25. package/dist/esm/{animation-a1d9e088.js → animation-92066c62.js} +60 -1
  26. package/dist/esm/{index-61bddc90.js → index-9b1940b1.js} +1 -1
  27. package/dist/esm/{index-87684bba.js → index-ca26aea8.js} +2 -2
  28. package/dist/esm/index.js +5 -5
  29. package/dist/esm/ion-action-sheet.entry.js +1 -1
  30. package/dist/esm/ion-alert.entry.js +1 -1
  31. package/dist/esm/ion-app_8.entry.js +1 -1
  32. package/dist/esm/ion-datetime_3.entry.js +1 -1
  33. package/dist/esm/ion-loading.entry.js +1 -1
  34. package/dist/esm/ion-menu_3.entry.js +53 -21
  35. package/dist/esm/ion-modal.entry.js +2 -2
  36. package/dist/esm/ion-nav_2.entry.js +1 -1
  37. package/dist/esm/ion-popover.entry.js +6 -5
  38. package/dist/esm/ion-refresher_2.entry.js +1 -1
  39. package/dist/esm/ion-toast.entry.js +1 -1
  40. package/dist/esm/{ios.transition-81e1aed6.js → ios.transition-d4be3bd5.js} +2 -2
  41. package/dist/esm/{md.transition-5becd8b5.js → md.transition-ae47f354.js} +2 -2
  42. package/dist/esm-es5/animation-92066c62.js +4 -0
  43. package/dist/esm-es5/{index-61bddc90.js → index-9b1940b1.js} +1 -1
  44. package/dist/esm-es5/{index-87684bba.js → index-ca26aea8.js} +1 -1
  45. package/dist/esm-es5/index.js +1 -1
  46. package/dist/esm-es5/ion-action-sheet.entry.js +1 -1
  47. package/dist/esm-es5/ion-alert.entry.js +1 -1
  48. package/dist/esm-es5/ion-app_8.entry.js +1 -1
  49. package/dist/esm-es5/ion-datetime_3.entry.js +1 -1
  50. package/dist/esm-es5/ion-loading.entry.js +1 -1
  51. package/dist/esm-es5/ion-menu_3.entry.js +1 -1
  52. package/dist/esm-es5/ion-modal.entry.js +1 -1
  53. package/dist/esm-es5/ion-nav_2.entry.js +1 -1
  54. package/dist/esm-es5/ion-popover.entry.js +1 -1
  55. package/dist/esm-es5/ion-refresher_2.entry.js +1 -1
  56. package/dist/esm-es5/ion-toast.entry.js +1 -1
  57. package/dist/esm-es5/{ios.transition-81e1aed6.js → ios.transition-d4be3bd5.js} +1 -1
  58. package/dist/esm-es5/{md.transition-5becd8b5.js → md.transition-ae47f354.js} +1 -1
  59. package/dist/ionic/index.esm.js +1 -1
  60. package/dist/ionic/ionic.esm.js +1 -1
  61. package/dist/ionic/p-003dbb0e.entry.js +4 -0
  62. package/dist/ionic/p-015187e5.system.js +4 -0
  63. package/dist/ionic/{p-4616f20a.system.entry.js → p-0505bc05.system.entry.js} +1 -1
  64. package/dist/ionic/{p-a6d8476b.system.entry.js → p-06a68207.system.entry.js} +1 -1
  65. package/dist/ionic/p-0a39673e.js +4 -0
  66. package/dist/ionic/{p-8fdd4a2f.system.js → p-0fb0904b.system.js} +1 -1
  67. package/dist/ionic/p-12b13ed4.entry.js +4 -0
  68. package/dist/ionic/{p-048d7153.system.entry.js → p-17f69cbc.system.entry.js} +1 -1
  69. package/dist/ionic/p-1a6c0442.js +4 -0
  70. package/dist/ionic/{p-90d892fd.entry.js → p-24ebc805.entry.js} +1 -1
  71. package/dist/ionic/p-2624b777.system.entry.js +4 -0
  72. package/dist/ionic/{p-c5729044.system.entry.js → p-26a785e9.system.entry.js} +1 -1
  73. package/dist/ionic/{p-b098f738.system.js → p-2a13187a.system.js} +1 -1
  74. package/dist/ionic/p-37a0b769.js +4 -0
  75. package/dist/ionic/{p-de676d36.system.entry.js → p-40ffdeb5.system.entry.js} +1 -1
  76. package/dist/ionic/p-446230d7.js +4 -0
  77. package/dist/ionic/{p-1a36bf45.system.entry.js → p-4d2c9270.system.entry.js} +1 -1
  78. package/dist/ionic/{p-f920f5ca.entry.js → p-4df178d7.entry.js} +1 -1
  79. package/dist/ionic/{p-918d5f19.system.js → p-51163f34.system.js} +1 -1
  80. package/dist/ionic/{p-7e46b6ab.entry.js → p-5c9f38bf.entry.js} +1 -1
  81. package/dist/ionic/p-6edbc09b.system.js +1 -1
  82. package/dist/ionic/{p-65a4c12f.system.entry.js → p-9eea70fb.system.entry.js} +1 -1
  83. package/dist/ionic/{p-13a91505.entry.js → p-9f758520.entry.js} +1 -1
  84. package/dist/ionic/{p-ee6d9730.entry.js → p-a42bbc51.entry.js} +1 -1
  85. package/dist/ionic/{p-27614d55.entry.js → p-b0c3f506.entry.js} +1 -1
  86. package/dist/ionic/{p-f547e62f.entry.js → p-b1a04d35.entry.js} +1 -1
  87. package/dist/ionic/p-bff7659e.system.entry.js +4 -0
  88. package/dist/ionic/{p-d4cea1ba.system.js → p-c6221536.system.js} +1 -1
  89. package/dist/ionic/{p-bf9b1560.entry.js → p-d4f02009.entry.js} +1 -1
  90. package/dist/ionic/{p-c7fca267.entry.js → p-d6e93d49.entry.js} +1 -1
  91. package/dist/ionic/{p-6bc9c436.system.entry.js → p-dcdc16e8.system.entry.js} +1 -1
  92. package/dist/ionic/{p-08c5b9f4.system.entry.js → p-eac9308b.system.entry.js} +1 -1
  93. package/dist/ionic/{p-73f50e29.system.js → p-f2bc4fc0.system.js} +1 -1
  94. package/dist/ionic/{p-5e2dc8e0.js → p-f70372cf.js} +1 -1
  95. package/dist/types/components/menu/menu.d.ts +8 -1
  96. package/hydrate/index.js +115 -23
  97. package/package.json +1 -1
  98. package/dist/esm-es5/animation-a1d9e088.js +0 -4
  99. package/dist/ionic/p-40e16caa.system.entry.js +0 -4
  100. package/dist/ionic/p-6b2641f6.system.js +0 -4
  101. package/dist/ionic/p-72a1cbc7.js +0 -4
  102. package/dist/ionic/p-78a293a5.js +0 -4
  103. package/dist/ionic/p-94a4ce40.js +0 -4
  104. package/dist/ionic/p-a76e80db.entry.js +0 -4
  105. package/dist/ionic/p-af624417.system.entry.js +0 -4
  106. package/dist/ionic/p-b95fd3c6.entry.js +0 -4
  107. package/dist/ionic/p-f978ccd1.js +0 -4
@@ -159,6 +159,7 @@ const createAnimation = (animationId) => {
159
159
  const id = animationId;
160
160
  const onFinishCallbacks = [];
161
161
  const onFinishOneTimeCallbacks = [];
162
+ const onStopOneTimeCallbacks = [];
162
163
  const elements = [];
163
164
  const childAnimations = [];
164
165
  const stylesheets = [];
@@ -216,6 +217,28 @@ const createAnimation = (animationId) => {
216
217
  const isRunning = () => {
217
218
  return numAnimationsRunning !== 0 && !paused;
218
219
  };
220
+ /**
221
+ * @internal
222
+ * Remove a callback from a chosen callback array
223
+ * @param callbackToRemove: A reference to the callback that should be removed
224
+ * @param callbackObjects: An array of callbacks that callbackToRemove should be removed from.
225
+ */
226
+ const clearCallback = (callbackToRemove, callbackObjects) => {
227
+ const index = callbackObjects.findIndex((callbackObject) => callbackObject.c === callbackToRemove);
228
+ if (index > -1) {
229
+ callbackObjects.splice(index, 1);
230
+ }
231
+ };
232
+ /**
233
+ * @internal
234
+ * Add a callback to be fired when an animation is stopped/cancelled.
235
+ * @param callback: A reference to the callback that should be fired
236
+ * @param opts: Any options associated with this particular callback
237
+ */
238
+ const onStop = (callback, opts) => {
239
+ onStopOneTimeCallbacks.push({ c: callback, o: opts });
240
+ return ani;
241
+ };
219
242
  const onFinish = (callback, opts) => {
220
243
  const callbacks = (opts === null || opts === void 0 ? void 0 : opts.oneTimeCallback) ? onFinishOneTimeCallbacks : onFinishCallbacks;
221
244
  callbacks.push({ c: callback, o: opts });
@@ -884,7 +907,33 @@ const createAnimation = (animationId) => {
884
907
  numAnimationsRunning = childAnimations.length + 1;
885
908
  shouldCalculateNumAnimations = false;
886
909
  }
887
- onFinish(() => resolve(), { oneTimeCallback: true });
910
+ /**
911
+ * When one of these callbacks fires we
912
+ * need to clear the other's callback otherwise
913
+ * you can potentially get these callbacks
914
+ * firing multiple times if the play method
915
+ * is subsequently called.
916
+ * Example:
917
+ * animation.play() (onStop and onFinish callbacks are registered)
918
+ * animation.stop() (onStop callback is fired, onFinish is not)
919
+ * animation.play() (onStop and onFinish callbacks are registered)
920
+ * Total onStop callbacks: 1
921
+ * Total onFinish callbacks: 2
922
+ */
923
+ const onStopCallback = () => {
924
+ clearCallback(onFinishCallback, onFinishOneTimeCallbacks);
925
+ resolve();
926
+ };
927
+ const onFinishCallback = () => {
928
+ clearCallback(onStopCallback, onStopOneTimeCallbacks);
929
+ resolve();
930
+ };
931
+ /**
932
+ * The play method resolves when an animation
933
+ * run either finishes or is cancelled.
934
+ */
935
+ onFinish(onFinishCallback, { oneTimeCallback: true });
936
+ onStop(onStopCallback, { oneTimeCallback: true });
888
937
  childAnimations.forEach((animation) => {
889
938
  animation.play();
890
939
  });
@@ -897,6 +946,14 @@ const createAnimation = (animationId) => {
897
946
  paused = false;
898
947
  });
899
948
  };
949
+ /**
950
+ * Stops an animation and resets it state to the
951
+ * beginning. This does not fire any onFinish
952
+ * callbacks because the animation did not finish.
953
+ * However, since the animation was not destroyed
954
+ * (i.e. the animation could run again) we do not
955
+ * clear the onFinish callbacks.
956
+ */
900
957
  const stop = () => {
901
958
  childAnimations.forEach((animation) => {
902
959
  animation.stop();
@@ -906,6 +963,8 @@ const createAnimation = (animationId) => {
906
963
  initialized = false;
907
964
  }
908
965
  resetFlags();
966
+ onStopOneTimeCallbacks.forEach((onStopCallback) => onStopCallback.c(0, ani));
967
+ onStopOneTimeCallbacks.length = 0;
909
968
  };
910
969
  const from = (property, value) => {
911
970
  const firstFrame = _keyframes[0];
@@ -33,6 +33,14 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
33
33
  this.lastOnEnd = 0;
34
34
  this.blocker = GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
35
35
  this.didLoad = false;
36
+ /**
37
+ * Flag used to determine if an open/close
38
+ * operation was cancelled. For example, if
39
+ * an app calls "menu.open" then disables the menu
40
+ * part way through the animation, then this would
41
+ * be considered a cancelled operation.
42
+ */
43
+ this.operationCancelled = false;
36
44
  this.isAnimating = false;
37
45
  this._isOpen = false;
38
46
  this.inheritedAttributes = {};
@@ -301,6 +309,15 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
301
309
  this.beforeAnimation(shouldOpen);
302
310
  await this.loadAnimation();
303
311
  await this.startAnimation(shouldOpen, animated);
312
+ /**
313
+ * If the animation was cancelled then
314
+ * return false because the operation
315
+ * did not succeed.
316
+ */
317
+ if (this.operationCancelled) {
318
+ this.operationCancelled = false;
319
+ return false;
320
+ }
304
321
  this.afterAnimation(shouldOpen);
305
322
  return true;
306
323
  }
@@ -337,18 +354,23 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
337
354
  const easingReverse = mode === 'ios' ? iosEasingReverse : mdEasingReverse;
338
355
  const ani = this.animation
339
356
  .direction(isReversed ? 'reverse' : 'normal')
340
- .easing(isReversed ? easingReverse : easing)
341
- .onFinish(() => {
342
- if (ani.getDirection() === 'reverse') {
343
- ani.direction('normal');
344
- }
345
- });
357
+ .easing(isReversed ? easingReverse : easing);
346
358
  if (animated) {
347
359
  await ani.play();
348
360
  }
349
361
  else {
350
362
  ani.play({ sync: true });
351
363
  }
364
+ /**
365
+ * We run this after the play invocation
366
+ * instead of using ani.onFinish so that
367
+ * multiple onFinish callbacks do not get
368
+ * run if an animation is played, stopped,
369
+ * and then played again.
370
+ */
371
+ if (ani.getDirection() === 'reverse') {
372
+ ani.direction('normal');
373
+ }
352
374
  }
353
375
  _isActive() {
354
376
  return !this.disabled && !this.isPaneVisible;
@@ -485,7 +507,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
485
507
  }
486
508
  afterAnimation(isOpen) {
487
509
  var _a;
488
- assert(this.isAnimating, '_before() should be called while animating');
489
510
  // keep opening/closing the menu disabled for a touch more yet
490
511
  // only add listeners/css if it's enabled and isOpen
491
512
  // and only remove listeners/css if it's not open
@@ -544,10 +565,29 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
544
565
  if (this.gesture) {
545
566
  this.gesture.enable(isActive && this.swipeGesture);
546
567
  }
547
- // Close menu immediately
548
- if (!isActive && this._isOpen) {
549
- // close if this menu is open, and should not be enabled
550
- this.forceClosing();
568
+ /**
569
+ * If the menu is disabled but it is still open
570
+ * then we should close the menu immediately.
571
+ * Additionally, if the menu is in the process
572
+ * of animating {open, close} and the menu is disabled
573
+ * then it should still be closed immediately.
574
+ */
575
+ if (!isActive) {
576
+ /**
577
+ * It is possible to disable the menu while
578
+ * it is mid-animation. When this happens, we
579
+ * need to set the operationCancelled flag
580
+ * so that this._setOpen knows to return false
581
+ * and not run the "afterAnimation" callback.
582
+ */
583
+ if (this.isAnimating) {
584
+ this.operationCancelled = true;
585
+ }
586
+ /**
587
+ * If the menu is disabled then we should
588
+ * forcibly close the menu even if it is open.
589
+ */
590
+ this.afterAnimation(false);
551
591
  }
552
592
  if (doc === null || doc === void 0 ? void 0 : doc.contains(this.el)) {
553
593
  /**
@@ -560,14 +600,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
560
600
  menuController._setActiveMenu(this);
561
601
  }
562
602
  }
563
- assert(!this.isAnimating, 'can not be animating');
564
- }
565
- forceClosing() {
566
- assert(this._isOpen, 'menu cannot be closed');
567
- this.isAnimating = true;
568
- const ani = this.animation.direction('reverse');
569
- ani.play({ sync: true });
570
- this.afterAnimation(false);
571
603
  }
572
604
  render() {
573
605
  const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
@@ -659,7 +659,9 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
659
659
  let originY = contentOriginY;
660
660
  let checkSafeAreaLeft = false;
661
661
  let checkSafeAreaRight = false;
662
- const triggerTop = triggerCoordinates ? triggerCoordinates.top : bodyHeight / 2 - contentHeight / 2;
662
+ const triggerTop = triggerCoordinates
663
+ ? triggerCoordinates.top + triggerCoordinates.height
664
+ : bodyHeight / 2 - contentHeight / 2;
663
665
  const triggerHeight = triggerCoordinates ? triggerCoordinates.height : 0;
664
666
  let addPopoverBottomClass = false;
665
667
  /**
@@ -699,7 +701,7 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
699
701
  * We chose 12 here so that the popover position looks a bit nicer as
700
702
  * it is not right up against the edge of the screen.
701
703
  */
702
- top = Math.max(12, triggerTop - contentHeight - (arrowHeight - 1));
704
+ top = Math.max(12, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
703
705
  arrowTop = top + contentHeight;
704
706
  originY = 'bottom';
705
707
  addPopoverBottomClass = true;
@@ -712,7 +714,6 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
712
714
  bottom = bodyPadding;
713
715
  }
714
716
  }
715
- console.log(top, arrowTop);
716
717
  return {
717
718
  top,
718
719
  left,
@@ -161,6 +161,7 @@ const createAnimation = (animationId) => {
161
161
  const id = animationId;
162
162
  const onFinishCallbacks = [];
163
163
  const onFinishOneTimeCallbacks = [];
164
+ const onStopOneTimeCallbacks = [];
164
165
  const elements = [];
165
166
  const childAnimations = [];
166
167
  const stylesheets = [];
@@ -218,6 +219,28 @@ const createAnimation = (animationId) => {
218
219
  const isRunning = () => {
219
220
  return numAnimationsRunning !== 0 && !paused;
220
221
  };
222
+ /**
223
+ * @internal
224
+ * Remove a callback from a chosen callback array
225
+ * @param callbackToRemove: A reference to the callback that should be removed
226
+ * @param callbackObjects: An array of callbacks that callbackToRemove should be removed from.
227
+ */
228
+ const clearCallback = (callbackToRemove, callbackObjects) => {
229
+ const index = callbackObjects.findIndex((callbackObject) => callbackObject.c === callbackToRemove);
230
+ if (index > -1) {
231
+ callbackObjects.splice(index, 1);
232
+ }
233
+ };
234
+ /**
235
+ * @internal
236
+ * Add a callback to be fired when an animation is stopped/cancelled.
237
+ * @param callback: A reference to the callback that should be fired
238
+ * @param opts: Any options associated with this particular callback
239
+ */
240
+ const onStop = (callback, opts) => {
241
+ onStopOneTimeCallbacks.push({ c: callback, o: opts });
242
+ return ani;
243
+ };
221
244
  const onFinish = (callback, opts) => {
222
245
  const callbacks = (opts === null || opts === void 0 ? void 0 : opts.oneTimeCallback) ? onFinishOneTimeCallbacks : onFinishCallbacks;
223
246
  callbacks.push({ c: callback, o: opts });
@@ -886,7 +909,33 @@ const createAnimation = (animationId) => {
886
909
  numAnimationsRunning = childAnimations.length + 1;
887
910
  shouldCalculateNumAnimations = false;
888
911
  }
889
- onFinish(() => resolve(), { oneTimeCallback: true });
912
+ /**
913
+ * When one of these callbacks fires we
914
+ * need to clear the other's callback otherwise
915
+ * you can potentially get these callbacks
916
+ * firing multiple times if the play method
917
+ * is subsequently called.
918
+ * Example:
919
+ * animation.play() (onStop and onFinish callbacks are registered)
920
+ * animation.stop() (onStop callback is fired, onFinish is not)
921
+ * animation.play() (onStop and onFinish callbacks are registered)
922
+ * Total onStop callbacks: 1
923
+ * Total onFinish callbacks: 2
924
+ */
925
+ const onStopCallback = () => {
926
+ clearCallback(onFinishCallback, onFinishOneTimeCallbacks);
927
+ resolve();
928
+ };
929
+ const onFinishCallback = () => {
930
+ clearCallback(onStopCallback, onStopOneTimeCallbacks);
931
+ resolve();
932
+ };
933
+ /**
934
+ * The play method resolves when an animation
935
+ * run either finishes or is cancelled.
936
+ */
937
+ onFinish(onFinishCallback, { oneTimeCallback: true });
938
+ onStop(onStopCallback, { oneTimeCallback: true });
890
939
  childAnimations.forEach((animation) => {
891
940
  animation.play();
892
941
  });
@@ -899,6 +948,14 @@ const createAnimation = (animationId) => {
899
948
  paused = false;
900
949
  });
901
950
  };
951
+ /**
952
+ * Stops an animation and resets it state to the
953
+ * beginning. This does not fire any onFinish
954
+ * callbacks because the animation did not finish.
955
+ * However, since the animation was not destroyed
956
+ * (i.e. the animation could run again) we do not
957
+ * clear the onFinish callbacks.
958
+ */
902
959
  const stop = () => {
903
960
  childAnimations.forEach((animation) => {
904
961
  animation.stop();
@@ -908,6 +965,8 @@ const createAnimation = (animationId) => {
908
965
  initialized = false;
909
966
  }
910
967
  resetFlags();
968
+ onStopOneTimeCallbacks.forEach((onStopCallback) => onStopCallback.c(0, ani));
969
+ onStopOneTimeCallbacks.length = 0;
911
970
  };
912
971
  const from = (property, value) => {
913
972
  const firstFrame = _keyframes[0];
@@ -12,8 +12,8 @@ const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
12
12
  const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
13
13
  const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
14
14
 
15
- const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-4b93903d.js'); });
16
- const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-79f3a215.js'); });
15
+ const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-fd592869.js'); });
16
+ const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-a6040d41.js'); });
17
17
  // TODO(FW-2832): types
18
18
  const transition = (opts) => {
19
19
  return new Promise((resolve, reject) => {
@@ -6,7 +6,7 @@
6
6
  const hardwareBackButton = require('./hardware-back-button-b67c8e75.js');
7
7
  const helpers = require('./helpers-ea4ccbcb.js');
8
8
  const ionicGlobal = require('./ionic-global-14a0604b.js');
9
- const animation = require('./animation-2bb33618.js');
9
+ const animation = require('./animation-c8bdd3c7.js');
10
10
 
11
11
  /**
12
12
  * baseAnimation
@@ -5,16 +5,16 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const animation = require('./animation-2bb33618.js');
9
- const index = require('./index-b183138a.js');
10
- const ios_transition = require('./ios.transition-4b93903d.js');
11
- const md_transition = require('./md.transition-79f3a215.js');
8
+ const animation = require('./animation-c8bdd3c7.js');
9
+ const index = require('./index-c388851f.js');
10
+ const ios_transition = require('./ios.transition-fd592869.js');
11
+ const md_transition = require('./md.transition-a6040d41.js');
12
12
  const cubicBezier = require('./cubic-bezier-6b9222ad.js');
13
13
  const index$1 = require('./index-0ee995e4.js');
14
14
  const ionicGlobal = require('./ionic-global-14a0604b.js');
15
15
  const helpers = require('./helpers-ea4ccbcb.js');
16
16
  const config = require('./config-d5882735.js');
17
- const index$2 = require('./index-5121bb90.js');
17
+ const index$2 = require('./index-e50a18ba.js');
18
18
  const overlays = require('./overlays-d3a13e61.js');
19
19
  require('./index-306a7476.js');
20
20
  require('./index-6f887430.js');
@@ -12,7 +12,7 @@ const lockController = require('./lock-controller-4ae2eb59.js');
12
12
  const overlays = require('./overlays-d3a13e61.js');
13
13
  const theme = require('./theme-fbc56b3b.js');
14
14
  const ionicGlobal = require('./ionic-global-14a0604b.js');
15
- const animation = require('./animation-2bb33618.js');
15
+ const animation = require('./animation-c8bdd3c7.js');
16
16
  require('./haptic-c5f6b4d5.js');
17
17
  require('./capacitor-2ffba62a.js');
18
18
  require('./index-306a7476.js');
@@ -13,7 +13,7 @@ const lockController = require('./lock-controller-4ae2eb59.js');
13
13
  const overlays = require('./overlays-d3a13e61.js');
14
14
  const theme = require('./theme-fbc56b3b.js');
15
15
  const ionicGlobal = require('./ionic-global-14a0604b.js');
16
- const animation = require('./animation-2bb33618.js');
16
+ const animation = require('./animation-c8bdd3c7.js');
17
17
  require('./haptic-c5f6b4d5.js');
18
18
  require('./capacitor-2ffba62a.js');
19
19
  require('./index-306a7476.js');
@@ -14,7 +14,7 @@ const index$1 = require('./index-10873539.js');
14
14
  const keyboardController = require('./keyboard-controller-50beb83a.js');
15
15
  const cubicBezier = require('./cubic-bezier-6b9222ad.js');
16
16
  const frameworkDelegate = require('./framework-delegate-c0873a6f.js');
17
- const index$2 = require('./index-b183138a.js');
17
+ const index$2 = require('./index-c388851f.js');
18
18
  require('./index-cc7dfb7c.js');
19
19
  require('./index-306a7476.js');
20
20
  require('./keyboard-fd7db491.js');
@@ -16,7 +16,7 @@ const ionicGlobal = require('./ionic-global-14a0604b.js');
16
16
  const data = require('./data-db832785.js');
17
17
  const lockController = require('./lock-controller-4ae2eb59.js');
18
18
  const overlays = require('./overlays-d3a13e61.js');
19
- const animation = require('./animation-2bb33618.js');
19
+ const animation = require('./animation-c8bdd3c7.js');
20
20
  const haptic = require('./haptic-c5f6b4d5.js');
21
21
  require('./index-306a7476.js');
22
22
  require('./framework-delegate-c0873a6f.js');
@@ -12,7 +12,7 @@ const lockController = require('./lock-controller-4ae2eb59.js');
12
12
  const overlays = require('./overlays-d3a13e61.js');
13
13
  const theme = require('./theme-fbc56b3b.js');
14
14
  const ionicGlobal = require('./ionic-global-14a0604b.js');
15
- const animation = require('./animation-2bb33618.js');
15
+ const animation = require('./animation-c8bdd3c7.js');
16
16
  require('./index-306a7476.js');
17
17
  require('./framework-delegate-c0873a6f.js');
18
18
  require('./hardware-back-button-b67c8e75.js');
@@ -10,13 +10,13 @@ const cubicBezier = require('./cubic-bezier-6b9222ad.js');
10
10
  const index$2 = require('./index-306a7476.js');
11
11
  const gestureController = require('./gesture-controller-b46721be.js');
12
12
  const helpers = require('./helpers-ea4ccbcb.js');
13
- const index$1 = require('./index-5121bb90.js');
13
+ const index$1 = require('./index-e50a18ba.js');
14
14
  const overlays = require('./overlays-d3a13e61.js');
15
15
  const ionicGlobal = require('./ionic-global-14a0604b.js');
16
16
  const theme = require('./theme-fbc56b3b.js');
17
17
  const index$3 = require('./index-d8d1fc0b.js');
18
18
  require('./hardware-back-button-b67c8e75.js');
19
- require('./animation-2bb33618.js');
19
+ require('./animation-c8bdd3c7.js');
20
20
  require('./framework-delegate-c0873a6f.js');
21
21
  require('./index-cc7dfb7c.js');
22
22
 
@@ -40,6 +40,14 @@ const Menu = class {
40
40
  this.lastOnEnd = 0;
41
41
  this.blocker = gestureController.GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
42
42
  this.didLoad = false;
43
+ /**
44
+ * Flag used to determine if an open/close
45
+ * operation was cancelled. For example, if
46
+ * an app calls "menu.open" then disables the menu
47
+ * part way through the animation, then this would
48
+ * be considered a cancelled operation.
49
+ */
50
+ this.operationCancelled = false;
43
51
  this.isAnimating = false;
44
52
  this._isOpen = false;
45
53
  this.inheritedAttributes = {};
@@ -305,6 +313,15 @@ const Menu = class {
305
313
  this.beforeAnimation(shouldOpen);
306
314
  await this.loadAnimation();
307
315
  await this.startAnimation(shouldOpen, animated);
316
+ /**
317
+ * If the animation was cancelled then
318
+ * return false because the operation
319
+ * did not succeed.
320
+ */
321
+ if (this.operationCancelled) {
322
+ this.operationCancelled = false;
323
+ return false;
324
+ }
308
325
  this.afterAnimation(shouldOpen);
309
326
  return true;
310
327
  }
@@ -341,18 +358,23 @@ const Menu = class {
341
358
  const easingReverse = mode === 'ios' ? iosEasingReverse : mdEasingReverse;
342
359
  const ani = this.animation
343
360
  .direction(isReversed ? 'reverse' : 'normal')
344
- .easing(isReversed ? easingReverse : easing)
345
- .onFinish(() => {
346
- if (ani.getDirection() === 'reverse') {
347
- ani.direction('normal');
348
- }
349
- });
361
+ .easing(isReversed ? easingReverse : easing);
350
362
  if (animated) {
351
363
  await ani.play();
352
364
  }
353
365
  else {
354
366
  ani.play({ sync: true });
355
367
  }
368
+ /**
369
+ * We run this after the play invocation
370
+ * instead of using ani.onFinish so that
371
+ * multiple onFinish callbacks do not get
372
+ * run if an animation is played, stopped,
373
+ * and then played again.
374
+ */
375
+ if (ani.getDirection() === 'reverse') {
376
+ ani.direction('normal');
377
+ }
356
378
  }
357
379
  _isActive() {
358
380
  return !this.disabled && !this.isPaneVisible;
@@ -489,7 +511,6 @@ const Menu = class {
489
511
  }
490
512
  afterAnimation(isOpen) {
491
513
  var _a;
492
- helpers.assert(this.isAnimating, '_before() should be called while animating');
493
514
  // keep opening/closing the menu disabled for a touch more yet
494
515
  // only add listeners/css if it's enabled and isOpen
495
516
  // and only remove listeners/css if it's not open
@@ -548,10 +569,29 @@ const Menu = class {
548
569
  if (this.gesture) {
549
570
  this.gesture.enable(isActive && this.swipeGesture);
550
571
  }
551
- // Close menu immediately
552
- if (!isActive && this._isOpen) {
553
- // close if this menu is open, and should not be enabled
554
- this.forceClosing();
572
+ /**
573
+ * If the menu is disabled but it is still open
574
+ * then we should close the menu immediately.
575
+ * Additionally, if the menu is in the process
576
+ * of animating {open, close} and the menu is disabled
577
+ * then it should still be closed immediately.
578
+ */
579
+ if (!isActive) {
580
+ /**
581
+ * It is possible to disable the menu while
582
+ * it is mid-animation. When this happens, we
583
+ * need to set the operationCancelled flag
584
+ * so that this._setOpen knows to return false
585
+ * and not run the "afterAnimation" callback.
586
+ */
587
+ if (this.isAnimating) {
588
+ this.operationCancelled = true;
589
+ }
590
+ /**
591
+ * If the menu is disabled then we should
592
+ * forcibly close the menu even if it is open.
593
+ */
594
+ this.afterAnimation(false);
555
595
  }
556
596
  if (index$2.doc === null || index$2.doc === void 0 ? void 0 : index$2.doc.contains(this.el)) {
557
597
  /**
@@ -564,14 +604,6 @@ const Menu = class {
564
604
  index$1.menuController._setActiveMenu(this);
565
605
  }
566
606
  }
567
- helpers.assert(!this.isAnimating, 'can not be animating');
568
- }
569
- forceClosing() {
570
- helpers.assert(this._isOpen, 'menu cannot be closed');
571
- this.isAnimating = true;
572
- const ani = this.animation.direction('reverse');
573
- ani.play({ sync: true });
574
- this.afterAnimation(false);
575
607
  }
576
608
  render() {
577
609
  const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
@@ -14,10 +14,10 @@ const index$4 = require('./index-cc7dfb7c.js');
14
14
  const capacitor = require('./capacitor-2ffba62a.js');
15
15
  const overlays = require('./overlays-d3a13e61.js');
16
16
  const theme = require('./theme-fbc56b3b.js');
17
- const index$5 = require('./index-b183138a.js');
17
+ const index$5 = require('./index-c388851f.js');
18
18
  const ionicGlobal = require('./ionic-global-14a0604b.js');
19
19
  const keyboard = require('./keyboard-38f2bb7b.js');
20
- const animation = require('./animation-2bb33618.js');
20
+ const animation = require('./animation-c8bdd3c7.js');
21
21
  const cubicBezier = require('./cubic-bezier-6b9222ad.js');
22
22
  const index$1 = require('./index-0ee995e4.js');
23
23
  const index = require('./index-306a7476.js');
@@ -8,7 +8,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
8
8
  const index = require('./index-6f887430.js');
9
9
  const cubicBezier = require('./cubic-bezier-6b9222ad.js');
10
10
  const helpers = require('./helpers-ea4ccbcb.js');
11
- const index$1 = require('./index-b183138a.js');
11
+ const index$1 = require('./index-c388851f.js');
12
12
  const ionicGlobal = require('./ionic-global-14a0604b.js');
13
13
  const frameworkDelegate = require('./framework-delegate-c0873a6f.js');
14
14
 
@@ -13,8 +13,8 @@ const index$1 = require('./index-cc7dfb7c.js');
13
13
  const overlays = require('./overlays-d3a13e61.js');
14
14
  const ionicGlobal = require('./ionic-global-14a0604b.js');
15
15
  const theme = require('./theme-fbc56b3b.js');
16
- const index$2 = require('./index-b183138a.js');
17
- const animation = require('./animation-2bb33618.js');
16
+ const index$2 = require('./index-c388851f.js');
17
+ const animation = require('./animation-c8bdd3c7.js');
18
18
  require('./index-306a7476.js');
19
19
  require('./hardware-back-button-b67c8e75.js');
20
20
 
@@ -664,7 +664,9 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
664
664
  let originY = contentOriginY;
665
665
  let checkSafeAreaLeft = false;
666
666
  let checkSafeAreaRight = false;
667
- const triggerTop = triggerCoordinates ? triggerCoordinates.top : bodyHeight / 2 - contentHeight / 2;
667
+ const triggerTop = triggerCoordinates
668
+ ? triggerCoordinates.top + triggerCoordinates.height
669
+ : bodyHeight / 2 - contentHeight / 2;
668
670
  const triggerHeight = triggerCoordinates ? triggerCoordinates.height : 0;
669
671
  let addPopoverBottomClass = false;
670
672
  /**
@@ -704,7 +706,7 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
704
706
  * We chose 12 here so that the popover position looks a bit nicer as
705
707
  * it is not right up against the edge of the screen.
706
708
  */
707
- top = Math.max(12, triggerTop - contentHeight - (arrowHeight - 1));
709
+ top = Math.max(12, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
708
710
  arrowTop = top + contentHeight;
709
711
  originY = 'bottom';
710
712
  addPopoverBottomClass = true;
@@ -717,7 +719,6 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
717
719
  bottom = bodyPadding;
718
720
  }
719
721
  }
720
- console.log(top, arrowTop);
721
722
  return {
722
723
  top,
723
724
  left,
@@ -11,7 +11,7 @@ const index$1 = require('./index-10873539.js');
11
11
  const helpers = require('./helpers-ea4ccbcb.js');
12
12
  const haptic = require('./haptic-c5f6b4d5.js');
13
13
  const ionicGlobal = require('./ionic-global-14a0604b.js');
14
- const animation = require('./animation-2bb33618.js');
14
+ const animation = require('./animation-c8bdd3c7.js');
15
15
  const config = require('./config-d5882735.js');
16
16
  const index$2 = require('./index-d8d1fc0b.js');
17
17
  const spinnerConfigs = require('./spinner-configs-f7b5105b.js');
@@ -13,7 +13,7 @@ const index$1 = require('./index-cc7dfb7c.js');
13
13
  const overlays = require('./overlays-d3a13e61.js');
14
14
  const theme = require('./theme-fbc56b3b.js');
15
15
  const ionicGlobal = require('./ionic-global-14a0604b.js');
16
- const animation = require('./animation-2bb33618.js');
16
+ const animation = require('./animation-c8bdd3c7.js');
17
17
  require('./index-306a7476.js');
18
18
  require('./framework-delegate-c0873a6f.js');
19
19
  require('./hardware-back-button-b67c8e75.js');
@@ -3,8 +3,8 @@
3
3
  */
4
4
  'use strict';
5
5
 
6
- const animation = require('./animation-2bb33618.js');
7
- const index = require('./index-b183138a.js');
6
+ const animation = require('./animation-c8bdd3c7.js');
7
+ const index = require('./index-c388851f.js');
8
8
  require('./index-306a7476.js');
9
9
  require('./helpers-ea4ccbcb.js');
10
10
  require('./index-6f887430.js');