@ionic/core 8.8.4-dev.11775078622.1402ffa2 → 8.8.4-nightly.20260402
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/index.js +1 -1
- package/components/ion-action-sheet.js +1 -1
- package/components/ion-alert.js +1 -1
- package/components/ion-datetime.js +1 -1
- package/components/ion-loading.js +1 -1
- package/components/ion-menu.js +1 -1
- package/components/ion-modal.js +1 -1
- package/components/ion-picker-legacy.js +1 -1
- package/components/ion-popover.js +1 -1
- package/components/ion-select-modal.js +1 -1
- package/components/ion-select-popover.js +1 -1
- package/components/ion-select.js +1 -1
- package/components/ion-toast.js +1 -1
- package/components/p-1KVKSLu5.js +4 -0
- package/components/p-BVnB3eEn.js +4 -0
- package/components/p-CH0NYjKq.js +4 -0
- package/components/p-Cq8cQ0NL.js +4 -0
- package/components/{p-BZ6v19WN.js → p-D6pdfDIA.js} +1 -1
- package/components/p-DHsZWn1l.js +4 -0
- package/components/{p-MT7pYfQI.js → p-e-EDj2CO.js} +1 -1
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/ion-action-sheet.cjs.entry.js +4 -8
- package/dist/cjs/ion-alert.cjs.entry.js +3 -7
- package/dist/cjs/ion-datetime_3.cjs.entry.js +3 -7
- package/dist/cjs/ion-loading.cjs.entry.js +3 -7
- package/dist/cjs/ion-menu_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-modal.cjs.entry.js +5 -9
- package/dist/cjs/ion-popover.cjs.entry.js +3 -7
- package/dist/cjs/ion-select-modal.cjs.entry.js +1 -1
- package/dist/cjs/ion-select_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-toast.cjs.entry.js +1 -1
- package/dist/cjs/{overlays-MjvhwPt2.js → overlays-C2jiBSNQ.js} +0 -24
- package/dist/collection/components/action-sheet/action-sheet.js +4 -8
- package/dist/collection/components/alert/alert.js +3 -7
- package/dist/collection/components/loading/loading.js +3 -7
- package/dist/collection/components/modal/modal.js +5 -9
- package/dist/collection/components/picker-legacy/picker.js +3 -7
- package/dist/collection/components/popover/popover.js +3 -7
- package/dist/collection/utils/overlays.js +0 -23
- package/dist/docs.json +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/ion-action-sheet.entry.js +4 -8
- package/dist/esm/ion-alert.entry.js +3 -7
- package/dist/esm/ion-datetime_3.entry.js +3 -7
- package/dist/esm/ion-loading.entry.js +3 -7
- package/dist/esm/ion-menu_3.entry.js +1 -1
- package/dist/esm/ion-modal.entry.js +5 -9
- package/dist/esm/ion-popover.entry.js +3 -7
- package/dist/esm/ion-select-modal.entry.js +1 -1
- package/dist/esm/ion-select_3.entry.js +1 -1
- package/dist/esm/ion-toast.entry.js +1 -1
- package/dist/esm/{overlays-CCsdmuZR.js → overlays-F8GHPo-e.js} +1 -24
- package/dist/ionic/index.esm.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-16b65553.entry.js +4 -0
- package/dist/ionic/p-1b02923f.entry.js +4 -0
- package/dist/ionic/p-23fac490.entry.js +4 -0
- package/dist/ionic/{p-e2e9d04e.entry.js → p-4dd5e8e0.entry.js} +1 -1
- package/dist/ionic/p-51c11c47.entry.js +4 -0
- package/dist/ionic/p-5b52aa7d.entry.js +4 -0
- package/dist/ionic/{p-c1854ee5.entry.js → p-7620be24.entry.js} +1 -1
- package/dist/ionic/p-7ca71c83.entry.js +4 -0
- package/dist/ionic/p-DTPR1Wpn.js +4 -0
- package/dist/ionic/{p-f5506e4e.entry.js → p-e6c5f060.entry.js} +1 -1
- package/dist/ionic/{p-cfeb806a.entry.js → p-f69a5f71.entry.js} +1 -1
- package/dist/types/utils/overlays.d.ts +0 -10
- package/hydrate/index.js +15 -62
- package/hydrate/index.mjs +15 -62
- package/package.json +1 -1
- package/components/p-0npDmDEs.js +0 -4
- package/components/p-7hlGym-0.js +0 -4
- package/components/p-BO_M4HrR.js +0 -4
- package/components/p-C5gHGV8-.js +0 -4
- package/components/p-CWnwVrC4.js +0 -4
- package/dist/ionic/p-2876a692.entry.js +0 -4
- package/dist/ionic/p-50b13f63.entry.js +0 -4
- package/dist/ionic/p-53399c0b.entry.js +0 -4
- package/dist/ionic/p-80bea9dd.entry.js +0 -4
- package/dist/ionic/p-Bx-dQ-64.js +0 -4
- package/dist/ionic/p-c7f46ed5.entry.js +0 -4
- package/dist/ionic/p-f83088b5.entry.js +0 -4
|
@@ -513,29 +513,6 @@ const setRootAriaHidden = (hidden = false) => {
|
|
|
513
513
|
viewContainer.removeAttribute('aria-hidden');
|
|
514
514
|
}
|
|
515
515
|
};
|
|
516
|
-
/**
|
|
517
|
-
* Cleans up root `aria-hidden` and `backdrop-no-scroll` when
|
|
518
|
-
* an overlay is removed from the DOM without going through
|
|
519
|
-
* the `dismiss()` flow (e.g., when a framework unmounts the
|
|
520
|
-
* overlay during a route change).
|
|
521
|
-
*
|
|
522
|
-
* Should be called from an overlay's `disconnectedCallback`
|
|
523
|
-
* when the overlay was still presented at the time of removal.
|
|
524
|
-
*/
|
|
525
|
-
const cleanupRootFocusTrapAccessibility = () => {
|
|
526
|
-
if (typeof document === 'undefined') {
|
|
527
|
-
return;
|
|
528
|
-
}
|
|
529
|
-
const remainingOverlays = getPresentedOverlays(document);
|
|
530
|
-
const hasRemainingLocking = remainingOverlays.some((o) => {
|
|
531
|
-
const el = o;
|
|
532
|
-
return el.tagName !== 'ION-TOAST' && el.focusTrap !== false && isBackdropAlwaysBlocking(el);
|
|
533
|
-
});
|
|
534
|
-
if (!hasRemainingLocking) {
|
|
535
|
-
setRootAriaHidden(false);
|
|
536
|
-
document.body.classList.remove(gestureController.BACKDROP_NO_SCROLL);
|
|
537
|
-
}
|
|
538
|
-
};
|
|
539
516
|
const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts) => {
|
|
540
517
|
var _a, _b;
|
|
541
518
|
if (overlay.presented) {
|
|
@@ -943,7 +920,6 @@ exports.GESTURE = GESTURE;
|
|
|
943
920
|
exports.OVERLAY_GESTURE_PRIORITY = OVERLAY_GESTURE_PRIORITY;
|
|
944
921
|
exports.actionSheetController = actionSheetController;
|
|
945
922
|
exports.alertController = alertController;
|
|
946
|
-
exports.cleanupRootFocusTrapAccessibility = cleanupRootFocusTrapAccessibility;
|
|
947
923
|
exports.createDelegateController = createDelegateController;
|
|
948
924
|
exports.createTriggerController = createTriggerController;
|
|
949
925
|
exports.dismiss = dismiss;
|
|
@@ -5,7 +5,7 @@ import { Host, h, readTask } from "@stencil/core";
|
|
|
5
5
|
import { createButtonActiveGesture } from "../../utils/gesture/button-active";
|
|
6
6
|
import { raf } from "../../utils/helpers";
|
|
7
7
|
import { createLockController } from "../../utils/lock-controller";
|
|
8
|
-
import { BACKDROP,
|
|
8
|
+
import { BACKDROP, createDelegateController, createTriggerController, dismiss, eventMethod, isCancel, prepareOverlay, present, safeCall, setOverlayId, } from "../../utils/overlays";
|
|
9
9
|
import { getClassMap } from "../../utils/theme";
|
|
10
10
|
import { getIonMode } from "../../global/ionic-global";
|
|
11
11
|
import { iosEnterAnimation } from "./animations/ios.enter";
|
|
@@ -284,10 +284,6 @@ export class ActionSheet {
|
|
|
284
284
|
this.gesture = undefined;
|
|
285
285
|
}
|
|
286
286
|
this.triggerController.removeClickListener();
|
|
287
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
288
|
-
if (this.presented) {
|
|
289
|
-
cleanupRootFocusTrapAccessibility();
|
|
290
|
-
}
|
|
291
287
|
}
|
|
292
288
|
componentWillLoad() {
|
|
293
289
|
var _a;
|
|
@@ -391,12 +387,12 @@ export class ActionSheet {
|
|
|
391
387
|
const cancelButton = allButtons.find((b) => b.role === 'cancel');
|
|
392
388
|
const buttons = allButtons.filter((b) => b.role !== 'cancel');
|
|
393
389
|
const headerID = `action-sheet-${overlayIndex}-header`;
|
|
394
|
-
return (h(Host, Object.assign({ key: '
|
|
390
|
+
return (h(Host, Object.assign({ key: '173fcff5b1da7c33c267de4667591c946b8c8d03', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
|
|
395
391
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
396
|
-
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '
|
|
392
|
+
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '521ede659f747864f6c974e09016436eceb7158c', tappable: this.backdropDismiss }), h("div", { key: '7a7946fc434bc444f16a70638f5e948c69d33fcd', tabindex: "0", "aria-hidden": "true" }), h("div", { key: 'bcff39a580489dbafa255842e57aa8602c6d0f18', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '84bba13ce14261f0f0daa3f9c77648c9e7f36e0e', class: "action-sheet-container" }, h("div", { key: 'd9c8ac404fd6719a7adf8cb36549f67616f9a0c4', class: "action-sheet-group", ref: (el) => (this.groupEl = el), role: hasRadioButtons ? 'radiogroup' : undefined }, header !== undefined && (h("div", { key: '180433a8ad03ef5c54728a1a8f34715b6921d658', id: headerID, class: {
|
|
397
393
|
'action-sheet-title': true,
|
|
398
394
|
'action-sheet-has-sub-title': this.subHeader !== undefined,
|
|
399
|
-
} }, header, this.subHeader && h("div", { key: '
|
|
395
|
+
} }, header, this.subHeader && h("div", { key: '7138e79e61b1a8f42bc5a9175c57fa2f15d7ec5a', class: "action-sheet-sub-title" }, this.subHeader))), this.renderActionSheetButtons(buttons)), cancelButton && (h("div", { key: 'b617c722f5b8028d73ed34b69310f312c65f34a7', class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({ key: 'd0dd876fc48815df3710413c201c0b445a8e16c0' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { key: 'e7b960157cc6fc5fe92a12090b2be55e8ae072e4', class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { key: '05498ffc60cab911dbff0ecbc6168dea59ada9a5', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", { key: '3d401346cea301be4ca03671f7370f6f4b0b6bde' })))))), h("div", { key: '971f3c5fcc07f36c28eb469a47ec0290c692e139', tabindex: "0", "aria-hidden": "true" })));
|
|
400
396
|
}
|
|
401
397
|
static get is() { return "ion-action-sheet"; }
|
|
402
398
|
static get encapsulation() { return "scoped"; }
|
|
@@ -7,7 +7,7 @@ import { createButtonActiveGesture } from "../../utils/gesture/button-active";
|
|
|
7
7
|
import { raf } from "../../utils/helpers";
|
|
8
8
|
import { createLockController } from "../../utils/lock-controller";
|
|
9
9
|
import { printIonWarning } from "../../utils/logging/index";
|
|
10
|
-
import {
|
|
10
|
+
import { createDelegateController, createTriggerController, BACKDROP, dismiss, eventMethod, isCancel, prepareOverlay, present, safeCall, setOverlayId, } from "../../utils/overlays";
|
|
11
11
|
import { sanitizeDOMString } from "../../utils/sanitization/index";
|
|
12
12
|
import { getClassMap } from "../../utils/theme";
|
|
13
13
|
import { config } from "../../global/config";
|
|
@@ -207,10 +207,6 @@ export class Alert {
|
|
|
207
207
|
this.gesture.destroy();
|
|
208
208
|
this.gesture = undefined;
|
|
209
209
|
}
|
|
210
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
211
|
-
if (this.presented) {
|
|
212
|
-
cleanupRootFocusTrapAccessibility();
|
|
213
|
-
}
|
|
214
210
|
}
|
|
215
211
|
componentDidLoad() {
|
|
216
212
|
/**
|
|
@@ -444,9 +440,9 @@ export class Alert {
|
|
|
444
440
|
* If neither are defined, do not set aria-labelledby.
|
|
445
441
|
*/
|
|
446
442
|
const ariaLabelledBy = header && subHeader ? `${hdrId} ${subHdrId}` : header ? hdrId : subHeader ? subHdrId : null;
|
|
447
|
-
return (h(Host, { key: '
|
|
443
|
+
return (h(Host, { key: '6025440b9cd369d4fac89e7e4296c84a10a0b8e0', tabindex: "-1", style: {
|
|
448
444
|
zIndex: `${20000 + overlayIndex}`,
|
|
449
|
-
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }, h("ion-backdrop", { key: '
|
|
445
|
+
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }, h("ion-backdrop", { key: '3cd5ca8b99cb95b11dd22ab41a820d841142896f', tappable: this.backdropDismiss }), h("div", { key: '4cc62ae6e21424057d22aeef1e8fc77011e77cd5', tabindex: "0", "aria-hidden": "true" }), h("div", Object.assign({ key: '364057a69f25aa88904df17bdcf7e5bf714e7830', class: "alert-wrapper ion-overlay-wrapper", role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "0", ref: (el) => (this.wrapperEl = el) }, htmlAttributes), h("div", { key: '78694e3c0db2d408df3899fb1a90859bcc8d14cc', class: "alert-head" }, header && (h("h2", { key: 'ec88ff3e4e1ea871b5975133fdcf4cac38b05e0f', id: hdrId, class: "alert-title" }, header)), subHeader && !header && (h("h2", { key: '9b09bc8bb68af255ef8b7d22587acc946148e544', id: subHdrId, class: "alert-sub-title" }, subHeader)), subHeader && header && (h("h3", { key: '99abe815f75d2df7f1b77c0df9f3436724fea76f', id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: 'a43d0c22c0e46b1ef911f92ffeb253d7911b85f7', tabindex: "0", "aria-hidden": "true" })));
|
|
450
446
|
}
|
|
451
447
|
static get is() { return "ion-alert"; }
|
|
452
448
|
static get encapsulation() { return "scoped"; }
|
|
@@ -5,7 +5,7 @@ import { Host, h } from "@stencil/core";
|
|
|
5
5
|
import { ENABLE_HTML_CONTENT_DEFAULT } from "../../utils/config";
|
|
6
6
|
import { raf } from "../../utils/helpers";
|
|
7
7
|
import { createLockController } from "../../utils/lock-controller";
|
|
8
|
-
import { BACKDROP,
|
|
8
|
+
import { BACKDROP, dismiss, eventMethod, prepareOverlay, present, createDelegateController, createTriggerController, setOverlayId, } from "../../utils/overlays";
|
|
9
9
|
import { sanitizeDOMString } from "../../utils/sanitization/index";
|
|
10
10
|
import { getClassMap } from "../../utils/theme";
|
|
11
11
|
import { config } from "../../global/config";
|
|
@@ -114,10 +114,6 @@ export class Loading {
|
|
|
114
114
|
}
|
|
115
115
|
disconnectedCallback() {
|
|
116
116
|
this.triggerController.removeClickListener();
|
|
117
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
118
|
-
if (this.presented) {
|
|
119
|
-
cleanupRootFocusTrapAccessibility();
|
|
120
|
-
}
|
|
121
117
|
}
|
|
122
118
|
/**
|
|
123
119
|
* Present the loading overlay after it has been created.
|
|
@@ -183,9 +179,9 @@ export class Loading {
|
|
|
183
179
|
* Otherwise, don't set aria-labelledby.
|
|
184
180
|
*/
|
|
185
181
|
const ariaLabelledBy = message !== undefined ? msgId : null;
|
|
186
|
-
return (h(Host, Object.assign({ key: '
|
|
182
|
+
return (h(Host, Object.assign({ key: 'f86ddbc600cb5c396b7de38fb5f49625388c3c3f', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
|
|
187
183
|
zIndex: `${40000 + this.overlayIndex}`,
|
|
188
|
-
}, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), h("ion-backdrop", { key: '
|
|
184
|
+
}, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), h("ion-backdrop", { key: 'b53727aaddc37ef3c685fcc150c6d5193290a847', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '4c61bede8e0a4e47daa6f1f9d0f364ef6aec0bc3', tabindex: "0", "aria-hidden": "true" }), h("div", { key: '84e51ceb07118f1eaeb757df28801c255496931b', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (h("div", { key: 'fc97f1912e0fc558b7c309a5bc084415f5f620b2', class: "loading-spinner" }, h("ion-spinner", { key: '6e186d856cd3f10f22c3e317ef00f31b4216459c', name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), h("div", { key: 'dcbe9d9a619daa1c08174e73827bdabeb59dde92', tabindex: "0", "aria-hidden": "true" })));
|
|
189
185
|
}
|
|
190
186
|
static get is() { return "ion-loading"; }
|
|
191
187
|
static get encapsulation() { return "scoped"; }
|
|
@@ -8,7 +8,7 @@ import { raf, inheritAttributes, hasLazyBuild, getElementRoot } from "../../util
|
|
|
8
8
|
import { createLockController } from "../../utils/lock-controller";
|
|
9
9
|
import { printIonWarning } from "../../utils/logging/index";
|
|
10
10
|
import { Style as StatusBarStyle, StatusBar } from "../../utils/native/status-bar";
|
|
11
|
-
import {
|
|
11
|
+
import { GESTURE, BACKDROP, dismiss, eventMethod, prepareOverlay, present, createTriggerController, setOverlayId, FOCUS_TRAP_DISABLE_CLASS, } from "../../utils/overlays";
|
|
12
12
|
import { getClassMap } from "../../utils/theme";
|
|
13
13
|
import { deepReady, waitForMount } from "../../utils/transition/index";
|
|
14
14
|
import { config } from "../../global/config";
|
|
@@ -277,10 +277,6 @@ export class Modal {
|
|
|
277
277
|
// Also called in dismiss() — intentional dual cleanup covers both
|
|
278
278
|
// dismiss-then-remove and direct DOM removal without dismiss.
|
|
279
279
|
this.cleanupSafeAreaOverrides();
|
|
280
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
281
|
-
if (this.presented) {
|
|
282
|
-
cleanupRootFocusTrapAccessibility();
|
|
283
|
-
}
|
|
284
280
|
}
|
|
285
281
|
componentWillLoad() {
|
|
286
282
|
var _a;
|
|
@@ -1137,20 +1133,20 @@ export class Modal {
|
|
|
1137
1133
|
const isCardModal = presentingElement !== undefined && mode === 'ios';
|
|
1138
1134
|
const isHandleCycle = handleBehavior === 'cycle';
|
|
1139
1135
|
const isSheetModalWithHandle = isSheetModal && showHandle;
|
|
1140
|
-
return (h(Host, Object.assign({ key: '
|
|
1136
|
+
return (h(Host, Object.assign({ key: '1a53e8f87532abccc169ca4b24973a39c5f9ba16', "no-router": true,
|
|
1141
1137
|
// Allow the modal to be navigable when the handle is focusable
|
|
1142
1138
|
tabIndex: isHandleCycle && isSheetModalWithHandle ? 0 : -1 }, htmlAttributes, { style: {
|
|
1143
1139
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
1144
|
-
}, 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 }), h("ion-backdrop", { key: '
|
|
1140
|
+
}, 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 }), h("ion-backdrop", { key: 'fa8e0a436c0d458331402e1850f87af3dc97b582', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && h("div", { key: 'f00de6027d3c8b5bc93db3b0f7a50a87628d40bb', class: "modal-shadow" }), h("div", Object.assign({ key: 'ae5e33bd6c58e541edb2edbca92420ea02dd5175',
|
|
1145
1141
|
/*
|
|
1146
1142
|
role and aria-modal must be used on the
|
|
1147
1143
|
same element. They must also be set inside the
|
|
1148
1144
|
shadow DOM otherwise ion-button will not be highlighted
|
|
1149
1145
|
when using VoiceOver: https://bugs.webkit.org/show_bug.cgi?id=247134
|
|
1150
1146
|
*/
|
|
1151
|
-
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (h("button", { key: '
|
|
1147
|
+
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (h("button", { key: '141cdd8f8522331f4b764e2a4d79ec6596b1eb3a', class: "modal-handle",
|
|
1152
1148
|
// Prevents the handle from receiving keyboard focus when it does not cycle
|
|
1153
|
-
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) })), h("slot", { key: '
|
|
1149
|
+
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) })), h("slot", { key: '7de20298b61abee67a16d275c9ebd9a25ce7dd26', onSlotchange: this.onSlotChange }))));
|
|
1154
1150
|
}
|
|
1155
1151
|
static get is() { return "ion-modal"; }
|
|
1156
1152
|
static get encapsulation() { return "shadow"; }
|
|
@@ -5,7 +5,7 @@ import { Host, h } from "@stencil/core";
|
|
|
5
5
|
import { raf } from "../../utils/helpers";
|
|
6
6
|
import { createLockController } from "../../utils/lock-controller";
|
|
7
7
|
import { printIonWarning } from "../../utils/logging/index";
|
|
8
|
-
import {
|
|
8
|
+
import { createDelegateController, createTriggerController, BACKDROP, dismiss, eventMethod, isCancel, prepareOverlay, present, safeCall, setOverlayId, } from "../../utils/overlays";
|
|
9
9
|
import { getClassMap } from "../../utils/theme";
|
|
10
10
|
import { getIonMode } from "../../global/ionic-global";
|
|
11
11
|
import { iosEnterAnimation } from "./animations/ios.enter";
|
|
@@ -89,10 +89,6 @@ export class Picker {
|
|
|
89
89
|
}
|
|
90
90
|
disconnectedCallback() {
|
|
91
91
|
this.triggerController.removeClickListener();
|
|
92
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
93
|
-
if (this.presented) {
|
|
94
|
-
cleanupRootFocusTrapAccessibility();
|
|
95
|
-
}
|
|
96
92
|
}
|
|
97
93
|
componentWillLoad() {
|
|
98
94
|
var _a;
|
|
@@ -211,11 +207,11 @@ export class Picker {
|
|
|
211
207
|
render() {
|
|
212
208
|
const { htmlAttributes } = this;
|
|
213
209
|
const mode = getIonMode(this);
|
|
214
|
-
return (h(Host, Object.assign({ key: '
|
|
210
|
+
return (h(Host, Object.assign({ key: '80f66d33780d8a1352d24be9cb63a0cc03d01ab5', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
|
|
215
211
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
216
212
|
}, class: Object.assign({ [mode]: true,
|
|
217
213
|
// Used internally for styling
|
|
218
|
-
[`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '
|
|
214
|
+
[`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '97fb8e10ba08b197610cb8c0cdea61103883d55f', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: 'b3969cb6fbf7153623d14e3ca1493d3370efb211', tabindex: "0", "aria-hidden": "true" }), h("div", { key: '299268483c3727e698d9135bfdf40349a7050ac1', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, h("div", { key: '95394de3ef691899b7dbf416f56fd3e86bbdce3f', class: "picker-toolbar" }, this.buttons.map((b) => (h("div", { class: buttonWrapperClass(b) }, h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), h("div", { key: '05f18bb8d00dc0e22f691b7e41f90f729a6c66d7', class: "picker-columns" }, h("div", { key: '4a8fdf224effc0af67fd413e2e6aca8a78d1cf43', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => h("ion-picker-legacy-column", { col: c })), h("div", { key: 'e50a31db45e3f39e9d0fed36a21be9257eec09bf', class: "picker-below-highlight" }))), h("div", { key: '5a78cb2176ac807ea0c195c6b76cd0e8eef9d4c0', tabindex: "0", "aria-hidden": "true" })));
|
|
219
215
|
}
|
|
220
216
|
static get is() { return "ion-picker-legacy"; }
|
|
221
217
|
static get encapsulation() { return "scoped"; }
|
|
@@ -7,7 +7,7 @@ import { CoreDelegate, attachComponent, detachComponent } from "../../utils/fram
|
|
|
7
7
|
import { addEventListener, raf, hasLazyBuild } from "../../utils/helpers";
|
|
8
8
|
import { createLockController } from "../../utils/lock-controller";
|
|
9
9
|
import { printIonWarning } from "../../utils/logging/index";
|
|
10
|
-
import { BACKDROP,
|
|
10
|
+
import { BACKDROP, dismiss, eventMethod, prepareOverlay, present, setOverlayId, FOCUS_TRAP_DISABLE_CLASS, } from "../../utils/overlays";
|
|
11
11
|
import { isPlatform } from "../../utils/platform";
|
|
12
12
|
import { getClassMap } from "../../utils/theme";
|
|
13
13
|
import { deepReady, waitForMount } from "../../utils/transition/index";
|
|
@@ -229,10 +229,6 @@ export class Popover {
|
|
|
229
229
|
this.headerResizeObserver.disconnect();
|
|
230
230
|
this.headerResizeObserver = undefined;
|
|
231
231
|
}
|
|
232
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
233
|
-
if (this.presented) {
|
|
234
|
-
cleanupRootFocusTrapAccessibility();
|
|
235
|
-
}
|
|
236
232
|
}
|
|
237
233
|
componentWillLoad() {
|
|
238
234
|
var _a, _b;
|
|
@@ -471,9 +467,9 @@ export class Popover {
|
|
|
471
467
|
const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes, focusTrap } = this;
|
|
472
468
|
const desktop = isPlatform('desktop');
|
|
473
469
|
const enableArrow = arrow && !parentPopover;
|
|
474
|
-
return (h(Host, Object.assign({ key: '
|
|
470
|
+
return (h(Host, Object.assign({ key: '2edd8333c630efbce59071f8a383e4326e928dbc', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
|
|
475
471
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
476
|
-
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && h("ion-backdrop", { key: '
|
|
472
|
+
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && h("ion-backdrop", { key: 'aac4e68b08197534375e8ea3f8c9ea0c10ab2af4', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), h("div", { key: 'b7f4ebf57d4148b32856b0075d286f454be8de5d', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && h("div", { key: '607d94c28d73e8e957175a7c0f6e8a99ec4dcd53', class: "popover-arrow", part: "arrow" }), h("div", { key: '4366a5a5de550c09895e923f345583508e1ec30c', class: "popover-content", part: "content" }, h("slot", { key: 'eb7886fbc99c15b667b7d825d24f1c12d9380f03' })))));
|
|
477
473
|
}
|
|
478
474
|
static get is() { return "ion-popover"; }
|
|
479
475
|
static get encapsulation() { return "shadow"; }
|
|
@@ -432,29 +432,6 @@ export const setRootAriaHidden = (hidden = false) => {
|
|
|
432
432
|
viewContainer.removeAttribute('aria-hidden');
|
|
433
433
|
}
|
|
434
434
|
};
|
|
435
|
-
/**
|
|
436
|
-
* Cleans up root `aria-hidden` and `backdrop-no-scroll` when
|
|
437
|
-
* an overlay is removed from the DOM without going through
|
|
438
|
-
* the `dismiss()` flow (e.g., when a framework unmounts the
|
|
439
|
-
* overlay during a route change).
|
|
440
|
-
*
|
|
441
|
-
* Should be called from an overlay's `disconnectedCallback`
|
|
442
|
-
* when the overlay was still presented at the time of removal.
|
|
443
|
-
*/
|
|
444
|
-
export const cleanupRootFocusTrapAccessibility = () => {
|
|
445
|
-
if (typeof document === 'undefined') {
|
|
446
|
-
return;
|
|
447
|
-
}
|
|
448
|
-
const remainingOverlays = getPresentedOverlays(document);
|
|
449
|
-
const hasRemainingLocking = remainingOverlays.some((o) => {
|
|
450
|
-
const el = o;
|
|
451
|
-
return el.tagName !== 'ION-TOAST' && el.focusTrap !== false && isBackdropAlwaysBlocking(el);
|
|
452
|
-
});
|
|
453
|
-
if (!hasRemainingLocking) {
|
|
454
|
-
setRootAriaHidden(false);
|
|
455
|
-
document.body.classList.remove(BACKDROP_NO_SCROLL);
|
|
456
|
-
}
|
|
457
|
-
};
|
|
458
435
|
export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts) => {
|
|
459
436
|
var _a, _b;
|
|
460
437
|
if (overlay.presented) {
|
package/dist/docs.json
CHANGED
package/dist/esm/index.js
CHANGED
|
@@ -13,7 +13,7 @@ export { L as LogLevel } from './index-IGIE5vDm.js';
|
|
|
13
13
|
export { I as IonicSafeString, g as getMode, s as setupConfig } from './config-TO1rZH52.js';
|
|
14
14
|
export { o as openURL } from './theme-DiVJyqlX.js';
|
|
15
15
|
export { m as menuController } from './index-B2KwgBLx.js';
|
|
16
|
-
export { b as actionSheetController, a as alertController, l as loadingController, m as modalController, p as pickerController, c as popoverController, t as toastController } from './overlays-
|
|
16
|
+
export { b as actionSheetController, a as alertController, l as loadingController, m as modalController, p as pickerController, c as popoverController, t as toastController } from './overlays-F8GHPo-e.js';
|
|
17
17
|
import './index-ZjP4CjeZ.js';
|
|
18
18
|
import './gesture-controller-BTEOs1at.js';
|
|
19
19
|
import './hardware-back-button-CTe4XmL7.js';
|
|
@@ -5,7 +5,7 @@ import { r as registerInstance, c as createEvent, a as readTask, h, d as Host, g
|
|
|
5
5
|
import { c as createButtonActiveGesture } from './button-active-BBx21brx.js';
|
|
6
6
|
import { r as raf } from './helpers-Tl8jw6S2.js';
|
|
7
7
|
import { c as createLockController } from './lock-controller-B-hirT0v.js';
|
|
8
|
-
import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, f as present, g as dismiss, h as eventMethod, s as safeCall, j as prepareOverlay, k as
|
|
8
|
+
import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, f as present, g as dismiss, h as eventMethod, s as safeCall, j as prepareOverlay, k as setOverlayId } from './overlays-F8GHPo-e.js';
|
|
9
9
|
import { g as getClassMap } from './theme-DiVJyqlX.js';
|
|
10
10
|
import { b as getIonMode } from './ionic-global-DfbeLwcV.js';
|
|
11
11
|
import { c as createAnimation } from './animation-CnGMT4ji.js';
|
|
@@ -383,10 +383,6 @@ const ActionSheet = class {
|
|
|
383
383
|
this.gesture = undefined;
|
|
384
384
|
}
|
|
385
385
|
this.triggerController.removeClickListener();
|
|
386
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
387
|
-
if (this.presented) {
|
|
388
|
-
cleanupRootFocusTrapAccessibility();
|
|
389
|
-
}
|
|
390
386
|
}
|
|
391
387
|
componentWillLoad() {
|
|
392
388
|
var _a;
|
|
@@ -490,12 +486,12 @@ const ActionSheet = class {
|
|
|
490
486
|
const cancelButton = allButtons.find((b) => b.role === 'cancel');
|
|
491
487
|
const buttons = allButtons.filter((b) => b.role !== 'cancel');
|
|
492
488
|
const headerID = `action-sheet-${overlayIndex}-header`;
|
|
493
|
-
return (h(Host, Object.assign({ key: '
|
|
489
|
+
return (h(Host, Object.assign({ key: '173fcff5b1da7c33c267de4667591c946b8c8d03', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
|
|
494
490
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
495
|
-
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '
|
|
491
|
+
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '521ede659f747864f6c974e09016436eceb7158c', tappable: this.backdropDismiss }), h("div", { key: '7a7946fc434bc444f16a70638f5e948c69d33fcd', tabindex: "0", "aria-hidden": "true" }), h("div", { key: 'bcff39a580489dbafa255842e57aa8602c6d0f18', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '84bba13ce14261f0f0daa3f9c77648c9e7f36e0e', class: "action-sheet-container" }, h("div", { key: 'd9c8ac404fd6719a7adf8cb36549f67616f9a0c4', class: "action-sheet-group", ref: (el) => (this.groupEl = el), role: hasRadioButtons ? 'radiogroup' : undefined }, header !== undefined && (h("div", { key: '180433a8ad03ef5c54728a1a8f34715b6921d658', id: headerID, class: {
|
|
496
492
|
'action-sheet-title': true,
|
|
497
493
|
'action-sheet-has-sub-title': this.subHeader !== undefined,
|
|
498
|
-
} }, header, this.subHeader && h("div", { key: '
|
|
494
|
+
} }, header, this.subHeader && h("div", { key: '7138e79e61b1a8f42bc5a9175c57fa2f15d7ec5a', class: "action-sheet-sub-title" }, this.subHeader))), this.renderActionSheetButtons(buttons)), cancelButton && (h("div", { key: 'b617c722f5b8028d73ed34b69310f312c65f34a7', class: "action-sheet-group action-sheet-group-cancel" }, h("button", Object.assign({ key: 'd0dd876fc48815df3710413c201c0b445a8e16c0' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass(cancelButton), onClick: () => this.buttonClick(cancelButton) }), h("span", { key: 'e7b960157cc6fc5fe92a12090b2be55e8ae072e4', class: "action-sheet-button-inner" }, cancelButton.icon && (h("ion-icon", { key: '05498ffc60cab911dbff0ecbc6168dea59ada9a5', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && h("ion-ripple-effect", { key: '3d401346cea301be4ca03671f7370f6f4b0b6bde' })))))), h("div", { key: '971f3c5fcc07f36c28eb469a47ec0290c692e139', tabindex: "0", "aria-hidden": "true" })));
|
|
499
495
|
}
|
|
500
496
|
get el() { return getElement(this); }
|
|
501
497
|
static get watchers() { return {
|
|
@@ -6,7 +6,7 @@ import { E as ENABLE_HTML_CONTENT_DEFAULT, a as sanitizeDOMString } from './conf
|
|
|
6
6
|
import { c as createButtonActiveGesture } from './button-active-BBx21brx.js';
|
|
7
7
|
import { r as raf } from './helpers-Tl8jw6S2.js';
|
|
8
8
|
import { c as createLockController } from './lock-controller-B-hirT0v.js';
|
|
9
|
-
import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay,
|
|
9
|
+
import { d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod, s as safeCall } from './overlays-F8GHPo-e.js';
|
|
10
10
|
import { g as getClassMap } from './theme-DiVJyqlX.js';
|
|
11
11
|
import { b as getIonMode } from './ionic-global-DfbeLwcV.js';
|
|
12
12
|
import { c as createAnimation } from './animation-CnGMT4ji.js';
|
|
@@ -303,10 +303,6 @@ const Alert = class {
|
|
|
303
303
|
this.gesture.destroy();
|
|
304
304
|
this.gesture = undefined;
|
|
305
305
|
}
|
|
306
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
307
|
-
if (this.presented) {
|
|
308
|
-
cleanupRootFocusTrapAccessibility();
|
|
309
|
-
}
|
|
310
306
|
}
|
|
311
307
|
componentDidLoad() {
|
|
312
308
|
/**
|
|
@@ -540,9 +536,9 @@ const Alert = class {
|
|
|
540
536
|
* If neither are defined, do not set aria-labelledby.
|
|
541
537
|
*/
|
|
542
538
|
const ariaLabelledBy = header && subHeader ? `${hdrId} ${subHdrId}` : header ? hdrId : subHeader ? subHdrId : null;
|
|
543
|
-
return (h(Host, { key: '
|
|
539
|
+
return (h(Host, { key: '6025440b9cd369d4fac89e7e4296c84a10a0b8e0', tabindex: "-1", style: {
|
|
544
540
|
zIndex: `${20000 + overlayIndex}`,
|
|
545
|
-
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }, h("ion-backdrop", { key: '
|
|
541
|
+
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }, h("ion-backdrop", { key: '3cd5ca8b99cb95b11dd22ab41a820d841142896f', tappable: this.backdropDismiss }), h("div", { key: '4cc62ae6e21424057d22aeef1e8fc77011e77cd5', tabindex: "0", "aria-hidden": "true" }), h("div", Object.assign({ key: '364057a69f25aa88904df17bdcf7e5bf714e7830', class: "alert-wrapper ion-overlay-wrapper", role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "0", ref: (el) => (this.wrapperEl = el) }, htmlAttributes), h("div", { key: '78694e3c0db2d408df3899fb1a90859bcc8d14cc', class: "alert-head" }, header && (h("h2", { key: 'ec88ff3e4e1ea871b5975133fdcf4cac38b05e0f', id: hdrId, class: "alert-title" }, header)), subHeader && !header && (h("h2", { key: '9b09bc8bb68af255ef8b7d22587acc946148e544', id: subHdrId, class: "alert-sub-title" }, subHeader)), subHeader && header && (h("h3", { key: '99abe815f75d2df7f1b77c0df9f3436724fea76f', id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: 'a43d0c22c0e46b1ef911f92ffeb253d7911b85f7', tabindex: "0", "aria-hidden": "true" })));
|
|
546
542
|
}
|
|
547
543
|
get el() { return getElement(this); }
|
|
548
544
|
static get watchers() { return {
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { j as printIonError, f as printIonWarning, r as registerInstance, c as createEvent, w as writeTask, h, d as Host, g as getElement } from './index-IGIE5vDm.js';
|
|
5
5
|
import { startFocusVisible } from './focus-visible-BmVRXR1y.js';
|
|
6
6
|
import { r as raf, g as getElementRoot, a as renderHiddenInput, e as clamp } from './helpers-Tl8jw6S2.js';
|
|
7
|
-
import { F as FOCUS_TRAP_DISABLE_CLASS, d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as
|
|
7
|
+
import { F as FOCUS_TRAP_DISABLE_CLASS, d as createDelegateController, e as createTriggerController, B as BACKDROP, i as isCancel, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod, s as safeCall } from './overlays-F8GHPo-e.js';
|
|
8
8
|
import { i as isRTL } from './dir-C53feagD.js';
|
|
9
9
|
import { c as createColorClasses, g as getClassMap } from './theme-DiVJyqlX.js';
|
|
10
10
|
import { l as chevronDown, o as caretUpSharp, p as chevronForward, q as caretDownSharp, c as chevronBack } from './index-DV3sJJW8.js';
|
|
@@ -2090,10 +2090,6 @@ const Picker = class {
|
|
|
2090
2090
|
}
|
|
2091
2091
|
disconnectedCallback() {
|
|
2092
2092
|
this.triggerController.removeClickListener();
|
|
2093
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
2094
|
-
if (this.presented) {
|
|
2095
|
-
cleanupRootFocusTrapAccessibility();
|
|
2096
|
-
}
|
|
2097
2093
|
}
|
|
2098
2094
|
componentWillLoad() {
|
|
2099
2095
|
var _a;
|
|
@@ -2212,11 +2208,11 @@ const Picker = class {
|
|
|
2212
2208
|
render() {
|
|
2213
2209
|
const { htmlAttributes } = this;
|
|
2214
2210
|
const mode = getIonMode(this);
|
|
2215
|
-
return (h(Host, Object.assign({ key: '
|
|
2211
|
+
return (h(Host, Object.assign({ key: '80f66d33780d8a1352d24be9cb63a0cc03d01ab5', "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
|
|
2216
2212
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
2217
2213
|
}, class: Object.assign({ [mode]: true,
|
|
2218
2214
|
// Used internally for styling
|
|
2219
|
-
[`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '
|
|
2215
|
+
[`picker-${mode}`]: true, 'overlay-hidden': true }, getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), h("ion-backdrop", { key: '97fb8e10ba08b197610cb8c0cdea61103883d55f', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: 'b3969cb6fbf7153623d14e3ca1493d3370efb211', tabindex: "0", "aria-hidden": "true" }), h("div", { key: '299268483c3727e698d9135bfdf40349a7050ac1', class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, h("div", { key: '95394de3ef691899b7dbf416f56fd3e86bbdce3f', class: "picker-toolbar" }, this.buttons.map((b) => (h("div", { class: buttonWrapperClass(b) }, h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), h("div", { key: '05f18bb8d00dc0e22f691b7e41f90f729a6c66d7', class: "picker-columns" }, h("div", { key: '4a8fdf224effc0af67fd413e2e6aca8a78d1cf43', class: "picker-above-highlight" }), this.presented && this.columns.map((c) => h("ion-picker-legacy-column", { col: c })), h("div", { key: 'e50a31db45e3f39e9d0fed36a21be9257eec09bf', class: "picker-below-highlight" }))), h("div", { key: '5a78cb2176ac807ea0c195c6b76cd0e8eef9d4c0', tabindex: "0", "aria-hidden": "true" })));
|
|
2220
2216
|
}
|
|
2221
2217
|
get el() { return getElement(this); }
|
|
2222
2218
|
static get watchers() { return {
|
|
@@ -5,7 +5,7 @@ import { r as registerInstance, c as createEvent, e as config, h, d as Host, g a
|
|
|
5
5
|
import { E as ENABLE_HTML_CONTENT_DEFAULT, a as sanitizeDOMString } from './config-TO1rZH52.js';
|
|
6
6
|
import { r as raf } from './helpers-Tl8jw6S2.js';
|
|
7
7
|
import { c as createLockController } from './lock-controller-B-hirT0v.js';
|
|
8
|
-
import { d as createDelegateController, e as createTriggerController, B as BACKDROP, j as prepareOverlay,
|
|
8
|
+
import { d as createDelegateController, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-F8GHPo-e.js';
|
|
9
9
|
import { g as getClassMap } from './theme-DiVJyqlX.js';
|
|
10
10
|
import { b as getIonMode } from './ionic-global-DfbeLwcV.js';
|
|
11
11
|
import { c as createAnimation } from './animation-CnGMT4ji.js';
|
|
@@ -211,10 +211,6 @@ const Loading = class {
|
|
|
211
211
|
}
|
|
212
212
|
disconnectedCallback() {
|
|
213
213
|
this.triggerController.removeClickListener();
|
|
214
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
215
|
-
if (this.presented) {
|
|
216
|
-
cleanupRootFocusTrapAccessibility();
|
|
217
|
-
}
|
|
218
214
|
}
|
|
219
215
|
/**
|
|
220
216
|
* Present the loading overlay after it has been created.
|
|
@@ -280,9 +276,9 @@ const Loading = class {
|
|
|
280
276
|
* Otherwise, don't set aria-labelledby.
|
|
281
277
|
*/
|
|
282
278
|
const ariaLabelledBy = message !== undefined ? msgId : null;
|
|
283
|
-
return (h(Host, Object.assign({ key: '
|
|
279
|
+
return (h(Host, Object.assign({ key: 'f86ddbc600cb5c396b7de38fb5f49625388c3c3f', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1" }, htmlAttributes, { style: {
|
|
284
280
|
zIndex: `${40000 + this.overlayIndex}`,
|
|
285
|
-
}, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), h("ion-backdrop", { key: '
|
|
281
|
+
}, onIonBackdropTap: this.onBackdropTap, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'loading-translucent': this.translucent }) }), h("ion-backdrop", { key: 'b53727aaddc37ef3c685fcc150c6d5193290a847', visible: this.showBackdrop, tappable: this.backdropDismiss }), h("div", { key: '4c61bede8e0a4e47daa6f1f9d0f364ef6aec0bc3', tabindex: "0", "aria-hidden": "true" }), h("div", { key: '84e51ceb07118f1eaeb757df28801c255496931b', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (h("div", { key: 'fc97f1912e0fc558b7c309a5bc084415f5f620b2', class: "loading-spinner" }, h("ion-spinner", { key: '6e186d856cd3f10f22c3e317ef00f31b4216459c', name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), h("div", { key: 'dcbe9d9a619daa1c08174e73827bdabeb59dde92', tabindex: "0", "aria-hidden": "true" })));
|
|
286
282
|
}
|
|
287
283
|
get el() { return getElement(this); }
|
|
288
284
|
static get watchers() { return {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { r as registerInstance, c as createEvent, e as config, j as printIonError, h, d as Host, g as getElement } from './index-IGIE5vDm.js';
|
|
5
5
|
import { g as getTimeGivenProgression } from './cubic-bezier-hHmYLOfE.js';
|
|
6
|
-
import {
|
|
6
|
+
import { o as getPresentedOverlay, B as BACKDROP, n as focusFirstDescendant, q as focusLastDescendant, G as GESTURE } from './overlays-F8GHPo-e.js';
|
|
7
7
|
import { G as GESTURE_CONTROLLER } from './gesture-controller-BTEOs1at.js';
|
|
8
8
|
import { shouldUseCloseWatcher } from './hardware-back-button-CTe4XmL7.js';
|
|
9
9
|
import { o as isEndSide, i as inheritAriaAttributes, l as assert, e as clamp } from './helpers-Tl8jw6S2.js';
|
|
@@ -7,7 +7,7 @@ import { C as CoreDelegate, a as attachComponent, d as detachComponent } from '.
|
|
|
7
7
|
import { e as clamp, g as getElementRoot, r as raf, b as inheritAttributes, h as hasLazyBuild } from './helpers-Tl8jw6S2.js';
|
|
8
8
|
import { c as createLockController } from './lock-controller-B-hirT0v.js';
|
|
9
9
|
import { g as getCapacitor } from './capacitor-CFERIeaU.js';
|
|
10
|
-
import { G as GESTURE, O as OVERLAY_GESTURE_PRIORITY, F as FOCUS_TRAP_DISABLE_CLASS, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as
|
|
10
|
+
import { G as GESTURE, O as OVERLAY_GESTURE_PRIORITY, F as FOCUS_TRAP_DISABLE_CLASS, e as createTriggerController, B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, g as dismiss, h as eventMethod } from './overlays-F8GHPo-e.js';
|
|
11
11
|
import { g as getClassMap } from './theme-DiVJyqlX.js';
|
|
12
12
|
import { e as deepReady, w as waitForMount } from './index-B-hkiOUh.js';
|
|
13
13
|
import { b as getIonMode } from './ionic-global-DfbeLwcV.js';
|
|
@@ -2056,10 +2056,6 @@ const Modal = class {
|
|
|
2056
2056
|
// Also called in dismiss() — intentional dual cleanup covers both
|
|
2057
2057
|
// dismiss-then-remove and direct DOM removal without dismiss.
|
|
2058
2058
|
this.cleanupSafeAreaOverrides();
|
|
2059
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
2060
|
-
if (this.presented) {
|
|
2061
|
-
cleanupRootFocusTrapAccessibility();
|
|
2062
|
-
}
|
|
2063
2059
|
}
|
|
2064
2060
|
componentWillLoad() {
|
|
2065
2061
|
var _a;
|
|
@@ -2908,20 +2904,20 @@ const Modal = class {
|
|
|
2908
2904
|
const isCardModal = presentingElement !== undefined && mode === 'ios';
|
|
2909
2905
|
const isHandleCycle = handleBehavior === 'cycle';
|
|
2910
2906
|
const isSheetModalWithHandle = isSheetModal && showHandle;
|
|
2911
|
-
return (h(Host, Object.assign({ key: '
|
|
2907
|
+
return (h(Host, Object.assign({ key: '1a53e8f87532abccc169ca4b24973a39c5f9ba16', "no-router": true,
|
|
2912
2908
|
// Allow the modal to be navigable when the handle is focusable
|
|
2913
2909
|
tabIndex: isHandleCycle && isSheetModalWithHandle ? 0 : -1 }, htmlAttributes, { style: {
|
|
2914
2910
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
2915
|
-
}, 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 }), h("ion-backdrop", { key: '
|
|
2911
|
+
}, 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 }), h("ion-backdrop", { key: 'fa8e0a436c0d458331402e1850f87af3dc97b582', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && h("div", { key: 'f00de6027d3c8b5bc93db3b0f7a50a87628d40bb', class: "modal-shadow" }), h("div", Object.assign({ key: 'ae5e33bd6c58e541edb2edbca92420ea02dd5175',
|
|
2916
2912
|
/*
|
|
2917
2913
|
role and aria-modal must be used on the
|
|
2918
2914
|
same element. They must also be set inside the
|
|
2919
2915
|
shadow DOM otherwise ion-button will not be highlighted
|
|
2920
2916
|
when using VoiceOver: https://bugs.webkit.org/show_bug.cgi?id=247134
|
|
2921
2917
|
*/
|
|
2922
|
-
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (h("button", { key: '
|
|
2918
|
+
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (h("button", { key: '141cdd8f8522331f4b764e2a4d79ec6596b1eb3a', class: "modal-handle",
|
|
2923
2919
|
// Prevents the handle from receiving keyboard focus when it does not cycle
|
|
2924
|
-
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) })), h("slot", { key: '
|
|
2920
|
+
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) })), h("slot", { key: '7de20298b61abee67a16d275c9ebd9a25ce7dd26', onSlotchange: this.onSlotChange }))));
|
|
2925
2921
|
}
|
|
2926
2922
|
get el() { return getElement(this); }
|
|
2927
2923
|
static get watchers() { return {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
3
|
*/
|
|
4
4
|
import { r as registerInstance, c as createEvent, f as printIonWarning, h, d as Host, g as getElement } from './index-IGIE5vDm.js';
|
|
5
|
-
import { B as BACKDROP, j as prepareOverlay, k as
|
|
5
|
+
import { B as BACKDROP, j as prepareOverlay, k as setOverlayId, f as present, n as focusFirstDescendant, g as dismiss, h as eventMethod, F as FOCUS_TRAP_DISABLE_CLASS } from './overlays-F8GHPo-e.js';
|
|
6
6
|
import { C as CoreDelegate, a as attachComponent, d as detachComponent } from './framework-delegate-CyxE1S_P.js';
|
|
7
7
|
import { g as getElementRoot, r as raf, f as addEventListener, h as hasLazyBuild } from './helpers-Tl8jw6S2.js';
|
|
8
8
|
import { c as createLockController } from './lock-controller-B-hirT0v.js';
|
|
@@ -1304,10 +1304,6 @@ const Popover = class {
|
|
|
1304
1304
|
this.headerResizeObserver.disconnect();
|
|
1305
1305
|
this.headerResizeObserver = undefined;
|
|
1306
1306
|
}
|
|
1307
|
-
// Clean up aria-hidden if removed without dismiss() being called
|
|
1308
|
-
if (this.presented) {
|
|
1309
|
-
cleanupRootFocusTrapAccessibility();
|
|
1310
|
-
}
|
|
1311
1307
|
}
|
|
1312
1308
|
componentWillLoad() {
|
|
1313
1309
|
var _a, _b;
|
|
@@ -1546,9 +1542,9 @@ const Popover = class {
|
|
|
1546
1542
|
const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes, focusTrap } = this;
|
|
1547
1543
|
const desktop = isPlatform('desktop');
|
|
1548
1544
|
const enableArrow = arrow && !parentPopover;
|
|
1549
|
-
return (h(Host, Object.assign({ key: '
|
|
1545
|
+
return (h(Host, Object.assign({ key: '2edd8333c630efbce59071f8a383e4326e928dbc', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
|
|
1550
1546
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
1551
|
-
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && h("ion-backdrop", { key: '
|
|
1547
|
+
}, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && h("ion-backdrop", { key: 'aac4e68b08197534375e8ea3f8c9ea0c10ab2af4', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), h("div", { key: 'b7f4ebf57d4148b32856b0075d286f454be8de5d', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && h("div", { key: '607d94c28d73e8e957175a7c0f6e8a99ec4dcd53', class: "popover-arrow", part: "arrow" }), h("div", { key: '4366a5a5de550c09895e923f345583508e1ec30c', class: "popover-content", part: "content" }, h("slot", { key: 'eb7886fbc99c15b667b7d825d24f1c12d9380f03' })))));
|
|
1552
1548
|
}
|
|
1553
1549
|
get el() { return getElement(this); }
|
|
1554
1550
|
static get watchers() { return {
|