voyager-ionic-core 8.8.4 → 8.8.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ion-action-sheet.js +1 -1
- package/components/ion-content.js +1 -1
- package/components/ion-datetime.js +1 -1
- package/components/ion-modal.js +1 -1
- package/components/ion-radio-group.js +1 -1
- package/components/ion-segment.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/p-0z8QSI5b.js +4 -0
- package/components/{p-ApmKVjaE.js → p-BGHGpkPX.js} +1 -1
- package/components/p-BlNv564p.js +4 -0
- package/components/p-D-cP12ZN.js +4 -0
- package/components/p-DZhbcvo5.js +4 -0
- package/components/{p-Bk2zuNWT.js → p-DvOO1fxp.js} +1 -1
- package/dist/cjs/ion-action-sheet.cjs.entry.js +4 -4
- package/dist/cjs/ion-app_8.cjs.entry.js +1 -1
- package/dist/cjs/ion-datetime_3.cjs.entry.js +30 -14
- package/dist/cjs/ion-modal.cjs.entry.js +99 -45
- package/dist/cjs/ion-radio_2.cjs.entry.js +13 -1
- package/dist/cjs/ion-segment_2.cjs.entry.js +6 -2
- package/dist/cjs/ion-select-modal.cjs.entry.js +18 -7
- package/dist/cjs/ion-select_3.cjs.entry.js +18 -7
- package/dist/collection/components/action-sheet/action-sheet.js +4 -4
- package/dist/collection/components/content/content.css +1 -1
- package/dist/collection/components/datetime/datetime.js +30 -14
- package/dist/collection/components/modal/modal.js +73 -44
- package/dist/collection/components/modal/safe-area-utils.js +27 -2
- package/dist/collection/components/radio-group/radio-group.js +13 -1
- package/dist/collection/components/radio-group/test/fixtures.js +2 -2
- package/dist/collection/components/segment/segment.js +6 -2
- package/dist/collection/components/select-modal/select-modal.js +18 -7
- package/dist/collection/components/select-modal/test/fixtures.js +4 -0
- package/dist/collection/components/select-popover/select-popover.js +18 -7
- package/dist/collection/components/select-popover/test/fixtures.js +4 -0
- package/dist/docs.json +1 -1
- package/dist/esm/ion-action-sheet.entry.js +4 -4
- package/dist/esm/ion-app_8.entry.js +1 -1
- package/dist/esm/ion-datetime_3.entry.js +30 -14
- package/dist/esm/ion-modal.entry.js +99 -45
- package/dist/esm/ion-radio_2.entry.js +13 -1
- package/dist/esm/ion-segment_2.entry.js +6 -2
- package/dist/esm/ion-select-modal.entry.js +18 -7
- package/dist/esm/ion-select_3.entry.js +18 -7
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-1ca9c36b.entry.js +4 -0
- package/dist/ionic/p-28a9e720.entry.js +4 -0
- package/dist/ionic/p-7761ef65.entry.js +4 -0
- package/dist/ionic/{p-4dd5e8e0.entry.js → p-8fda6a62.entry.js} +1 -1
- package/dist/ionic/p-a893c61c.entry.js +4 -0
- package/dist/ionic/{p-9eac4eb1.entry.js → p-aa812c4b.entry.js} +1 -1
- package/dist/ionic/p-cb27fe68.entry.js +4 -0
- package/dist/ionic/p-ce2edb36.entry.js +4 -0
- package/dist/types/components/datetime/datetime.d.ts +7 -0
- package/dist/types/components/modal/modal.d.ts +41 -3
- package/dist/types/components/modal/safe-area-utils.d.ts +16 -0
- package/dist/types/components/radio-group/test/fixtures.d.ts +1 -1
- package/dist/types/components/select-modal/select-modal.d.ts +1 -0
- package/dist/types/components/select-modal/test/fixtures.d.ts +1 -0
- package/dist/types/components/select-popover/select-popover.d.ts +1 -0
- package/dist/types/components/select-popover/test/fixtures.d.ts +1 -0
- package/hydrate/index.js +189 -81
- package/hydrate/index.mjs +189 -81
- package/package.json +1 -1
- package/components/p-1KVKSLu5.js +0 -4
- package/components/p-BI7WNErr.js +0 -4
- package/components/p-BTF2nRLo.js +0 -4
- package/components/p-EK4xUz-q.js +0 -4
- package/dist/ionic/p-4c67ce4c.entry.js +0 -4
- package/dist/ionic/p-51c11c47.entry.js +0 -4
- package/dist/ionic/p-5681dde4.entry.js +0 -4
- package/dist/ionic/p-9cdbabbb.entry.js +0 -4
- package/dist/ionic/p-cb78f5a0.entry.js +0 -4
- package/dist/ionic/p-e6c5f060.entry.js +0 -4
package/hydrate/index.mjs
CHANGED
|
@@ -9796,7 +9796,7 @@ class ActionSheet {
|
|
|
9796
9796
|
if (isRadio) {
|
|
9797
9797
|
htmlAttrs['aria-checked'] = isActiveRadio ? 'true' : 'false';
|
|
9798
9798
|
}
|
|
9799
|
-
return (hAsync("button", Object.assign({}, htmlAttrs, { role: isRadio ? 'radio' : undefined, type: "button", id: buttonId, class: Object.assign(Object.assign({}, buttonClass$3(b)), { 'action-sheet-selected': isActiveRadio }), onClick: () => {
|
|
9799
|
+
return (hAsync("button", Object.assign({}, htmlAttrs, { role: isRadio ? 'radio' : undefined, type: "button", id: buttonId, class: Object.assign(Object.assign({}, buttonClass$3(b)), (isRadio && { 'action-sheet-selected': isActiveRadio })), onClick: () => {
|
|
9800
9800
|
if (isRadio) {
|
|
9801
9801
|
this.selectRadioButton(b);
|
|
9802
9802
|
}
|
|
@@ -9811,12 +9811,12 @@ class ActionSheet {
|
|
|
9811
9811
|
const cancelButton = allButtons.find((b) => b.role === 'cancel');
|
|
9812
9812
|
const buttons = allButtons.filter((b) => b.role !== 'cancel');
|
|
9813
9813
|
const headerID = `action-sheet-${overlayIndex}-header`;
|
|
9814
|
-
return (hAsync(Host, Object.assign({ key: '
|
|
9814
|
+
return (hAsync(Host, Object.assign({ key: '48b63b870f2816b4cad3c606f3d9956854cee79a', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
|
|
9815
9815
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
9816
|
-
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), hAsync("ion-backdrop", { key: '
|
|
9816
|
+
}, class: Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'action-sheet-translucent': this.translucent }), onIonActionSheetWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), hAsync("ion-backdrop", { key: '41dd5781f139d26b3feea33ab387451aeafacd51', tappable: this.backdropDismiss }), hAsync("div", { key: 'f797c2657782e4e83adf90d2d796108e857a1fc0', tabindex: "0", "aria-hidden": "true" }), hAsync("div", { key: '8e74209321fc5e8712e3e293c91a6fa036ea45ab', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: 'c811860be2eed0b6c73fc2cc5a59cb94db2e8912', class: "action-sheet-container" }, hAsync("div", { key: 'd36ee14b70d73eb5cd69e0c57bc5cc31daf86ab3', class: "action-sheet-group", ref: (el) => (this.groupEl = el), role: hasRadioButtons ? 'radiogroup' : undefined }, header !== undefined && (hAsync("div", { key: '922695de191edc86451eed2552acc4f54993ea52', id: headerID, class: {
|
|
9817
9817
|
'action-sheet-title': true,
|
|
9818
9818
|
'action-sheet-has-sub-title': this.subHeader !== undefined,
|
|
9819
|
-
} }, header, this.subHeader && hAsync("div", { key: '
|
|
9819
|
+
} }, header, this.subHeader && hAsync("div", { key: 'a119d4a93668e829f7106f11cbbdd437310f3e80', class: "action-sheet-sub-title" }, this.subHeader))), this.renderActionSheetButtons(buttons)), cancelButton && (hAsync("div", { key: '1d27f36d09bedd2e4c61fea9dd9d05f8f9271aef', class: "action-sheet-group action-sheet-group-cancel" }, hAsync("button", Object.assign({ key: 'ed13658176c54cc45808a54a0331c297430d9bc6' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass$3(cancelButton), onClick: () => this.buttonClick(cancelButton) }), hAsync("span", { key: '5208e3e3535b775a443cef6fb1decd790db69b0c', class: "action-sheet-button-inner" }, cancelButton.icon && (hAsync("ion-icon", { key: 'b7ba489e1ee50524a5b4af670eef787844a16286', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && hAsync("ion-ripple-effect", { key: 'b3f88898114855853259f0001def26b4bd6e4a98' })))))), hAsync("div", { key: '0dfd0fcdc633bf565990eaa06679608e749cf8f9', tabindex: "0", "aria-hidden": "true" })));
|
|
9820
9820
|
}
|
|
9821
9821
|
get el() { return getElement(this); }
|
|
9822
9822
|
static get watchers() { return {
|
|
@@ -12365,7 +12365,7 @@ const isRTL$1 = (hostEl) => {
|
|
|
12365
12365
|
return (document === null || document === void 0 ? void 0 : document.dir.toLowerCase()) === 'rtl';
|
|
12366
12366
|
};
|
|
12367
12367
|
|
|
12368
|
-
const contentCss = () => `:host{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000);--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}:host(.ion-color) .inner-scroll{background:var(--ion-color-base);color:var(--ion-color-contrast)}#background-content{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-ms-touch-action:pan-x pan-y pinch-zoom;touch-action:pan-x pan-y pinch-zoom}.scroll-y,.scroll-x{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}.scroll-y{overflow-y:var(--overflow);overscroll-behavior-y:contain}.scroll-x{overflow-x:var(--overflow);overscroll-behavior-x:contain}.overscroll::before,.overscroll::after{position:absolute;width:1px;height:1px;content:""}.overscroll::before{bottom:-1px}.overscroll::after{top:-1px}:host(.content-sizing){display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:0;contain:none}:host(.content-sizing) .inner-scroll{position:relative;top:0;bottom:0;margin-top:calc(var(--offset-top) * -1);margin-bottom:calc(var(--offset-bottom) * -1)}.transition-effect{display:none;position:absolute;width:100%;height:100vh;opacity:0;pointer-events:none}:host(.content-ltr) .transition-effect{left:-100%;}:host(.content-rtl) .transition-effect{right:-100%;}.transition-cover{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}.transition-shadow{display:block;position:absolute;width:100%;height:100%;-webkit-box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03);box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03)}:host(.content-ltr) .transition-shadow{right:0;}:host(.content-rtl) .transition-shadow{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}::slotted([slot=fixed]){position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}`;
|
|
12368
|
+
const contentCss = () => `:host{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000);--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}:host(.ion-color) .inner-scroll{background:var(--ion-color-base);color:var(--ion-color-contrast)}#background-content{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom) + var(--ion-content-safe-area-padding-bottom, 0px));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-ms-touch-action:pan-x pan-y pinch-zoom;touch-action:pan-x pan-y pinch-zoom}.scroll-y,.scroll-x{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}.scroll-y{overflow-y:var(--overflow);overscroll-behavior-y:contain}.scroll-x{overflow-x:var(--overflow);overscroll-behavior-x:contain}.overscroll::before,.overscroll::after{position:absolute;width:1px;height:1px;content:""}.overscroll::before{bottom:-1px}.overscroll::after{top:-1px}:host(.content-sizing){display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:0;contain:none}:host(.content-sizing) .inner-scroll{position:relative;top:0;bottom:0;margin-top:calc(var(--offset-top) * -1);margin-bottom:calc(var(--offset-bottom) * -1)}.transition-effect{display:none;position:absolute;width:100%;height:100vh;opacity:0;pointer-events:none}:host(.content-ltr) .transition-effect{left:-100%;}:host(.content-rtl) .transition-effect{right:-100%;}.transition-cover{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}.transition-shadow{display:block;position:absolute;width:100%;height:100%;-webkit-box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03);box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03)}:host(.content-ltr) .transition-shadow{right:0;}:host(.content-rtl) .transition-shadow{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}::slotted([slot=fixed]){position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}`;
|
|
12369
12369
|
|
|
12370
12370
|
/**
|
|
12371
12371
|
* @slot - Content is placed in the scrollable area if provided without a slot.
|
|
@@ -14779,6 +14779,12 @@ class Datetime {
|
|
|
14779
14779
|
this.ionStyle = createEvent(this, "ionStyle", 7);
|
|
14780
14780
|
this.ionRender = createEvent(this, "ionRender", 7);
|
|
14781
14781
|
this.inputId = `ion-dt-${datetimeIds++}`;
|
|
14782
|
+
/**
|
|
14783
|
+
* Set true only by `visibleCallback`. Lets `hiddenCallback` ignore the
|
|
14784
|
+
* synthetic "not intersecting" entry IntersectionObserver fires on
|
|
14785
|
+
* `observe()` when the host mounts offscreen.
|
|
14786
|
+
*/
|
|
14787
|
+
this.hasBeenIntersecting = false;
|
|
14782
14788
|
this.prevPresentation = null;
|
|
14783
14789
|
this.showMonthAndYear = false;
|
|
14784
14790
|
this.activeParts = [];
|
|
@@ -15341,7 +15347,21 @@ class Datetime {
|
|
|
15341
15347
|
if (rect.width === 0 || rect.height === 0) {
|
|
15342
15348
|
return;
|
|
15343
15349
|
}
|
|
15350
|
+
this.markReady();
|
|
15351
|
+
};
|
|
15352
|
+
this.markReady = () => {
|
|
15353
|
+
if (this.el.classList.contains('datetime-ready')) {
|
|
15354
|
+
return;
|
|
15355
|
+
}
|
|
15344
15356
|
this.initializeListeners();
|
|
15357
|
+
/**
|
|
15358
|
+
* TODO FW-2793: Datetime needs a frame to ensure that it
|
|
15359
|
+
* can properly scroll contents into view. As a result
|
|
15360
|
+
* we hide the scrollable content until after that frame
|
|
15361
|
+
* so users do not see the content quickly shifting. The downside
|
|
15362
|
+
* is that the content will pop into view a frame after. Maybe there
|
|
15363
|
+
* is a better way to handle this?
|
|
15364
|
+
*/
|
|
15345
15365
|
writeTask(() => {
|
|
15346
15366
|
this.el.classList.add('datetime-ready');
|
|
15347
15367
|
});
|
|
@@ -15634,6 +15654,7 @@ class Datetime {
|
|
|
15634
15654
|
this.clearFocusVisible = undefined;
|
|
15635
15655
|
}
|
|
15636
15656
|
this.loadTimeoutCleanup();
|
|
15657
|
+
this.hasBeenIntersecting = false;
|
|
15637
15658
|
}
|
|
15638
15659
|
initializeListeners() {
|
|
15639
15660
|
this.initializeCalendarListener();
|
|
@@ -15653,18 +15674,8 @@ class Datetime {
|
|
|
15653
15674
|
if (!ev.isIntersecting) {
|
|
15654
15675
|
return;
|
|
15655
15676
|
}
|
|
15656
|
-
this.
|
|
15657
|
-
|
|
15658
|
-
* TODO FW-2793: Datetime needs a frame to ensure that it
|
|
15659
|
-
* can properly scroll contents into view. As a result
|
|
15660
|
-
* we hide the scrollable content until after that frame
|
|
15661
|
-
* so users do not see the content quickly shifting. The downside
|
|
15662
|
-
* is that the content will pop into view a frame after. Maybe there
|
|
15663
|
-
* is a better way to handle this?
|
|
15664
|
-
*/
|
|
15665
|
-
writeTask(() => {
|
|
15666
|
-
this.el.classList.add('datetime-ready');
|
|
15667
|
-
});
|
|
15677
|
+
this.hasBeenIntersecting = true;
|
|
15678
|
+
this.markReady();
|
|
15668
15679
|
};
|
|
15669
15680
|
const visibleIO = new IntersectionObserver(visibleCallback, { threshold: 0.01, root: el });
|
|
15670
15681
|
/**
|
|
@@ -15700,6 +15711,11 @@ class Datetime {
|
|
|
15700
15711
|
if (ev.isIntersecting) {
|
|
15701
15712
|
return;
|
|
15702
15713
|
}
|
|
15714
|
+
// Ignore the initial "not intersecting" entry IntersectionObserver fires on observe().
|
|
15715
|
+
if (!this.hasBeenIntersecting) {
|
|
15716
|
+
return;
|
|
15717
|
+
}
|
|
15718
|
+
this.hasBeenIntersecting = false;
|
|
15703
15719
|
this.destroyInteractionListeners();
|
|
15704
15720
|
/**
|
|
15705
15721
|
* When datetime is hidden, we need to make sure that
|
|
@@ -16443,7 +16459,7 @@ class Datetime {
|
|
|
16443
16459
|
const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
|
|
16444
16460
|
const hasWheelVariant = hasDatePresentation && preferWheel;
|
|
16445
16461
|
renderHiddenInput(true, el, name, formatValue(value), disabled);
|
|
16446
|
-
return (hAsync(Host, { key: '
|
|
16462
|
+
return (hAsync(Host, { key: '323c8c2327088f00934b8c93c3306538cb9b5677', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
|
|
16447
16463
|
[mode]: true,
|
|
16448
16464
|
['datetime-readonly']: readonly,
|
|
16449
16465
|
['datetime-disabled']: disabled,
|
|
@@ -16453,7 +16469,7 @@ class Datetime {
|
|
|
16453
16469
|
[`datetime-size-${size}`]: true,
|
|
16454
16470
|
[`datetime-prefer-wheel`]: hasWheelVariant,
|
|
16455
16471
|
[`datetime-grid`]: isGridStyle,
|
|
16456
|
-
})) }, hAsync("div", { key: '
|
|
16472
|
+
})) }, hAsync("div", { key: '1e0855c8909bc3f1e48a21ad68159fa782060691', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
|
|
16457
16473
|
}
|
|
16458
16474
|
get el() { return getElement(this); }
|
|
16459
16475
|
static get watchers() { return {
|
|
@@ -25006,6 +25022,12 @@ const createSheetGesture = (baseEl, backdropEl, wrapperEl, initialBreakpoint, ba
|
|
|
25006
25022
|
const MODAL_INSET_MIN_WIDTH = 768;
|
|
25007
25023
|
const MODAL_INSET_MIN_HEIGHT = 600;
|
|
25008
25024
|
const EDGE_THRESHOLD = 5;
|
|
25025
|
+
/**
|
|
25026
|
+
* CSS values for `--width` / `--height` that are treated as fullscreen
|
|
25027
|
+
* (modal touches the corresponding screen edges). Empty string means the
|
|
25028
|
+
* property was not overridden. See `hasCustomModalDimensions()`.
|
|
25029
|
+
*/
|
|
25030
|
+
const FULLSCREEN_SIZE_VALUES = new Set(['', '100%', '100vw', '100vh', '100dvw', '100dvh', '100svw', '100svh']);
|
|
25009
25031
|
/**
|
|
25010
25032
|
* Cache for resolved root safe-area-top value, invalidated once per frame.
|
|
25011
25033
|
*/
|
|
@@ -25054,6 +25076,22 @@ const getRootSafeAreaTop = () => {
|
|
|
25054
25076
|
}
|
|
25055
25077
|
return value;
|
|
25056
25078
|
};
|
|
25079
|
+
/**
|
|
25080
|
+
* True when the modal host declares BOTH a non-fullscreen `--width` AND a
|
|
25081
|
+
* non-fullscreen `--height` (i.e. a centered-dialog-like modal that doesn't
|
|
25082
|
+
* touch any screen edge).
|
|
25083
|
+
*
|
|
25084
|
+
* The conservative "both axes" check avoids mis-zeroing safe-area for
|
|
25085
|
+
* partial-custom modals where the modal still touches top/bottom edges
|
|
25086
|
+
* (e.g. only `--width` overridden). Partial cases fall through to the
|
|
25087
|
+
* existing position-based post-animation correction.
|
|
25088
|
+
*/
|
|
25089
|
+
const hasCustomModalDimensions = (hostEl) => {
|
|
25090
|
+
const styles = getComputedStyle(hostEl);
|
|
25091
|
+
const width = styles.getPropertyValue('--width').trim();
|
|
25092
|
+
const height = styles.getPropertyValue('--height').trim();
|
|
25093
|
+
return !FULLSCREEN_SIZE_VALUES.has(width) && !FULLSCREEN_SIZE_VALUES.has(height);
|
|
25094
|
+
};
|
|
25057
25095
|
/**
|
|
25058
25096
|
* Returns the initial safe-area configuration based on modal type.
|
|
25059
25097
|
* This is called before animation starts and uses configuration-based prediction.
|
|
@@ -25088,8 +25126,11 @@ const getInitialSafeAreaConfig = (context) => {
|
|
|
25088
25126
|
}
|
|
25089
25127
|
// On viewports that meet the centered dialog media query breakpoints,
|
|
25090
25128
|
// regular modals render as centered dialogs (not fullscreen), so they
|
|
25091
|
-
// don't touch any screen edges and don't need safe-area insets.
|
|
25092
|
-
|
|
25129
|
+
// don't touch any screen edges and don't need safe-area insets. Also
|
|
25130
|
+
// applies to phone viewports when the modal declares custom --width and
|
|
25131
|
+
// --height; these don't touch screen edges either, so the initial
|
|
25132
|
+
// prediction must be zero to avoid a post-animation correction flash.
|
|
25133
|
+
if (isCenteredDialogViewport() || context.hasCustomDimensions) {
|
|
25093
25134
|
return {
|
|
25094
25135
|
top: '0px',
|
|
25095
25136
|
bottom: '0px',
|
|
@@ -25401,12 +25442,10 @@ class Modal {
|
|
|
25401
25442
|
// since the viewport may have crossed the centered-dialog breakpoint.
|
|
25402
25443
|
if (!context.isSheetModal && !context.isCardModal) {
|
|
25403
25444
|
this.updateSafeAreaOverrides();
|
|
25404
|
-
// Re-evaluate fullscreen safe-area padding: clear first, then re-apply
|
|
25405
|
-
|
|
25406
|
-
|
|
25407
|
-
|
|
25408
|
-
}
|
|
25409
|
-
this.applyFullscreenSafeArea();
|
|
25445
|
+
// Re-evaluate fullscreen safe-area padding: clear first, then re-apply.
|
|
25446
|
+
const { contentEl, hasFooter } = this.findContentAndFooter();
|
|
25447
|
+
this.clearContentSafeAreaPadding(contentEl);
|
|
25448
|
+
this.applyFullscreenSafeAreaTo(contentEl, hasFooter);
|
|
25410
25449
|
}
|
|
25411
25450
|
}, 50); // Debounce to avoid excessive calls during active resizing
|
|
25412
25451
|
}
|
|
@@ -26153,6 +26192,11 @@ class Modal {
|
|
|
26153
26192
|
}
|
|
26154
26193
|
/**
|
|
26155
26194
|
* Creates the context object for safe-area utilities.
|
|
26195
|
+
*
|
|
26196
|
+
* `hasCustomDimensions` is only set by `setInitialSafeAreaOverrides()`
|
|
26197
|
+
* because it is only read by `getInitialSafeAreaConfig()`. Other callers
|
|
26198
|
+
* (resize handler, post-animation update, fullscreen-padding apply) would
|
|
26199
|
+
* pay a `getComputedStyle()` cost for a value they never consult.
|
|
26156
26200
|
*/
|
|
26157
26201
|
getSafeAreaContext() {
|
|
26158
26202
|
return {
|
|
@@ -26174,7 +26218,7 @@ class Modal {
|
|
|
26174
26218
|
* sheets to prevent header content from getting double-offset padding).
|
|
26175
26219
|
*/
|
|
26176
26220
|
setInitialSafeAreaOverrides() {
|
|
26177
|
-
const context = this.getSafeAreaContext();
|
|
26221
|
+
const context = Object.assign(Object.assign({}, this.getSafeAreaContext()), { hasCustomDimensions: hasCustomModalDimensions(this.el) });
|
|
26178
26222
|
const safeAreaConfig = getInitialSafeAreaConfig(context);
|
|
26179
26223
|
applySafeAreaOverrides(this.el, safeAreaConfig);
|
|
26180
26224
|
// Set the internal offset property with the resolved root safe-area-top value
|
|
@@ -26214,59 +26258,85 @@ class Modal {
|
|
|
26214
26258
|
applySafeAreaOverrides(el, safeAreaConfig);
|
|
26215
26259
|
}
|
|
26216
26260
|
/**
|
|
26217
|
-
* Applies
|
|
26218
|
-
*
|
|
26261
|
+
* Applies safe-area-bottom scroll padding to ion-content inside
|
|
26262
|
+
* fullscreen modals that have no ion-footer. This prevents content
|
|
26263
|
+
* from being hidden behind the system navigation bar while keeping
|
|
26264
|
+
* the modal background edge-to-edge (no visible gap).
|
|
26219
26265
|
*/
|
|
26220
26266
|
applyFullscreenSafeArea() {
|
|
26221
|
-
const { wrapperEl, el } = this;
|
|
26222
|
-
if (!wrapperEl)
|
|
26223
|
-
return;
|
|
26224
26267
|
const context = this.getSafeAreaContext();
|
|
26225
26268
|
if (context.isSheetModal || context.isCardModal)
|
|
26226
26269
|
return;
|
|
26227
|
-
|
|
26228
|
-
|
|
26229
|
-
|
|
26230
|
-
|
|
26231
|
-
|
|
26232
|
-
|
|
26270
|
+
const { contentEl, hasFooter } = this.findContentAndFooter();
|
|
26271
|
+
this.applyFullscreenSafeAreaTo(contentEl, hasFooter);
|
|
26272
|
+
}
|
|
26273
|
+
/**
|
|
26274
|
+
* Sets --ion-content-safe-area-padding-bottom on the given ion-content
|
|
26275
|
+
* when no footer is present, so ion-content's .inner-scroll includes
|
|
26276
|
+
* safe-area-bottom in its scroll padding. This keeps the modal background
|
|
26277
|
+
* edge-to-edge while ensuring content scrolls clear of the system nav bar.
|
|
26278
|
+
*
|
|
26279
|
+
* --ion-content-safe-area-padding-bottom is an internal CSS property used
|
|
26280
|
+
* only by this code path. It is not part of ion-content's public API and
|
|
26281
|
+
* should not be set by consumers. The default of 0px makes it a no-op
|
|
26282
|
+
* when unset, which is the expected state for ion-content used outside of
|
|
26283
|
+
* a fullscreen modal without a footer.
|
|
26284
|
+
*/
|
|
26285
|
+
applyFullscreenSafeAreaTo(contentEl, hasFooter) {
|
|
26286
|
+
// Only apply for standard Ionic layouts (has ion-content but no
|
|
26287
|
+
// ion-footer). When a footer is present it handles its own safe-area
|
|
26288
|
+
// padding. Custom modals with raw HTML are developer-controlled.
|
|
26289
|
+
if (!contentEl || hasFooter)
|
|
26290
|
+
return;
|
|
26291
|
+
contentEl.style.setProperty('--ion-content-safe-area-padding-bottom', 'var(--ion-safe-area-bottom, 0px)');
|
|
26292
|
+
}
|
|
26293
|
+
/**
|
|
26294
|
+
* Removes the internal --ion-content-safe-area-padding-bottom property
|
|
26295
|
+
* from an already-located ion-content. Callers do their own
|
|
26296
|
+
* findContentAndFooter() so they can also read hasFooter if needed.
|
|
26297
|
+
*/
|
|
26298
|
+
clearContentSafeAreaPadding(contentEl) {
|
|
26299
|
+
if (!contentEl)
|
|
26300
|
+
return;
|
|
26301
|
+
contentEl.style.removeProperty('--ion-content-safe-area-padding-bottom');
|
|
26302
|
+
}
|
|
26303
|
+
/**
|
|
26304
|
+
* Finds ion-content and ion-footer among direct children and one level of
|
|
26305
|
+
* grandchildren (for wrapped components like <app-footer><ion-footer>).
|
|
26306
|
+
*
|
|
26307
|
+
* Intentionally does NOT use findIonContent() or querySelector() because
|
|
26308
|
+
* those search the full subtree and would match ion-content inside nested
|
|
26309
|
+
* routes/pages. We only want direct slot children (+ one wrapper level).
|
|
26310
|
+
*
|
|
26311
|
+
* Uses a manual loop instead of querySelector(':scope > ...') because
|
|
26312
|
+
* Stencil's mock-doc (used in spec tests) does not support :scope.
|
|
26313
|
+
*/
|
|
26314
|
+
findContentAndFooter() {
|
|
26315
|
+
let contentEl = null;
|
|
26233
26316
|
let hasFooter = false;
|
|
26234
|
-
for (const child of Array.from(el.children)) {
|
|
26317
|
+
for (const child of Array.from(this.el.children)) {
|
|
26235
26318
|
if (child.tagName === 'ION-CONTENT')
|
|
26236
|
-
|
|
26319
|
+
contentEl = child;
|
|
26237
26320
|
if (child.tagName === 'ION-FOOTER')
|
|
26238
26321
|
hasFooter = true;
|
|
26239
26322
|
for (const grandchild of Array.from(child.children)) {
|
|
26240
|
-
if (grandchild.tagName === 'ION-CONTENT')
|
|
26241
|
-
|
|
26323
|
+
if (grandchild.tagName === 'ION-CONTENT' && !contentEl)
|
|
26324
|
+
contentEl = grandchild;
|
|
26242
26325
|
if (grandchild.tagName === 'ION-FOOTER')
|
|
26243
26326
|
hasFooter = true;
|
|
26244
26327
|
}
|
|
26245
26328
|
}
|
|
26246
|
-
|
|
26247
|
-
// but no ion-footer). Custom modals with raw HTML are fully
|
|
26248
|
-
// developer-controlled and should not be modified.
|
|
26249
|
-
if (!hasContent || hasFooter)
|
|
26250
|
-
return;
|
|
26251
|
-
// Reduce wrapper height by safe-area and add equivalent padding so the
|
|
26252
|
-
// total visual size stays the same but the flex content area shrinks.
|
|
26253
|
-
// Using height + padding instead of box-sizing: border-box avoids
|
|
26254
|
-
// breaking custom modals that set --border-width (border-box would
|
|
26255
|
-
// include the border inside the height, changing the layout).
|
|
26256
|
-
wrapperEl.style.setProperty('height', 'calc(var(--height) - var(--ion-safe-area-bottom, 0px))');
|
|
26257
|
-
wrapperEl.style.setProperty('padding-bottom', 'var(--ion-safe-area-bottom, 0px)');
|
|
26329
|
+
return { contentEl, hasFooter };
|
|
26258
26330
|
}
|
|
26259
26331
|
/**
|
|
26260
|
-
* Clears all safe-area overrides and padding
|
|
26332
|
+
* Clears all safe-area overrides and padding.
|
|
26261
26333
|
*/
|
|
26262
26334
|
cleanupSafeAreaOverrides() {
|
|
26263
26335
|
clearSafeAreaOverrides(this.el);
|
|
26264
26336
|
// Remove internal sheet offset property
|
|
26265
26337
|
this.el.style.removeProperty('--ion-modal-offset-top');
|
|
26266
|
-
|
|
26267
|
-
|
|
26268
|
-
this.wrapperEl.style.removeProperty('padding-bottom');
|
|
26269
|
-
}
|
|
26338
|
+
const { contentEl } = this.findContentAndFooter();
|
|
26339
|
+
this.clearContentSafeAreaPadding(contentEl);
|
|
26270
26340
|
}
|
|
26271
26341
|
render() {
|
|
26272
26342
|
const { handle, isSheetModal, presentingElement, htmlAttributes, handleBehavior, inheritedAttributes, focusTrap, expandToScroll, } = this;
|
|
@@ -26275,20 +26345,20 @@ class Modal {
|
|
|
26275
26345
|
const isCardModal = presentingElement !== undefined && mode === 'ios';
|
|
26276
26346
|
const isHandleCycle = handleBehavior === 'cycle';
|
|
26277
26347
|
const isSheetModalWithHandle = isSheetModal && showHandle;
|
|
26278
|
-
return (hAsync(Host, Object.assign({ key: '
|
|
26348
|
+
return (hAsync(Host, Object.assign({ key: '4bf38aa67df9a3f977163bba5423960bbafd16de', "no-router": true,
|
|
26279
26349
|
// Allow the modal to be navigable when the handle is focusable
|
|
26280
26350
|
tabIndex: isHandleCycle && isSheetModalWithHandle ? 0 : -1 }, htmlAttributes, { style: {
|
|
26281
26351
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
26282
|
-
}, 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: '
|
|
26352
|
+
}, 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: '866da40cc5fc8d3e36637098fb3066a5bc9f4e0f', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: '5a2a05514ea8592c8feb0465e504aa7c7af17963', class: "modal-shadow" }), hAsync("div", Object.assign({ key: '4d327115306451f57d190b06ab8cbb6191a6f1d7',
|
|
26283
26353
|
/*
|
|
26284
26354
|
role and aria-modal must be used on the
|
|
26285
26355
|
same element. They must also be set inside the
|
|
26286
26356
|
shadow DOM otherwise ion-button will not be highlighted
|
|
26287
26357
|
when using VoiceOver: https://bugs.webkit.org/show_bug.cgi?id=247134
|
|
26288
26358
|
*/
|
|
26289
|
-
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: '
|
|
26359
|
+
role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: 'd1882835cc049232c0d957e3ba1e79676a07d179', class: "modal-handle",
|
|
26290
26360
|
// Prevents the handle from receiving keyboard focus when it does not cycle
|
|
26291
|
-
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: '
|
|
26361
|
+
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: '81dc58b09cf7d7022b04cd170f53113604364d5e', onSlotchange: this.onSlotChange }))));
|
|
26292
26362
|
}
|
|
26293
26363
|
get el() { return getElement(this); }
|
|
26294
26364
|
static get watchers() { return {
|
|
@@ -31301,6 +31371,18 @@ class RadioGroup {
|
|
|
31301
31371
|
// to the bottom of the screen
|
|
31302
31372
|
ev.preventDefault();
|
|
31303
31373
|
}
|
|
31374
|
+
// Inside a select interface, Enter commits the focused radio
|
|
31375
|
+
// value (matching native <select>). The !ev.repeat guard stops
|
|
31376
|
+
// a held Enter on the triggering ion-select from re-committing
|
|
31377
|
+
// once focus lands in the opened popover/modal.
|
|
31378
|
+
if (ev.key === 'Enter' && inSelectInterface && !ev.repeat) {
|
|
31379
|
+
const previousValue = this.value;
|
|
31380
|
+
this.value = current.value;
|
|
31381
|
+
if (previousValue !== this.value) {
|
|
31382
|
+
this.emitValueChange(ev);
|
|
31383
|
+
}
|
|
31384
|
+
ev.preventDefault();
|
|
31385
|
+
}
|
|
31304
31386
|
}
|
|
31305
31387
|
}
|
|
31306
31388
|
/** @internal */
|
|
@@ -31333,7 +31415,7 @@ class RadioGroup {
|
|
|
31333
31415
|
const { label, labelId, el, name, value } = this;
|
|
31334
31416
|
const mode = getIonMode$1(this);
|
|
31335
31417
|
renderHiddenInput(true, el, name, value, false);
|
|
31336
|
-
return (hAsync(Host, { key: '
|
|
31418
|
+
return (hAsync(Host, { key: '377e4aa3a656cc84b742f9d7a7d4be65d20c69f5', role: "radiogroup", "aria-labelledby": label ? labelId : null, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, onClick: this.onClick, class: mode }, this.renderHintText(), hAsync("slot", { key: 'c3187a2497773b4f15cea3b413b036502bcec8c0' })));
|
|
31337
31419
|
}
|
|
31338
31420
|
get el() { return getElement(this); }
|
|
31339
31421
|
static get watchers() { return {
|
|
@@ -35973,6 +36055,7 @@ class Segment {
|
|
|
35973
36055
|
return segmentContent === null || segmentContent === void 0 ? void 0 : segmentContent.closest('ion-segment-view');
|
|
35974
36056
|
}
|
|
35975
36057
|
handleSegmentViewScroll(ev) {
|
|
36058
|
+
var _a;
|
|
35976
36059
|
const { scrollRatio, isManualScroll } = ev.detail;
|
|
35977
36060
|
if (!isManualScroll) {
|
|
35978
36061
|
return;
|
|
@@ -35989,6 +36072,9 @@ class Segment {
|
|
|
35989
36072
|
const index = buttons.findIndex((button) => button.value === this.value);
|
|
35990
36073
|
const current = buttons[index];
|
|
35991
36074
|
const nextIndex = Math.round(scrollRatio * (buttons.length - 1));
|
|
36075
|
+
if ((_a = buttons[nextIndex]) === null || _a === void 0 ? void 0 : _a.disabled) {
|
|
36076
|
+
return;
|
|
36077
|
+
}
|
|
35992
36078
|
if (this.lastNextIndex === undefined || this.lastNextIndex !== nextIndex) {
|
|
35993
36079
|
this.lastNextIndex = nextIndex;
|
|
35994
36080
|
this.triggerScrollOnValueChange = false;
|
|
@@ -36199,14 +36285,14 @@ class Segment {
|
|
|
36199
36285
|
}
|
|
36200
36286
|
render() {
|
|
36201
36287
|
const mode = getIonMode$1(this);
|
|
36202
|
-
return (hAsync(Host, { key: '
|
|
36288
|
+
return (hAsync(Host, { key: 'eda6b7b88b7967b55cf9098c59b655b348a42224', role: "tablist", onClick: this.onClick, class: createColorClasses$1(this.color, {
|
|
36203
36289
|
[mode]: true,
|
|
36204
36290
|
'in-toolbar': hostContext('ion-toolbar', this.el),
|
|
36205
36291
|
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
|
|
36206
36292
|
'segment-activated': this.activated,
|
|
36207
36293
|
'segment-disabled': this.disabled,
|
|
36208
36294
|
'segment-scrollable': this.scrollable,
|
|
36209
|
-
}) }, hAsync("slot", { key: '
|
|
36295
|
+
}) }, hAsync("slot", { key: 'fdb451f235ce59c5bb50c61a13c69160ece2d5df', onSlotchange: this.onSlottedItemsChange })));
|
|
36210
36296
|
}
|
|
36211
36297
|
get el() { return getElement(this); }
|
|
36212
36298
|
static get watchers() { return {
|
|
@@ -37423,6 +37509,10 @@ const selectModalMdCss = () => `.sc-ion-select-modal-md-h{height:100%}ion-list.s
|
|
|
37423
37509
|
class SelectModal {
|
|
37424
37510
|
constructor(hostRef) {
|
|
37425
37511
|
registerInstance(this, hostRef);
|
|
37512
|
+
// Tracks the option that received Enter-keydown so keyup only
|
|
37513
|
+
// dismisses when the press started on the same option. Prevents
|
|
37514
|
+
// Enter on the triggering ion-select from auto-dismissing.
|
|
37515
|
+
this.pendingEnterTarget = null;
|
|
37426
37516
|
/**
|
|
37427
37517
|
* The text to display on the cancel button.
|
|
37428
37518
|
*/
|
|
@@ -37472,15 +37562,22 @@ class SelectModal {
|
|
|
37472
37562
|
return (hAsync("ion-radio-group", { value: checked, onIonChange: (ev) => this.callOptionHandler(ev) }, this.options.map((option) => (hAsync("ion-item", { lines: "none", class: Object.assign({
|
|
37473
37563
|
// TODO FW-4784
|
|
37474
37564
|
'item-radio-checked': option.value === checked
|
|
37475
|
-
}, getClassMap(option.cssClass)) }, hAsync("ion-radio", { value: option.value, disabled: option.disabled, justify: "start", labelPlacement: "end", onClick: () => this.closeModal(),
|
|
37565
|
+
}, getClassMap(option.cssClass)) }, hAsync("ion-radio", { value: option.value, disabled: option.disabled, justify: "start", labelPlacement: "end", onClick: () => this.closeModal(), onKeyDown: (ev) => {
|
|
37566
|
+
if (ev.key === 'Enter' && !ev.repeat) {
|
|
37567
|
+
this.pendingEnterTarget = ev.currentTarget;
|
|
37568
|
+
}
|
|
37569
|
+
}, onKeyUp: (ev) => {
|
|
37476
37570
|
if (ev.key === ' ') {
|
|
37477
|
-
|
|
37478
|
-
* Selecting a radio option with keyboard navigation,
|
|
37479
|
-
* either through the Enter or Space keys, should
|
|
37480
|
-
* dismiss the modal.
|
|
37481
|
-
*/
|
|
37571
|
+
// Space selects and dismisses in one press.
|
|
37482
37572
|
this.closeModal();
|
|
37483
37573
|
}
|
|
37574
|
+
else if (ev.key === 'Enter') {
|
|
37575
|
+
const shouldClose = this.pendingEnterTarget === ev.currentTarget;
|
|
37576
|
+
this.pendingEnterTarget = null;
|
|
37577
|
+
if (shouldClose) {
|
|
37578
|
+
this.closeModal();
|
|
37579
|
+
}
|
|
37580
|
+
}
|
|
37484
37581
|
} }, option.text))))));
|
|
37485
37582
|
}
|
|
37486
37583
|
renderCheckboxOptions() {
|
|
@@ -37493,7 +37590,7 @@ class SelectModal {
|
|
|
37493
37590
|
} }, option.text))));
|
|
37494
37591
|
}
|
|
37495
37592
|
render() {
|
|
37496
|
-
return (hAsync(Host, { key: '
|
|
37593
|
+
return (hAsync(Host, { key: 'fda0bf6f93cd5ec9f3c64f88a52de849e0e140a2', class: getIonMode$1(this) }, hAsync("ion-header", { key: '27c0b17175a53db9ff159feeeb96451a3f011dab' }, hAsync("ion-toolbar", { key: '91a4155ebc317fbc9f1bb3e26a7e94754b953c9b' }, this.header !== undefined && hAsync("ion-title", { key: 'f6dae8e4e381f322cc90efefd9bb6ef81d4d2f3e' }, this.header), hAsync("ion-buttons", { key: 'e7760532fb2e7e7385ed6e62097d92d96ff20148', slot: "end" }, hAsync("ion-button", { key: '4999b6fc46cba138186546dca67b7950855e6fb7', onClick: () => this.closeModal() }, this.cancelText)))), hAsync("ion-content", { key: 'c73f80a4bc25b9061ea65cf11e5d811c1a4d8704' }, hAsync("ion-list", { key: 'b21905d15b36ad5eb45845e768918d2763cf48b1' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
|
|
37497
37594
|
}
|
|
37498
37595
|
get el() { return getElement(this); }
|
|
37499
37596
|
static get style() { return {
|
|
@@ -37556,6 +37653,10 @@ const selectPopoverMdCss = () => `.sc-ion-select-popover-md-h ion-list.sc-ion-se
|
|
|
37556
37653
|
class SelectPopover {
|
|
37557
37654
|
constructor(hostRef) {
|
|
37558
37655
|
registerInstance(this, hostRef);
|
|
37656
|
+
// Tracks the option that received Enter-keydown so keyup only
|
|
37657
|
+
// dismisses when the press started on the same option. Prevents
|
|
37658
|
+
// Enter on the triggering ion-select from auto-dismissing.
|
|
37659
|
+
this.pendingEnterTarget = null;
|
|
37559
37660
|
/**
|
|
37560
37661
|
* An array of options for the popover
|
|
37561
37662
|
*/
|
|
@@ -37631,21 +37732,28 @@ class SelectPopover {
|
|
|
37631
37732
|
return (hAsync("ion-radio-group", { value: checked, onIonChange: (ev) => this.callOptionHandler(ev) }, options.map((option) => (hAsync("ion-item", { class: Object.assign({
|
|
37632
37733
|
// TODO FW-4784
|
|
37633
37734
|
'item-radio-checked': option.value === checked
|
|
37634
|
-
}, getClassMap(option.cssClass)) }, hAsync("ion-radio", { value: option.value, disabled: option.disabled, onClick: () => this.dismissParentPopover(),
|
|
37735
|
+
}, getClassMap(option.cssClass)) }, hAsync("ion-radio", { value: option.value, disabled: option.disabled, onClick: () => this.dismissParentPopover(), onKeyDown: (ev) => {
|
|
37736
|
+
if (ev.key === 'Enter' && !ev.repeat) {
|
|
37737
|
+
this.pendingEnterTarget = ev.currentTarget;
|
|
37738
|
+
}
|
|
37739
|
+
}, onKeyUp: (ev) => {
|
|
37635
37740
|
if (ev.key === ' ') {
|
|
37636
|
-
|
|
37637
|
-
* Selecting a radio option with keyboard navigation,
|
|
37638
|
-
* either through the Enter or Space keys, should
|
|
37639
|
-
* dismiss the popover.
|
|
37640
|
-
*/
|
|
37741
|
+
// Space selects and dismisses in one press.
|
|
37641
37742
|
this.dismissParentPopover();
|
|
37642
37743
|
}
|
|
37744
|
+
else if (ev.key === 'Enter') {
|
|
37745
|
+
const shouldDismiss = this.pendingEnterTarget === ev.currentTarget;
|
|
37746
|
+
this.pendingEnterTarget = null;
|
|
37747
|
+
if (shouldDismiss) {
|
|
37748
|
+
this.dismissParentPopover();
|
|
37749
|
+
}
|
|
37750
|
+
}
|
|
37643
37751
|
} }, option.text))))));
|
|
37644
37752
|
}
|
|
37645
37753
|
render() {
|
|
37646
37754
|
const { header, message, options, subHeader } = this;
|
|
37647
37755
|
const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
|
|
37648
|
-
return (hAsync(Host, { key: '
|
|
37756
|
+
return (hAsync(Host, { key: 'e7449a1ecfcdbf45a79f8e26a00253c4e146448a', class: getIonMode$1(this) }, hAsync("ion-list", { key: '52abdfc8668c3429a0dcefef8ddedb6647fdd894' }, header !== undefined && hAsync("ion-list-header", { key: '978e5c03728756feafcc60a0e10e6ec59bf2ae11' }, header), hasSubHeaderOrMessage && (hAsync("ion-item", { key: 'e93c44e7f07a76def16e4b11f0fb4780d84ed402' }, hAsync("ion-label", { key: 'bba1aac43b0bc7f4f00978dd8301985233f3725c', class: "ion-text-wrap" }, subHeader !== undefined && hAsync("h3", { key: 'ad96f6017cf2cc5219540bded2c4f1ca3b532de2' }, subHeader), message !== undefined && hAsync("p", { key: '3fd038921dc40c4d0c29734433984b279ccaeec3' }, message)))), this.renderOptions(options))));
|
|
37649
37757
|
}
|
|
37650
37758
|
get el() { return getElement(this); }
|
|
37651
37759
|
static get style() { return {
|
package/package.json
CHANGED
package/components/p-1KVKSLu5.js
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
-
*/
|
|
4
|
-
import{p as t,H as o,e,k as i,h as n,d as a,t as s}from"./p-BJoMtgfR.js";import{c as r}from"./p-C4jPsTQa.js";import{r as c}from"./p-DgbT0exM.js";import{c as d}from"./p-B-hirT0v.js";import{d as l,e as h,B as b,i as u,f as p,g,h as f,s as m,j as v,k}from"./p-Cq8cQ0NL.js";import{g as x}from"./p-DiVJyqlX.js";import{b as y}from"./p-CDfQnFrd.js";import{c as w}from"./p-Csw8xuz4.js";import{d as z}from"./p-CoA-aqGF.js";import{d as j}from"./p-YLXPWgVj.js";import{d as C}from"./p-fpbh6w3f.js";const D=t=>{const o=w(),e=w(),i=w();return e.addElement(t.querySelector("ion-backdrop")).fromTo("opacity",.01,"var(--backdrop-opacity)").beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),i.addElement(t.querySelector(".action-sheet-wrapper")).fromTo("transform","translateY(100%)","translateY(0%)"),o.addElement(t).easing("cubic-bezier(.36,.66,.04,1)").duration(400).addAnimation([e,i])},A=t=>{const o=w(),e=w(),i=w();return e.addElement(t.querySelector("ion-backdrop")).fromTo("opacity","var(--backdrop-opacity)",0),i.addElement(t.querySelector(".action-sheet-wrapper")).fromTo("transform","translateY(0%)","translateY(100%)"),o.addElement(t).easing("cubic-bezier(.36,.66,.04,1)").duration(450).addAnimation([e,i])},O=t=>{const o=w(),e=w(),i=w();return e.addElement(t.querySelector("ion-backdrop")).fromTo("opacity",.01,"var(--backdrop-opacity)").beforeStyles({"pointer-events":"none"}).afterClearStyles(["pointer-events"]),i.addElement(t.querySelector(".action-sheet-wrapper")).fromTo("transform","translateY(100%)","translateY(0%)"),o.addElement(t).easing("cubic-bezier(.36,.66,.04,1)").duration(400).addAnimation([e,i])},I=t=>{const o=w(),e=w(),i=w();return e.addElement(t.querySelector("ion-backdrop")).fromTo("opacity","var(--backdrop-opacity)",0),i.addElement(t.querySelector(".action-sheet-wrapper")).fromTo("transform","translateY(0%)","translateY(100%)"),o.addElement(t).easing("cubic-bezier(.36,.66,.04,1)").duration(450).addAnimation([e,i])},B=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.didPresent=e(this,"ionActionSheetDidPresent",7),this.willPresent=e(this,"ionActionSheetWillPresent",7),this.willDismiss=e(this,"ionActionSheetWillDismiss",7),this.didDismiss=e(this,"ionActionSheetDidDismiss",7),this.didPresentShorthand=e(this,"didPresent",7),this.willPresentShorthand=e(this,"willPresent",7),this.willDismissShorthand=e(this,"willDismiss",7),this.didDismissShorthand=e(this,"didDismiss",7),this.delegateController=l(this),this.lockController=d(),this.triggerController=h(),this.hasRadioButtons=!1,this.presented=!1,this.hasController=!1,this.keyboardClose=!0,this.buttons=[],this.backdropDismiss=!0,this.translucent=!1,this.animated=!0,this.isOpen=!1,this.onBackdropTap=()=>{this.dismiss(void 0,b)},this.dispatchCancelHandler=t=>{if(u(t.detail.role)){const t=this.getButtons().find((t=>"cancel"===t.role));this.callButtonHandler(t)}}}buttonsChanged(){const t=this.getRadioButtons();if(this.hasRadioButtons=t.length>0,this.hasRadioButtons){const o=t.find((t=>{var o;return"true"===(null===(o=t.htmlAttributes)||void 0===o?void 0:o["aria-checked"])}));if(o){const t=this.getButtons().indexOf(o);this.activeRadioId=this.getButtonId(o,t)}}}onIsOpenChange(t,o){!0===t&&!1===o?this.present():!1===t&&!0===o&&this.dismiss()}triggerChanged(){const{trigger:t,el:o,triggerController:e}=this;t&&e.addClickListener(o,t)}async present(){const t=await this.lockController.lock();await this.delegateController.attachViewToDom(),await p(this,"actionSheetEnter",D,O),t()}async dismiss(t,o){const e=await this.lockController.lock(),i=await g(this,t,o,"actionSheetLeave",A,I);return i&&this.delegateController.removeViewFromDom(),e(),i}onDidDismiss(){return f(this.el,"ionActionSheetDidDismiss")}onWillDismiss(){return f(this.el,"ionActionSheetWillDismiss")}async buttonClick(t){const o=t.role;return u(o)?this.dismiss(t.data,o):await this.callButtonHandler(t)?this.dismiss(t.data,t.role):Promise.resolve()}async callButtonHandler(t){return!t||!1!==await m(t.handler)}getButtons(){return this.buttons.map((t=>"string"==typeof t?{text:t}:t))}getRadioButtons(){return this.getButtons().filter((t=>{var o;const e=null===(o=t.htmlAttributes)||void 0===o?void 0:o.role;return"radio"===e&&!u(e)}))}selectRadioButton(t){const o=this.getButtonId(t);this.activeRadioId=o}getButtonId(t,o){if(t.id)return t.id;const e=this.getButtons(),i=void 0!==o?o:e.indexOf(t);return`action-sheet-button-${this.overlayIndex}-${i}`}onKeydown(t){if(!this.hasRadioButtons||!this.presented)return;const o=t.target;if(!this.el.contains(o)||!o.classList.contains("action-sheet-button")||"radio"!==o.getAttribute("role"))return;const e=Array.from(this.el.querySelectorAll('.action-sheet-button[role="radio"]')).filter((t=>!t.disabled)),i=e.findIndex((t=>t.id===o.id));if(-1===i)return;const n=this.getButtons(),a=this.getRadioButtons(),s=new Map;let r;if(a.forEach((t=>{const o=n.indexOf(t),e=this.getButtonId(t,o);s.set(e,t)})),["ArrowDown","ArrowRight"].includes(t.key))t.preventDefault(),t.stopPropagation(),r=i===e.length-1?e[0]:e[i+1];else if(["ArrowUp","ArrowLeft"].includes(t.key))t.preventDefault(),t.stopPropagation(),r=0===i?e[e.length-1]:e[i-1];else if(" "===t.key||"Enter"===t.key){t.preventDefault(),t.stopPropagation();const e=s.get(o.id);return void(e&&(this.selectRadioButton(e),this.buttonClick(e)))}if(r){const t=s.get(r.id);t&&(this.selectRadioButton(t),r.focus())}}connectedCallback(){v(this.el),this.triggerChanged()}disconnectedCallback(){this.gesture&&(this.gesture.destroy(),this.gesture=void 0),this.triggerController.removeClickListener()}componentWillLoad(){var t;(null===(t=this.htmlAttributes)||void 0===t?void 0:t.id)||k(this.el),this.buttonsChanged()}componentDidLoad(){const{groupEl:t,wrapperEl:o}=this;!this.gesture&&"ios"===y(this)&&o&&t&&i((()=>{t.scrollHeight>t.clientHeight||(this.gesture=r(o,(t=>t.classList.contains("action-sheet-button"))),this.gesture.enable(!0))})),!0===this.isOpen&&c((()=>this.present())),this.triggerChanged()}renderActionSheetButtons(t){const o=y(this),{activeRadioId:e}=this;return t.map(((t,i)=>{var a;const s="radio"===(null===(a=t.htmlAttributes)||void 0===a?void 0:a.role),r=this.getButtonId(t,i),c=this.getRadioButtons(),d=s&&r===e;let l;l=s?d||!e&&s&&t===c[0]?0:-1:void 0;const h=Object.assign({},t.htmlAttributes);return s&&(h["aria-checked"]=d?"true":"false"),n("button",Object.assign({},h,{role:s?"radio":void 0,type:"button",id:r,class:Object.assign(Object.assign({},E(t)),{"action-sheet-selected":d}),onClick:()=>{s&&this.selectRadioButton(t),this.buttonClick(t)},disabled:t.disabled,tabIndex:l}),n("span",{class:"action-sheet-button-inner"},t.icon&&n("ion-icon",{icon:t.icon,"aria-hidden":"true",lazy:!1,class:"action-sheet-icon"}),t.text),"md"===o&&n("ion-ripple-effect",null))}))}render(){const{header:t,htmlAttributes:o,overlayIndex:e,hasRadioButtons:i}=this,s=y(this),r=this.getButtons(),c=r.find((t=>"cancel"===t.role)),d=r.filter((t=>"cancel"!==t.role)),l=`action-sheet-${e}-header`;return n(a,Object.assign({key:"173fcff5b1da7c33c267de4667591c946b8c8d03",role:"dialog","aria-modal":"true","aria-labelledby":void 0!==t?l:null,tabindex:"-1"},o,{style:{zIndex:`${2e4+this.overlayIndex}`},class:Object.assign(Object.assign({[s]:!0},x(this.cssClass)),{"overlay-hidden":!0,"action-sheet-translucent":this.translucent}),onIonActionSheetWillDismiss:this.dispatchCancelHandler,onIonBackdropTap:this.onBackdropTap}),n("ion-backdrop",{key:"521ede659f747864f6c974e09016436eceb7158c",tappable:this.backdropDismiss}),n("div",{key:"7a7946fc434bc444f16a70638f5e948c69d33fcd",tabindex:"0","aria-hidden":"true"}),n("div",{key:"bcff39a580489dbafa255842e57aa8602c6d0f18",class:"action-sheet-wrapper ion-overlay-wrapper",ref:t=>this.wrapperEl=t},n("div",{key:"84bba13ce14261f0f0daa3f9c77648c9e7f36e0e",class:"action-sheet-container"},n("div",{key:"d9c8ac404fd6719a7adf8cb36549f67616f9a0c4",class:"action-sheet-group",ref:t=>this.groupEl=t,role:i?"radiogroup":void 0},void 0!==t&&n("div",{key:"180433a8ad03ef5c54728a1a8f34715b6921d658",id:l,class:{"action-sheet-title":!0,"action-sheet-has-sub-title":void 0!==this.subHeader}},t,this.subHeader&&n("div",{key:"7138e79e61b1a8f42bc5a9175c57fa2f15d7ec5a",class:"action-sheet-sub-title"},this.subHeader)),this.renderActionSheetButtons(d)),c&&n("div",{key:"b617c722f5b8028d73ed34b69310f312c65f34a7",class:"action-sheet-group action-sheet-group-cancel"},n("button",Object.assign({key:"d0dd876fc48815df3710413c201c0b445a8e16c0"},c.htmlAttributes,{type:"button",class:E(c),onClick:()=>this.buttonClick(c)}),n("span",{key:"e7b960157cc6fc5fe92a12090b2be55e8ae072e4",class:"action-sheet-button-inner"},c.icon&&n("ion-icon",{key:"05498ffc60cab911dbff0ecbc6168dea59ada9a5",icon:c.icon,"aria-hidden":"true",lazy:!1,class:"action-sheet-icon"}),c.text),"md"===s&&n("ion-ripple-effect",{key:"3d401346cea301be4ca03671f7370f6f4b0b6bde"}))))),n("div",{key:"971f3c5fcc07f36c28eb469a47ec0290c692e139",tabindex:"0","aria-hidden":"true"}))}get el(){return this}static get watchers(){return{buttons:[{buttonsChanged:0}],isOpen:[{onIsOpenChange:0}],trigger:[{triggerChanged:0}]}}static get style(){return{ios:'.sc-ion-action-sheet-ios-h{--color:initial;--button-color-activated:var(--button-color);--button-color-focused:var(--button-color);--button-color-hover:var(--button-color);--button-color-selected:var(--button-color);--min-width:auto;--width:100%;--max-width:500px;--min-height:auto;--height:auto;--max-height:calc(100% - (var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:block;position:fixed;outline:none;font-family:var(--ion-font-family, inherit);-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-action-sheet-ios-h{display:none}.action-sheet-wrapper.sc-ion-action-sheet-ios{left:0;right:0;bottom:0;-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);display:block;position:absolute;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);z-index:10;pointer-events:none}.action-sheet-button.sc-ion-action-sheet-ios{display:block;position:relative;width:100%;border:0;outline:none;background:var(--button-background);color:var(--button-color);font-family:inherit;overflow:hidden}.action-sheet-button.sc-ion-action-sheet-ios:disabled{color:var(--button-color-disabled);opacity:0.4}.action-sheet-button-inner.sc-ion-action-sheet-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;pointer-events:none;width:100%;height:100%;z-index:1}.action-sheet-container.sc-ion-action-sheet-ios{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:end;justify-content:flex-end;height:100%;max-height:calc(100vh - (var(--ion-safe-area-top, 0) + var(--ion-safe-area-bottom, 0)));max-height:calc(100dvh - (var(--ion-safe-area-top, 0) + var(--ion-safe-area-bottom, 0)))}.action-sheet-group.sc-ion-action-sheet-ios{-ms-flex-negative:2;flex-shrink:2;overscroll-behavior-y:contain;overflow-y:auto;-webkit-overflow-scrolling:touch;pointer-events:all;background:var(--background)}@media (any-pointer: coarse){.action-sheet-group.sc-ion-action-sheet-ios::-webkit-scrollbar{display:none}}.action-sheet-group-cancel.sc-ion-action-sheet-ios{-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.action-sheet-button.sc-ion-action-sheet-ios::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.action-sheet-selected.sc-ion-action-sheet-ios{color:var(--button-color-selected)}.action-sheet-selected.sc-ion-action-sheet-ios::after{background:var(--button-background-selected);opacity:var(--button-background-selected-opacity)}.action-sheet-button.ion-activated.sc-ion-action-sheet-ios{color:var(--button-color-activated)}.action-sheet-button.ion-activated.sc-ion-action-sheet-ios::after{background:var(--button-background-activated);opacity:var(--button-background-activated-opacity)}.action-sheet-button.ion-focused.sc-ion-action-sheet-ios{color:var(--button-color-focused)}.action-sheet-button.ion-focused.sc-ion-action-sheet-ios::after{background:var(--button-background-focused);opacity:var(--button-background-focused-opacity)}@media (any-hover: hover){.action-sheet-button.sc-ion-action-sheet-ios:not(:disabled):hover{color:var(--button-color-hover)}.action-sheet-button.sc-ion-action-sheet-ios:not(:disabled):hover::after{background:var(--button-background-hover);opacity:var(--button-background-hover-opacity)}}.sc-ion-action-sheet-ios-h{--background:var(--ion-overlay-background-color, var(--ion-color-step-100, var(--ion-background-color-step-100, #f9f9f9)));--backdrop-opacity:var(--ion-backdrop-opacity, 0.4);--button-background:linear-gradient(0deg, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08), rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08) 50%, transparent 50%) bottom/100% 1px no-repeat transparent;--button-background-activated:var(--ion-text-color, #000);--button-background-activated-opacity:.08;--button-background-hover:currentColor;--button-background-hover-opacity:.04;--button-background-focused:currentColor;--button-background-focused-opacity:.12;--button-background-selected:var(--ion-color-step-150, var(--ion-background-color-step-150, var(--ion-background-color, #fff)));--button-background-selected-opacity:1;--button-color:var(--ion-color-primary, #0054e9);--button-color-disabled:var(--ion-color-step-850, var(--ion-text-color-step-150, #262626));--color:var(--ion-color-step-400, var(--ion-text-color-step-600, #999999));text-align:center}.action-sheet-wrapper.sc-ion-action-sheet-ios{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:var(--ion-safe-area-top, 0);padding-bottom:var(--ion-safe-area-bottom, 0);-webkit-box-sizing:content-box;box-sizing:content-box}.action-sheet-container.sc-ion-action-sheet-ios{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:0;padding-bottom:0}.action-sheet-group.sc-ion-action-sheet-ios{border-radius:13px;margin-bottom:8px}.action-sheet-group.sc-ion-action-sheet-ios:first-child{margin-top:10px}.action-sheet-group.sc-ion-action-sheet-ios:last-child{margin-bottom:10px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-group.sc-ion-action-sheet-ios{background-color:transparent;-webkit-backdrop-filter:saturate(280%) blur(20px);backdrop-filter:saturate(280%) blur(20px)}.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-title.sc-ion-action-sheet-ios,.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-button.sc-ion-action-sheet-ios{background-color:transparent;background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8)), to(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8))), -webkit-gradient(linear, left bottom, left top, from(rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4)), color-stop(50%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4)), color-stop(50%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8)));background-image:linear-gradient(0deg, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8), rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8) 100%), linear-gradient(0deg, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4), rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.4) 50%, rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8) 50%);background-repeat:no-repeat;background-position:top, bottom;background-size:100% calc(100% - 1px), 100% 1px;-webkit-backdrop-filter:saturate(120%);backdrop-filter:saturate(120%)}.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-button.ion-activated.sc-ion-action-sheet-ios{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.7);background-image:none}.action-sheet-translucent.sc-ion-action-sheet-ios-h .action-sheet-cancel.sc-ion-action-sheet-ios{background:var(--button-background-selected)}}.action-sheet-title.sc-ion-action-sheet-ios{background:-webkit-gradient(linear, left bottom, left top, from(rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08)), color-stop(50%, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08)), color-stop(50%, transparent)) bottom/100% 1px no-repeat transparent;background:linear-gradient(0deg, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08), rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.08) 50%, transparent 50%) bottom/100% 1px no-repeat transparent}.action-sheet-title.sc-ion-action-sheet-ios{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:14px;padding-bottom:13px;color:var(--color, var(--ion-color-step-400, var(--ion-text-color-step-600, #999999)));font-size:max(13px, 0.8125rem);font-weight:400;text-align:center}.action-sheet-title.action-sheet-has-sub-title.sc-ion-action-sheet-ios{font-weight:600}.action-sheet-sub-title.sc-ion-action-sheet-ios{padding-left:0;padding-right:0;padding-top:6px;padding-bottom:0;font-size:max(13px, 0.8125rem);font-weight:400}.action-sheet-button.sc-ion-action-sheet-ios{-webkit-padding-start:14px;padding-inline-start:14px;-webkit-padding-end:14px;padding-inline-end:14px;padding-top:14px;padding-bottom:14px;min-height:56px;font-size:max(20px, 1.25rem);contain:content}.action-sheet-button.sc-ion-action-sheet-ios .action-sheet-icon.sc-ion-action-sheet-ios{-webkit-margin-end:0.3em;margin-inline-end:0.3em;font-size:max(28px, 1.75rem);pointer-events:none}.action-sheet-button.sc-ion-action-sheet-ios:last-child{background-image:none}.action-sheet-selected.sc-ion-action-sheet-ios{font-weight:bold}.action-sheet-cancel.sc-ion-action-sheet-ios{font-weight:600}.action-sheet-cancel.sc-ion-action-sheet-ios::after{background:var(--button-background-selected);opacity:var(--button-background-selected-opacity)}.action-sheet-destructive.sc-ion-action-sheet-ios,.action-sheet-destructive.ion-activated.sc-ion-action-sheet-ios,.action-sheet-destructive.ion-focused.sc-ion-action-sheet-ios{color:var(--ion-color-danger, #c5000f)}@media (any-hover: hover){.action-sheet-destructive.sc-ion-action-sheet-ios:hover{color:var(--ion-color-danger, #c5000f)}}',md:'.sc-ion-action-sheet-md-h{--color:initial;--button-color-activated:var(--button-color);--button-color-focused:var(--button-color);--button-color-hover:var(--button-color);--button-color-selected:var(--button-color);--min-width:auto;--width:100%;--max-width:500px;--min-height:auto;--height:auto;--max-height:calc(100% - (var(--ion-safe-area-top) + var(--ion-safe-area-bottom)));-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;left:0;right:0;top:0;bottom:0;display:block;position:fixed;outline:none;font-family:var(--ion-font-family, inherit);-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1001}.overlay-hidden.sc-ion-action-sheet-md-h{display:none}.action-sheet-wrapper.sc-ion-action-sheet-md{left:0;right:0;bottom:0;-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);display:block;position:absolute;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);z-index:10;pointer-events:none}.action-sheet-button.sc-ion-action-sheet-md{display:block;position:relative;width:100%;border:0;outline:none;background:var(--button-background);color:var(--button-color);font-family:inherit;overflow:hidden}.action-sheet-button.sc-ion-action-sheet-md:disabled{color:var(--button-color-disabled);opacity:0.4}.action-sheet-button-inner.sc-ion-action-sheet-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;pointer-events:none;width:100%;height:100%;z-index:1}.action-sheet-container.sc-ion-action-sheet-md{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:end;justify-content:flex-end;height:100%;max-height:calc(100vh - (var(--ion-safe-area-top, 0) + var(--ion-safe-area-bottom, 0)));max-height:calc(100dvh - (var(--ion-safe-area-top, 0) + var(--ion-safe-area-bottom, 0)))}.action-sheet-group.sc-ion-action-sheet-md{-ms-flex-negative:2;flex-shrink:2;overscroll-behavior-y:contain;overflow-y:auto;-webkit-overflow-scrolling:touch;pointer-events:all;background:var(--background)}@media (any-pointer: coarse){.action-sheet-group.sc-ion-action-sheet-md::-webkit-scrollbar{display:none}}.action-sheet-group-cancel.sc-ion-action-sheet-md{-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.action-sheet-button.sc-ion-action-sheet-md::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.action-sheet-selected.sc-ion-action-sheet-md{color:var(--button-color-selected)}.action-sheet-selected.sc-ion-action-sheet-md::after{background:var(--button-background-selected);opacity:var(--button-background-selected-opacity)}.action-sheet-button.ion-activated.sc-ion-action-sheet-md{color:var(--button-color-activated)}.action-sheet-button.ion-activated.sc-ion-action-sheet-md::after{background:var(--button-background-activated);opacity:var(--button-background-activated-opacity)}.action-sheet-button.ion-focused.sc-ion-action-sheet-md{color:var(--button-color-focused)}.action-sheet-button.ion-focused.sc-ion-action-sheet-md::after{background:var(--button-background-focused);opacity:var(--button-background-focused-opacity)}@media (any-hover: hover){.action-sheet-button.sc-ion-action-sheet-md:not(:disabled):hover{color:var(--button-color-hover)}.action-sheet-button.sc-ion-action-sheet-md:not(:disabled):hover::after{background:var(--button-background-hover);opacity:var(--button-background-hover-opacity)}}.sc-ion-action-sheet-md-h{--background:var(--ion-overlay-background-color, var(--ion-background-color, #fff));--backdrop-opacity:var(--ion-backdrop-opacity, 0.32);--button-background:transparent;--button-background-selected:currentColor;--button-background-selected-opacity:0;--button-background-activated:transparent;--button-background-activated-opacity:0;--button-background-hover:currentColor;--button-background-hover-opacity:.04;--button-background-focused:currentColor;--button-background-focused-opacity:.12;--button-color:var(--ion-color-step-850, var(--ion-text-color-step-150, #262626));--button-color-disabled:var(--button-color);--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54)}.action-sheet-wrapper.sc-ion-action-sheet-md{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:var(--ion-safe-area-top, 0);margin-bottom:0}.action-sheet-title.sc-ion-action-sheet-md{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:20px;padding-bottom:17px;min-height:60px;color:var(--color, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54));font-size:1rem;text-align:start}.action-sheet-sub-title.sc-ion-action-sheet-md{padding-left:0;padding-right:0;padding-top:16px;padding-bottom:0;font-size:0.875rem}.action-sheet-group.sc-ion-action-sheet-md:first-child{padding-top:0}.action-sheet-group.sc-ion-action-sheet-md:last-child{padding-bottom:var(--ion-safe-area-bottom)}.action-sheet-button.sc-ion-action-sheet-md{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:12px;padding-bottom:12px;position:relative;min-height:52px;font-size:1rem;text-align:start;contain:content;overflow:hidden}.action-sheet-icon.sc-ion-action-sheet-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:32px;margin-inline-end:32px;margin-top:0;margin-bottom:0;color:var(--color);font-size:1.5rem}.action-sheet-button-inner.sc-ion-action-sheet-md{-ms-flex-pack:start;justify-content:flex-start}.action-sheet-selected.sc-ion-action-sheet-md{font-weight:bold}'}}},[34,"ion-action-sheet",{overlayIndex:[2,"overlay-index"],delegate:[16],hasController:[4,"has-controller"],keyboardClose:[4,"keyboard-close"],enterAnimation:[16],leaveAnimation:[16],buttons:[16],cssClass:[1,"css-class"],backdropDismiss:[4,"backdrop-dismiss"],header:[1],subHeader:[1,"sub-header"],translucent:[4],animated:[4],htmlAttributes:[16],isOpen:[4,"is-open"],trigger:[1],activeRadioId:[32],present:[64],dismiss:[64],onDidDismiss:[64],onWillDismiss:[64]},[[0,"keydown","onKeydown"]],{buttons:[{buttonsChanged:0}],isOpen:[{onIsOpenChange:0}],trigger:[{triggerChanged:0}]}]),E=t=>Object.assign({"action-sheet-button":!0,"ion-activatable":!t.disabled,"ion-focusable":!t.disabled,[`action-sheet-${t.role}`]:void 0!==t.role},x(t.cssClass));function S(){"undefined"!=typeof customElements&&["ion-action-sheet","ion-backdrop","ion-icon","ion-ripple-effect"].forEach((t=>{switch(t){case"ion-action-sheet":customElements.get(s(t))||customElements.define(s(t),B);break;case"ion-backdrop":customElements.get(s(t))||z();break;case"ion-icon":customElements.get(s(t))||j();break;case"ion-ripple-effect":customElements.get(s(t))||C()}}))}export{B as A,S as d}
|