@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.
- package/components/animation.js +60 -1
- package/components/ion-menu.js +51 -19
- package/components/popover.js +4 -3
- package/dist/cjs/{animation-2bb33618.js → animation-c8bdd3c7.js} +60 -1
- package/dist/cjs/{index-b183138a.js → index-c388851f.js} +2 -2
- package/dist/cjs/{index-5121bb90.js → index-e50a18ba.js} +1 -1
- package/dist/cjs/index.cjs.js +5 -5
- package/dist/cjs/ion-action-sheet.cjs.entry.js +1 -1
- package/dist/cjs/ion-alert.cjs.entry.js +1 -1
- package/dist/cjs/ion-app_8.cjs.entry.js +1 -1
- package/dist/cjs/ion-datetime_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-loading.cjs.entry.js +1 -1
- package/dist/cjs/ion-menu_3.cjs.entry.js +53 -21
- package/dist/cjs/ion-modal.cjs.entry.js +2 -2
- package/dist/cjs/ion-nav_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-popover.cjs.entry.js +6 -5
- package/dist/cjs/ion-refresher_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-toast.cjs.entry.js +1 -1
- package/dist/cjs/{ios.transition-4b93903d.js → ios.transition-fd592869.js} +2 -2
- package/dist/cjs/{md.transition-79f3a215.js → md.transition-a6040d41.js} +2 -2
- package/dist/collection/components/menu/menu.js +51 -19
- package/dist/collection/components/popover/utils.js +4 -3
- package/dist/collection/utils/animation/animation.js +60 -1
- package/dist/docs.json +1 -1
- package/dist/esm/{animation-a1d9e088.js → animation-92066c62.js} +60 -1
- package/dist/esm/{index-61bddc90.js → index-9b1940b1.js} +1 -1
- package/dist/esm/{index-87684bba.js → index-ca26aea8.js} +2 -2
- package/dist/esm/index.js +5 -5
- package/dist/esm/ion-action-sheet.entry.js +1 -1
- package/dist/esm/ion-alert.entry.js +1 -1
- package/dist/esm/ion-app_8.entry.js +1 -1
- package/dist/esm/ion-datetime_3.entry.js +1 -1
- package/dist/esm/ion-loading.entry.js +1 -1
- package/dist/esm/ion-menu_3.entry.js +53 -21
- package/dist/esm/ion-modal.entry.js +2 -2
- package/dist/esm/ion-nav_2.entry.js +1 -1
- package/dist/esm/ion-popover.entry.js +6 -5
- package/dist/esm/ion-refresher_2.entry.js +1 -1
- package/dist/esm/ion-toast.entry.js +1 -1
- package/dist/esm/{ios.transition-81e1aed6.js → ios.transition-d4be3bd5.js} +2 -2
- package/dist/esm/{md.transition-5becd8b5.js → md.transition-ae47f354.js} +2 -2
- package/dist/esm-es5/animation-92066c62.js +4 -0
- package/dist/esm-es5/{index-61bddc90.js → index-9b1940b1.js} +1 -1
- package/dist/esm-es5/{index-87684bba.js → index-ca26aea8.js} +1 -1
- package/dist/esm-es5/index.js +1 -1
- package/dist/esm-es5/ion-action-sheet.entry.js +1 -1
- package/dist/esm-es5/ion-alert.entry.js +1 -1
- package/dist/esm-es5/ion-app_8.entry.js +1 -1
- package/dist/esm-es5/ion-datetime_3.entry.js +1 -1
- package/dist/esm-es5/ion-loading.entry.js +1 -1
- package/dist/esm-es5/ion-menu_3.entry.js +1 -1
- package/dist/esm-es5/ion-modal.entry.js +1 -1
- package/dist/esm-es5/ion-nav_2.entry.js +1 -1
- package/dist/esm-es5/ion-popover.entry.js +1 -1
- package/dist/esm-es5/ion-refresher_2.entry.js +1 -1
- package/dist/esm-es5/ion-toast.entry.js +1 -1
- package/dist/esm-es5/{ios.transition-81e1aed6.js → ios.transition-d4be3bd5.js} +1 -1
- package/dist/esm-es5/{md.transition-5becd8b5.js → md.transition-ae47f354.js} +1 -1
- package/dist/ionic/index.esm.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-003dbb0e.entry.js +4 -0
- package/dist/ionic/p-015187e5.system.js +4 -0
- package/dist/ionic/{p-4616f20a.system.entry.js → p-0505bc05.system.entry.js} +1 -1
- package/dist/ionic/{p-a6d8476b.system.entry.js → p-06a68207.system.entry.js} +1 -1
- package/dist/ionic/p-0a39673e.js +4 -0
- package/dist/ionic/{p-8fdd4a2f.system.js → p-0fb0904b.system.js} +1 -1
- package/dist/ionic/p-12b13ed4.entry.js +4 -0
- package/dist/ionic/{p-048d7153.system.entry.js → p-17f69cbc.system.entry.js} +1 -1
- package/dist/ionic/p-1a6c0442.js +4 -0
- package/dist/ionic/{p-90d892fd.entry.js → p-24ebc805.entry.js} +1 -1
- package/dist/ionic/p-2624b777.system.entry.js +4 -0
- package/dist/ionic/{p-c5729044.system.entry.js → p-26a785e9.system.entry.js} +1 -1
- package/dist/ionic/{p-b098f738.system.js → p-2a13187a.system.js} +1 -1
- package/dist/ionic/p-37a0b769.js +4 -0
- package/dist/ionic/{p-de676d36.system.entry.js → p-40ffdeb5.system.entry.js} +1 -1
- package/dist/ionic/p-446230d7.js +4 -0
- package/dist/ionic/{p-1a36bf45.system.entry.js → p-4d2c9270.system.entry.js} +1 -1
- package/dist/ionic/{p-f920f5ca.entry.js → p-4df178d7.entry.js} +1 -1
- package/dist/ionic/{p-918d5f19.system.js → p-51163f34.system.js} +1 -1
- package/dist/ionic/{p-7e46b6ab.entry.js → p-5c9f38bf.entry.js} +1 -1
- package/dist/ionic/p-6edbc09b.system.js +1 -1
- package/dist/ionic/{p-65a4c12f.system.entry.js → p-9eea70fb.system.entry.js} +1 -1
- package/dist/ionic/{p-13a91505.entry.js → p-9f758520.entry.js} +1 -1
- package/dist/ionic/{p-ee6d9730.entry.js → p-a42bbc51.entry.js} +1 -1
- package/dist/ionic/{p-27614d55.entry.js → p-b0c3f506.entry.js} +1 -1
- package/dist/ionic/{p-f547e62f.entry.js → p-b1a04d35.entry.js} +1 -1
- package/dist/ionic/p-bff7659e.system.entry.js +4 -0
- package/dist/ionic/{p-d4cea1ba.system.js → p-c6221536.system.js} +1 -1
- package/dist/ionic/{p-bf9b1560.entry.js → p-d4f02009.entry.js} +1 -1
- package/dist/ionic/{p-c7fca267.entry.js → p-d6e93d49.entry.js} +1 -1
- package/dist/ionic/{p-6bc9c436.system.entry.js → p-dcdc16e8.system.entry.js} +1 -1
- package/dist/ionic/{p-08c5b9f4.system.entry.js → p-eac9308b.system.entry.js} +1 -1
- package/dist/ionic/{p-73f50e29.system.js → p-f2bc4fc0.system.js} +1 -1
- package/dist/ionic/{p-5e2dc8e0.js → p-f70372cf.js} +1 -1
- package/dist/types/components/menu/menu.d.ts +8 -1
- package/hydrate/index.js +115 -23
- package/package.json +1 -1
- package/dist/esm-es5/animation-a1d9e088.js +0 -4
- package/dist/ionic/p-40e16caa.system.entry.js +0 -4
- package/dist/ionic/p-6b2641f6.system.js +0 -4
- package/dist/ionic/p-72a1cbc7.js +0 -4
- package/dist/ionic/p-78a293a5.js +0 -4
- package/dist/ionic/p-94a4ce40.js +0 -4
- package/dist/ionic/p-a76e80db.entry.js +0 -4
- package/dist/ionic/p-af624417.system.entry.js +0 -4
- package/dist/ionic/p-b95fd3c6.entry.js +0 -4
- package/dist/ionic/p-f978ccd1.js +0 -4
package/components/animation.js
CHANGED
|
@@ -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
|
-
|
|
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];
|
package/components/ion-menu.js
CHANGED
|
@@ -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
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
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;
|
package/components/popover.js
CHANGED
|
@@ -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
|
|
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
|
-
|
|
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-
|
|
16
|
-
const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-
|
|
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-
|
|
9
|
+
const animation = require('./animation-c8bdd3c7.js');
|
|
10
10
|
|
|
11
11
|
/**
|
|
12
12
|
* baseAnimation
|
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -5,16 +5,16 @@
|
|
|
5
5
|
|
|
6
6
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
7
7
|
|
|
8
|
-
const animation = require('./animation-
|
|
9
|
-
const index = require('./index-
|
|
10
|
-
const ios_transition = require('./ios.transition-
|
|
11
|
-
const md_transition = require('./md.transition-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
17
|
-
const animation = require('./animation-
|
|
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
|
|
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-
|
|
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-
|
|
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-
|
|
7
|
-
const index = require('./index-
|
|
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');
|