@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
@@ -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');
@@ -24,6 +24,14 @@ export class Menu {
24
24
  this.lastOnEnd = 0;
25
25
  this.blocker = GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
26
26
  this.didLoad = false;
27
+ /**
28
+ * Flag used to determine if an open/close
29
+ * operation was cancelled. For example, if
30
+ * an app calls "menu.open" then disables the menu
31
+ * part way through the animation, then this would
32
+ * be considered a cancelled operation.
33
+ */
34
+ this.operationCancelled = false;
27
35
  this.isAnimating = false;
28
36
  this._isOpen = false;
29
37
  this.inheritedAttributes = {};
@@ -292,6 +300,15 @@ export class Menu {
292
300
  this.beforeAnimation(shouldOpen);
293
301
  await this.loadAnimation();
294
302
  await this.startAnimation(shouldOpen, animated);
303
+ /**
304
+ * If the animation was cancelled then
305
+ * return false because the operation
306
+ * did not succeed.
307
+ */
308
+ if (this.operationCancelled) {
309
+ this.operationCancelled = false;
310
+ return false;
311
+ }
295
312
  this.afterAnimation(shouldOpen);
296
313
  return true;
297
314
  }
@@ -328,18 +345,23 @@ export class Menu {
328
345
  const easingReverse = mode === 'ios' ? iosEasingReverse : mdEasingReverse;
329
346
  const ani = this.animation
330
347
  .direction(isReversed ? 'reverse' : 'normal')
331
- .easing(isReversed ? easingReverse : easing)
332
- .onFinish(() => {
333
- if (ani.getDirection() === 'reverse') {
334
- ani.direction('normal');
335
- }
336
- });
348
+ .easing(isReversed ? easingReverse : easing);
337
349
  if (animated) {
338
350
  await ani.play();
339
351
  }
340
352
  else {
341
353
  ani.play({ sync: true });
342
354
  }
355
+ /**
356
+ * We run this after the play invocation
357
+ * instead of using ani.onFinish so that
358
+ * multiple onFinish callbacks do not get
359
+ * run if an animation is played, stopped,
360
+ * and then played again.
361
+ */
362
+ if (ani.getDirection() === 'reverse') {
363
+ ani.direction('normal');
364
+ }
343
365
  }
344
366
  _isActive() {
345
367
  return !this.disabled && !this.isPaneVisible;
@@ -476,7 +498,6 @@ export class Menu {
476
498
  }
477
499
  afterAnimation(isOpen) {
478
500
  var _a;
479
- assert(this.isAnimating, '_before() should be called while animating');
480
501
  // keep opening/closing the menu disabled for a touch more yet
481
502
  // only add listeners/css if it's enabled and isOpen
482
503
  // and only remove listeners/css if it's not open
@@ -535,10 +556,29 @@ export class Menu {
535
556
  if (this.gesture) {
536
557
  this.gesture.enable(isActive && this.swipeGesture);
537
558
  }
538
- // Close menu immediately
539
- if (!isActive && this._isOpen) {
540
- // close if this menu is open, and should not be enabled
541
- this.forceClosing();
559
+ /**
560
+ * If the menu is disabled but it is still open
561
+ * then we should close the menu immediately.
562
+ * Additionally, if the menu is in the process
563
+ * of animating {open, close} and the menu is disabled
564
+ * then it should still be closed immediately.
565
+ */
566
+ if (!isActive) {
567
+ /**
568
+ * It is possible to disable the menu while
569
+ * it is mid-animation. When this happens, we
570
+ * need to set the operationCancelled flag
571
+ * so that this._setOpen knows to return false
572
+ * and not run the "afterAnimation" callback.
573
+ */
574
+ if (this.isAnimating) {
575
+ this.operationCancelled = true;
576
+ }
577
+ /**
578
+ * If the menu is disabled then we should
579
+ * forcibly close the menu even if it is open.
580
+ */
581
+ this.afterAnimation(false);
542
582
  }
543
583
  if (doc === null || doc === void 0 ? void 0 : doc.contains(this.el)) {
544
584
  /**
@@ -551,14 +591,6 @@ export class Menu {
551
591
  menuController._setActiveMenu(this);
552
592
  }
553
593
  }
554
- assert(!this.isAnimating, 'can not be animating');
555
- }
556
- forceClosing() {
557
- assert(this._isOpen, 'menu cannot be closed');
558
- this.isAnimating = true;
559
- const ani = this.animation.direction('reverse');
560
- ani.play({ sync: true });
561
- this.afterAnimation(false);
562
594
  }
563
595
  render() {
564
596
  const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
@@ -650,7 +650,9 @@ export const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding
650
650
  let originY = contentOriginY;
651
651
  let checkSafeAreaLeft = false;
652
652
  let checkSafeAreaRight = false;
653
- const triggerTop = triggerCoordinates ? triggerCoordinates.top : bodyHeight / 2 - contentHeight / 2;
653
+ const triggerTop = triggerCoordinates
654
+ ? triggerCoordinates.top + triggerCoordinates.height
655
+ : bodyHeight / 2 - contentHeight / 2;
654
656
  const triggerHeight = triggerCoordinates ? triggerCoordinates.height : 0;
655
657
  let addPopoverBottomClass = false;
656
658
  /**
@@ -690,7 +692,7 @@ export const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding
690
692
  * We chose 12 here so that the popover position looks a bit nicer as
691
693
  * it is not right up against the edge of the screen.
692
694
  */
693
- top = Math.max(12, triggerTop - contentHeight - (arrowHeight - 1));
695
+ top = Math.max(12, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
694
696
  arrowTop = top + contentHeight;
695
697
  originY = 'bottom';
696
698
  addPopoverBottomClass = true;
@@ -703,7 +705,6 @@ export const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding
703
705
  bottom = bodyPadding;
704
706
  }
705
707
  }
706
- console.log(top, arrowTop);
707
708
  return {
708
709
  top,
709
710
  left,
@@ -36,6 +36,7 @@ export const createAnimation = (animationId) => {
36
36
  const id = animationId;
37
37
  const onFinishCallbacks = [];
38
38
  const onFinishOneTimeCallbacks = [];
39
+ const onStopOneTimeCallbacks = [];
39
40
  const elements = [];
40
41
  const childAnimations = [];
41
42
  const stylesheets = [];
@@ -93,6 +94,28 @@ export const createAnimation = (animationId) => {
93
94
  const isRunning = () => {
94
95
  return numAnimationsRunning !== 0 && !paused;
95
96
  };
97
+ /**
98
+ * @internal
99
+ * Remove a callback from a chosen callback array
100
+ * @param callbackToRemove: A reference to the callback that should be removed
101
+ * @param callbackObjects: An array of callbacks that callbackToRemove should be removed from.
102
+ */
103
+ const clearCallback = (callbackToRemove, callbackObjects) => {
104
+ const index = callbackObjects.findIndex((callbackObject) => callbackObject.c === callbackToRemove);
105
+ if (index > -1) {
106
+ callbackObjects.splice(index, 1);
107
+ }
108
+ };
109
+ /**
110
+ * @internal
111
+ * Add a callback to be fired when an animation is stopped/cancelled.
112
+ * @param callback: A reference to the callback that should be fired
113
+ * @param opts: Any options associated with this particular callback
114
+ */
115
+ const onStop = (callback, opts) => {
116
+ onStopOneTimeCallbacks.push({ c: callback, o: opts });
117
+ return ani;
118
+ };
96
119
  const onFinish = (callback, opts) => {
97
120
  const callbacks = (opts === null || opts === void 0 ? void 0 : opts.oneTimeCallback) ? onFinishOneTimeCallbacks : onFinishCallbacks;
98
121
  callbacks.push({ c: callback, o: opts });
@@ -761,7 +784,33 @@ export const createAnimation = (animationId) => {
761
784
  numAnimationsRunning = childAnimations.length + 1;
762
785
  shouldCalculateNumAnimations = false;
763
786
  }
764
- onFinish(() => resolve(), { oneTimeCallback: true });
787
+ /**
788
+ * When one of these callbacks fires we
789
+ * need to clear the other's callback otherwise
790
+ * you can potentially get these callbacks
791
+ * firing multiple times if the play method
792
+ * is subsequently called.
793
+ * Example:
794
+ * animation.play() (onStop and onFinish callbacks are registered)
795
+ * animation.stop() (onStop callback is fired, onFinish is not)
796
+ * animation.play() (onStop and onFinish callbacks are registered)
797
+ * Total onStop callbacks: 1
798
+ * Total onFinish callbacks: 2
799
+ */
800
+ const onStopCallback = () => {
801
+ clearCallback(onFinishCallback, onFinishOneTimeCallbacks);
802
+ resolve();
803
+ };
804
+ const onFinishCallback = () => {
805
+ clearCallback(onStopCallback, onStopOneTimeCallbacks);
806
+ resolve();
807
+ };
808
+ /**
809
+ * The play method resolves when an animation
810
+ * run either finishes or is cancelled.
811
+ */
812
+ onFinish(onFinishCallback, { oneTimeCallback: true });
813
+ onStop(onStopCallback, { oneTimeCallback: true });
765
814
  childAnimations.forEach((animation) => {
766
815
  animation.play();
767
816
  });
@@ -774,6 +823,14 @@ export const createAnimation = (animationId) => {
774
823
  paused = false;
775
824
  });
776
825
  };
826
+ /**
827
+ * Stops an animation and resets it state to the
828
+ * beginning. This does not fire any onFinish
829
+ * callbacks because the animation did not finish.
830
+ * However, since the animation was not destroyed
831
+ * (i.e. the animation could run again) we do not
832
+ * clear the onFinish callbacks.
833
+ */
777
834
  const stop = () => {
778
835
  childAnimations.forEach((animation) => {
779
836
  animation.stop();
@@ -783,6 +840,8 @@ export const createAnimation = (animationId) => {
783
840
  initialized = false;
784
841
  }
785
842
  resetFlags();
843
+ onStopOneTimeCallbacks.forEach((onStopCallback) => onStopCallback.c(0, ani));
844
+ onStopOneTimeCallbacks.length = 0;
786
845
  };
787
846
  const from = (property, value) => {
788
847
  const firstFrame = _keyframes[0];
package/dist/docs.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2023-09-29T13:44:07",
2
+ "timestamp": "2023-10-02T15:25:58",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.3.0",
@@ -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];
@@ -4,7 +4,7 @@
4
4
  import { MENU_BACK_BUTTON_PRIORITY } from './hardware-back-button-39299f84.js';
5
5
  import { c as componentOnReady } from './helpers-3379ba19.js';
6
6
  import { b as getIonMode } from './ionic-global-b3fc28dd.js';
7
- import { c as createAnimation } from './animation-a1d9e088.js';
7
+ import { c as createAnimation } from './animation-92066c62.js';
8
8
 
9
9
  /**
10
10
  * baseAnimation
@@ -10,8 +10,8 @@ const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
10
10
  const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
11
11
  const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
12
12
 
13
- const iosTransitionAnimation = () => import('./ios.transition-81e1aed6.js');
14
- const mdTransitionAnimation = () => import('./md.transition-5becd8b5.js');
13
+ const iosTransitionAnimation = () => import('./ios.transition-d4be3bd5.js');
14
+ const mdTransitionAnimation = () => import('./md.transition-ae47f354.js');
15
15
  // TODO(FW-2832): types
16
16
  const transition = (opts) => {
17
17
  return new Promise((resolve, reject) => {
package/dist/esm/index.js CHANGED
@@ -1,16 +1,16 @@
1
1
  /*!
2
2
  * (C) Ionic http://ionicframework.com - MIT License
3
3
  */
4
- export { c as createAnimation } from './animation-a1d9e088.js';
5
- export { a as LIFECYCLE_DID_ENTER, c as LIFECYCLE_DID_LEAVE, L as LIFECYCLE_WILL_ENTER, b as LIFECYCLE_WILL_LEAVE, d as LIFECYCLE_WILL_UNLOAD, g as getIonPageElement } from './index-87684bba.js';
6
- export { iosTransitionAnimation } from './ios.transition-81e1aed6.js';
7
- export { mdTransitionAnimation } from './md.transition-5becd8b5.js';
4
+ export { c as createAnimation } from './animation-92066c62.js';
5
+ export { a as LIFECYCLE_DID_ENTER, c as LIFECYCLE_DID_LEAVE, L as LIFECYCLE_WILL_ENTER, b as LIFECYCLE_WILL_LEAVE, d as LIFECYCLE_WILL_UNLOAD, g as getIonPageElement } from './index-ca26aea8.js';
6
+ export { iosTransitionAnimation } from './ios.transition-d4be3bd5.js';
7
+ export { mdTransitionAnimation } from './md.transition-ae47f354.js';
8
8
  export { g as getTimeGivenProgression } from './cubic-bezier-66542bc5.js';
9
9
  export { createGesture } from './index-ff313b19.js';
10
10
  export { g as getPlatforms, i as initialize, a as isPlatform } from './ionic-global-b3fc28dd.js';
11
11
  export { c as componentOnReady } from './helpers-3379ba19.js';
12
12
  export { I as IonicSafeString, g as getMode, s as setupConfig } from './config-96c9ace3.js';
13
- export { m as menuController } from './index-61bddc90.js';
13
+ export { m as menuController } from './index-9b1940b1.js';
14
14
  export { b as actionSheetController, a as alertController, l as loadingController, m as modalController, p as pickerController, c as popoverController, t as toastController } from './overlays-8fc6656c.js';
15
15
  import './index-7a14ecec.js';
16
16
  import './index-2d388930.js';
@@ -8,7 +8,7 @@ import { c as createLockController } from './lock-controller-e8c6c051.js';
8
8
  import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, f as present, g as dismiss, h as eventMethod, s as safeCall, j as prepareOverlay, k as setOverlayId } from './overlays-8fc6656c.js';
9
9
  import { g as getClassMap } from './theme-17531cdf.js';
10
10
  import { b as getIonMode } from './ionic-global-b3fc28dd.js';
11
- import { c as createAnimation } from './animation-a1d9e088.js';
11
+ import { c as createAnimation } from './animation-92066c62.js';
12
12
  import './haptic-6447af60.js';
13
13
  import './capacitor-b4979570.js';
14
14
  import './index-7a14ecec.js';
@@ -9,7 +9,7 @@ import { c as createLockController } from './lock-controller-e8c6c051.js';
9
9
  import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod, s as safeCall } from './overlays-8fc6656c.js';
10
10
  import { g as getClassMap } from './theme-17531cdf.js';
11
11
  import { c as config, b as getIonMode } from './ionic-global-b3fc28dd.js';
12
- import { c as createAnimation } from './animation-a1d9e088.js';
12
+ import { c as createAnimation } from './animation-92066c62.js';
13
13
  import './haptic-6447af60.js';
14
14
  import './capacitor-b4979570.js';
15
15
  import './index-7a14ecec.js';
@@ -10,7 +10,7 @@ import { a as findIonContent, p as printIonContentErrorMsg, g as getScrollElemen
10
10
  import { c as createKeyboardController } from './keyboard-controller-0c2dce71.js';
11
11
  import { g as getTimeGivenProgression } from './cubic-bezier-66542bc5.js';
12
12
  import { a as attachComponent, d as detachComponent } from './framework-delegate-aa433dea.js';
13
- import { t as transition } from './index-87684bba.js';
13
+ import { t as transition } from './index-ca26aea8.js';
14
14
  import './index-595d62c9.js';
15
15
  import './index-7a14ecec.js';
16
16
  import './keyboard-b063f012.js';
@@ -12,7 +12,7 @@ import { b as getIonMode } from './ionic-global-b3fc28dd.js';
12
12
  import { g as generateDayAriaLabel, a as getDay, i as isBefore, b as isAfter, c as isSameDay, d as getPreviousMonth, e as getNextMonth, v as validateParts, f as getPartsFromCalendarDay, h as getEndOfWeek, j as getStartOfWeek, k as getPreviousDay, l as getNextDay, m as getPreviousWeek, n as getNextWeek, p as parseMinParts, o as parseMaxParts, q as parseDate, w as warnIfValueOutOfBounds, r as convertToArrayOfNumbers, s as convertDataToISO, t as getToday, u as getClosestValidDate, x as getNumDaysInMonth, y as getCombinedDateColumnData, z as getMonthColumnData, A as getDayColumnData, B as getYearColumnData, C as isMonthFirstLocale, D as getTimeColumnsData, E as isLocaleDayPeriodRTL, F as getDaysOfWeek, G as getMonthAndYear, H as getDaysOfMonth, I as generateMonths, J as is24Hour, K as getLocalizedTime, L as getMonthAndDay, M as formatValue, N as getNextYear, O as getPreviousYear, P as clampDate, Q as parseAmPm, R as calculateHourFromAMPM } from './data-009dbf15.js';
13
13
  import { c as createLockController } from './lock-controller-e8c6c051.js';
14
14
  import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod, s as safeCall } from './overlays-8fc6656c.js';
15
- import { c as createAnimation } from './animation-a1d9e088.js';
15
+ import { c as createAnimation } from './animation-92066c62.js';
16
16
  import { b as hapticSelectionChanged, h as hapticSelectionEnd, a as hapticSelectionStart } from './haptic-6447af60.js';
17
17
  import './index-7a14ecec.js';
18
18
  import './framework-delegate-aa433dea.js';
@@ -8,7 +8,7 @@ import { c as createLockController } from './lock-controller-e8c6c051.js';
8
8
  import { d as createDelegateController, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-8fc6656c.js';
9
9
  import { g as getClassMap } from './theme-17531cdf.js';
10
10
  import { c as config, b as getIonMode } from './ionic-global-b3fc28dd.js';
11
- import { c as createAnimation } from './animation-a1d9e088.js';
11
+ import { c as createAnimation } from './animation-92066c62.js';
12
12
  import './index-7a14ecec.js';
13
13
  import './framework-delegate-aa433dea.js';
14
14
  import './hardware-back-button-39299f84.js';
@@ -6,13 +6,13 @@ import { g as getTimeGivenProgression } from './cubic-bezier-66542bc5.js';
6
6
  import { d as doc } from './index-7a14ecec.js';
7
7
  import { G as GESTURE_CONTROLLER } from './gesture-controller-0fa396c4.js';
8
8
  import { p as isEndSide, i as inheritAriaAttributes, o as assert, l as clamp } from './helpers-3379ba19.js';
9
- import { m as menuController } from './index-61bddc90.js';
9
+ import { m as menuController } from './index-9b1940b1.js';
10
10
  import { q as getPresentedOverlay } from './overlays-8fc6656c.js';
11
11
  import { c as config, b as getIonMode } from './ionic-global-b3fc28dd.js';
12
12
  import { c as createColorClasses, h as hostContext } from './theme-17531cdf.js';
13
13
  import { u as menuOutline, v as menuSharp } from './index-ecfc2c9f.js';
14
14
  import './hardware-back-button-39299f84.js';
15
- import './animation-a1d9e088.js';
15
+ import './animation-92066c62.js';
16
16
  import './framework-delegate-aa433dea.js';
17
17
  import './index-595d62c9.js';
18
18
 
@@ -36,6 +36,14 @@ const Menu = class {
36
36
  this.lastOnEnd = 0;
37
37
  this.blocker = GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
38
38
  this.didLoad = false;
39
+ /**
40
+ * Flag used to determine if an open/close
41
+ * operation was cancelled. For example, if
42
+ * an app calls "menu.open" then disables the menu
43
+ * part way through the animation, then this would
44
+ * be considered a cancelled operation.
45
+ */
46
+ this.operationCancelled = false;
39
47
  this.isAnimating = false;
40
48
  this._isOpen = false;
41
49
  this.inheritedAttributes = {};
@@ -301,6 +309,15 @@ const Menu = class {
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 = class {
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 = class {
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 = class {
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 = class {
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;
@@ -10,10 +10,10 @@ import { p as printIonWarning } from './index-595d62c9.js';
10
10
  import { g as getCapacitor } from './capacitor-b4979570.js';
11
11
  import { G as GESTURE, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, n as activeAnimations, g as dismiss, h as eventMethod } from './overlays-8fc6656c.js';
12
12
  import { g as getClassMap } from './theme-17531cdf.js';
13
- import { e as deepReady, w as waitForMount } from './index-87684bba.js';
13
+ import { e as deepReady, w as waitForMount } from './index-ca26aea8.js';
14
14
  import { b as getIonMode, c as config } from './ionic-global-b3fc28dd.js';
15
15
  import { KEYBOARD_DID_OPEN } from './keyboard-b551279d.js';
16
- import { c as createAnimation } from './animation-a1d9e088.js';
16
+ import { c as createAnimation } from './animation-92066c62.js';
17
17
  import { g as getTimeGivenProgression } from './cubic-bezier-66542bc5.js';
18
18
  import { createGesture } from './index-ff313b19.js';
19
19
  import { w as win } from './index-7a14ecec.js';
@@ -4,7 +4,7 @@
4
4
  import { r as registerInstance, d as createEvent, h, f as getElement, H as Host } from './index-2d388930.js';
5
5
  import { g as getTimeGivenProgression } from './cubic-bezier-66542bc5.js';
6
6
  import { o as assert, s as shallowEqualStringMap } from './helpers-3379ba19.js';
7
- import { l as lifecycle, t as transition, s as setPageHidden, d as LIFECYCLE_WILL_UNLOAD, b as LIFECYCLE_WILL_LEAVE, c as LIFECYCLE_DID_LEAVE } from './index-87684bba.js';
7
+ import { l as lifecycle, t as transition, s as setPageHidden, d as LIFECYCLE_WILL_UNLOAD, b as LIFECYCLE_WILL_LEAVE, c as LIFECYCLE_DID_LEAVE } from './index-ca26aea8.js';
8
8
  import { b as getIonMode, c as config } from './ionic-global-b3fc28dd.js';
9
9
  import { a as attachComponent } from './framework-delegate-aa433dea.js';
10
10
 
@@ -9,8 +9,8 @@ import { p as printIonWarning } from './index-595d62c9.js';
9
9
  import { B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, o as focusFirstDescendant, g as dismiss, h as eventMethod } from './overlays-8fc6656c.js';
10
10
  import { b as getIonMode, a as isPlatform } from './ionic-global-b3fc28dd.js';
11
11
  import { g as getClassMap } from './theme-17531cdf.js';
12
- import { e as deepReady, w as waitForMount } from './index-87684bba.js';
13
- import { c as createAnimation } from './animation-a1d9e088.js';
12
+ import { e as deepReady, w as waitForMount } from './index-ca26aea8.js';
13
+ import { c as createAnimation } from './animation-92066c62.js';
14
14
  import './index-7a14ecec.js';
15
15
  import './hardware-back-button-39299f84.js';
16
16
 
@@ -660,7 +660,9 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
660
660
  let originY = contentOriginY;
661
661
  let checkSafeAreaLeft = false;
662
662
  let checkSafeAreaRight = false;
663
- const triggerTop = triggerCoordinates ? triggerCoordinates.top : bodyHeight / 2 - contentHeight / 2;
663
+ const triggerTop = triggerCoordinates
664
+ ? triggerCoordinates.top + triggerCoordinates.height
665
+ : bodyHeight / 2 - contentHeight / 2;
664
666
  const triggerHeight = triggerCoordinates ? triggerCoordinates.height : 0;
665
667
  let addPopoverBottomClass = false;
666
668
  /**
@@ -700,7 +702,7 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
700
702
  * We chose 12 here so that the popover position looks a bit nicer as
701
703
  * it is not right up against the edge of the screen.
702
704
  */
703
- top = Math.max(12, triggerTop - contentHeight - (arrowHeight - 1));
705
+ top = Math.max(12, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
704
706
  arrowTop = top + contentHeight;
705
707
  originY = 'bottom';
706
708
  addPopoverBottomClass = true;
@@ -713,7 +715,6 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
713
715
  bottom = bodyPadding;
714
716
  }
715
717
  }
716
- console.log(top, arrowTop);
717
718
  return {
718
719
  top,
719
720
  left,
@@ -7,7 +7,7 @@ import { I as ION_CONTENT_CLASS_SELECTOR, b as ION_CONTENT_ELEMENT_SELECTOR, p a
7
7
  import { t as transitionEndAsync, c as componentOnReady, l as clamp, g as getElementRoot, r as raf } from './helpers-3379ba19.js';
8
8
  import { d as hapticImpact, I as ImpactStyle } from './haptic-6447af60.js';
9
9
  import { a as isPlatform, b as getIonMode, c as config } from './ionic-global-b3fc28dd.js';
10
- import { c as createAnimation } from './animation-a1d9e088.js';
10
+ import { c as createAnimation } from './animation-92066c62.js';
11
11
  import { E as ENABLE_HTML_CONTENT_DEFAULT, a as sanitizeDOMString } from './config-96c9ace3.js';
12
12
  import { h as caretBackSharp, i as arrowDown } from './index-ecfc2c9f.js';
13
13
  import { S as SPINNERS } from './spinner-configs-d09fbbbb.js';