@ionic/core 7.4.3-dev.11696256088.1a73a68b → 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/ion-menu.js +34 -28
- package/dist/cjs/ion-menu_3.cjs.entry.js +34 -28
- package/dist/collection/components/menu/menu.js +34 -28
- package/dist/docs.json +1 -1
- package/dist/esm/ion-menu_3.entry.js +34 -28
- package/dist/esm-es5/ion-menu_3.entry.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-12b13ed4.entry.js +4 -0
- package/dist/ionic/p-6edbc09b.system.js +1 -1
- package/dist/ionic/p-bff7659e.system.entry.js +4 -0
- package/dist/types/components/menu/menu.d.ts +8 -2
- package/hydrate/index.js +34 -28
- package/package.json +1 -1
- package/dist/ionic/p-77aa204e.entry.js +0 -4
- package/dist/ionic/p-967f4fc2.system.entry.js +0 -4
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 = {};
|
|
@@ -50,7 +58,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
|
|
|
50
58
|
}
|
|
51
59
|
this.trapKeyboardFocus(ev, document);
|
|
52
60
|
};
|
|
53
|
-
this.operationCancelled = false;
|
|
54
61
|
this.isPaneVisible = false;
|
|
55
62
|
this.isEndSide = false;
|
|
56
63
|
this.contentId = undefined;
|
|
@@ -302,6 +309,15 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
|
|
|
302
309
|
this.beforeAnimation(shouldOpen);
|
|
303
310
|
await this.loadAnimation();
|
|
304
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
|
+
}
|
|
305
321
|
this.afterAnimation(shouldOpen);
|
|
306
322
|
return true;
|
|
307
323
|
}
|
|
@@ -444,9 +460,7 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
|
|
|
444
460
|
const playTo = this._isOpen ? !shouldComplete : shouldComplete;
|
|
445
461
|
this.animation
|
|
446
462
|
.easing('cubic-bezier(0.4, 0.0, 0.6, 1)')
|
|
447
|
-
.onFinish(() => {
|
|
448
|
-
return this.afterAnimation(shouldOpen);
|
|
449
|
-
}, { oneTimeCallback: true })
|
|
463
|
+
.onFinish(() => this.afterAnimation(shouldOpen), { oneTimeCallback: true })
|
|
450
464
|
.progressEnd(playTo ? 1 : 0, this._isOpen ? 1 - newStepValue : newStepValue, 300);
|
|
451
465
|
}
|
|
452
466
|
beforeAnimation(shouldOpen) {
|
|
@@ -493,16 +507,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
|
|
|
493
507
|
}
|
|
494
508
|
afterAnimation(isOpen) {
|
|
495
509
|
var _a;
|
|
496
|
-
console.log('after animation', isOpen, this.isAnimating);
|
|
497
|
-
if (this.operationCancelled) {
|
|
498
|
-
console.log('cancelled');
|
|
499
|
-
this.operationCancelled = false;
|
|
500
|
-
this.isAnimating = false;
|
|
501
|
-
this._isOpen = false;
|
|
502
|
-
console.log('this.', this.disabled);
|
|
503
|
-
return;
|
|
504
|
-
}
|
|
505
|
-
assert(this.isAnimating, '_before() should be called while animating');
|
|
506
510
|
// keep opening/closing the menu disabled for a touch more yet
|
|
507
511
|
// only add listeners/css if it's enabled and isOpen
|
|
508
512
|
// and only remove listeners/css if it's not open
|
|
@@ -567,12 +571,23 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
|
|
|
567
571
|
* Additionally, if the menu is in the process
|
|
568
572
|
* of animating {open, close} and the menu is disabled
|
|
569
573
|
* then it should still be closed immediately.
|
|
570
|
-
* TODO: Do we let the animation finish???
|
|
571
|
-
* what happens if we navigate away from a page?
|
|
572
574
|
*/
|
|
573
|
-
if (!isActive
|
|
574
|
-
|
|
575
|
-
|
|
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);
|
|
576
591
|
}
|
|
577
592
|
if (doc === null || doc === void 0 ? void 0 : doc.contains(this.el)) {
|
|
578
593
|
/**
|
|
@@ -586,15 +601,6 @@ const Menu = /*@__PURE__*/ proxyCustomElement(class Menu extends HTMLElement {
|
|
|
586
601
|
}
|
|
587
602
|
}
|
|
588
603
|
}
|
|
589
|
-
forceClosing() {
|
|
590
|
-
const { animation } = this;
|
|
591
|
-
if (animation) {
|
|
592
|
-
console.log('stopping animation');
|
|
593
|
-
// TODO - disable when menu is fully open
|
|
594
|
-
animation.stop();
|
|
595
|
-
this.operationCancelled = true;
|
|
596
|
-
}
|
|
597
|
-
}
|
|
598
604
|
render() {
|
|
599
605
|
const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
|
|
600
606
|
const mode = getIonMode(this);
|
|
@@ -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 = {};
|
|
@@ -57,7 +65,6 @@ const Menu = class {
|
|
|
57
65
|
}
|
|
58
66
|
this.trapKeyboardFocus(ev, document);
|
|
59
67
|
};
|
|
60
|
-
this.operationCancelled = false;
|
|
61
68
|
this.isPaneVisible = false;
|
|
62
69
|
this.isEndSide = false;
|
|
63
70
|
this.contentId = undefined;
|
|
@@ -306,6 +313,15 @@ const Menu = class {
|
|
|
306
313
|
this.beforeAnimation(shouldOpen);
|
|
307
314
|
await this.loadAnimation();
|
|
308
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
|
+
}
|
|
309
325
|
this.afterAnimation(shouldOpen);
|
|
310
326
|
return true;
|
|
311
327
|
}
|
|
@@ -448,9 +464,7 @@ const Menu = class {
|
|
|
448
464
|
const playTo = this._isOpen ? !shouldComplete : shouldComplete;
|
|
449
465
|
this.animation
|
|
450
466
|
.easing('cubic-bezier(0.4, 0.0, 0.6, 1)')
|
|
451
|
-
.onFinish(() => {
|
|
452
|
-
return this.afterAnimation(shouldOpen);
|
|
453
|
-
}, { oneTimeCallback: true })
|
|
467
|
+
.onFinish(() => this.afterAnimation(shouldOpen), { oneTimeCallback: true })
|
|
454
468
|
.progressEnd(playTo ? 1 : 0, this._isOpen ? 1 - newStepValue : newStepValue, 300);
|
|
455
469
|
}
|
|
456
470
|
beforeAnimation(shouldOpen) {
|
|
@@ -497,16 +511,6 @@ const Menu = class {
|
|
|
497
511
|
}
|
|
498
512
|
afterAnimation(isOpen) {
|
|
499
513
|
var _a;
|
|
500
|
-
console.log('after animation', isOpen, this.isAnimating);
|
|
501
|
-
if (this.operationCancelled) {
|
|
502
|
-
console.log('cancelled');
|
|
503
|
-
this.operationCancelled = false;
|
|
504
|
-
this.isAnimating = false;
|
|
505
|
-
this._isOpen = false;
|
|
506
|
-
console.log('this.', this.disabled);
|
|
507
|
-
return;
|
|
508
|
-
}
|
|
509
|
-
helpers.assert(this.isAnimating, '_before() should be called while animating');
|
|
510
514
|
// keep opening/closing the menu disabled for a touch more yet
|
|
511
515
|
// only add listeners/css if it's enabled and isOpen
|
|
512
516
|
// and only remove listeners/css if it's not open
|
|
@@ -571,12 +575,23 @@ const Menu = class {
|
|
|
571
575
|
* Additionally, if the menu is in the process
|
|
572
576
|
* of animating {open, close} and the menu is disabled
|
|
573
577
|
* then it should still be closed immediately.
|
|
574
|
-
* TODO: Do we let the animation finish???
|
|
575
|
-
* what happens if we navigate away from a page?
|
|
576
578
|
*/
|
|
577
|
-
if (!isActive
|
|
578
|
-
|
|
579
|
-
|
|
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);
|
|
580
595
|
}
|
|
581
596
|
if (index$2.doc === null || index$2.doc === void 0 ? void 0 : index$2.doc.contains(this.el)) {
|
|
582
597
|
/**
|
|
@@ -590,15 +605,6 @@ const Menu = class {
|
|
|
590
605
|
}
|
|
591
606
|
}
|
|
592
607
|
}
|
|
593
|
-
forceClosing() {
|
|
594
|
-
const { animation } = this;
|
|
595
|
-
if (animation) {
|
|
596
|
-
console.log('stopping animation');
|
|
597
|
-
// TODO - disable when menu is fully open
|
|
598
|
-
animation.stop();
|
|
599
|
-
this.operationCancelled = true;
|
|
600
|
-
}
|
|
601
|
-
}
|
|
602
608
|
render() {
|
|
603
609
|
const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
|
|
604
610
|
const mode = ionicGlobal.getIonMode(this);
|
|
@@ -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 = {};
|
|
@@ -41,7 +49,6 @@ export class Menu {
|
|
|
41
49
|
}
|
|
42
50
|
this.trapKeyboardFocus(ev, document);
|
|
43
51
|
};
|
|
44
|
-
this.operationCancelled = false;
|
|
45
52
|
this.isPaneVisible = false;
|
|
46
53
|
this.isEndSide = false;
|
|
47
54
|
this.contentId = undefined;
|
|
@@ -293,6 +300,15 @@ export class Menu {
|
|
|
293
300
|
this.beforeAnimation(shouldOpen);
|
|
294
301
|
await this.loadAnimation();
|
|
295
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
|
+
}
|
|
296
312
|
this.afterAnimation(shouldOpen);
|
|
297
313
|
return true;
|
|
298
314
|
}
|
|
@@ -435,9 +451,7 @@ export class Menu {
|
|
|
435
451
|
const playTo = this._isOpen ? !shouldComplete : shouldComplete;
|
|
436
452
|
this.animation
|
|
437
453
|
.easing('cubic-bezier(0.4, 0.0, 0.6, 1)')
|
|
438
|
-
.onFinish(() => {
|
|
439
|
-
return this.afterAnimation(shouldOpen);
|
|
440
|
-
}, { oneTimeCallback: true })
|
|
454
|
+
.onFinish(() => this.afterAnimation(shouldOpen), { oneTimeCallback: true })
|
|
441
455
|
.progressEnd(playTo ? 1 : 0, this._isOpen ? 1 - newStepValue : newStepValue, 300);
|
|
442
456
|
}
|
|
443
457
|
beforeAnimation(shouldOpen) {
|
|
@@ -484,16 +498,6 @@ export class Menu {
|
|
|
484
498
|
}
|
|
485
499
|
afterAnimation(isOpen) {
|
|
486
500
|
var _a;
|
|
487
|
-
console.log('after animation', isOpen, this.isAnimating);
|
|
488
|
-
if (this.operationCancelled) {
|
|
489
|
-
console.log('cancelled');
|
|
490
|
-
this.operationCancelled = false;
|
|
491
|
-
this.isAnimating = false;
|
|
492
|
-
this._isOpen = false;
|
|
493
|
-
console.log('this.', this.disabled);
|
|
494
|
-
return;
|
|
495
|
-
}
|
|
496
|
-
assert(this.isAnimating, '_before() should be called while animating');
|
|
497
501
|
// keep opening/closing the menu disabled for a touch more yet
|
|
498
502
|
// only add listeners/css if it's enabled and isOpen
|
|
499
503
|
// and only remove listeners/css if it's not open
|
|
@@ -558,12 +562,23 @@ export class Menu {
|
|
|
558
562
|
* Additionally, if the menu is in the process
|
|
559
563
|
* of animating {open, close} and the menu is disabled
|
|
560
564
|
* then it should still be closed immediately.
|
|
561
|
-
* TODO: Do we let the animation finish???
|
|
562
|
-
* what happens if we navigate away from a page?
|
|
563
565
|
*/
|
|
564
|
-
if (!isActive
|
|
565
|
-
|
|
566
|
-
|
|
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);
|
|
567
582
|
}
|
|
568
583
|
if (doc === null || doc === void 0 ? void 0 : doc.contains(this.el)) {
|
|
569
584
|
/**
|
|
@@ -577,15 +592,6 @@ export class Menu {
|
|
|
577
592
|
}
|
|
578
593
|
}
|
|
579
594
|
}
|
|
580
|
-
forceClosing() {
|
|
581
|
-
const { animation } = this;
|
|
582
|
-
if (animation) {
|
|
583
|
-
console.log('stopping animation');
|
|
584
|
-
// TODO - disable when menu is fully open
|
|
585
|
-
animation.stop();
|
|
586
|
-
this.operationCancelled = true;
|
|
587
|
-
}
|
|
588
|
-
}
|
|
589
595
|
render() {
|
|
590
596
|
const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
|
|
591
597
|
const mode = getIonMode(this);
|
package/dist/docs.json
CHANGED
|
@@ -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 = {};
|
|
@@ -53,7 +61,6 @@ const Menu = class {
|
|
|
53
61
|
}
|
|
54
62
|
this.trapKeyboardFocus(ev, document);
|
|
55
63
|
};
|
|
56
|
-
this.operationCancelled = false;
|
|
57
64
|
this.isPaneVisible = false;
|
|
58
65
|
this.isEndSide = false;
|
|
59
66
|
this.contentId = undefined;
|
|
@@ -302,6 +309,15 @@ const Menu = class {
|
|
|
302
309
|
this.beforeAnimation(shouldOpen);
|
|
303
310
|
await this.loadAnimation();
|
|
304
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
|
+
}
|
|
305
321
|
this.afterAnimation(shouldOpen);
|
|
306
322
|
return true;
|
|
307
323
|
}
|
|
@@ -444,9 +460,7 @@ const Menu = class {
|
|
|
444
460
|
const playTo = this._isOpen ? !shouldComplete : shouldComplete;
|
|
445
461
|
this.animation
|
|
446
462
|
.easing('cubic-bezier(0.4, 0.0, 0.6, 1)')
|
|
447
|
-
.onFinish(() => {
|
|
448
|
-
return this.afterAnimation(shouldOpen);
|
|
449
|
-
}, { oneTimeCallback: true })
|
|
463
|
+
.onFinish(() => this.afterAnimation(shouldOpen), { oneTimeCallback: true })
|
|
450
464
|
.progressEnd(playTo ? 1 : 0, this._isOpen ? 1 - newStepValue : newStepValue, 300);
|
|
451
465
|
}
|
|
452
466
|
beforeAnimation(shouldOpen) {
|
|
@@ -493,16 +507,6 @@ const Menu = class {
|
|
|
493
507
|
}
|
|
494
508
|
afterAnimation(isOpen) {
|
|
495
509
|
var _a;
|
|
496
|
-
console.log('after animation', isOpen, this.isAnimating);
|
|
497
|
-
if (this.operationCancelled) {
|
|
498
|
-
console.log('cancelled');
|
|
499
|
-
this.operationCancelled = false;
|
|
500
|
-
this.isAnimating = false;
|
|
501
|
-
this._isOpen = false;
|
|
502
|
-
console.log('this.', this.disabled);
|
|
503
|
-
return;
|
|
504
|
-
}
|
|
505
|
-
assert(this.isAnimating, '_before() should be called while animating');
|
|
506
510
|
// keep opening/closing the menu disabled for a touch more yet
|
|
507
511
|
// only add listeners/css if it's enabled and isOpen
|
|
508
512
|
// and only remove listeners/css if it's not open
|
|
@@ -567,12 +571,23 @@ const Menu = class {
|
|
|
567
571
|
* Additionally, if the menu is in the process
|
|
568
572
|
* of animating {open, close} and the menu is disabled
|
|
569
573
|
* then it should still be closed immediately.
|
|
570
|
-
* TODO: Do we let the animation finish???
|
|
571
|
-
* what happens if we navigate away from a page?
|
|
572
574
|
*/
|
|
573
|
-
if (!isActive
|
|
574
|
-
|
|
575
|
-
|
|
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);
|
|
576
591
|
}
|
|
577
592
|
if (doc === null || doc === void 0 ? void 0 : doc.contains(this.el)) {
|
|
578
593
|
/**
|
|
@@ -586,15 +601,6 @@ const Menu = class {
|
|
|
586
601
|
}
|
|
587
602
|
}
|
|
588
603
|
}
|
|
589
|
-
forceClosing() {
|
|
590
|
-
const { animation } = this;
|
|
591
|
-
if (animation) {
|
|
592
|
-
console.log('stopping animation');
|
|
593
|
-
// TODO - disable when menu is fully open
|
|
594
|
-
animation.stop();
|
|
595
|
-
this.operationCancelled = true;
|
|
596
|
-
}
|
|
597
|
-
}
|
|
598
604
|
render() {
|
|
599
605
|
const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
|
|
600
606
|
const mode = getIonMode(this);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import{__awaiter,__generator}from"tslib";
|
|
2
2
|
/*!
|
|
3
3
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
4
|
-
*/import{r as registerInstance,d as createEvent,h,H as Host,f as getElement}from"./index-2d388930.js";import{g as getTimeGivenProgression}from"./cubic-bezier-66542bc5.js";import{d as doc}from"./index-7a14ecec.js";import{G as GESTURE_CONTROLLER}from"./gesture-controller-0fa396c4.js";import{p as isEndSide,i as inheritAriaAttributes,o as assert,l as clamp}from"./helpers-3379ba19.js";import{m as menuController}from"./index-9b1940b1.js";import{q as getPresentedOverlay}from"./overlays-8fc6656c.js";import{c as config,b as getIonMode}from"./ionic-global-b3fc28dd.js";import{c as createColorClasses,h as hostContext}from"./theme-17531cdf.js";import{u as menuOutline,v as menuSharp}from"./index-ecfc2c9f.js";import"./hardware-back-button-39299f84.js";import"./animation-92066c62.js";import"./framework-delegate-aa433dea.js";import"./index-595d62c9.js";var menuIosCss=":host{--width:304px;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--background:var(--ion-background-color, #fff);left:0;right:0;top:0;bottom:0;display:none;position:absolute;contain:strict}:host(.show-menu){display:block}.menu-inner{-webkit-transform:translateX(-9999px);transform:translateX(-9999px);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:strict}:host(.menu-side-start) .menu-inner{--ion-safe-area-right:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{inset-inline-start:0;inset-inline-end:auto}}@supports not (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{left:0;right:auto}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{left:unset;right:unset;left:auto;right:0}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){left:unset;right:unset;left:auto;right:0}}}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{--ion-safe-area-right:unset;--ion-safe-area-left:0px}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){--ion-safe-area-right:unset;--ion-safe-area-left:0px}}:host(.menu-side-end) .menu-inner{--ion-safe-area-left:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{inset-inline-start:auto;inset-inline-end:0}}@supports not (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{left:auto;right:0}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{left:unset;right:unset;left:0;right:auto}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){left:unset;right:unset;left:0;right:auto}}}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{--ion-safe-area-left:unset;--ion-safe-area-right:0px}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){--ion-safe-area-left:unset;--ion-safe-area-right:0px}}ion-backdrop{display:none;opacity:0.01;z-index:-1}@media (max-width: 340px){.menu-inner{--width:264px}}:host(.menu-type-reveal){z-index:0}:host(.menu-type-reveal.show-menu) .menu-inner{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}:host(.menu-type-overlay){z-index:1000}:host(.menu-type-overlay) .show-backdrop{display:block;cursor:pointer}:host(.menu-pane-visible){width:var(--width);min-width:var(--min-width);max-width:var(--max-width)}:host(.menu-pane-visible) .menu-inner{left:0;right:0;width:auto;-webkit-transform:none !important;transform:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}:host(.menu-pane-visible) ion-backdrop{display:hidden !important;}:host(.menu-type-push){z-index:1000}:host(.menu-type-push) .show-backdrop{display:block}";var menuMdCss=":host{--width:304px;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--background:var(--ion-background-color, #fff);left:0;right:0;top:0;bottom:0;display:none;position:absolute;contain:strict}:host(.show-menu){display:block}.menu-inner{-webkit-transform:translateX(-9999px);transform:translateX(-9999px);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:strict}:host(.menu-side-start) .menu-inner{--ion-safe-area-right:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{inset-inline-start:0;inset-inline-end:auto}}@supports not (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{left:0;right:auto}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{left:unset;right:unset;left:auto;right:0}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){left:unset;right:unset;left:auto;right:0}}}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{--ion-safe-area-right:unset;--ion-safe-area-left:0px}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){--ion-safe-area-right:unset;--ion-safe-area-left:0px}}:host(.menu-side-end) .menu-inner{--ion-safe-area-left:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{inset-inline-start:auto;inset-inline-end:0}}@supports not (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{left:auto;right:0}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{left:unset;right:unset;left:0;right:auto}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){left:unset;right:unset;left:0;right:auto}}}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{--ion-safe-area-left:unset;--ion-safe-area-right:0px}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){--ion-safe-area-left:unset;--ion-safe-area-right:0px}}ion-backdrop{display:none;opacity:0.01;z-index:-1}@media (max-width: 340px){.menu-inner{--width:264px}}:host(.menu-type-reveal){z-index:0}:host(.menu-type-reveal.show-menu) .menu-inner{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}:host(.menu-type-overlay){z-index:1000}:host(.menu-type-overlay) .show-backdrop{display:block;cursor:pointer}:host(.menu-pane-visible){width:var(--width);min-width:var(--min-width);max-width:var(--max-width)}:host(.menu-pane-visible) .menu-inner{left:0;right:0;width:auto;-webkit-transform:none !important;transform:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}:host(.menu-pane-visible) ion-backdrop{display:hidden !important;}:host(.menu-type-overlay) .menu-inner{-webkit-box-shadow:4px 0px 16px rgba(0, 0, 0, 0.18);box-shadow:4px 0px 16px rgba(0, 0, 0, 0.18)}";var iosEasing="cubic-bezier(0.32,0.72,0,1)";var mdEasing="cubic-bezier(0.0,0.0,0.2,1)";var iosEasingReverse="cubic-bezier(1, 0, 0.68, 0.28)";var mdEasingReverse="cubic-bezier(0.4, 0, 0.6, 1)";var focusableQueryString='[tabindex]:not([tabindex^="-"]), input:not([type=hidden]):not([tabindex^="-"]), textarea:not([tabindex^="-"]), button:not([tabindex^="-"]), select:not([tabindex^="-"]), .ion-focusable:not([tabindex^="-"])';var Menu=function(){function t(t){var e=this;registerInstance(this,t);this.ionWillOpen=createEvent(this,"ionWillOpen",7);this.ionWillClose=createEvent(this,"ionWillClose",7);this.ionDidOpen=createEvent(this,"ionDidOpen",7);this.ionDidClose=createEvent(this,"ionDidClose",7);this.ionMenuChange=createEvent(this,"ionMenuChange",7);this.lastOnEnd=0;this.blocker=GESTURE_CONTROLLER.createBlocker({disableScroll:true});this.didLoad=false;this.isAnimating=false;this._isOpen=false;this.inheritedAttributes={};this.handleFocus=function(t){var n=getPresentedOverlay(document);if(n&&!n.contains(e.el)){return}e.trapKeyboardFocus(t,document)};this.operationCancelled=false;this.isPaneVisible=false;this.isEndSide=false;this.contentId=undefined;this.menuId=undefined;this.type=undefined;this.disabled=false;this.side="start";this.swipeGesture=true;this.maxEdgeStart=50}t.prototype.typeChanged=function(t,e){var n=this.contentEl;if(n){if(e!==undefined){n.classList.remove("menu-content-".concat(e))}n.classList.add("menu-content-".concat(t));n.removeAttribute("style")}if(this.menuInnerEl){this.menuInnerEl.removeAttribute("style")}this.animation=undefined};t.prototype.disabledChanged=function(){this.updateState();this.ionMenuChange.emit({disabled:this.disabled,open:this._isOpen})};t.prototype.sideChanged=function(){this.isEndSide=isEndSide(this.side);this.animation=undefined};t.prototype.swipeGestureChanged=function(){this.updateState()};t.prototype.connectedCallback=function(){return __awaiter(this,void 0,void 0,(function(){var t,e;var n=this;return __generator(this,(function(i){switch(i.label){case 0:if(!(typeof customElements!=="undefined"&&customElements!=null))return[3,2];return[4,customElements.whenDefined("ion-menu")];case 1:i.sent();i.label=2;case 2:if(this.type===undefined){this.type=config.get("menuType","overlay")}t=this.contentId!==undefined?document.getElementById(this.contentId):null;if(t===null){console.error('Menu: must have a "content" element to listen for drag events on.');return[2]}if(this.el.contains(t)){console.error('Menu: "contentId" should refer to the main view\'s ion-content, not the ion-content inside of the ion-menu.')}this.contentEl=t;t.classList.add("menu-content");this.typeChanged(this.type,undefined);this.sideChanged();menuController._register(this);this.menuChanged();e=this;return[4,import("./index-ff313b19.js")];case 3:e.gesture=i.sent().createGesture({el:document,gestureName:"menu-swipe",gesturePriority:30,threshold:10,blurOnStart:true,canStart:function(t){return n.canStart(t)},onWillStart:function(){return n.onWillStart()},onStart:function(){return n.onStart()},onMove:function(t){return n.onMove(t)},onEnd:function(t){return n.onEnd(t)}});this.updateState();return[2]}}))}))};t.prototype.componentWillLoad=function(){this.inheritedAttributes=inheritAriaAttributes(this.el)};t.prototype.componentDidLoad=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.didLoad=true;this.menuChanged();this.updateState();return[2]}))}))};t.prototype.menuChanged=function(){if(this.didLoad){this.ionMenuChange.emit({disabled:this.disabled,open:this._isOpen})}};t.prototype.disconnectedCallback=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,this.close(false)];case 1:t.sent();this.blocker.destroy();menuController._unregister(this);if(this.animation){this.animation.destroy()}if(this.gesture){this.gesture.destroy();this.gesture=undefined}this.animation=undefined;this.contentEl=undefined;return[2]}}))}))};t.prototype.onSplitPaneChanged=function(t){this.isPaneVisible=t.detail.isPane(this.el);this.updateState()};t.prototype.onBackdropClick=function(t){if(this._isOpen&&this.lastOnEnd<t.timeStamp-100){var e=t.composedPath?!t.composedPath().includes(this.menuInnerEl):false;if(e){t.preventDefault();t.stopPropagation();this.close()}}};t.prototype.onKeydown=function(t){if(t.key==="Escape"){this.close()}};t.prototype.isOpen=function(){return Promise.resolve(this._isOpen)};t.prototype.isActive=function(){return Promise.resolve(this._isActive())};t.prototype.open=function(t){if(t===void 0){t=true}return this.setOpen(true,t)};t.prototype.close=function(t){if(t===void 0){t=true}return this.setOpen(false,t)};t.prototype.toggle=function(t){if(t===void 0){t=true}return this.setOpen(!this._isOpen,t)};t.prototype.setOpen=function(t,e){if(e===void 0){e=true}return menuController._setOpen(this,t,e)};t.prototype.focusFirstDescendant=function(){var t=this.el;var e=t.querySelector(focusableQueryString);if(e){e.focus()}else{t.focus()}};t.prototype.focusLastDescendant=function(){var t=this.el;var e=Array.from(t.querySelectorAll(focusableQueryString));var n=e.length>0?e[e.length-1]:null;if(n){n.focus()}else{t.focus()}};t.prototype.trapKeyboardFocus=function(t,e){var n=t.target;if(!n){return}if(this.el.contains(n)){this.lastFocus=n}else{this.focusFirstDescendant();if(this.lastFocus===e.activeElement){this.focusLastDescendant()}}};t.prototype._setOpen=function(t,e){if(e===void 0){e=true}return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(n){switch(n.label){case 0:if(!this._isActive()||this.isAnimating||t===this._isOpen){return[2,false]}this.beforeAnimation(t);return[4,this.loadAnimation()];case 1:n.sent();return[4,this.startAnimation(t,e)];case 2:n.sent();this.afterAnimation(t);return[2,true]}}))}))};t.prototype.loadAnimation=function(){return __awaiter(this,void 0,void 0,(function(){var t,e,n;return __generator(this,(function(i){switch(i.label){case 0:t=this.menuInnerEl.offsetWidth;e=isEndSide(this.side);if(t===this.width&&this.animation!==undefined&&e===this.isEndSide){return[2]}this.width=t;this.isEndSide=e;if(this.animation){this.animation.destroy();this.animation=undefined}n=this;return[4,menuController._createAnimation(this.type,this)];case 1:n.animation=i.sent();if(!config.getBoolean("animated",true)){this.animation.duration(0)}this.animation.fill("both");return[2]}}))}))};t.prototype.startAnimation=function(t,e){return __awaiter(this,void 0,void 0,(function(){var n,i,o,r,s;return __generator(this,(function(a){switch(a.label){case 0:n=!t;i=getIonMode(this);o=i==="ios"?iosEasing:mdEasing;r=i==="ios"?iosEasingReverse:mdEasingReverse;s=this.animation.direction(n?"reverse":"normal").easing(n?r:o);if(!e)return[3,2];return[4,s.play()];case 1:a.sent();return[3,3];case 2:s.play({sync:true});a.label=3;case 3:if(s.getDirection()==="reverse"){s.direction("normal")}return[2]}}))}))};t.prototype._isActive=function(){return!this.disabled&&!this.isPaneVisible};t.prototype.canSwipe=function(){return this.swipeGesture&&!this.isAnimating&&this._isActive()};t.prototype.canStart=function(t){var e=!!document.querySelector("ion-modal.show-modal");if(e||!this.canSwipe()){return false}if(this._isOpen){return true}else if(menuController._getOpenSync()){return false}return checkEdgeSide(window,t.currentX,this.isEndSide,this.maxEdgeStart)};t.prototype.onWillStart=function(){this.beforeAnimation(!this._isOpen);return this.loadAnimation()};t.prototype.onStart=function(){if(!this.isAnimating||!this.animation){assert(false,"isAnimating has to be true");return}this.animation.progressStart(true,this._isOpen?1:0)};t.prototype.onMove=function(t){if(!this.isAnimating||!this.animation){assert(false,"isAnimating has to be true");return}var e=computeDelta(t.deltaX,this._isOpen,this.isEndSide);var n=e/this.width;this.animation.progressStep(this._isOpen?1-n:n)};t.prototype.onEnd=function(t){var e=this;if(!this.isAnimating||!this.animation){assert(false,"isAnimating has to be true");return}var n=this._isOpen;var i=this.isEndSide;var o=computeDelta(t.deltaX,n,i);var r=this.width;var s=o/r;var a=t.velocityX;var u=r/2;var d=a>=0&&(a>.2||t.deltaX>u);var l=a<=0&&(a<-.2||t.deltaX<-u);var h=n?i?d:l:i?l:d;var c=!n&&h;if(n&&!h){c=true}this.lastOnEnd=t.currentTime;var p=h?.001:-.001;var m=s<0?.01:s;p+=getTimeGivenProgression([0,0],[.4,0],[.6,1],[1,1],clamp(0,m,.9999))[0]||0;var f=this._isOpen?!h:h;this.animation.easing("cubic-bezier(0.4, 0.0, 0.6, 1)").onFinish((function(){return e.afterAnimation(c)}),{oneTimeCallback:true}).progressEnd(f?1:0,this._isOpen?1-p:p,300)};t.prototype.beforeAnimation=function(t){assert(!this.isAnimating,"_before() should not be called while animating");this.el.classList.add(SHOW_MENU);this.el.setAttribute("tabindex","0");if(this.backdropEl){this.backdropEl.classList.add(SHOW_BACKDROP)}if(this.contentEl){this.contentEl.classList.add(MENU_CONTENT_OPEN);this.contentEl.setAttribute("aria-hidden","true")}this.blocker.block();this.isAnimating=true;if(t){this.ionWillOpen.emit()}else{this.ionWillClose.emit()}};t.prototype.afterAnimation=function(t){var e;console.log("after animation",t,this.isAnimating);if(this.operationCancelled){console.log("cancelled");this.operationCancelled=false;this.isAnimating=false;this._isOpen=false;console.log("this.",this.disabled);return}assert(this.isAnimating,"_before() should be called while animating");this._isOpen=t;this.isAnimating=false;if(!this._isOpen){this.blocker.unblock()}if(t){this.ionDidOpen.emit();var n=(e=document.activeElement)===null||e===void 0?void 0:e.closest("ion-menu");if(n!==this.el){this.el.focus()}document.addEventListener("focus",this.handleFocus,true)}else{this.el.classList.remove(SHOW_MENU);this.el.removeAttribute("tabindex");if(this.contentEl){this.contentEl.classList.remove(MENU_CONTENT_OPEN);this.contentEl.removeAttribute("aria-hidden")}if(this.backdropEl){this.backdropEl.classList.remove(SHOW_BACKDROP)}if(this.animation){this.animation.stop()}this.ionDidClose.emit();document.removeEventListener("focus",this.handleFocus,true)}};t.prototype.updateState=function(){var t=this._isActive();if(this.gesture){this.gesture.enable(t&&this.swipeGesture)}if(!t&&(this._isOpen||this.isAnimating)){this.forceClosing()}if(doc===null||doc===void 0?void 0:doc.contains(this.el)){if(!this.disabled){menuController._setActiveMenu(this)}}};t.prototype.forceClosing=function(){var t=this.animation;if(t){console.log("stopping animation");t.stop();this.operationCancelled=true}};t.prototype.render=function(){var t;var e=this;var n=this,i=n.type,o=n.disabled,r=n.isPaneVisible,s=n.inheritedAttributes,a=n.side;var u=getIonMode(this);return h(Host,{role:"navigation","aria-label":s["aria-label"]||"menu",class:(t={},t[u]=true,t["menu-type-".concat(i)]=true,t["menu-enabled"]=!o,t["menu-side-".concat(a)]=true,t["menu-pane-visible"]=r,t)},h("div",{class:"menu-inner",part:"container",ref:function(t){return e.menuInnerEl=t}},h("slot",null)),h("ion-backdrop",{ref:function(t){return e.backdropEl=t},class:"menu-backdrop",tappable:false,stopPropagation:false,part:"backdrop"}))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{type:["typeChanged"],disabled:["disabledChanged"],side:["sideChanged"],swipeGesture:["swipeGestureChanged"]}},enumerable:false,configurable:true});return t}();var computeDelta=function(t,e,n){return Math.max(0,e!==n?-t:t)};var checkEdgeSide=function(t,e,n,i){if(n){return e>=t.innerWidth-i}else{return e<=i}};var SHOW_MENU="show-menu";var SHOW_BACKDROP="show-backdrop";var MENU_CONTENT_OPEN="menu-content-open";Menu.style={ios:menuIosCss,md:menuMdCss};var updateVisibility=function(t){return __awaiter(void 0,void 0,void 0,(function(){var e,n;return __generator(this,(function(i){switch(i.label){case 0:return[4,menuController.get(t)];case 1:e=i.sent();n=e;if(!n)return[3,3];return[4,e.isActive()];case 2:n=i.sent();i.label=3;case 3:return[2,!!n]}}))}))};var menuButtonIosCss=':host{--background:transparent;--color-focused:currentColor;--border-radius:initial;--padding-top:0;--padding-bottom:0;color:var(--color);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}ion-icon{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;pointer-events:none}:host(.menu-button-hidden){display:none}:host(.menu-button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity, 0)}}:host(.ion-color) .button-native{color:var(--ion-color-base)}:host(.in-toolbar:not(.in-toolbar-color)){color:var(--ion-toolbar-color, var(--color))}:host{--background-focused:currentColor;--background-focused-opacity:.1;--border-radius:4px;--color:var(--ion-color-primary, #3880ff);--padding-start:5px;--padding-end:5px;height:32px;font-size:31px}:host(.ion-activated){opacity:0.4}@media (any-hover: hover){:host(:hover){opacity:0.6}}';var menuButtonMdCss=':host{--background:transparent;--color-focused:currentColor;--border-radius:initial;--padding-top:0;--padding-bottom:0;color:var(--color);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}ion-icon{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;pointer-events:none}:host(.menu-button-hidden){display:none}:host(.menu-button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity, 0)}}:host(.ion-color) .button-native{color:var(--ion-color-base)}:host(.in-toolbar:not(.in-toolbar-color)){color:var(--ion-toolbar-color, var(--color))}:host{--background-focused:currentColor;--background-focused-opacity:.12;--background-hover:currentColor;--background-hover-opacity:.04;--border-radius:50%;--color:initial;--padding-start:8px;--padding-end:8px;width:48px;height:48px;font-size:24px}:host(.ion-color.ion-focused)::after{background:var(--ion-color-base)}@media (any-hover: hover){:host(.ion-color:hover) .button-native::after{background:var(--ion-color-base)}}';var MenuButton=function(){function t(t){var e=this;registerInstance(this,t);this.inheritedAttributes={};this.onClick=function(){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(t){return[2,menuController.toggle(this.menu)]}))}))};this.visible=false;this.color=undefined;this.disabled=false;this.menu=undefined;this.autoHide=true;this.type="button"}t.prototype.componentWillLoad=function(){this.inheritedAttributes=inheritAriaAttributes(this.el)};t.prototype.componentDidLoad=function(){this.visibilityChanged()};t.prototype.visibilityChanged=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:t=this;return[4,updateVisibility(this.menu)];case 1:t.visible=e.sent();return[2]}}))}))};t.prototype.render=function(){var t;var e=this,n=e.color,i=e.disabled,o=e.inheritedAttributes;var r=getIonMode(this);var s=config.get("menuIcon",r==="ios"?menuOutline:menuSharp);var a=this.autoHide&&!this.visible;var u={type:this.type};var d=o["aria-label"]||"menu";return h(Host,{onClick:this.onClick,"aria-disabled":i?"true":null,"aria-hidden":a?"true":null,class:createColorClasses(n,(t={},t[r]=true,t.button=true,t["menu-button-hidden"]=a,t["menu-button-disabled"]=i,t["in-toolbar"]=hostContext("ion-toolbar",this.el),t["in-toolbar-color"]=hostContext("ion-toolbar[color]",this.el),t["ion-activatable"]=true,t["ion-focusable"]=true,t))},h("button",Object.assign({},u,{disabled:i,class:"button-native",part:"native","aria-label":d}),h("span",{class:"button-inner"},h("slot",null,h("ion-icon",{part:"icon",icon:s,mode:r,lazy:false,"aria-hidden":"true"}))),r==="md"&&h("ion-ripple-effect",{type:"unbounded"})))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();MenuButton.style={ios:menuButtonIosCss,md:menuButtonMdCss};var menuToggleCss=":host(.menu-toggle-hidden){display:none}";var MenuToggle=function(){function t(t){var e=this;registerInstance(this,t);this.onClick=function(){return menuController.toggle(e.menu)};this.visible=false;this.menu=undefined;this.autoHide=true}t.prototype.connectedCallback=function(){this.visibilityChanged()};t.prototype.visibilityChanged=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:t=this;return[4,updateVisibility(this.menu)];case 1:t.visible=e.sent();return[2]}}))}))};t.prototype.render=function(){var t;var e=getIonMode(this);var n=this.autoHide&&!this.visible;return h(Host,{onClick:this.onClick,"aria-hidden":n?"true":null,class:(t={},t[e]=true,t["menu-toggle-hidden"]=n,t)},h("slot",null))};return t}();MenuToggle.style=menuToggleCss;export{Menu as ion_menu,MenuButton as ion_menu_button,MenuToggle as ion_menu_toggle};
|
|
4
|
+
*/import{r as registerInstance,d as createEvent,h,H as Host,f as getElement}from"./index-2d388930.js";import{g as getTimeGivenProgression}from"./cubic-bezier-66542bc5.js";import{d as doc}from"./index-7a14ecec.js";import{G as GESTURE_CONTROLLER}from"./gesture-controller-0fa396c4.js";import{p as isEndSide,i as inheritAriaAttributes,o as assert,l as clamp}from"./helpers-3379ba19.js";import{m as menuController}from"./index-9b1940b1.js";import{q as getPresentedOverlay}from"./overlays-8fc6656c.js";import{c as config,b as getIonMode}from"./ionic-global-b3fc28dd.js";import{c as createColorClasses,h as hostContext}from"./theme-17531cdf.js";import{u as menuOutline,v as menuSharp}from"./index-ecfc2c9f.js";import"./hardware-back-button-39299f84.js";import"./animation-92066c62.js";import"./framework-delegate-aa433dea.js";import"./index-595d62c9.js";var menuIosCss=":host{--width:304px;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--background:var(--ion-background-color, #fff);left:0;right:0;top:0;bottom:0;display:none;position:absolute;contain:strict}:host(.show-menu){display:block}.menu-inner{-webkit-transform:translateX(-9999px);transform:translateX(-9999px);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:strict}:host(.menu-side-start) .menu-inner{--ion-safe-area-right:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{inset-inline-start:0;inset-inline-end:auto}}@supports not (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{left:0;right:auto}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{left:unset;right:unset;left:auto;right:0}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){left:unset;right:unset;left:auto;right:0}}}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{--ion-safe-area-right:unset;--ion-safe-area-left:0px}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){--ion-safe-area-right:unset;--ion-safe-area-left:0px}}:host(.menu-side-end) .menu-inner{--ion-safe-area-left:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{inset-inline-start:auto;inset-inline-end:0}}@supports not (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{left:auto;right:0}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{left:unset;right:unset;left:0;right:auto}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){left:unset;right:unset;left:0;right:auto}}}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{--ion-safe-area-left:unset;--ion-safe-area-right:0px}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){--ion-safe-area-left:unset;--ion-safe-area-right:0px}}ion-backdrop{display:none;opacity:0.01;z-index:-1}@media (max-width: 340px){.menu-inner{--width:264px}}:host(.menu-type-reveal){z-index:0}:host(.menu-type-reveal.show-menu) .menu-inner{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}:host(.menu-type-overlay){z-index:1000}:host(.menu-type-overlay) .show-backdrop{display:block;cursor:pointer}:host(.menu-pane-visible){width:var(--width);min-width:var(--min-width);max-width:var(--max-width)}:host(.menu-pane-visible) .menu-inner{left:0;right:0;width:auto;-webkit-transform:none !important;transform:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}:host(.menu-pane-visible) ion-backdrop{display:hidden !important;}:host(.menu-type-push){z-index:1000}:host(.menu-type-push) .show-backdrop{display:block}";var menuMdCss=":host{--width:304px;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--background:var(--ion-background-color, #fff);left:0;right:0;top:0;bottom:0;display:none;position:absolute;contain:strict}:host(.show-menu){display:block}.menu-inner{-webkit-transform:translateX(-9999px);transform:translateX(-9999px);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);background:var(--background);contain:strict}:host(.menu-side-start) .menu-inner{--ion-safe-area-right:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{inset-inline-start:0;inset-inline-end:auto}}@supports not (inset-inline-start: 0){:host(.menu-side-start) .menu-inner{left:0;right:auto}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{left:unset;right:unset;left:auto;right:0}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){left:unset;right:unset;left:auto;right:0}}}:host-context([dir=rtl]):host(.menu-side-start) .menu-inner,:host-context([dir=rtl]).menu-side-start .menu-inner{--ion-safe-area-right:unset;--ion-safe-area-left:0px}@supports selector(:dir(rtl)){:host(.menu-side-start) .menu-inner:dir(rtl){--ion-safe-area-right:unset;--ion-safe-area-left:0px}}:host(.menu-side-end) .menu-inner{--ion-safe-area-left:0px;top:0;bottom:0}@supports (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{inset-inline-start:auto;inset-inline-end:0}}@supports not (inset-inline-start: 0){:host(.menu-side-end) .menu-inner{left:auto;right:0}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{left:unset;right:unset;left:0;right:auto}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){left:unset;right:unset;left:0;right:auto}}}:host-context([dir=rtl]):host(.menu-side-end) .menu-inner,:host-context([dir=rtl]).menu-side-end .menu-inner{--ion-safe-area-left:unset;--ion-safe-area-right:0px}@supports selector(:dir(rtl)){:host(.menu-side-end) .menu-inner:dir(rtl){--ion-safe-area-left:unset;--ion-safe-area-right:0px}}ion-backdrop{display:none;opacity:0.01;z-index:-1}@media (max-width: 340px){.menu-inner{--width:264px}}:host(.menu-type-reveal){z-index:0}:host(.menu-type-reveal.show-menu) .menu-inner{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}:host(.menu-type-overlay){z-index:1000}:host(.menu-type-overlay) .show-backdrop{display:block;cursor:pointer}:host(.menu-pane-visible){width:var(--width);min-width:var(--min-width);max-width:var(--max-width)}:host(.menu-pane-visible) .menu-inner{left:0;right:0;width:auto;-webkit-transform:none !important;transform:none !important;-webkit-box-shadow:none !important;box-shadow:none !important}:host(.menu-pane-visible) ion-backdrop{display:hidden !important;}:host(.menu-type-overlay) .menu-inner{-webkit-box-shadow:4px 0px 16px rgba(0, 0, 0, 0.18);box-shadow:4px 0px 16px rgba(0, 0, 0, 0.18)}";var iosEasing="cubic-bezier(0.32,0.72,0,1)";var mdEasing="cubic-bezier(0.0,0.0,0.2,1)";var iosEasingReverse="cubic-bezier(1, 0, 0.68, 0.28)";var mdEasingReverse="cubic-bezier(0.4, 0, 0.6, 1)";var focusableQueryString='[tabindex]:not([tabindex^="-"]), input:not([type=hidden]):not([tabindex^="-"]), textarea:not([tabindex^="-"]), button:not([tabindex^="-"]), select:not([tabindex^="-"]), .ion-focusable:not([tabindex^="-"])';var Menu=function(){function t(t){var e=this;registerInstance(this,t);this.ionWillOpen=createEvent(this,"ionWillOpen",7);this.ionWillClose=createEvent(this,"ionWillClose",7);this.ionDidOpen=createEvent(this,"ionDidOpen",7);this.ionDidClose=createEvent(this,"ionDidClose",7);this.ionMenuChange=createEvent(this,"ionMenuChange",7);this.lastOnEnd=0;this.blocker=GESTURE_CONTROLLER.createBlocker({disableScroll:true});this.didLoad=false;this.operationCancelled=false;this.isAnimating=false;this._isOpen=false;this.inheritedAttributes={};this.handleFocus=function(t){var n=getPresentedOverlay(document);if(n&&!n.contains(e.el)){return}e.trapKeyboardFocus(t,document)};this.isPaneVisible=false;this.isEndSide=false;this.contentId=undefined;this.menuId=undefined;this.type=undefined;this.disabled=false;this.side="start";this.swipeGesture=true;this.maxEdgeStart=50}t.prototype.typeChanged=function(t,e){var n=this.contentEl;if(n){if(e!==undefined){n.classList.remove("menu-content-".concat(e))}n.classList.add("menu-content-".concat(t));n.removeAttribute("style")}if(this.menuInnerEl){this.menuInnerEl.removeAttribute("style")}this.animation=undefined};t.prototype.disabledChanged=function(){this.updateState();this.ionMenuChange.emit({disabled:this.disabled,open:this._isOpen})};t.prototype.sideChanged=function(){this.isEndSide=isEndSide(this.side);this.animation=undefined};t.prototype.swipeGestureChanged=function(){this.updateState()};t.prototype.connectedCallback=function(){return __awaiter(this,void 0,void 0,(function(){var t,e;var n=this;return __generator(this,(function(i){switch(i.label){case 0:if(!(typeof customElements!=="undefined"&&customElements!=null))return[3,2];return[4,customElements.whenDefined("ion-menu")];case 1:i.sent();i.label=2;case 2:if(this.type===undefined){this.type=config.get("menuType","overlay")}t=this.contentId!==undefined?document.getElementById(this.contentId):null;if(t===null){console.error('Menu: must have a "content" element to listen for drag events on.');return[2]}if(this.el.contains(t)){console.error('Menu: "contentId" should refer to the main view\'s ion-content, not the ion-content inside of the ion-menu.')}this.contentEl=t;t.classList.add("menu-content");this.typeChanged(this.type,undefined);this.sideChanged();menuController._register(this);this.menuChanged();e=this;return[4,import("./index-ff313b19.js")];case 3:e.gesture=i.sent().createGesture({el:document,gestureName:"menu-swipe",gesturePriority:30,threshold:10,blurOnStart:true,canStart:function(t){return n.canStart(t)},onWillStart:function(){return n.onWillStart()},onStart:function(){return n.onStart()},onMove:function(t){return n.onMove(t)},onEnd:function(t){return n.onEnd(t)}});this.updateState();return[2]}}))}))};t.prototype.componentWillLoad=function(){this.inheritedAttributes=inheritAriaAttributes(this.el)};t.prototype.componentDidLoad=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.didLoad=true;this.menuChanged();this.updateState();return[2]}))}))};t.prototype.menuChanged=function(){if(this.didLoad){this.ionMenuChange.emit({disabled:this.disabled,open:this._isOpen})}};t.prototype.disconnectedCallback=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,this.close(false)];case 1:t.sent();this.blocker.destroy();menuController._unregister(this);if(this.animation){this.animation.destroy()}if(this.gesture){this.gesture.destroy();this.gesture=undefined}this.animation=undefined;this.contentEl=undefined;return[2]}}))}))};t.prototype.onSplitPaneChanged=function(t){this.isPaneVisible=t.detail.isPane(this.el);this.updateState()};t.prototype.onBackdropClick=function(t){if(this._isOpen&&this.lastOnEnd<t.timeStamp-100){var e=t.composedPath?!t.composedPath().includes(this.menuInnerEl):false;if(e){t.preventDefault();t.stopPropagation();this.close()}}};t.prototype.onKeydown=function(t){if(t.key==="Escape"){this.close()}};t.prototype.isOpen=function(){return Promise.resolve(this._isOpen)};t.prototype.isActive=function(){return Promise.resolve(this._isActive())};t.prototype.open=function(t){if(t===void 0){t=true}return this.setOpen(true,t)};t.prototype.close=function(t){if(t===void 0){t=true}return this.setOpen(false,t)};t.prototype.toggle=function(t){if(t===void 0){t=true}return this.setOpen(!this._isOpen,t)};t.prototype.setOpen=function(t,e){if(e===void 0){e=true}return menuController._setOpen(this,t,e)};t.prototype.focusFirstDescendant=function(){var t=this.el;var e=t.querySelector(focusableQueryString);if(e){e.focus()}else{t.focus()}};t.prototype.focusLastDescendant=function(){var t=this.el;var e=Array.from(t.querySelectorAll(focusableQueryString));var n=e.length>0?e[e.length-1]:null;if(n){n.focus()}else{t.focus()}};t.prototype.trapKeyboardFocus=function(t,e){var n=t.target;if(!n){return}if(this.el.contains(n)){this.lastFocus=n}else{this.focusFirstDescendant();if(this.lastFocus===e.activeElement){this.focusLastDescendant()}}};t.prototype._setOpen=function(t,e){if(e===void 0){e=true}return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(n){switch(n.label){case 0:if(!this._isActive()||this.isAnimating||t===this._isOpen){return[2,false]}this.beforeAnimation(t);return[4,this.loadAnimation()];case 1:n.sent();return[4,this.startAnimation(t,e)];case 2:n.sent();if(this.operationCancelled){this.operationCancelled=false;return[2,false]}this.afterAnimation(t);return[2,true]}}))}))};t.prototype.loadAnimation=function(){return __awaiter(this,void 0,void 0,(function(){var t,e,n;return __generator(this,(function(i){switch(i.label){case 0:t=this.menuInnerEl.offsetWidth;e=isEndSide(this.side);if(t===this.width&&this.animation!==undefined&&e===this.isEndSide){return[2]}this.width=t;this.isEndSide=e;if(this.animation){this.animation.destroy();this.animation=undefined}n=this;return[4,menuController._createAnimation(this.type,this)];case 1:n.animation=i.sent();if(!config.getBoolean("animated",true)){this.animation.duration(0)}this.animation.fill("both");return[2]}}))}))};t.prototype.startAnimation=function(t,e){return __awaiter(this,void 0,void 0,(function(){var n,i,o,r,s;return __generator(this,(function(a){switch(a.label){case 0:n=!t;i=getIonMode(this);o=i==="ios"?iosEasing:mdEasing;r=i==="ios"?iosEasingReverse:mdEasingReverse;s=this.animation.direction(n?"reverse":"normal").easing(n?r:o);if(!e)return[3,2];return[4,s.play()];case 1:a.sent();return[3,3];case 2:s.play({sync:true});a.label=3;case 3:if(s.getDirection()==="reverse"){s.direction("normal")}return[2]}}))}))};t.prototype._isActive=function(){return!this.disabled&&!this.isPaneVisible};t.prototype.canSwipe=function(){return this.swipeGesture&&!this.isAnimating&&this._isActive()};t.prototype.canStart=function(t){var e=!!document.querySelector("ion-modal.show-modal");if(e||!this.canSwipe()){return false}if(this._isOpen){return true}else if(menuController._getOpenSync()){return false}return checkEdgeSide(window,t.currentX,this.isEndSide,this.maxEdgeStart)};t.prototype.onWillStart=function(){this.beforeAnimation(!this._isOpen);return this.loadAnimation()};t.prototype.onStart=function(){if(!this.isAnimating||!this.animation){assert(false,"isAnimating has to be true");return}this.animation.progressStart(true,this._isOpen?1:0)};t.prototype.onMove=function(t){if(!this.isAnimating||!this.animation){assert(false,"isAnimating has to be true");return}var e=computeDelta(t.deltaX,this._isOpen,this.isEndSide);var n=e/this.width;this.animation.progressStep(this._isOpen?1-n:n)};t.prototype.onEnd=function(t){var e=this;if(!this.isAnimating||!this.animation){assert(false,"isAnimating has to be true");return}var n=this._isOpen;var i=this.isEndSide;var o=computeDelta(t.deltaX,n,i);var r=this.width;var s=o/r;var a=t.velocityX;var u=r/2;var d=a>=0&&(a>.2||t.deltaX>u);var l=a<=0&&(a<-.2||t.deltaX<-u);var h=n?i?d:l:i?l:d;var c=!n&&h;if(n&&!h){c=true}this.lastOnEnd=t.currentTime;var p=h?.001:-.001;var m=s<0?.01:s;p+=getTimeGivenProgression([0,0],[.4,0],[.6,1],[1,1],clamp(0,m,.9999))[0]||0;var f=this._isOpen?!h:h;this.animation.easing("cubic-bezier(0.4, 0.0, 0.6, 1)").onFinish((function(){return e.afterAnimation(c)}),{oneTimeCallback:true}).progressEnd(f?1:0,this._isOpen?1-p:p,300)};t.prototype.beforeAnimation=function(t){assert(!this.isAnimating,"_before() should not be called while animating");this.el.classList.add(SHOW_MENU);this.el.setAttribute("tabindex","0");if(this.backdropEl){this.backdropEl.classList.add(SHOW_BACKDROP)}if(this.contentEl){this.contentEl.classList.add(MENU_CONTENT_OPEN);this.contentEl.setAttribute("aria-hidden","true")}this.blocker.block();this.isAnimating=true;if(t){this.ionWillOpen.emit()}else{this.ionWillClose.emit()}};t.prototype.afterAnimation=function(t){var e;this._isOpen=t;this.isAnimating=false;if(!this._isOpen){this.blocker.unblock()}if(t){this.ionDidOpen.emit();var n=(e=document.activeElement)===null||e===void 0?void 0:e.closest("ion-menu");if(n!==this.el){this.el.focus()}document.addEventListener("focus",this.handleFocus,true)}else{this.el.classList.remove(SHOW_MENU);this.el.removeAttribute("tabindex");if(this.contentEl){this.contentEl.classList.remove(MENU_CONTENT_OPEN);this.contentEl.removeAttribute("aria-hidden")}if(this.backdropEl){this.backdropEl.classList.remove(SHOW_BACKDROP)}if(this.animation){this.animation.stop()}this.ionDidClose.emit();document.removeEventListener("focus",this.handleFocus,true)}};t.prototype.updateState=function(){var t=this._isActive();if(this.gesture){this.gesture.enable(t&&this.swipeGesture)}if(!t){if(this.isAnimating){this.operationCancelled=true}this.afterAnimation(false)}if(doc===null||doc===void 0?void 0:doc.contains(this.el)){if(!this.disabled){menuController._setActiveMenu(this)}}};t.prototype.render=function(){var t;var e=this;var n=this,i=n.type,o=n.disabled,r=n.isPaneVisible,s=n.inheritedAttributes,a=n.side;var u=getIonMode(this);return h(Host,{role:"navigation","aria-label":s["aria-label"]||"menu",class:(t={},t[u]=true,t["menu-type-".concat(i)]=true,t["menu-enabled"]=!o,t["menu-side-".concat(a)]=true,t["menu-pane-visible"]=r,t)},h("div",{class:"menu-inner",part:"container",ref:function(t){return e.menuInnerEl=t}},h("slot",null)),h("ion-backdrop",{ref:function(t){return e.backdropEl=t},class:"menu-backdrop",tappable:false,stopPropagation:false,part:"backdrop"}))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{type:["typeChanged"],disabled:["disabledChanged"],side:["sideChanged"],swipeGesture:["swipeGestureChanged"]}},enumerable:false,configurable:true});return t}();var computeDelta=function(t,e,n){return Math.max(0,e!==n?-t:t)};var checkEdgeSide=function(t,e,n,i){if(n){return e>=t.innerWidth-i}else{return e<=i}};var SHOW_MENU="show-menu";var SHOW_BACKDROP="show-backdrop";var MENU_CONTENT_OPEN="menu-content-open";Menu.style={ios:menuIosCss,md:menuMdCss};var updateVisibility=function(t){return __awaiter(void 0,void 0,void 0,(function(){var e,n;return __generator(this,(function(i){switch(i.label){case 0:return[4,menuController.get(t)];case 1:e=i.sent();n=e;if(!n)return[3,3];return[4,e.isActive()];case 2:n=i.sent();i.label=3;case 3:return[2,!!n]}}))}))};var menuButtonIosCss=':host{--background:transparent;--color-focused:currentColor;--border-radius:initial;--padding-top:0;--padding-bottom:0;color:var(--color);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}ion-icon{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;pointer-events:none}:host(.menu-button-hidden){display:none}:host(.menu-button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity, 0)}}:host(.ion-color) .button-native{color:var(--ion-color-base)}:host(.in-toolbar:not(.in-toolbar-color)){color:var(--ion-toolbar-color, var(--color))}:host{--background-focused:currentColor;--background-focused-opacity:.1;--border-radius:4px;--color:var(--ion-color-primary, #3880ff);--padding-start:5px;--padding-end:5px;height:32px;font-size:31px}:host(.ion-activated){opacity:0.4}@media (any-hover: hover){:host(:hover){opacity:0.6}}';var menuButtonMdCss=':host{--background:transparent;--color-focused:currentColor;--border-radius:initial;--padding-top:0;--padding-bottom:0;color:var(--color);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}ion-icon{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;pointer-events:none}:host(.menu-button-hidden){display:none}:host(.menu-button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity, 0)}}:host(.ion-color) .button-native{color:var(--ion-color-base)}:host(.in-toolbar:not(.in-toolbar-color)){color:var(--ion-toolbar-color, var(--color))}:host{--background-focused:currentColor;--background-focused-opacity:.12;--background-hover:currentColor;--background-hover-opacity:.04;--border-radius:50%;--color:initial;--padding-start:8px;--padding-end:8px;width:48px;height:48px;font-size:24px}:host(.ion-color.ion-focused)::after{background:var(--ion-color-base)}@media (any-hover: hover){:host(.ion-color:hover) .button-native::after{background:var(--ion-color-base)}}';var MenuButton=function(){function t(t){var e=this;registerInstance(this,t);this.inheritedAttributes={};this.onClick=function(){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(t){return[2,menuController.toggle(this.menu)]}))}))};this.visible=false;this.color=undefined;this.disabled=false;this.menu=undefined;this.autoHide=true;this.type="button"}t.prototype.componentWillLoad=function(){this.inheritedAttributes=inheritAriaAttributes(this.el)};t.prototype.componentDidLoad=function(){this.visibilityChanged()};t.prototype.visibilityChanged=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:t=this;return[4,updateVisibility(this.menu)];case 1:t.visible=e.sent();return[2]}}))}))};t.prototype.render=function(){var t;var e=this,n=e.color,i=e.disabled,o=e.inheritedAttributes;var r=getIonMode(this);var s=config.get("menuIcon",r==="ios"?menuOutline:menuSharp);var a=this.autoHide&&!this.visible;var u={type:this.type};var d=o["aria-label"]||"menu";return h(Host,{onClick:this.onClick,"aria-disabled":i?"true":null,"aria-hidden":a?"true":null,class:createColorClasses(n,(t={},t[r]=true,t.button=true,t["menu-button-hidden"]=a,t["menu-button-disabled"]=i,t["in-toolbar"]=hostContext("ion-toolbar",this.el),t["in-toolbar-color"]=hostContext("ion-toolbar[color]",this.el),t["ion-activatable"]=true,t["ion-focusable"]=true,t))},h("button",Object.assign({},u,{disabled:i,class:"button-native",part:"native","aria-label":d}),h("span",{class:"button-inner"},h("slot",null,h("ion-icon",{part:"icon",icon:s,mode:r,lazy:false,"aria-hidden":"true"}))),r==="md"&&h("ion-ripple-effect",{type:"unbounded"})))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();MenuButton.style={ios:menuButtonIosCss,md:menuButtonMdCss};var menuToggleCss=":host(.menu-toggle-hidden){display:none}";var MenuToggle=function(){function t(t){var e=this;registerInstance(this,t);this.onClick=function(){return menuController.toggle(e.menu)};this.visible=false;this.menu=undefined;this.autoHide=true}t.prototype.connectedCallback=function(){this.visibilityChanged()};t.prototype.visibilityChanged=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(e){switch(e.label){case 0:t=this;return[4,updateVisibility(this.menu)];case 1:t.visible=e.sent();return[2]}}))}))};t.prototype.render=function(){var t;var e=getIonMode(this);var n=this.autoHide&&!this.visible;return h(Host,{onClick:this.onClick,"aria-hidden":n?"true":null,class:(t={},t[e]=true,t["menu-toggle-hidden"]=n,t)},h("slot",null))};return t}();MenuToggle.style=menuToggleCss;export{Menu as ion_menu,MenuButton as ion_menu_button,MenuToggle as ion_menu_toggle};
|