@ionic/core 8.7.16-dev.11767111768.1552e96d → 8.7.16-dev.11767365495.141917e9
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/modal.js +131 -11
- package/components/popover.js +60 -10
- package/dist/cjs/ion-modal.cjs.entry.js +131 -11
- package/dist/cjs/ion-popover.cjs.entry.js +60 -10
- package/dist/collection/components/modal/gestures/sheet.js +3 -1
- package/dist/collection/components/modal/gestures/swipe-to-close.js +3 -1
- package/dist/collection/components/modal/modal.ios.css +0 -4
- package/dist/collection/components/modal/modal.js +123 -7
- package/dist/collection/components/modal/modal.md.css +0 -4
- package/dist/collection/components/popover/animations/ios.enter.js +21 -5
- package/dist/collection/components/popover/animations/md.enter.js +20 -4
- package/dist/collection/components/popover/utils.js +19 -1
- package/dist/docs.json +1 -1
- package/dist/esm/ion-modal.entry.js +131 -11
- package/dist/esm/ion-popover.entry.js +60 -10
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-301ad219.entry.js +4 -0
- package/dist/ionic/p-71fa7adc.entry.js +4 -0
- package/dist/types/components/modal/gestures/sheet.d.ts +1 -1
- package/dist/types/components/modal/gestures/swipe-to-close.d.ts +1 -1
- package/dist/types/components/modal/modal.d.ts +24 -0
- package/dist/types/components/popover/utils.d.ts +2 -0
- package/hydrate/index.js +191 -21
- package/hydrate/index.mjs +191 -21
- package/package.json +1 -1
- package/dist/ionic/p-b28af559.entry.js +0 -4
- package/dist/ionic/p-f9061316.entry.js +0 -4
package/hydrate/index.mjs
CHANGED
|
@@ -21531,7 +21531,7 @@ const calculateSpringStep = (t) => {
|
|
|
21531
21531
|
const SwipeToCloseDefaults = {
|
|
21532
21532
|
MIN_PRESENTING_SCALE: 0.915,
|
|
21533
21533
|
};
|
|
21534
|
-
const createSwipeToCloseGesture = (el, animation, statusBarStyle, onDismiss) => {
|
|
21534
|
+
const createSwipeToCloseGesture = (el, animation, statusBarStyle, onDismiss, onGestureMove) => {
|
|
21535
21535
|
/**
|
|
21536
21536
|
* The step value at which a card modal
|
|
21537
21537
|
* is eligible for dismissing via gesture.
|
|
@@ -21688,6 +21688,8 @@ const createSwipeToCloseGesture = (el, animation, statusBarStyle, onDismiss) =>
|
|
|
21688
21688
|
const processedStep = isAttemptingDismissWithCanDismiss ? calculateSpringStep(step / maxStep) : step;
|
|
21689
21689
|
const clampedStep = clamp(0.0001, processedStep, maxStep);
|
|
21690
21690
|
animation.progressStep(clampedStep);
|
|
21691
|
+
// Notify modal of position change for safe-area updates
|
|
21692
|
+
onGestureMove === null || onGestureMove === void 0 ? void 0 : onGestureMove();
|
|
21691
21693
|
/**
|
|
21692
21694
|
* When swiping down half way, the status bar style
|
|
21693
21695
|
* should be reset to its default value.
|
|
@@ -22231,7 +22233,7 @@ const mdLeaveAnimation$2 = (baseEl, opts) => {
|
|
|
22231
22233
|
return baseAnimation;
|
|
22232
22234
|
};
|
|
22233
22235
|
|
|
22234
|
-
const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, backdropBreakpoint, animation, breakpoints = [], expandToScroll, getCurrentBreakpoint, onDismiss, onBreakpointChange) => {
|
|
22236
|
+
const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, backdropBreakpoint, animation, breakpoints = [], expandToScroll, getCurrentBreakpoint, onDismiss, onBreakpointChange, onGestureMove) => {
|
|
22235
22237
|
// Defaults for the sheet swipe animation
|
|
22236
22238
|
const defaultBackdrop = [
|
|
22237
22239
|
{ offset: 0, opacity: 'var(--backdrop-opacity)' },
|
|
@@ -22562,6 +22564,8 @@ const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, ba
|
|
|
22562
22564
|
: step;
|
|
22563
22565
|
offset = clamp(0.0001, processedStep, maxStep);
|
|
22564
22566
|
animation.progressStep(offset);
|
|
22567
|
+
// Notify modal of position change for safe-area updates
|
|
22568
|
+
onGestureMove === null || onGestureMove === void 0 ? void 0 : onGestureMove();
|
|
22565
22569
|
};
|
|
22566
22570
|
const onEnd = (detail) => {
|
|
22567
22571
|
/**
|
|
@@ -22756,9 +22760,9 @@ const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, ba
|
|
|
22756
22760
|
};
|
|
22757
22761
|
};
|
|
22758
22762
|
|
|
22759
|
-
const modalIosCss = ":host{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);contain:strict}.modal-wrapper,ion-backdrop{pointer-events:auto}:host(.overlay-hidden){display:none}.modal-wrapper,.modal-shadow{border-radius:var(--border-radius);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);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--width:600px;--height:500px
|
|
22763
|
+
const modalIosCss = ":host{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);contain:strict}.modal-wrapper,ion-backdrop{pointer-events:auto}:host(.overlay-hidden){display:none}.modal-wrapper,.modal-shadow{border-radius:var(--border-radius);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);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--width:600px;--height:500px}}@media only screen and (min-width: 768px) and (min-height: 768px){:host{--width:600px;--height:600px}}.modal-handle{left:0px;right:0px;top:5px;border-radius:8px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;position:absolute;width:36px;height:5px;-webkit-transform:translateZ(0);transform:translateZ(0);border:0;background:var(--ion-color-step-350, var(--ion-background-color-step-350, #c0c0be));cursor:pointer;z-index:11}.modal-handle::before{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;position:absolute;width:36px;height:5px;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);content:\"\"}:host(.modal-sheet){--height:calc(100% - (var(--ion-safe-area-top) + 10px))}:host(.modal-sheet) .modal-wrapper,:host(.modal-sheet) .modal-shadow{position:absolute;bottom:0}:host(.modal-sheet.modal-no-expand-scroll) ion-footer{position:absolute;bottom:0;width:var(--width)}:host{--backdrop-opacity:var(--ion-backdrop-opacity, 0.4)}:host(.modal-card),:host(.modal-sheet){--border-radius:10px}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--border-radius:10px}}.modal-wrapper{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0)}@media screen and (max-width: 767px){@supports (width: max(0px, 1px)){:host(.modal-card){--height:calc(100% - max(30px, var(--ion-safe-area-top)) - 10px)}}@supports not (width: max(0px, 1px)){:host(.modal-card){--height:calc(100% - 40px)}}:host(.modal-card) .modal-wrapper{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0;border-end-start-radius:0}:host(.modal-card){--backdrop-opacity:0;--width:100%;-ms-flex-align:end;align-items:flex-end}:host(.modal-card) .modal-shadow{display:none}:host(.modal-card) ion-backdrop{pointer-events:none}}@media screen and (min-width: 768px){:host(.modal-card){--width:calc(100% - 120px);--height:calc(100% - (120px + var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));--max-width:720px;--max-height:1000px;--backdrop-opacity:0;--box-shadow:0px 0px 30px 10px rgba(0, 0, 0, 0.1);-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out}:host(.modal-card) .modal-wrapper{-webkit-box-shadow:none;box-shadow:none}:host(.modal-card) .modal-shadow{-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}}:host(.modal-sheet) .modal-wrapper{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0;border-end-start-radius:0}";
|
|
22760
22764
|
|
|
22761
|
-
const modalMdCss = ":host{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);contain:strict}.modal-wrapper,ion-backdrop{pointer-events:auto}:host(.overlay-hidden){display:none}.modal-wrapper,.modal-shadow{border-radius:var(--border-radius);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);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--width:600px;--height:500px
|
|
22765
|
+
const modalMdCss = ":host{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);contain:strict}.modal-wrapper,ion-backdrop{pointer-events:auto}:host(.overlay-hidden){display:none}.modal-wrapper,.modal-shadow{border-radius:var(--border-radius);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);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--width:600px;--height:500px}}@media only screen and (min-width: 768px) and (min-height: 768px){:host{--width:600px;--height:600px}}.modal-handle{left:0px;right:0px;top:5px;border-radius:8px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;position:absolute;width:36px;height:5px;-webkit-transform:translateZ(0);transform:translateZ(0);border:0;background:var(--ion-color-step-350, var(--ion-background-color-step-350, #c0c0be));cursor:pointer;z-index:11}.modal-handle::before{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;position:absolute;width:36px;height:5px;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);content:\"\"}:host(.modal-sheet){--height:calc(100% - (var(--ion-safe-area-top) + 10px))}:host(.modal-sheet) .modal-wrapper,:host(.modal-sheet) .modal-shadow{position:absolute;bottom:0}:host(.modal-sheet.modal-no-expand-scroll) ion-footer{position:absolute;bottom:0;width:var(--width)}:host{--backdrop-opacity:var(--ion-backdrop-opacity, 0.32)}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--border-radius:2px;--box-shadow:0 28px 48px rgba(0, 0, 0, 0.4)}}.modal-wrapper{-webkit-transform:translate3d(0, 40px, 0);transform:translate3d(0, 40px, 0);opacity:0.01}";
|
|
22762
22766
|
|
|
22763
22767
|
// TODO(FW-2832): types
|
|
22764
22768
|
/**
|
|
@@ -22791,6 +22795,8 @@ class Modal {
|
|
|
22791
22795
|
this.inline = false;
|
|
22792
22796
|
// Whether or not modal is being dismissed via gesture
|
|
22793
22797
|
this.gestureAnimationDismissing = false;
|
|
22798
|
+
// Whether to skip coordinate-based safe-area detection (for fullscreen phone modals)
|
|
22799
|
+
this.skipSafeAreaCoordinateDetection = false;
|
|
22794
22800
|
this.presented = false;
|
|
22795
22801
|
/** @internal */
|
|
22796
22802
|
this.hasController = false;
|
|
@@ -22981,7 +22987,9 @@ class Modal {
|
|
|
22981
22987
|
}
|
|
22982
22988
|
}
|
|
22983
22989
|
onWindowResize() {
|
|
22984
|
-
//
|
|
22990
|
+
// Update safe-area overrides for all modal types on resize
|
|
22991
|
+
this.updateSafeAreaOverrides();
|
|
22992
|
+
// Only handle view transition for iOS card modals when no custom animations are provided
|
|
22985
22993
|
if (getIonMode$1(this) !== 'ios' || !this.presentingElement || this.enterAnimation || this.leaveAnimation) {
|
|
22986
22994
|
return;
|
|
22987
22995
|
}
|
|
@@ -23163,6 +23171,8 @@ class Modal {
|
|
|
23163
23171
|
else if (!this.keepContentsMounted) {
|
|
23164
23172
|
await waitForMount();
|
|
23165
23173
|
}
|
|
23174
|
+
// Predict safe-area needs based on modal configuration to avoid visual snap
|
|
23175
|
+
this.setInitialSafeAreaOverrides(presentingElement);
|
|
23166
23176
|
writeTask(() => this.el.classList.add('show-modal'));
|
|
23167
23177
|
const hasCardModal = presentingElement !== undefined;
|
|
23168
23178
|
/**
|
|
@@ -23224,6 +23234,8 @@ class Modal {
|
|
|
23224
23234
|
else if (hasCardModal) {
|
|
23225
23235
|
this.initSwipeToClose();
|
|
23226
23236
|
}
|
|
23237
|
+
// Now that animation is complete, update safe-area based on actual position
|
|
23238
|
+
this.updateSafeAreaOverrides();
|
|
23227
23239
|
// Initialize view transition listener for iOS card modals
|
|
23228
23240
|
this.initViewTransitionListener();
|
|
23229
23241
|
// Initialize parent removal observer
|
|
@@ -23275,7 +23287,7 @@ class Modal {
|
|
|
23275
23287
|
await this.dismiss(undefined, GESTURE);
|
|
23276
23288
|
this.gestureAnimationDismissing = false;
|
|
23277
23289
|
});
|
|
23278
|
-
});
|
|
23290
|
+
}, () => this.updateSafeAreaOverrides());
|
|
23279
23291
|
this.gesture.enable(true);
|
|
23280
23292
|
}
|
|
23281
23293
|
initSheetGesture() {
|
|
@@ -23296,7 +23308,8 @@ class Modal {
|
|
|
23296
23308
|
this.currentBreakpoint = breakpoint;
|
|
23297
23309
|
this.ionBreakpointDidChange.emit({ breakpoint });
|
|
23298
23310
|
}
|
|
23299
|
-
|
|
23311
|
+
this.updateSafeAreaOverrides();
|
|
23312
|
+
}, () => this.updateSafeAreaOverrides());
|
|
23300
23313
|
this.gesture = gesture;
|
|
23301
23314
|
this.moveSheetToBreakpoint = moveSheetToBreakpoint;
|
|
23302
23315
|
this.gesture.enable(true);
|
|
@@ -23374,6 +23387,107 @@ class Modal {
|
|
|
23374
23387
|
// Clear the cached reference
|
|
23375
23388
|
this.cachedPageParent = undefined;
|
|
23376
23389
|
}
|
|
23390
|
+
/**
|
|
23391
|
+
* Sets initial safe-area overrides based on modal configuration before
|
|
23392
|
+
* the modal becomes visible. This predicts whether the modal will touch
|
|
23393
|
+
* screen edges to avoid a visual snap after animation completes.
|
|
23394
|
+
*/
|
|
23395
|
+
setInitialSafeAreaOverrides(presentingElement) {
|
|
23396
|
+
const style = this.el.style;
|
|
23397
|
+
const isSheetModal = this.breakpoints !== undefined && this.initialBreakpoint !== undefined;
|
|
23398
|
+
const isCardModal = presentingElement !== undefined;
|
|
23399
|
+
const isTablet = window.innerWidth >= 768;
|
|
23400
|
+
// Sheet modals always touch bottom edge, never top/left/right
|
|
23401
|
+
if (isSheetModal) {
|
|
23402
|
+
style.setProperty('--ion-safe-area-top', '0px');
|
|
23403
|
+
style.setProperty('--ion-safe-area-left', '0px');
|
|
23404
|
+
style.setProperty('--ion-safe-area-right', '0px');
|
|
23405
|
+
return;
|
|
23406
|
+
}
|
|
23407
|
+
// Card modals have rounded top corners
|
|
23408
|
+
if (isCardModal) {
|
|
23409
|
+
style.setProperty('--ion-safe-area-top', '0px');
|
|
23410
|
+
if (isTablet) {
|
|
23411
|
+
// On tablets, card modals are inset from all edges
|
|
23412
|
+
this.zeroAllSafeAreas();
|
|
23413
|
+
}
|
|
23414
|
+
else {
|
|
23415
|
+
// On phones, card modals still extend to the bottom edge
|
|
23416
|
+
style.setProperty('--ion-safe-area-left', '0px');
|
|
23417
|
+
style.setProperty('--ion-safe-area-right', '0px');
|
|
23418
|
+
this.applyFullscreenSafeArea();
|
|
23419
|
+
}
|
|
23420
|
+
return;
|
|
23421
|
+
}
|
|
23422
|
+
// Phone-sized fullscreen modals inherit safe areas and use wrapper padding
|
|
23423
|
+
if (!isTablet) {
|
|
23424
|
+
this.applyFullscreenSafeArea();
|
|
23425
|
+
return;
|
|
23426
|
+
}
|
|
23427
|
+
// Check if tablet modal is fullscreen via CSS custom properties
|
|
23428
|
+
const computedStyle = getComputedStyle(this.el);
|
|
23429
|
+
const width = computedStyle.getPropertyValue('--width').trim();
|
|
23430
|
+
const height = computedStyle.getPropertyValue('--height').trim();
|
|
23431
|
+
const isFullscreen = width === '100%' && height === '100%';
|
|
23432
|
+
if (isFullscreen) {
|
|
23433
|
+
this.applyFullscreenSafeArea();
|
|
23434
|
+
}
|
|
23435
|
+
else {
|
|
23436
|
+
// Centered dialog doesn't touch edges
|
|
23437
|
+
this.zeroAllSafeAreas();
|
|
23438
|
+
}
|
|
23439
|
+
}
|
|
23440
|
+
/**
|
|
23441
|
+
* Applies safe-area handling for fullscreen modals.
|
|
23442
|
+
* Adds wrapper padding when no footer is present to prevent
|
|
23443
|
+
* content from overlapping system navigation areas.
|
|
23444
|
+
*/
|
|
23445
|
+
applyFullscreenSafeArea() {
|
|
23446
|
+
this.skipSafeAreaCoordinateDetection = true;
|
|
23447
|
+
const hasFooter = this.el.querySelector('ion-footer') !== null;
|
|
23448
|
+
if (!hasFooter && this.wrapperEl) {
|
|
23449
|
+
this.wrapperEl.style.setProperty('padding-bottom', 'var(--ion-safe-area-bottom, 0px)');
|
|
23450
|
+
this.wrapperEl.style.setProperty('box-sizing', 'border-box');
|
|
23451
|
+
}
|
|
23452
|
+
}
|
|
23453
|
+
/**
|
|
23454
|
+
* Sets all safe-area CSS variables to 0px for modals that
|
|
23455
|
+
* don't touch screen edges.
|
|
23456
|
+
*/
|
|
23457
|
+
zeroAllSafeAreas() {
|
|
23458
|
+
const style = this.el.style;
|
|
23459
|
+
style.setProperty('--ion-safe-area-top', '0px');
|
|
23460
|
+
style.setProperty('--ion-safe-area-bottom', '0px');
|
|
23461
|
+
style.setProperty('--ion-safe-area-left', '0px');
|
|
23462
|
+
style.setProperty('--ion-safe-area-right', '0px');
|
|
23463
|
+
}
|
|
23464
|
+
/**
|
|
23465
|
+
* Updates safe-area CSS variable overrides based on whether the modal
|
|
23466
|
+
* is touching each edge of the viewport. Called after animation
|
|
23467
|
+
* and during gestures to handle dynamic position changes.
|
|
23468
|
+
*/
|
|
23469
|
+
updateSafeAreaOverrides() {
|
|
23470
|
+
if (this.skipSafeAreaCoordinateDetection) {
|
|
23471
|
+
return;
|
|
23472
|
+
}
|
|
23473
|
+
const wrapper = this.wrapperEl;
|
|
23474
|
+
if (!wrapper) {
|
|
23475
|
+
return;
|
|
23476
|
+
}
|
|
23477
|
+
const rect = wrapper.getBoundingClientRect();
|
|
23478
|
+
const threshold = 2;
|
|
23479
|
+
const touchingTop = rect.top <= threshold;
|
|
23480
|
+
const touchingBottom = rect.bottom >= window.innerHeight - threshold;
|
|
23481
|
+
const touchingLeft = rect.left <= threshold;
|
|
23482
|
+
const touchingRight = rect.right >= window.innerWidth - threshold;
|
|
23483
|
+
const style = this.el.style;
|
|
23484
|
+
touchingTop ? style.removeProperty('--ion-safe-area-top') : style.setProperty('--ion-safe-area-top', '0px');
|
|
23485
|
+
touchingBottom
|
|
23486
|
+
? style.removeProperty('--ion-safe-area-bottom')
|
|
23487
|
+
: style.setProperty('--ion-safe-area-bottom', '0px');
|
|
23488
|
+
touchingLeft ? style.removeProperty('--ion-safe-area-left') : style.setProperty('--ion-safe-area-left', '0px');
|
|
23489
|
+
touchingRight ? style.removeProperty('--ion-safe-area-right') : style.setProperty('--ion-safe-area-right', '0px');
|
|
23490
|
+
}
|
|
23377
23491
|
sheetOnDismiss() {
|
|
23378
23492
|
/**
|
|
23379
23493
|
* While the gesture animation is finishing
|
|
@@ -23466,6 +23580,8 @@ class Modal {
|
|
|
23466
23580
|
}
|
|
23467
23581
|
this.currentBreakpoint = undefined;
|
|
23468
23582
|
this.animation = undefined;
|
|
23583
|
+
// Reset safe-area detection flag for potential re-presentation
|
|
23584
|
+
this.skipSafeAreaCoordinateDetection = false;
|
|
23469
23585
|
unlock();
|
|
23470
23586
|
return dismissed;
|
|
23471
23587
|
}
|
|
@@ -23547,6 +23663,10 @@ class Modal {
|
|
|
23547
23663
|
this.currentViewIsPortrait = window.innerWidth < 768;
|
|
23548
23664
|
}
|
|
23549
23665
|
handleViewTransition() {
|
|
23666
|
+
// Only run view transitions when the modal is presented
|
|
23667
|
+
if (!this.presented) {
|
|
23668
|
+
return;
|
|
23669
|
+
}
|
|
23550
23670
|
const isPortrait = window.innerWidth < 768;
|
|
23551
23671
|
// Only transition if view state actually changed
|
|
23552
23672
|
if (this.currentViewIsPortrait === isPortrait) {
|
|
@@ -23711,20 +23831,20 @@ class Modal {
|
|
|
23711
23831
|
const isCardModal = presentingElement !== undefined && mode === 'ios';
|
|
23712
23832
|
const isHandleCycle = handleBehavior === 'cycle';
|
|
23713
23833
|
const isSheetModalWithHandle = isSheetModal && showHandle;
|
|
23714
|
-
return (hAsync(Host, Object.assign({ key: '
|
|
23834
|
+
return (hAsync(Host, Object.assign({ key: '6642b8a32dad449f26ac4ed60814d69afc97bf30', "no-router": true,
|
|
23715
23835
|
// Allow the modal to be navigable when the handle is focusable
|
|
23716
23836
|
tabIndex: isHandleCycle && isSheetModalWithHandle ? 0 : -1 }, htmlAttributes, { style: {
|
|
23717
23837
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
23718
|
-
}, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, [`modal-no-expand-scroll`]: isSheetModal && !expandToScroll, 'overlay-hidden': true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle, onFocus: this.onModalFocus }), hAsync("ion-backdrop", { key: '
|
|
23838
|
+
}, class: Object.assign({ [mode]: true, ['modal-default']: !isCardModal && !isSheetModal, [`modal-card`]: isCardModal, [`modal-sheet`]: isSheetModal, [`modal-no-expand-scroll`]: isSheetModal && !expandToScroll, 'overlay-hidden': true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle, onFocus: this.onModalFocus }), hAsync("ion-backdrop", { key: '8adf79ea72c0f622190ff366980621067c35795b', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: '34f14fcd4970c04aee3b7a5305f9f220ff377f37', class: "modal-shadow" }), hAsync("div", Object.assign({ key: 'a3a8e3df6a1cfe061bbd99503655015ca8cd416d',
|
|
23719
23839
|
/*
|
|
23720
23840
|
role and aria-modal must be used on the
|
|
23721
23841
|
same element. They must also be set inside the
|
|
23722
23842
|
shadow DOM otherwise ion-button will not be highlighted
|
|
23723
23843
|
when using VoiceOver: https://bugs.webkit.org/show_bug.cgi?id=247134
|
|
23724
23844
|
*/
|
|
23725
|
-
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: '
|
|
23845
|
+
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: 'a4ad2f6def8c20a36a9731553dfa5a98392151ef', class: "modal-handle",
|
|
23726
23846
|
// Prevents the handle from receiving keyboard focus when it does not cycle
|
|
23727
|
-
tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle", ref: (el) => (this.dragHandleEl = el) })), hAsync("slot", { key: '
|
|
23847
|
+
tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle", ref: (el) => (this.dragHandleEl = el) })), hAsync("slot", { key: '46fb6d94814dae4a9bcdf99387d57a17c6a6a95c', onSlotchange: this.onSlotChange }))));
|
|
23728
23848
|
}
|
|
23729
23849
|
get el() { return getElement(this); }
|
|
23730
23850
|
static get watchers() { return {
|
|
@@ -27302,6 +27422,8 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
|
|
|
27302
27422
|
let bottom;
|
|
27303
27423
|
let originX = contentOriginX;
|
|
27304
27424
|
let originY = contentOriginY;
|
|
27425
|
+
let checkSafeAreaTop = false;
|
|
27426
|
+
let checkSafeAreaBottom = false;
|
|
27305
27427
|
let checkSafeAreaLeft = false;
|
|
27306
27428
|
let checkSafeAreaRight = false;
|
|
27307
27429
|
const triggerTop = triggerCoordinates
|
|
@@ -27346,10 +27468,18 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
|
|
|
27346
27468
|
* We chose 12 here so that the popover position looks a bit nicer as
|
|
27347
27469
|
* it is not right up against the edge of the screen.
|
|
27348
27470
|
*/
|
|
27349
|
-
top = Math.max(
|
|
27471
|
+
top = Math.max(bodyPadding, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
|
|
27350
27472
|
arrowTop = top + contentHeight;
|
|
27351
27473
|
originY = 'bottom';
|
|
27352
27474
|
addPopoverBottomClass = true;
|
|
27475
|
+
/**
|
|
27476
|
+
* If the popover is positioned near the top edge, account for safe area.
|
|
27477
|
+
* This ensures the popover doesn't overlap with status bars or notches.
|
|
27478
|
+
*/
|
|
27479
|
+
if (top <= bodyPadding + safeAreaMargin) {
|
|
27480
|
+
checkSafeAreaTop = true;
|
|
27481
|
+
top = bodyPadding;
|
|
27482
|
+
}
|
|
27353
27483
|
/**
|
|
27354
27484
|
* If not enough room for popover to appear
|
|
27355
27485
|
* above trigger, then cut it off.
|
|
@@ -27357,6 +27487,12 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
|
|
|
27357
27487
|
}
|
|
27358
27488
|
else {
|
|
27359
27489
|
bottom = bodyPadding;
|
|
27490
|
+
/**
|
|
27491
|
+
* When the popover is pinned to the bottom, account for safe area.
|
|
27492
|
+
* This ensures the popover doesn't overlap with home indicators
|
|
27493
|
+
* or navigation bars (e.g., Android API 36+ edge-to-edge).
|
|
27494
|
+
*/
|
|
27495
|
+
checkSafeAreaBottom = true;
|
|
27360
27496
|
}
|
|
27361
27497
|
}
|
|
27362
27498
|
return {
|
|
@@ -27365,6 +27501,8 @@ const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding, bodyW
|
|
|
27365
27501
|
bottom,
|
|
27366
27502
|
originX,
|
|
27367
27503
|
originY,
|
|
27504
|
+
checkSafeAreaTop,
|
|
27505
|
+
checkSafeAreaBottom,
|
|
27368
27506
|
checkSafeAreaLeft,
|
|
27369
27507
|
checkSafeAreaRight,
|
|
27370
27508
|
arrowTop,
|
|
@@ -27425,7 +27563,7 @@ const iosEnterAnimation$1 = (baseEl, opts) => {
|
|
|
27425
27563
|
const results = getPopoverPosition(isRTL, contentWidth, contentHeight, arrowWidth, arrowHeight, reference, side, align, defaultPosition, trigger, ev);
|
|
27426
27564
|
const padding = size === 'cover' ? 0 : POPOVER_IOS_BODY_PADDING;
|
|
27427
27565
|
const margin = size === 'cover' ? 0 : 25;
|
|
27428
|
-
const { originX, originY, top, left, bottom, checkSafeAreaLeft, checkSafeAreaRight, arrowTop, arrowLeft, addPopoverBottomClass, } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, margin, results.originX, results.originY, results.referenceCoordinates, results.arrowTop, results.arrowLeft, arrowHeight);
|
|
27566
|
+
const { originX, originY, top, left, bottom, checkSafeAreaTop, checkSafeAreaBottom, checkSafeAreaLeft, checkSafeAreaRight, arrowTop, arrowLeft, addPopoverBottomClass, } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, margin, results.originX, results.originY, results.referenceCoordinates, results.arrowTop, results.arrowLeft, arrowHeight);
|
|
27429
27567
|
const baseAnimation = createAnimation();
|
|
27430
27568
|
const backdropAnimation = createAnimation();
|
|
27431
27569
|
const contentAnimation = createAnimation();
|
|
@@ -27455,19 +27593,35 @@ const iosEnterAnimation$1 = (baseEl, opts) => {
|
|
|
27455
27593
|
if (addPopoverBottomClass) {
|
|
27456
27594
|
baseEl.classList.add('popover-bottom');
|
|
27457
27595
|
}
|
|
27458
|
-
|
|
27459
|
-
|
|
27460
|
-
|
|
27596
|
+
/**
|
|
27597
|
+
* Safe area CSS variable adjustments.
|
|
27598
|
+
* When the popover is positioned near an edge, we add the corresponding
|
|
27599
|
+
* safe-area inset to ensure the popover doesn't overlap with system UI
|
|
27600
|
+
* (status bars, home indicators, navigation bars on Android API 36+, etc.)
|
|
27601
|
+
*/
|
|
27602
|
+
const safeAreaTop = ' + var(--ion-safe-area-top, 0)';
|
|
27603
|
+
const safeAreaBottom = ' + var(--ion-safe-area-bottom, 0)';
|
|
27461
27604
|
const safeAreaLeft = ' + var(--ion-safe-area-left, 0)';
|
|
27462
27605
|
const safeAreaRight = ' - var(--ion-safe-area-right, 0)';
|
|
27606
|
+
let topValue = `${top}px`;
|
|
27607
|
+
let bottomValue = bottom !== undefined ? `${bottom}px` : undefined;
|
|
27463
27608
|
let leftValue = `${left}px`;
|
|
27609
|
+
if (checkSafeAreaTop) {
|
|
27610
|
+
topValue = `${top}px${safeAreaTop}`;
|
|
27611
|
+
}
|
|
27612
|
+
if (checkSafeAreaBottom && bottomValue !== undefined) {
|
|
27613
|
+
bottomValue = `${bottom}px${safeAreaBottom}`;
|
|
27614
|
+
}
|
|
27464
27615
|
if (checkSafeAreaLeft) {
|
|
27465
27616
|
leftValue = `${left}px${safeAreaLeft}`;
|
|
27466
27617
|
}
|
|
27467
27618
|
if (checkSafeAreaRight) {
|
|
27468
27619
|
leftValue = `${left}px${safeAreaRight}`;
|
|
27469
27620
|
}
|
|
27470
|
-
|
|
27621
|
+
if (bottomValue !== undefined) {
|
|
27622
|
+
contentEl.style.setProperty('bottom', `calc(${bottomValue})`);
|
|
27623
|
+
}
|
|
27624
|
+
contentEl.style.setProperty('top', `calc(${topValue} + var(--offset-y, 0))`);
|
|
27471
27625
|
contentEl.style.setProperty('left', `calc(${leftValue} + var(--offset-x, 0))`);
|
|
27472
27626
|
contentEl.style.setProperty('transform-origin', `${originY} ${originX}`);
|
|
27473
27627
|
if (arrowEl !== null) {
|
|
@@ -27543,7 +27697,23 @@ const mdEnterAnimation$1 = (baseEl, opts) => {
|
|
|
27543
27697
|
};
|
|
27544
27698
|
const results = getPopoverPosition(isRTL, contentWidth, contentHeight, 0, 0, reference, side, align, defaultPosition, trigger, ev);
|
|
27545
27699
|
const padding = size === 'cover' ? 0 : POPOVER_MD_BODY_PADDING;
|
|
27546
|
-
const { originX, originY, top, left, bottom } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, 0, results.originX, results.originY, results.referenceCoordinates);
|
|
27700
|
+
const { originX, originY, top, left, bottom, checkSafeAreaTop, checkSafeAreaBottom } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, 0, results.originX, results.originY, results.referenceCoordinates);
|
|
27701
|
+
/**
|
|
27702
|
+
* Safe area CSS variable adjustments.
|
|
27703
|
+
* When the popover is positioned near an edge, we add the corresponding
|
|
27704
|
+
* safe-area inset to ensure the popover doesn't overlap with system UI
|
|
27705
|
+
* (status bars, home indicators, navigation bars on Android API 36+, etc.)
|
|
27706
|
+
*/
|
|
27707
|
+
const safeAreaTop = ' + var(--ion-safe-area-top, 0)';
|
|
27708
|
+
const safeAreaBottom = ' + var(--ion-safe-area-bottom, 0)';
|
|
27709
|
+
let topValue = `${top}px`;
|
|
27710
|
+
let bottomValue = bottom !== undefined ? `${bottom}px` : undefined;
|
|
27711
|
+
if (checkSafeAreaTop) {
|
|
27712
|
+
topValue = `${top}px${safeAreaTop}`;
|
|
27713
|
+
}
|
|
27714
|
+
if (checkSafeAreaBottom && bottomValue !== undefined) {
|
|
27715
|
+
bottomValue = `${bottom}px${safeAreaBottom}`;
|
|
27716
|
+
}
|
|
27547
27717
|
const baseAnimation = createAnimation();
|
|
27548
27718
|
const backdropAnimation = createAnimation();
|
|
27549
27719
|
const wrapperAnimation = createAnimation();
|
|
@@ -27560,13 +27730,13 @@ const mdEnterAnimation$1 = (baseEl, opts) => {
|
|
|
27560
27730
|
contentAnimation
|
|
27561
27731
|
.addElement(contentEl)
|
|
27562
27732
|
.beforeStyles({
|
|
27563
|
-
top: `calc(${
|
|
27733
|
+
top: `calc(${topValue} + var(--offset-y, 0px))`,
|
|
27564
27734
|
left: `calc(${left}px + var(--offset-x, 0px))`,
|
|
27565
27735
|
'transform-origin': `${originY} ${originX}`,
|
|
27566
27736
|
})
|
|
27567
27737
|
.beforeAddWrite(() => {
|
|
27568
|
-
if (
|
|
27569
|
-
contentEl.style.setProperty('bottom',
|
|
27738
|
+
if (bottomValue !== undefined) {
|
|
27739
|
+
contentEl.style.setProperty('bottom', `calc(${bottomValue})`);
|
|
27570
27740
|
}
|
|
27571
27741
|
})
|
|
27572
27742
|
.fromTo('transform', 'scale(0.8)', 'scale(1)');
|
package/package.json
CHANGED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
-
*/
|
|
4
|
-
import{r as t,c as o,f as i,w as a,e,h as r,d as s,g as n}from"./p-C8IsBmNU.js";import{f as d,i as h,d as l,r as p,a as c,p as m}from"./p-CwgG81ZD.js";import{C as f,a as u,d as b}from"./p-D-eFFUkA.js";import{e as v,g as x,r as w,b as g,h as k}from"./p-CTfR9YZG.js";import{c as y}from"./p-B-hirT0v.js";import{g as A}from"./p-CIGNaXM1.js";import{G as Y,O as D,F as E,e as B,B as T,j as O,k as S,f as C,g as M,h as P}from"./p-DdR6rpbR.js";import{g as j}from"./p-DiVJyqlX.js";import{e as R,w as L}from"./p-DUt5fQmA.js";import{b as $}from"./p-BFvmZNyx.js";import{KEYBOARD_DID_OPEN as I}from"./p-9eeaBrnk.js";import{c as N}from"./p-DDb5r57F.js";import{g as z}from"./p-hHmYLOfE.js";import{createGesture as W}from"./p-Cl0B-RWe.js";import{w as F}from"./p-ZjP4CjeZ.js";import"./p-B0q1YL7N.js";import"./p-BTEOs1at.js";import"./p-D13Eaw-8.js";var H;!function(t){t.Dark="DARK",t.Light="LIGHT",t.Default="DEFAULT"}(H||(H={}));const Z={getEngine(){const t=A();if(null==t?void 0:t.isPluginAvailable("StatusBar"))return t.Plugins.StatusBar},setStyle(t){const o=this.getEngine();o&&o.setStyle(t)},getStyle:async function(){const t=this.getEngine();if(!t)return H.Default;const{style:o}=await t.getInfo();return o}},V=(t,o)=>{if(1===o)return 0;const i=1/(1-o);return t*i+-o*i},G=()=>{!F||F.innerWidth>=768||Z.setStyle({style:H.Dark})},U=(t=H.Default)=>{!F||F.innerWidth>=768||Z.setStyle({style:t})},K=async(t,o)=>{"function"==typeof t.canDismiss&&await t.canDismiss(void 0,Y)&&(o.isRunning()?o.onFinish((()=>{t.dismiss(void 0,"handler")}),{oneTimeCallback:!0}):t.dismiss(void 0,"handler"))},_=t=>.00255275*2.71828**(-14.9619*t)-1.00255*2.71828**(-.0380968*t)+1,q=.915,X=(t,o)=>v(400,t/Math.abs(1.1*o),500),J=t=>{const{currentBreakpoint:o,backdropBreakpoint:i,expandToScroll:a}=t,e=void 0===i||i<o,r=e?`calc(var(--backdrop-opacity) * ${o})`:"0",s=N("backdropAnimation").fromTo("opacity",0,r);return e&&s.beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),{wrapperAnimation:N("wrapperAnimation").keyframes([{offset:0,opacity:1,transform:"translateY(100%)"},{offset:1,opacity:1,transform:`translateY(${100-100*o}%)`}]),backdropAnimation:s,contentAnimation:a?void 0:N("contentAnimation").keyframes([{offset:0,opacity:1,maxHeight:100*(1-o)+"%"},{offset:1,opacity:1,maxHeight:100*o+"%"}])}},Q=t=>{const{currentBreakpoint:o,backdropBreakpoint:i}=t,a=`calc(var(--backdrop-opacity) * ${V(o,i)})`,e=[{offset:0,opacity:a},{offset:1,opacity:0}],r=[{offset:0,opacity:a},{offset:i,opacity:0},{offset:1,opacity:0}],s=N("backdropAnimation").keyframes(0!==i?r:e);return{wrapperAnimation:N("wrapperAnimation").keyframes([{offset:0,opacity:1,transform:`translateY(${100-100*o}%)`},{offset:1,opacity:1,transform:"translateY(100%)"}]),backdropAnimation:s}},tt=(t,o)=>{const{presentingEl:i,currentBreakpoint:a,expandToScroll:e}=o,r=x(t),{wrapperAnimation:s,backdropAnimation:n,contentAnimation:d}=void 0!==a?J(o):{backdropAnimation:N().fromTo("opacity",.01,"var(--backdrop-opacity)").beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),wrapperAnimation:N().fromTo("transform","translateY(100vh)","translateY(0vh)"),contentAnimation:void 0};n.addElement(r.querySelector("ion-backdrop")),s.addElement(r.querySelectorAll(".modal-wrapper, .modal-shadow")).beforeStyles({opacity:1}),!e&&(null==d||d.addElement(t.querySelector(".ion-page")));const h=N("entering-base").addElement(t).easing("cubic-bezier(0.32,0.72,0,1)").duration(500).addAnimation([s]);if(d&&h.addAnimation(d),i){const t=window.innerWidth<768,o="ION-MODAL"===i.tagName&&void 0!==i.presentingElement,a=x(i),e=N().beforeStyles({transform:"translateY(0)","transform-origin":"top center",overflow:"hidden"}),r=document.body;if(t){const t=CSS.supports("width","max(0px, 1px)")?"max(30px, var(--ion-safe-area-top))":"30px",a=`translateY(${o?"-10px":t}) scale(0.915)`;e.afterStyles({transform:a}).beforeAddWrite((()=>r.style.setProperty("background-color","black"))).addElement(i).keyframes([{offset:0,filter:"contrast(1)",transform:"translateY(0px) scale(1)",borderRadius:"0px"},{offset:1,filter:"contrast(0.85)",transform:a,borderRadius:"10px 10px 0 0"}]),h.addAnimation(e)}else if(h.addAnimation(n),o){const t=`translateY(-10px) scale(${o?q:1})`;e.afterStyles({transform:t}).addElement(a.querySelector(".modal-wrapper")).keyframes([{offset:0,filter:"contrast(1)",transform:"translateY(0) scale(1)"},{offset:1,filter:"contrast(0.85)",transform:t}]);const i=N().afterStyles({transform:t}).addElement(a.querySelector(".modal-shadow")).keyframes([{offset:0,opacity:"1",transform:"translateY(0) scale(1)"},{offset:1,opacity:"0",transform:t}]);h.addAnimation([e,i])}else s.fromTo("opacity","0","1")}else h.addAnimation(n);return h},ot=(t,o,i=500)=>{const{presentingEl:a,currentBreakpoint:e}=o,r=x(t),{wrapperAnimation:s,backdropAnimation:n}=void 0!==e?Q(o):{backdropAnimation:N().fromTo("opacity","var(--backdrop-opacity)",0),wrapperAnimation:N().fromTo("transform","translateY(0vh)","translateY(100vh)")};n.addElement(r.querySelector("ion-backdrop")),s.addElement(r.querySelectorAll(".modal-wrapper, .modal-shadow")).beforeStyles({opacity:1});const d=N("leaving-base").addElement(t).easing("cubic-bezier(0.32,0.72,0,1)").duration(i).addAnimation(s);if(a){const t=window.innerWidth<768,o="ION-MODAL"===a.tagName&&void 0!==a.presentingElement,i=x(a),e=N().beforeClearStyles(["transform"]).afterClearStyles(["transform"]).onFinish((t=>{1===t&&(a.style.setProperty("overflow",""),Array.from(r.querySelectorAll("ion-modal:not(.overlay-hidden)")).filter((t=>void 0!==t.presentingElement)).length<=1&&r.style.setProperty("background-color",""))})),r=document.body;if(t){const t=CSS.supports("width","max(0px, 1px)")?"max(30px, var(--ion-safe-area-top))":"30px",i=`translateY(${o?"-10px":t}) scale(0.915)`;e.addElement(a).keyframes([{offset:0,filter:"contrast(0.85)",transform:i,borderRadius:"10px 10px 0 0"},{offset:1,filter:"contrast(1)",transform:"translateY(0px) scale(1)",borderRadius:"0px"}]),d.addAnimation(e)}else if(d.addAnimation(n),o){const t=`translateY(-10px) scale(${o?q:1})`;e.addElement(i.querySelector(".modal-wrapper")).afterStyles({transform:"translate3d(0, 0, 0)"}).keyframes([{offset:0,filter:"contrast(0.85)",transform:t},{offset:1,filter:"contrast(1)",transform:"translateY(0) scale(1)"}]);const a=N().addElement(i.querySelector(".modal-shadow")).afterStyles({transform:"translateY(0) scale(1)"}).keyframes([{offset:0,opacity:"0",transform:t},{offset:1,opacity:"1",transform:"translateY(0) scale(1)"}]);d.addAnimation([e,a])}else s.fromTo("opacity","1","0")}else d.addAnimation(n);return d},it=(t,o)=>{const{currentBreakpoint:i,expandToScroll:a}=o,e=x(t),{wrapperAnimation:r,backdropAnimation:s,contentAnimation:n}=void 0!==i?J(o):{backdropAnimation:N().fromTo("opacity",.01,"var(--backdrop-opacity)").beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),wrapperAnimation:N().keyframes([{offset:0,opacity:.01,transform:"translateY(40px)"},{offset:1,opacity:1,transform:"translateY(0px)"}]),contentAnimation:void 0};s.addElement(e.querySelector("ion-backdrop")),r.addElement(e.querySelector(".modal-wrapper")),!a&&(null==n||n.addElement(t.querySelector(".ion-page")));const d=N().addElement(t).easing("cubic-bezier(0.36,0.66,0.04,1)").duration(280).addAnimation([s,r]);return n&&d.addAnimation(n),d},at=(t,o)=>{const{currentBreakpoint:i}=o,a=x(t),{wrapperAnimation:e,backdropAnimation:r}=void 0!==i?Q(o):{backdropAnimation:N().fromTo("opacity","var(--backdrop-opacity)",0),wrapperAnimation:N().keyframes([{offset:0,opacity:.99,transform:"translateY(0px)"},{offset:1,opacity:0,transform:"translateY(40px)"}])};return r.addElement(a.querySelector("ion-backdrop")),e.addElement(a.querySelector(".modal-wrapper")),N().easing("cubic-bezier(0.47,0,0.745,0.715)").duration(200).addAnimation([r,e])},et=class{constructor(i){t(this,i),this.didPresent=o(this,"ionModalDidPresent",7),this.willPresent=o(this,"ionModalWillPresent",7),this.willDismiss=o(this,"ionModalWillDismiss",7),this.didDismiss=o(this,"ionModalDidDismiss",7),this.ionBreakpointDidChange=o(this,"ionBreakpointDidChange",7),this.didPresentShorthand=o(this,"didPresent",7),this.willPresentShorthand=o(this,"willPresent",7),this.willDismissShorthand=o(this,"willDismiss",7),this.didDismissShorthand=o(this,"didDismiss",7),this.ionMount=o(this,"ionMount",7),this.lockController=y(),this.triggerController=B(),this.coreDelegate=f(),this.isSheetModal=!1,this.inheritedAttributes={},this.inline=!1,this.gestureAnimationDismissing=!1,this.presented=!1,this.hasController=!1,this.keyboardClose=!0,this.expandToScroll=!0,this.backdropBreakpoint=0,this.handleBehavior="none",this.backdropDismiss=!0,this.showBackdrop=!0,this.animated=!0,this.isOpen=!1,this.keepContentsMounted=!1,this.focusTrap=!0,this.canDismiss=!0,this.onHandleClick=()=>{const{sheetTransition:t,handleBehavior:o}=this;"cycle"===o&&void 0===t&&this.moveToNextBreakpoint()},this.onBackdropTap=()=>{const{sheetTransition:t}=this;void 0===t&&this.dismiss(void 0,T)},this.onLifecycle=t=>{const o=this.usersElement,i=rt[t.type];if(o&&i){const a=new CustomEvent(i,{bubbles:!1,cancelable:!1,detail:t.detail});o.dispatchEvent(a)}},this.onModalFocus=t=>{const{dragHandleEl:o,el:i}=this;t.target===i&&o&&-1!==o.tabIndex&&o.focus()},this.onSlotChange=({target:t})=>{t.assignedElements().forEach((t=>{t.querySelectorAll("ion-modal").forEach((t=>{null===t.getAttribute("data-parent-ion-modal")&&t.setAttribute("data-parent-ion-modal",this.el.id)}))}))}}onIsOpenChange(t,o){!0===t&&!1===o?this.present():!1===t&&!0===o&&this.dismiss()}triggerChanged(){const{trigger:t,el:o,triggerController:i}=this;t&&i.addClickListener(o,t)}onWindowResize(){"ios"!==$(this)||!this.presentingElement||this.enterAnimation||this.leaveAnimation||(clearTimeout(this.resizeTimeout),this.resizeTimeout=setTimeout((()=>{this.handleViewTransition()}),50))}breakpointsChanged(t){void 0!==t&&(this.sortedBreakpoints=t.sort(((t,o)=>t-o)))}connectedCallback(){const{el:t}=this;O(t),this.triggerChanged()}disconnectedCallback(){this.triggerController.removeClickListener(),this.cleanupViewTransitionListener(),this.cleanupParentRemovalObserver()}componentWillLoad(){var t;const{breakpoints:o,initialBreakpoint:a,el:e,htmlAttributes:r}=this,s=this.isSheetModal=void 0!==o&&void 0!==a,n=["aria-label","role"];this.inheritedAttributes=g(e,n),e.parentNode&&(this.cachedOriginalParent=e.parentNode),void 0!==r&&n.forEach((t=>{r[t]&&(this.inheritedAttributes=Object.assign(Object.assign({},this.inheritedAttributes),{[t]:r[t]}),delete r[t])})),s&&(this.currentBreakpoint=this.initialBreakpoint),void 0===o||void 0===a||o.includes(a)||i("[ion-modal] - Your breakpoints array must include the initialBreakpoint value."),(null===(t=this.htmlAttributes)||void 0===t?void 0:t.id)||S(this.el)}componentDidLoad(){!0===this.isOpen&&w((()=>this.present())),this.breakpointsChanged(this.breakpoints),this.triggerChanged()}getDelegate(t=!1){if(this.workingDelegate&&!t)return{delegate:this.workingDelegate,inline:this.inline};const o=this.inline=null!==this.el.parentNode&&!this.hasController;return{inline:o,delegate:this.workingDelegate=o?this.delegate||this.coreDelegate:this.delegate}}async checkCanDismiss(t,o){const{canDismiss:i}=this;return"function"==typeof i?i(t,o):i}async present(){const t=await this.lockController.lock();if(this.presented)return void t();const{presentingElement:o,el:i}=this;this.currentBreakpoint=this.initialBreakpoint;const{inline:e,delegate:r}=this.getDelegate(!0);this.ionMount.emit(),this.usersElement=await u(r,i,this.component,["ion-page"],this.componentProps,e),k(i)?await R(this.usersElement):this.keepContentsMounted||await L(),a((()=>this.el.classList.add("show-modal")));const s=void 0!==o;s&&"ios"===$(this)&&(this.statusBarStyle=await Z.getStyle(),G()),await C(this,"modalEnter",tt,it,{presentingEl:o,currentBreakpoint:this.initialBreakpoint,backdropBreakpoint:this.backdropBreakpoint,expandToScroll:this.expandToScroll}),"undefined"!=typeof window&&(this.keyboardOpenCallback=()=>{this.gesture&&(this.gesture.enable(!1),w((()=>{this.gesture&&this.gesture.enable(!0)})))},window.addEventListener(I,this.keyboardOpenCallback));const n=void 0!==this.breakpoints&&void 0!==this.initialBreakpoint;this.isSheetModal=n,n?this.initSheetGesture():s&&this.initSwipeToClose(),this.initViewTransitionListener(),this.initParentRemovalObserver(),t()}initSwipeToClose(){var t;if("ios"!==$(this))return;const{el:o}=this,i=this.leaveAnimation||e.get("modalLeave",ot),a=this.animation=i(o,{presentingEl:this.presentingElement,expandToScroll:this.expandToScroll});if(!c(o))return void m(o);const r=null!==(t=this.statusBarStyle)&&void 0!==t?t:H.Default;this.gesture=((t,o,i,a)=>{const e=.5,r=t.offsetHeight;let s=!1,n=!1,c=null,m=null,f=!0,u=0;const b=W({el:t,gestureName:"modalSwipeToClose",gesturePriority:D,direction:"y",threshold:10,canStart:t=>{const o=t.event.target;if(null===o||!o.closest)return!0;if(c=d(o),c){if(h(c)){const t=x(c);m=t.querySelector(".inner-scroll")}else m=c;return!c.querySelector("ion-refresher")&&0===m.scrollTop}return null===o.closest("ion-footer")},onStart:i=>{const{deltaY:a}=i;f=!c||!h(c)||c.scrollY,n=void 0!==t.canDismiss&&!0!==t.canDismiss,a>0&&c&&l(c),o.progressStart(!0,s?1:0)},onMove:t=>{const{deltaY:a}=t;a>0&&c&&l(c);const s=t.deltaY/r,d=s>=0&&n,h=d?.2:.9999,p=d?_(s/h):s,m=v(1e-4,p,h);o.progressStep(m),m>=e&&u<e?U(i):m<e&&u>=e&&G(),u=m},onEnd:i=>{const d=i.velocityY,h=i.deltaY/r,l=h>=0&&n,m=l?.2:.9999,u=l?_(h/m):h,x=v(1e-4,u,m),w=!l&&(i.deltaY+1e3*d)/r>=e;let g=w?-.001:.001;w?(o.easing("cubic-bezier(0.32, 0.72, 0, 1)"),g+=z([0,0],[.32,.72],[0,1],[1,1],x)[0]):(o.easing("cubic-bezier(1, 0, 0.68, 0.28)"),g+=z([0,0],[1,0],[.68,.28],[1,1],x)[0]);const k=X(w?h*r:(1-x)*r,d);s=w,b.enable(!1),c&&p(c,f),o.onFinish((()=>{w||b.enable(!0)})).progressEnd(w?1:0,g,k),l&&x>m/4?K(t,o):w&&a()}});return b})(o,a,r,(()=>{this.gestureAnimationDismissing=!0,U(this.statusBarStyle),this.animation.onFinish((async()=>{await this.dismiss(void 0,Y),this.gestureAnimationDismissing=!1}))})),this.gesture.enable(!0)}initSheetGesture(){const{wrapperEl:t,initialBreakpoint:o,backdropBreakpoint:i}=this;if(!t||void 0===o)return;const a=this.enterAnimation||e.get("modalEnter",tt),r=this.animation=a(this.el,{presentingEl:this.presentingElement,currentBreakpoint:o,backdropBreakpoint:i,expandToScroll:this.expandToScroll});r.progressStart(!0,1);const{gesture:s,moveSheetToBreakpoint:n}=((t,o,i,a,e,r,s=[],n,l,p,c)=>{const m={WRAPPER_KEYFRAMES:[{offset:0,transform:"translateY(0%)"},{offset:1,transform:"translateY(100%)"}],BACKDROP_KEYFRAMES:0!==e?[{offset:0,opacity:"var(--backdrop-opacity)"},{offset:1-e,opacity:0},{offset:1,opacity:0}]:[{offset:0,opacity:"var(--backdrop-opacity)"},{offset:1,opacity:.01}],CONTENT_KEYFRAMES:[{offset:0,maxHeight:"100%"},{offset:1,maxHeight:"0%"}]},f=t.querySelector("ion-content"),u=i.clientHeight;let b=a,g=0,k=!1,y=null,A=null,Y=null,D=null;const B=s[s.length-1],T=s[0],O=r.childAnimations.find((t=>"wrapperAnimation"===t.id)),S=r.childAnimations.find((t=>"backdropAnimation"===t.id)),C=r.childAnimations.find((t=>"contentAnimation"===t.id)),M=()=>{!1!==t.focusTrap&&!1!==t.showBackdrop&&(t.style.setProperty("pointer-events","auto"),o.style.setProperty("pointer-events","auto"),t.classList.remove(E))},P=()=>{t.style.setProperty("pointer-events","none"),o.style.setProperty("pointer-events","none"),t.classList.add(E)},j=o=>{if(!A&&(A=Array.from(t.querySelectorAll("ion-footer")),!A.length))return;const i=t.querySelector(".ion-page");if(D=o,"stationary"===o)A.forEach((t=>{t.classList.remove("modal-footer-moving"),t.style.removeProperty("position"),t.style.removeProperty("width"),t.style.removeProperty("height"),t.style.removeProperty("top"),t.style.removeProperty("left"),null==i||i.style.removeProperty("padding-bottom"),null==i||i.appendChild(t)}));else{let o=0;A.forEach(((i,a)=>{const e=i.getBoundingClientRect(),r=document.body.getBoundingClientRect();o+=i.clientHeight;const s=e.top-r.top,n=e.left-r.left;if(i.style.setProperty("--pinned-width",`${i.clientWidth}px`),i.style.setProperty("--pinned-height",`${i.clientHeight}px`),i.style.setProperty("--pinned-top",`${s}px`),i.style.setProperty("--pinned-left",`${n}px`),0===a){Y=s;const o=t.querySelector("ion-header");o&&(Y-=o.clientHeight)}})),A.forEach((t=>{null==i||i.style.setProperty("padding-bottom",`${o}px`),t.classList.add("modal-footer-moving"),t.style.setProperty("position","absolute"),t.style.setProperty("width","var(--pinned-width)"),t.style.setProperty("height","var(--pinned-height)"),t.style.setProperty("top","var(--pinned-top)"),t.style.setProperty("left","var(--pinned-left)"),document.body.appendChild(t)}))}};O&&S&&(O.keyframes([...m.WRAPPER_KEYFRAMES]),S.keyframes([...m.BACKDROP_KEYFRAMES]),null==C||C.keyframes([...m.CONTENT_KEYFRAMES]),r.progressStart(!0,1-b),b>e&&!1!==t.focusTrap&&!1!==t.showBackdrop?M():P()),f&&b!==B&&n&&(f.scrollY=!1);const R=o=>{const{breakpoint:i,canDismiss:a,breakpointOffset:d,animated:h}=o,l=a&&0===i,u=l?b:i,v=0!==u;return b=0,O&&S&&(O.keyframes([{offset:0,transform:`translateY(${100*d}%)`},{offset:1,transform:`translateY(${100*(1-u)}%)`}]),S.keyframes([{offset:0,opacity:`calc(var(--backdrop-opacity) * ${V(1-d,e)})`},{offset:1,opacity:`calc(var(--backdrop-opacity) * ${V(u,e)})`}]),C&&C.keyframes([{offset:0,maxHeight:100*(1-d)+"%"},{offset:1,maxHeight:100*u+"%"}]),r.progressStep(0)),L.enable(!1),l?K(t,r):v||p(),!f||u!==s[s.length-1]&&n||(f.scrollY=!0),n||0!==u||j("stationary"),new Promise((o=>{r.onFinish((()=>{v?(n||j("stationary"),O&&S?w((()=>{O.keyframes([...m.WRAPPER_KEYFRAMES]),S.keyframes([...m.BACKDROP_KEYFRAMES]),null==C||C.keyframes([...m.CONTENT_KEYFRAMES]),r.progressStart(!0,1-u),b=u,c(b),b>e&&!1!==t.focusTrap&&!1!==t.showBackdrop?M():P(),L.enable(!0),o()})):(L.enable(!0),o())):o()}),{oneTimeCallback:!0}).progressEnd(1,0,h?500:0)}))},L=W({el:i,gestureName:"modalSheet",gesturePriority:40,direction:"y",threshold:10,canStart:t=>{const o=d(t.event.target);if(b=l(),!n&&o)return 0===(h(o)?x(o).querySelector(".inner-scroll"):o).scrollTop;if(1===b&&o){const t=h(o)?x(o).querySelector(".inner-scroll"):o;return!o.querySelector("ion-refresher")&&0===t.scrollTop}return!0},onStart:o=>{if(k=void 0!==t.canDismiss&&!0!==t.canDismiss&&0===T,!n){const t=d(o.event.target);y=t&&h(t)?x(t).querySelector(".inner-scroll"):t}n||j("moving"),o.deltaY>0&&f&&(f.scrollY=!1),w((()=>{t.focus()})),r.progressStart(!0,1-b)},onMove:t=>{if(n||null===Y||null===D||(t.currentY>=Y&&"moving"===D?j("stationary"):t.currentY<Y&&"stationary"===D&&j("moving")),!n&&t.deltaY<=0&&y)return;t.deltaY>0&&f&&(f.scrollY=!1);const o=s.length>1?1-s[1]:void 0,i=1-b+t.deltaY/u,a=void 0!==o&&i>=o&&k,e=a?.95:.9999,d=a&&void 0!==o?o+_((i-o)/(e-o)):i;g=v(1e-4,d,e),r.progressStep(g)},onEnd:t=>{if(!n&&t.deltaY<=0&&y&&y.scrollTop>0)return void j("stationary");const o=b-(t.deltaY+350*t.velocityY)/u,i=s.reduce(((t,i)=>Math.abs(i-o)<Math.abs(t-o)?i:t));R({breakpoint:i,breakpointOffset:g,canDismiss:k,animated:!0})}});return{gesture:L,moveSheetToBreakpoint:R}})(this.el,this.backdropEl,t,o,i,r,this.sortedBreakpoints,this.expandToScroll,(()=>{var t;return null!==(t=this.currentBreakpoint)&&void 0!==t?t:0}),(()=>this.sheetOnDismiss()),(t=>{this.currentBreakpoint!==t&&(this.currentBreakpoint=t,this.ionBreakpointDidChange.emit({breakpoint:t}))}));this.gesture=s,this.moveSheetToBreakpoint=n,this.gesture.enable(!0),(!1===this.showBackdrop||!1===this.focusTrap||i>0)&&this.setupChildRoutePassthrough()}setupChildRoutePassthrough(){var t;this.cachedPageParent=this.getOriginalPageParent();const o=this.cachedPageParent;if(!o||"ION-APP"===o.tagName)return;const i=Array.from(o.children).some((t=>{var o;return!(t===this.el||t instanceof HTMLElement&&"none"===window.getComputedStyle(t).display||"TEMPLATE"===t.tagName||"SLOT"===t.tagName||t.nodeType===Node.TEXT_NODE&&!(null===(o=t.textContent)||void 0===o?void 0:o.trim()))}));if(i)return;o.classList.add("ion-page-overlay-passthrough");const a=o.parentElement;"ION-ROUTER-OUTLET"===(null==a?void 0:a.tagName)&&"ION-APP"!==(null===(t=a.parentElement)||void 0===t?void 0:t.tagName)&&(a.style.setProperty("pointer-events","none"),a.setAttribute("data-overlay-passthrough","true"))}getOriginalPageParent(){if(!this.cachedOriginalParent)return null;let t=this.cachedOriginalParent;for(;t&&!t.classList.contains("ion-page");)t=t.parentElement;return t}cleanupChildRoutePassthrough(){const t=this.cachedPageParent;if(!t)return;t.classList.remove("ion-page-overlay-passthrough");const o=t.parentElement;(null==o?void 0:o.hasAttribute("data-overlay-passthrough"))&&(o.style.removeProperty("pointer-events"),o.removeAttribute("data-overlay-passthrough")),this.cachedPageParent=void 0}sheetOnDismiss(){this.gestureAnimationDismissing=!0,this.animation.onFinish((async()=>{this.currentBreakpoint=0,this.ionBreakpointDidChange.emit({breakpoint:this.currentBreakpoint}),await this.dismiss(void 0,Y),this.gestureAnimationDismissing=!1}))}async dismiss(t,o){var i;if(this.gestureAnimationDismissing&&o!==Y)return!1;const e=await this.lockController.lock();if(await this.dismissNestedModals(),"handler"!==o&&!await this.checkCanDismiss(t,o))return e(),!1;const{presentingElement:r}=this;void 0!==r&&"ios"===$(this)&&U(this.statusBarStyle),"undefined"!=typeof window&&this.keyboardOpenCallback&&(window.removeEventListener(I,this.keyboardOpenCallback),this.keyboardOpenCallback=void 0);const s=await M(this,t,o,"modalLeave",ot,at,{presentingEl:r,currentBreakpoint:null!==(i=this.currentBreakpoint)&&void 0!==i?i:this.initialBreakpoint,backdropBreakpoint:this.backdropBreakpoint,expandToScroll:this.expandToScroll});if(s){const{delegate:t}=this.getDelegate();await b(t,this.usersElement),a((()=>this.el.classList.remove("show-modal"))),this.animation&&this.animation.destroy(),this.gesture&&this.gesture.destroy(),this.cleanupViewTransitionListener(),this.cleanupParentRemovalObserver(),this.cleanupChildRoutePassthrough()}return this.currentBreakpoint=void 0,this.animation=void 0,e(),s}onDidDismiss(){return P(this.el,"ionModalDidDismiss")}onWillDismiss(){return P(this.el,"ionModalWillDismiss")}async setCurrentBreakpoint(t){if(!this.isSheetModal)return void i("[ion-modal] - setCurrentBreakpoint is only supported on sheet modals.");if(!this.breakpoints.includes(t))return void i(`[ion-modal] - Attempted to set invalid breakpoint value ${t}. Please double check that the breakpoint value is part of your defined breakpoints.`);const{currentBreakpoint:o,moveSheetToBreakpoint:a,canDismiss:e,breakpoints:r,animated:s}=this;o!==t&&a&&(this.sheetTransition=a({breakpoint:t,breakpointOffset:1-o,canDismiss:void 0!==e&&!0!==e&&0===r[0],animated:s}),await this.sheetTransition,this.sheetTransition=void 0)}async getCurrentBreakpoint(){return this.currentBreakpoint}async moveToNextBreakpoint(){const{breakpoints:t,currentBreakpoint:o}=this;if(!t||null==o)return!1;const i=t.filter((t=>0!==t)),a=i.indexOf(o),e=i[(a+1)%i.length];return await this.setCurrentBreakpoint(e),!0}initViewTransitionListener(){"ios"!==$(this)||!this.presentingElement||this.enterAnimation||this.leaveAnimation||(this.currentViewIsPortrait=window.innerWidth<768)}handleViewTransition(){const t=window.innerWidth<768;if(this.currentViewIsPortrait===t)return;this.viewTransitionAnimation&&(this.viewTransitionAnimation.destroy(),this.viewTransitionAnimation=void 0);const{presentingElement:o}=this;if(!o)return;let i;i=this.currentViewIsPortrait&&!t?((t,o,i=300)=>{const{presentingEl:a}=o;if(!a)return N("portrait-to-landscape-transition");const e="ION-MODAL"===a.tagName&&void 0!==a.presentingElement,r=x(a),s=document.body,n=N("portrait-to-landscape-transition").addElement(t).easing("cubic-bezier(0.32,0.72,0,1)").duration(i),d=N().beforeStyles({transform:"translateY(0)","transform-origin":"top center",overflow:"hidden"});if(e){const t="translateY(-10px) scale(0.915)",o="translateY(0px) scale(1)";d.addElement(a).afterStyles({transform:o}).fromTo("transform",t,o).fromTo("filter","contrast(0.85)","contrast(1)");const i=N().addElement(r.querySelector(".modal-shadow")).afterStyles({transform:o,opacity:"0"}).fromTo("transform",t,o);n.addAnimation([d,i])}else{const o=x(t),i=N().addElement(o.querySelectorAll(".modal-wrapper, .modal-shadow")).fromTo("opacity","1","1"),e=N().addElement(o.querySelector("ion-backdrop")).fromTo("opacity","var(--backdrop-opacity)","var(--backdrop-opacity)"),r=`translateY(${CSS.supports("width","max(0px, 1px)")?"max(30px, var(--ion-safe-area-top))":"30px"}) scale(0.915)`;d.addElement(a).afterStyles({transform:"translateY(0px) scale(1)","border-radius":"0px"}).beforeAddWrite((()=>s.style.setProperty("background-color",""))).fromTo("transform",r,"translateY(0px) scale(1)").fromTo("filter","contrast(0.85)","contrast(1)").fromTo("border-radius","10px 10px 0 0","0px"),n.addAnimation([d,i,e])}return n})(this.el,{presentingEl:o}):((t,o,i=300)=>{const{presentingEl:a}=o;if(!a)return N("landscape-to-portrait-transition");const e="ION-MODAL"===a.tagName&&void 0!==a.presentingElement,r=x(a),s=document.body,n=N("landscape-to-portrait-transition").addElement(t).easing("cubic-bezier(0.32,0.72,0,1)").duration(i),d=N().beforeStyles({transform:"translateY(0)","transform-origin":"top center",overflow:"hidden"});if(e){const t="translateY(-10px) scale(0.915)",o="translateY(0) scale(1)";d.addElement(a).afterStyles({transform:o}).fromTo("transform",t,o);const i=N().addElement(r.querySelector(".modal-shadow")).afterStyles({transform:o,opacity:"0"}).fromTo("transform",t,o);n.addAnimation([d,i])}else{const o=x(t),i=N().addElement(o.querySelectorAll(".modal-wrapper, .modal-shadow")).fromTo("opacity","1","1"),e=N().addElement(o.querySelector("ion-backdrop")).fromTo("opacity","var(--backdrop-opacity)","var(--backdrop-opacity)"),r=`translateY(${CSS.supports("width","max(0px, 1px)")?"max(30px, var(--ion-safe-area-top))":"30px"}) scale(0.915)`;d.addElement(a).afterStyles({transform:r}).beforeAddWrite((()=>s.style.setProperty("background-color","black"))).keyframes([{offset:0,transform:"translateY(0px) scale(1)",filter:"contrast(1)",borderRadius:"0px"},{offset:.2,transform:"translateY(0px) scale(1)",filter:"contrast(1)",borderRadius:"10px 10px 0 0"},{offset:1,transform:r,filter:"contrast(0.85)",borderRadius:"10px 10px 0 0"}]),n.addAnimation([d,i,e])}return n})(this.el,{presentingEl:o}),this.currentViewIsPortrait=t,this.viewTransitionAnimation=i,i.play().then((()=>{this.viewTransitionAnimation=void 0,this.reinitSwipeToClose()}))}cleanupViewTransitionListener(){this.resizeTimeout&&(clearTimeout(this.resizeTimeout),this.resizeTimeout=void 0),this.viewTransitionAnimation&&(this.viewTransitionAnimation.destroy(),this.viewTransitionAnimation=void 0)}reinitSwipeToClose(){"ios"===$(this)&&this.presentingElement&&(this.gesture&&(this.gesture.destroy(),this.gesture=void 0),this.animation&&(this.animation.progressEnd(0,0,0),this.animation.destroy(),this.animation=void 0),w((()=>{this.ensureCorrectModalPosition(),this.initSwipeToClose()})))}ensureCorrectModalPosition(){const{el:t,presentingElement:o}=this,i=x(t).querySelector(".modal-wrapper");if(i&&(i.style.transform="translateY(0vh)",i.style.opacity="1"),"ION-MODAL"===(null==o?void 0:o.tagName))if(window.innerWidth<768){const t=CSS.supports("width","max(0px, 1px)")?"max(30px, var(--ion-safe-area-top))":"30px";o.style.transform=`translateY(${t}) scale(0.915)`}else o.style.transform="translateY(0px) scale(1)"}async dismissNestedModals(){const t=document.querySelectorAll(`ion-modal[data-parent-ion-modal="${this.el.id}"]`);null==t||t.forEach((async t=>{await t.dismiss(void 0,"parent-dismissed")}))}initParentRemovalObserver(){"undefined"!=typeof MutationObserver&&"undefined"!=typeof window&&this.cachedOriginalParent&&this.cachedOriginalParent.nodeType!==Node.DOCUMENT_NODE&&this.cachedOriginalParent.nodeType!==Node.DOCUMENT_FRAGMENT_NODE&&(this.hasController||this.cachedOriginalParent===document.body||"ION-APP"===this.cachedOriginalParent.tagName||(this.parentRemovalObserver=new MutationObserver((t=>{t.forEach((t=>{"childList"===t.type&&t.removedNodes.length>0&&(Array.from(t.removedNodes).some((t=>{var o,i;const a=t===this.cachedOriginalParent,e=!!this.cachedOriginalParent&&(null===(i=(o=t).contains)||void 0===i?void 0:i.call(o,this.cachedOriginalParent));return a||e}))||this.cachedOriginalParent&&!this.cachedOriginalParent.isConnected)&&(this.dismiss(void 0,"parent-removed"),this.cachedOriginalParent=void 0)}))})),this.parentRemovalObserver.observe(document.body,{childList:!0,subtree:!0})))}cleanupParentRemovalObserver(){var t;null===(t=this.parentRemovalObserver)||void 0===t||t.disconnect(),this.parentRemovalObserver=void 0}render(){const{handle:t,isSheetModal:o,presentingElement:i,htmlAttributes:a,handleBehavior:e,inheritedAttributes:n,focusTrap:d,expandToScroll:h}=this,l=!1!==t&&o,p=$(this),c=void 0!==i&&"ios"===p,m="cycle"===e;return r(s,Object.assign({key:"9a75095a13de0cfc96f1fa69fd92777d25da8daa","no-router":!0,tabIndex:m&&o&&l?0:-1},a,{style:{zIndex:`${2e4+this.overlayIndex}`},class:Object.assign({[p]:!0,"modal-default":!c&&!o,"modal-card":c,"modal-sheet":o,"modal-no-expand-scroll":o&&!h,"overlay-hidden":!0,[E]:!1===d},j(this.cssClass)),onIonBackdropTap:this.onBackdropTap,onIonModalDidPresent:this.onLifecycle,onIonModalWillPresent:this.onLifecycle,onIonModalWillDismiss:this.onLifecycle,onIonModalDidDismiss:this.onLifecycle,onFocus:this.onModalFocus}),r("ion-backdrop",{key:"d02612d8063ef20f59f173ff47795f71cdaaf63e",ref:t=>this.backdropEl=t,visible:this.showBackdrop,tappable:this.backdropDismiss,part:"backdrop"}),"ios"===p&&r("div",{key:"708761b70a93e34c08faae079569f444c7416a4c",class:"modal-shadow"}),r("div",Object.assign({key:"a72226ff1a98229f9bfd9207b98fc57e02baa430",role:"dialog"},n,{"aria-modal":"true",class:"modal-wrapper ion-overlay-wrapper",part:"content",ref:t=>this.wrapperEl=t}),l&&r("button",{key:"0547f32323882660221385d84d492929caa77c6b",class:"modal-handle",tabIndex:m?0:-1,"aria-label":"Activate to adjust the size of the dialog overlaying the screen",onClick:m?this.onHandleClick:void 0,part:"handle",ref:t=>this.dragHandleEl=t}),r("slot",{key:"fccbd64518b6fa22f9e874deb6b4ba55d8d89c3b",onSlotchange:this.onSlotChange})))}get el(){return n(this)}static get watchers(){return{isOpen:["onIsOpenChange"],trigger:["triggerChanged"]}}},rt={ionModalDidPresent:"ionViewDidEnter",ionModalWillPresent:"ionViewWillEnter",ionModalWillDismiss:"ionViewWillLeave",ionModalDidDismiss:"ionViewDidLeave"};et.style={ios:':host{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);contain:strict}.modal-wrapper,ion-backdrop{pointer-events:auto}:host(.overlay-hidden){display:none}.modal-wrapper,.modal-shadow{border-radius:var(--border-radius);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);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--width:600px;--height:500px;--ion-safe-area-top:0px;--ion-safe-area-bottom:0px;--ion-safe-area-right:0px;--ion-safe-area-left:0px}}@media only screen and (min-width: 768px) and (min-height: 768px){:host{--width:600px;--height:600px}}.modal-handle{left:0px;right:0px;top:5px;border-radius:8px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;position:absolute;width:36px;height:5px;-webkit-transform:translateZ(0);transform:translateZ(0);border:0;background:var(--ion-color-step-350, var(--ion-background-color-step-350, #c0c0be));cursor:pointer;z-index:11}.modal-handle::before{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;position:absolute;width:36px;height:5px;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);content:""}:host(.modal-sheet){--height:calc(100% - (var(--ion-safe-area-top) + 10px))}:host(.modal-sheet) .modal-wrapper,:host(.modal-sheet) .modal-shadow{position:absolute;bottom:0}:host(.modal-sheet.modal-no-expand-scroll) ion-footer{position:absolute;bottom:0;width:var(--width)}:host{--backdrop-opacity:var(--ion-backdrop-opacity, 0.4)}:host(.modal-card),:host(.modal-sheet){--border-radius:10px}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--border-radius:10px}}.modal-wrapper{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0)}@media screen and (max-width: 767px){@supports (width: max(0px, 1px)){:host(.modal-card){--height:calc(100% - max(30px, var(--ion-safe-area-top)) - 10px)}}@supports not (width: max(0px, 1px)){:host(.modal-card){--height:calc(100% - 40px)}}:host(.modal-card) .modal-wrapper{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0;border-end-start-radius:0}:host(.modal-card){--backdrop-opacity:0;--width:100%;-ms-flex-align:end;align-items:flex-end}:host(.modal-card) .modal-shadow{display:none}:host(.modal-card) ion-backdrop{pointer-events:none}}@media screen and (min-width: 768px){:host(.modal-card){--width:calc(100% - 120px);--height:calc(100% - (120px + var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));--max-width:720px;--max-height:1000px;--backdrop-opacity:0;--box-shadow:0px 0px 30px 10px rgba(0, 0, 0, 0.1);-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out}:host(.modal-card) .modal-wrapper{-webkit-box-shadow:none;box-shadow:none}:host(.modal-card) .modal-shadow{-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}}:host(.modal-sheet) .modal-wrapper{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0;border-end-start-radius:0}',md:':host{--width:100%;--min-width:auto;--max-width:auto;--height:100%;--min-height:auto;--max-height:auto;--overflow:hidden;--border-radius:0;--border-width:0;--border-style:none;--border-color:transparent;--background:var(--ion-background-color, #fff);--box-shadow:none;--backdrop-opacity:0;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);contain:strict}.modal-wrapper,ion-backdrop{pointer-events:auto}:host(.overlay-hidden){display:none}.modal-wrapper,.modal-shadow{border-radius:var(--border-radius);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);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:var(--overflow);z-index:10}.modal-shadow{position:absolute;background:transparent}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--width:600px;--height:500px;--ion-safe-area-top:0px;--ion-safe-area-bottom:0px;--ion-safe-area-right:0px;--ion-safe-area-left:0px}}@media only screen and (min-width: 768px) and (min-height: 768px){:host{--width:600px;--height:600px}}.modal-handle{left:0px;right:0px;top:5px;border-radius:8px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;position:absolute;width:36px;height:5px;-webkit-transform:translateZ(0);transform:translateZ(0);border:0;background:var(--ion-color-step-350, var(--ion-background-color-step-350, #c0c0be));cursor:pointer;z-index:11}.modal-handle::before{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;position:absolute;width:36px;height:5px;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);content:""}:host(.modal-sheet){--height:calc(100% - (var(--ion-safe-area-top) + 10px))}:host(.modal-sheet) .modal-wrapper,:host(.modal-sheet) .modal-shadow{position:absolute;bottom:0}:host(.modal-sheet.modal-no-expand-scroll) ion-footer{position:absolute;bottom:0;width:var(--width)}:host{--backdrop-opacity:var(--ion-backdrop-opacity, 0.32)}@media only screen and (min-width: 768px) and (min-height: 600px){:host{--border-radius:2px;--box-shadow:0 28px 48px rgba(0, 0, 0, 0.4)}}.modal-wrapper{-webkit-transform:translate3d(0, 40px, 0);transform:translate3d(0, 40px, 0);opacity:0.01}'};export{et as ion_modal}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
-
*/
|
|
4
|
-
import{r as t,c as o,f as e,h as r,d as i,g as s}from"./p-C8IsBmNU.js";import{B as n,j as a,k as p,f as d,n as c,g as h,h as l,F as v}from"./p-DdR6rpbR.js";import{C as f,a as g,d as m}from"./p-D-eFFUkA.js";import{g as x,r as b,f as u,h as w}from"./p-CTfR9YZG.js";import{c as k}from"./p-B-hirT0v.js";import{b as y,a as D}from"./p-BFvmZNyx.js";import{g as P}from"./p-DiVJyqlX.js";import{e as T,w as I}from"./p-DUt5fQmA.js";import{c as N}from"./p-DDb5r57F.js";import"./p-ZjP4CjeZ.js";import"./p-B0q1YL7N.js";import"./p-BTEOs1at.js";const $=(t,o,e)=>{const r=o.getBoundingClientRect(),i=r.height;let s=r.width;return"cover"===t&&e&&(s=e.getBoundingClientRect().width),{contentWidth:s,contentHeight:i}},j=(t,o)=>o&&"ION-ITEM"===o.tagName?t.findIndex((t=>t===o)):-1,A=t=>{const o=x(t).querySelector("button");o&&b((()=>o.focus()))},L=(t,o,e,r,i,s,n,a,p,d,c)=>{var h;let l={top:0,left:0,width:0,height:0};if("event"===s){if(!c)return p;l={top:c.clientY,left:c.clientX,width:1,height:1}}else{const t=d||(null===(h=null==c?void 0:c.detail)||void 0===h?void 0:h.ionShadowTarget)||(null==c?void 0:c.target);if(!t)return p;const o=t.getBoundingClientRect();l={top:o.top,left:o.left,width:o.width,height:o.height}}const v=z(n,l,o,e,r,i,t),f=X(a,n,l,o,e),g=v.top+f.top,m=v.left+f.left,{arrowTop:x,arrowLeft:b}=Y(n,r,i,g,m,o,e,t),{originX:u,originY:w}=C(n,a,t);return{top:g,left:m,referenceCoordinates:l,arrowTop:x,arrowLeft:b,originX:u,originY:w}},C=(t,o,e)=>{switch(t){case"top":return{originX:O(o),originY:"bottom"};case"bottom":return{originX:O(o),originY:"top"};case"left":return{originX:"right",originY:W(o)};case"right":return{originX:"left",originY:W(o)};case"start":return{originX:e?"left":"right",originY:W(o)};case"end":return{originX:e?"right":"left",originY:W(o)}}},O=t=>{switch(t){case"start":return"left";case"center":return"center";case"end":return"right"}},W=t=>{switch(t){case"start":return"top";case"center":return"center";case"end":return"bottom"}},Y=(t,o,e,r,i,s,n,a)=>{const p={arrowTop:r+n/2-o/2,arrowLeft:i+s-o/2},d={arrowTop:r+n/2-o/2,arrowLeft:i-1.5*o};switch(t){case"top":return{arrowTop:r+n,arrowLeft:i+s/2-o/2};case"bottom":return{arrowTop:r-e,arrowLeft:i+s/2-o/2};case"left":return p;case"right":return d;case"start":return a?d:p;case"end":return a?p:d;default:return{arrowTop:0,arrowLeft:0}}},z=(t,o,e,r,i,s,n)=>{const a={top:o.top,left:o.left-e-i},p={top:o.top,left:o.left+o.width+i};switch(t){case"top":return{top:o.top-r-s,left:o.left};case"right":return p;case"bottom":return{top:o.top+o.height+s,left:o.left};case"left":return a;case"start":return n?p:a;case"end":return n?a:p}},X=(t,o,e,r,i)=>{switch(t){case"center":return B(o,e,r,i);case"end":return E(o,e,r,i);default:return{top:0,left:0}}},E=(t,o,e,r)=>{switch(t){case"start":case"end":case"left":case"right":return{top:-(r-o.height),left:0};default:return{top:0,left:-(e-o.width)}}},B=(t,o,e,r)=>{switch(t){case"start":case"end":case"left":case"right":return{top:-(r/2-o.height/2),left:0};default:return{top:0,left:-(e/2-o.width/2)}}},R=(t,o,e,r,i,s,n,a,p,d,c,h,l=0,v=0,f=0)=>{let g=l;const m=v;let x,b=e,u=o,w=d,k=c,y=!1,D=!1;const P=h?h.top+h.height:s/2-a/2,T=h?h.height:0;let I=!1;return b<r+p?(b=r,y=!0,w="left"):n+r+b+p>i&&(D=!0,b=i-n-r,w="right"),P+T+a>s&&("top"===t||"bottom"===t)&&(P-a>0?(u=Math.max(12,P-a-T-(f-1)),g=u+a,k="bottom",I=!0):x=r),{top:u,left:b,bottom:x,originX:w,originY:k,checkSafeAreaLeft:y,checkSafeAreaRight:D,arrowTop:g,arrowLeft:m,addPopoverBottomClass:I}},H=(t,o)=>{var e;const{event:r,size:i,trigger:s,reference:n,side:a,align:p}=o,d=t.ownerDocument,c="rtl"===d.dir,h=d.defaultView.innerWidth,l=d.defaultView.innerHeight,v=x(t),f=v.querySelector(".popover-content"),g=v.querySelector(".popover-arrow"),m=s||(null===(e=null==r?void 0:r.detail)||void 0===e?void 0:e.ionShadowTarget)||(null==r?void 0:r.target),{contentWidth:b,contentHeight:u}=$(i,f,m),{arrowWidth:w,arrowHeight:k}=(t=>{if(!t)return{arrowWidth:0,arrowHeight:0};const{width:o,height:e}=t.getBoundingClientRect();return{arrowWidth:o,arrowHeight:e}})(g),y=L(c,b,u,w,k,n,a,p,{top:l/2-u/2,left:h/2-b/2,originX:c?"right":"left",originY:"top"},s,r),D="cover"===i?0:5,P="cover"===i?0:25,{originX:T,originY:I,top:j,left:A,bottom:C,checkSafeAreaLeft:O,checkSafeAreaRight:W,arrowTop:Y,arrowLeft:z,addPopoverBottomClass:X}=R(a,y.top,y.left,D,h,l,b,u,P,y.originX,y.originY,y.referenceCoordinates,y.arrowTop,y.arrowLeft,k),E=N(),B=N(),H=N();return B.addElement(v.querySelector("ion-backdrop")).fromTo("opacity",.01,"var(--backdrop-opacity)").beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),H.addElement(v.querySelector(".popover-arrow")).addElement(v.querySelector(".popover-content")).fromTo("opacity",.01,1),E.easing("ease").duration(100).beforeAddWrite((()=>{"cover"===i&&t.style.setProperty("--width",`${b}px`),X&&t.classList.add("popover-bottom"),void 0!==C&&f.style.setProperty("bottom",`${C}px`);let o=`${A}px`;if(O&&(o=`${A}px + var(--ion-safe-area-left, 0)`),W&&(o=`${A}px - var(--ion-safe-area-right, 0)`),f.style.setProperty("top",`calc(${j}px + var(--offset-y, 0))`),f.style.setProperty("left",`calc(${o} + var(--offset-x, 0))`),f.style.setProperty("transform-origin",`${I} ${T}`),null!==g){const t=((t,o=!1,e,r)=>!(!e&&!r||"top"!==t&&"bottom"!==t&&o))(a,y.top!==j||y.left!==A,r,s);t?(g.style.setProperty("top",`calc(${Y}px + var(--offset-y, 0))`),g.style.setProperty("left",`calc(${z}px + var(--offset-x, 0))`)):g.style.setProperty("display","none")}})).addAnimation([B,H])},F=t=>{const o=x(t),e=o.querySelector(".popover-content"),r=o.querySelector(".popover-arrow"),i=N(),s=N(),n=N();return s.addElement(o.querySelector("ion-backdrop")).fromTo("opacity","var(--backdrop-opacity)",0),n.addElement(o.querySelector(".popover-arrow")).addElement(o.querySelector(".popover-content")).fromTo("opacity",.99,0),i.easing("ease").afterAddWrite((()=>{t.style.removeProperty("--width"),t.classList.remove("popover-bottom"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("bottom"),e.style.removeProperty("transform-origin"),r&&(r.style.removeProperty("top"),r.style.removeProperty("left"),r.style.removeProperty("display"))})).duration(300).addAnimation([s,n])},M=(t,o)=>{var e;const{event:r,size:i,trigger:s,reference:n,side:a,align:p}=o,d=t.ownerDocument,c="rtl"===d.dir,h=d.defaultView.innerWidth,l=d.defaultView.innerHeight,v=x(t),f=v.querySelector(".popover-content"),g=s||(null===(e=null==r?void 0:r.detail)||void 0===e?void 0:e.ionShadowTarget)||(null==r?void 0:r.target),{contentWidth:m,contentHeight:b}=$(i,f,g),u=L(c,m,b,0,0,n,a,p,{top:l/2-b/2,left:h/2-m/2,originX:c?"right":"left",originY:"top"},s,r),w="cover"===i?0:12,{originX:k,originY:y,top:D,left:P,bottom:T}=R(a,u.top,u.left,w,h,l,m,b,0,u.originX,u.originY,u.referenceCoordinates),I=N(),j=N(),A=N(),C=N(),O=N();return j.addElement(v.querySelector("ion-backdrop")).fromTo("opacity",.01,"var(--backdrop-opacity)").beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),A.addElement(v.querySelector(".popover-wrapper")).duration(150).fromTo("opacity",.01,1),C.addElement(f).beforeStyles({top:`calc(${D}px + var(--offset-y, 0px))`,left:`calc(${P}px + var(--offset-x, 0px))`,"transform-origin":`${y} ${k}`}).beforeAddWrite((()=>{void 0!==T&&f.style.setProperty("bottom",`${T}px`)})).fromTo("transform","scale(0.8)","scale(1)"),O.addElement(v.querySelector(".popover-viewport")).fromTo("opacity",.01,1),I.easing("cubic-bezier(0.36,0.66,0.04,1)").duration(300).beforeAddWrite((()=>{"cover"===i&&t.style.setProperty("--width",`${m}px`),"bottom"===y&&t.classList.add("popover-bottom")})).addAnimation([j,A,C,O])},V=t=>{const o=x(t),e=o.querySelector(".popover-content"),r=N(),i=N(),s=N();return i.addElement(o.querySelector("ion-backdrop")).fromTo("opacity","var(--backdrop-opacity)",0),s.addElement(o.querySelector(".popover-wrapper")).fromTo("opacity",.99,0),r.easing("ease").afterAddWrite((()=>{t.style.removeProperty("--width"),t.classList.remove("popover-bottom"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("bottom"),e.style.removeProperty("transform-origin")})).duration(150).addAnimation([i,s])},S=class{constructor(r){t(this,r),this.didPresent=o(this,"ionPopoverDidPresent",7),this.willPresent=o(this,"ionPopoverWillPresent",7),this.willDismiss=o(this,"ionPopoverWillDismiss",7),this.didDismiss=o(this,"ionPopoverDidDismiss",7),this.didPresentShorthand=o(this,"didPresent",7),this.willPresentShorthand=o(this,"willPresent",7),this.willDismissShorthand=o(this,"willDismiss",7),this.didDismissShorthand=o(this,"didDismiss",7),this.ionMount=o(this,"ionMount",7),this.parentPopover=null,this.coreDelegate=f(),this.lockController=k(),this.inline=!1,this.focusDescendantOnPresent=!1,this.presented=!1,this.hasController=!1,this.keyboardClose=!0,this.backdropDismiss=!0,this.showBackdrop=!0,this.translucent=!1,this.animated=!0,this.triggerAction="click",this.size="auto",this.dismissOnSelect=!1,this.reference="trigger",this.side="bottom",this.arrow=!0,this.isOpen=!1,this.keyboardEvents=!1,this.focusTrap=!0,this.keepContentsMounted=!1,this.onBackdropTap=()=>{this.dismiss(void 0,n)},this.onLifecycle=t=>{const o=this.usersElement,e=U[t.type];if(o&&e){const r=new CustomEvent(e,{bubbles:!1,cancelable:!1,detail:t.detail});o.dispatchEvent(r)}},this.configureTriggerInteraction=()=>{const{trigger:t,triggerAction:o,el:r,destroyTriggerInteraction:i}=this;if(i&&i(),void 0===t)return;const s=this.triggerEl=void 0!==t?document.getElementById(t):null;s?this.destroyTriggerInteraction=((t,o,e)=>{let r=[];switch(o){case"hover":let t;r=[{eventName:"mouseenter",callback:async o=>{o.stopPropagation(),t&&clearTimeout(t),t=setTimeout((()=>{b((()=>{e.presentFromTrigger(o),t=void 0}))}),100)}},{eventName:"mouseleave",callback:o=>{t&&clearTimeout(t);const r=o.relatedTarget;r&&r.closest("ion-popover")!==e&&e.dismiss(void 0,void 0,!1)}},{eventName:"click",callback:t=>t.stopPropagation()},{eventName:"ionPopoverActivateTrigger",callback:t=>e.presentFromTrigger(t,!0)}];break;case"context-menu":r=[{eventName:"contextmenu",callback:t=>{t.preventDefault(),e.presentFromTrigger(t)}},{eventName:"click",callback:t=>t.stopPropagation()},{eventName:"ionPopoverActivateTrigger",callback:t=>e.presentFromTrigger(t,!0)}];break;default:r=[{eventName:"click",callback:t=>e.presentFromTrigger(t)},{eventName:"ionPopoverActivateTrigger",callback:t=>e.presentFromTrigger(t,!0)}]}return r.forEach((({eventName:o,callback:e})=>t.addEventListener(o,e))),t.setAttribute("data-ion-popover-trigger","true"),()=>{r.forEach((({eventName:o,callback:e})=>t.removeEventListener(o,e))),t.removeAttribute("data-ion-popover-trigger")}})(s,o,r):e(`[ion-popover] - A trigger element with the ID "${t}" was not found in the DOM. The trigger element must be in the DOM when the "trigger" property is set on ion-popover.`,this.el)},this.configureKeyboardInteraction=()=>{const{destroyKeyboardInteraction:t,el:o}=this;t&&t(),this.destroyKeyboardInteraction=(t=>{const o=async o=>{var e;const r=document.activeElement;let i=[];const s=null===(e=o.target)||void 0===e?void 0:e.tagName;if("ION-POPOVER"===s||"ION-ITEM"===s){try{i=Array.from(t.querySelectorAll("ion-item:not(ion-popover ion-popover *):not([disabled])"))}catch(t){}switch(o.key){case"ArrowLeft":await t.getParentPopover()&&t.dismiss(void 0,void 0,!1);break;case"ArrowDown":o.preventDefault();const e=((t,o)=>t[j(t,o)+1])(i,r);void 0!==e&&A(e);break;case"ArrowUp":o.preventDefault();const s=((t,o)=>t[j(t,o)-1])(i,r);void 0!==s&&A(s);break;case"Home":o.preventDefault();const n=i[0];void 0!==n&&A(n);break;case"End":o.preventDefault();const a=i[i.length-1];void 0!==a&&A(a);break;case"ArrowRight":case" ":case"Enter":if(r&&r.hasAttribute("data-ion-popover-trigger")){const t=new CustomEvent("ionPopoverActivateTrigger");r.dispatchEvent(t)}}}};return t.addEventListener("keydown",o),()=>t.removeEventListener("keydown",o)})(o)},this.configureDismissInteraction=()=>{const{destroyDismissInteraction:t,parentPopover:o,triggerAction:e,triggerEl:r,el:i}=this;o&&r&&(t&&t(),this.destroyDismissInteraction=((t,o,e,r)=>{let i=[];const s=x(r).querySelector(".popover-content");return i="hover"===o?[{eventName:"mouseenter",callback:o=>{document.elementFromPoint(o.clientX,o.clientY)!==t&&e.dismiss(void 0,void 0,!1)}}]:[{eventName:"click",callback:o=>{o.target.closest("[data-ion-popover-trigger]")!==t?e.dismiss(void 0,void 0,!1):o.stopPropagation()}}],i.forEach((({eventName:t,callback:o})=>s.addEventListener(t,o))),()=>{i.forEach((({eventName:t,callback:o})=>s.removeEventListener(t,o)))}})(r,e,i,o))}}onTriggerChange(){this.configureTriggerInteraction()}onIsOpenChange(t,o){!0===t&&!1===o?this.present():!1===t&&!0===o&&this.dismiss()}connectedCallback(){const{configureTriggerInteraction:t,el:o}=this;a(o),t()}disconnectedCallback(){const{destroyTriggerInteraction:t}=this;t&&t(),this.headerResizeObserver&&(this.headerResizeObserver.disconnect(),this.headerResizeObserver=void 0)}componentWillLoad(){var t,o;const{el:e}=this,r=null!==(o=null===(t=this.htmlAttributes)||void 0===t?void 0:t.id)&&void 0!==o?o:p(e);this.parentPopover=e.closest(`ion-popover:not(#${r})`),void 0===this.alignment&&(this.alignment="ios"===y(this)?"center":"start")}componentDidLoad(){const{parentPopover:t,isOpen:o}=this;!0===o&&b((()=>this.present())),t&&u(t,"ionPopoverWillDismiss",(()=>{this.dismiss(void 0,void 0,!1)})),this.configureTriggerInteraction()}async presentFromTrigger(t,o=!1){this.focusDescendantOnPresent=o,await this.present(t),this.focusDescendantOnPresent=!1}getDelegate(t=!1){if(this.workingDelegate&&!t)return{delegate:this.workingDelegate,inline:this.inline};const o=this.inline=null!==this.el.parentNode&&!this.hasController;return{inline:o,delegate:this.workingDelegate=o?this.delegate||this.coreDelegate:this.delegate}}async present(t){const o=await this.lockController.lock();if(this.presented)return void o();const{el:e}=this,{inline:r,delegate:i}=this.getDelegate(!0);this.ionMount.emit(),this.usersElement=await g(i,e,this.component,["popover-viewport"],this.componentProps,r),this.recalculateContentOnHeaderReady(),this.keyboardEvents||this.configureKeyboardInteraction(),this.configureDismissInteraction(),w(e)?await T(this.usersElement):this.keepContentsMounted||await I(),await d(this,"popoverEnter",H,M,{event:t||this.event,size:this.size,trigger:this.triggerEl,reference:this.reference,side:this.side,align:this.alignment}),this.focusDescendantOnPresent&&c(e),o()}recalculateContentOnHeaderReady(){var t;const o=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector(".popover-content");if(!o)return;const e=this.usersElement||o,r=e.querySelector("ion-header"),i=e.querySelectorAll("ion-content");r&&0!==i.length&&(this.headerResizeObserver=new ResizeObserver((async()=>{var t;if(r.offsetHeight>0){null===(t=this.headerResizeObserver)||void 0===t||t.disconnect(),this.headerResizeObserver=void 0;for(const t of i)await t.recalculateDimensions()}})),this.headerResizeObserver.observe(r))}async dismiss(t,o,e=!0){const r=await this.lockController.lock(),{destroyKeyboardInteraction:i,destroyDismissInteraction:s}=this;e&&this.parentPopover&&this.parentPopover.dismiss(t,o,e);const n=await h(this,t,o,"popoverLeave",F,V,this.event);if(n){i&&(i(),this.destroyKeyboardInteraction=void 0),s&&(s(),this.destroyDismissInteraction=void 0);const{delegate:t}=this.getDelegate();await m(t,this.usersElement)}return r(),n}async getParentPopover(){return this.parentPopover}onDidDismiss(){return l(this.el,"ionPopoverDidDismiss")}onWillDismiss(){return l(this.el,"ionPopoverWillDismiss")}render(){const t=y(this),{onLifecycle:o,parentPopover:e,dismissOnSelect:s,side:n,arrow:a,htmlAttributes:p,focusTrap:d}=this,c=D("desktop"),h=a&&!e;return r(i,Object.assign({key:"42863f748c93f709d433931d969230137b37d42d","aria-modal":"true","no-router":!0,tabindex:"-1"},p,{style:{zIndex:`${2e4+this.overlayIndex}`},class:Object.assign(Object.assign({},P(this.cssClass)),{[t]:!0,"popover-translucent":this.translucent,"overlay-hidden":!0,"popover-desktop":c,[`popover-side-${n}`]:!0,[v]:!1===d,"popover-nested":!!e}),onIonPopoverDidPresent:o,onIonPopoverWillPresent:o,onIonPopoverWillDismiss:o,onIonPopoverDidDismiss:o,onIonBackdropTap:this.onBackdropTap}),!e&&r("ion-backdrop",{key:"22b6d82178b52158b76ab3fd9a7dd738fd6e4bbf",tappable:this.backdropDismiss,visible:this.showBackdrop,part:"backdrop"}),r("div",{key:"b76335c64e992a964ed3fb91d17a992c3474b4cd",class:"popover-wrapper ion-overlay-wrapper",onClick:s?()=>this.dismiss():void 0},h&&r("div",{key:"018c846c32e7ff7fa010528e6b37a17e5f03c84c",class:"popover-arrow",part:"arrow"}),r("div",{key:"350c468c80052da3a07768bceab98fe159c35a43",class:"popover-content",part:"content"},r("slot",{key:"686443c17ac9873d33905c1cdb67e6d6da675282"}))))}get el(){return s(this)}static get watchers(){return{trigger:["onTriggerChange"],triggerAction:["onTriggerChange"],isOpen:["onIsOpenChange"]}}},U={ionPopoverDidPresent:"ionViewDidEnter",ionPopoverWillPresent:"ionViewWillEnter",ionPopoverWillDismiss:"ionViewWillLeave",ionPopoverDidDismiss:"ionViewDidLeave"};S.style={ios:':host{--background:var(--ion-background-color, #fff);--min-width:0;--min-height:0;--max-width:auto;--height:auto;--offset-x:0px;--offset-y:0px;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);z-index:1001}:host(.popover-nested){pointer-events:none}:host(.popover-nested) .popover-wrapper{pointer-events:auto}:host(.overlay-hidden){display:none}.popover-wrapper{z-index:10}.popover-content{display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;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);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:auto;z-index:10}::slotted(.popover-viewport){--ion-safe-area-top:0px;--ion-safe-area-right:0px;--ion-safe-area-bottom:0px;--ion-safe-area-left:0px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.popover-nested.popover-side-left){--offset-x:5px}:host(.popover-nested.popover-side-right){--offset-x:-5px}:host(.popover-nested.popover-side-start){--offset-x:5px}:host-context([dir=rtl]):host(.popover-nested.popover-side-start),:host-context([dir=rtl]).popover-nested.popover-side-start{--offset-x:-5px}@supports selector(:dir(rtl)){:host(.popover-nested.popover-side-start:dir(rtl)){--offset-x:-5px}}:host(.popover-nested.popover-side-end){--offset-x:-5px}:host-context([dir=rtl]):host(.popover-nested.popover-side-end),:host-context([dir=rtl]).popover-nested.popover-side-end{--offset-x:5px}@supports selector(:dir(rtl)){:host(.popover-nested.popover-side-end:dir(rtl)){--offset-x:5px}}:host{--width:200px;--max-height:90%;--box-shadow:none;--backdrop-opacity:var(--ion-backdrop-opacity, 0.08)}:host(.popover-desktop){--box-shadow:0px 4px 16px 0px rgba(0, 0, 0, 0.12)}.popover-content{border-radius:10px}:host(.popover-desktop) .popover-content{border:0.5px solid var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6))}.popover-arrow{display:block;position:absolute;width:20px;height:10px;overflow:hidden;z-index:11}.popover-arrow::after{top:3px;border-radius:3px;position:absolute;width:14px;height:14px;-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--background);content:"";z-index:10}.popover-arrow::after{inset-inline-start:3px}:host(.popover-bottom) .popover-arrow{top:auto;bottom:-10px}:host(.popover-bottom) .popover-arrow::after{top:-6px}:host(.popover-side-left) .popover-arrow{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host(.popover-side-right) .popover-arrow{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}:host(.popover-side-top) .popover-arrow{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host(.popover-side-start) .popover-arrow{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host-context([dir=rtl]):host(.popover-side-start) .popover-arrow,:host-context([dir=rtl]).popover-side-start .popover-arrow{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}@supports selector(:dir(rtl)){:host(.popover-side-start:dir(rtl)) .popover-arrow{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}}:host(.popover-side-end) .popover-arrow{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}:host-context([dir=rtl]):host(.popover-side-end) .popover-arrow,:host-context([dir=rtl]).popover-side-end .popover-arrow{-webkit-transform:rotate(90deg);transform:rotate(90deg)}@supports selector(:dir(rtl)){:host(.popover-side-end:dir(rtl)) .popover-arrow{-webkit-transform:rotate(90deg);transform:rotate(90deg)}}.popover-arrow,.popover-content{opacity:0}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.popover-translucent) .popover-content,:host(.popover-translucent) .popover-arrow::after{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}',md:":host{--background:var(--ion-background-color, #fff);--min-width:0;--min-height:0;--max-width:auto;--height:auto;--offset-x:0px;--offset-y:0px;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:fixed;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;outline:none;color:var(--ion-text-color, #000);z-index:1001}:host(.popover-nested){pointer-events:none}:host(.popover-nested) .popover-wrapper{pointer-events:auto}:host(.overlay-hidden){display:none}.popover-wrapper{z-index:10}.popover-content{display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;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);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);overflow:auto;z-index:10}::slotted(.popover-viewport){--ion-safe-area-top:0px;--ion-safe-area-right:0px;--ion-safe-area-bottom:0px;--ion-safe-area-left:0px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.popover-nested.popover-side-left){--offset-x:5px}:host(.popover-nested.popover-side-right){--offset-x:-5px}:host(.popover-nested.popover-side-start){--offset-x:5px}:host-context([dir=rtl]):host(.popover-nested.popover-side-start),:host-context([dir=rtl]).popover-nested.popover-side-start{--offset-x:-5px}@supports selector(:dir(rtl)){:host(.popover-nested.popover-side-start:dir(rtl)){--offset-x:-5px}}:host(.popover-nested.popover-side-end){--offset-x:-5px}:host-context([dir=rtl]):host(.popover-nested.popover-side-end),:host-context([dir=rtl]).popover-nested.popover-side-end{--offset-x:5px}@supports selector(:dir(rtl)){:host(.popover-nested.popover-side-end:dir(rtl)){--offset-x:5px}}:host{--width:250px;--max-height:90%;--box-shadow:0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);--backdrop-opacity:var(--ion-backdrop-opacity, 0.32)}.popover-content{border-radius:4px;-webkit-transform-origin:left top;transform-origin:left top}:host-context([dir=rtl]) .popover-content{-webkit-transform-origin:right top;transform-origin:right top}[dir=rtl] .popover-content{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.popover-content:dir(rtl){-webkit-transform-origin:right top;transform-origin:right top}}.popover-viewport{-webkit-transition-delay:100ms;transition-delay:100ms}.popover-wrapper{opacity:0}"};export{S as ion_popover}
|