@ionic/core 8.7.12-dev.11765060985.14ad27fb → 8.7.12-dev.11765231260.1def96ab

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.
Files changed (63) hide show
  1. package/components/action-sheet.js +186 -5
  2. package/components/ion-select.js +8 -3
  3. package/components/modal.js +16 -86
  4. package/components/overlays.js +11 -15
  5. package/css/core.css +1 -1
  6. package/css/core.css.map +1 -1
  7. package/css/ionic.bundle.css +1 -1
  8. package/css/ionic.bundle.css.map +1 -1
  9. package/dist/cjs/index.cjs.js +1 -1
  10. package/dist/cjs/ion-action-sheet.cjs.entry.js +184 -5
  11. package/dist/cjs/ion-alert.cjs.entry.js +1 -1
  12. package/dist/cjs/ion-datetime_3.cjs.entry.js +1 -1
  13. package/dist/cjs/ion-loading.cjs.entry.js +1 -1
  14. package/dist/cjs/ion-menu_3.cjs.entry.js +1 -1
  15. package/dist/cjs/ion-modal.cjs.entry.js +17 -86
  16. package/dist/cjs/ion-popover.cjs.entry.js +1 -1
  17. package/dist/cjs/ion-select-modal.cjs.entry.js +1 -1
  18. package/dist/cjs/ion-select_3.cjs.entry.js +9 -4
  19. package/dist/cjs/ion-toast.cjs.entry.js +1 -1
  20. package/dist/cjs/ionic.cjs.js +1 -1
  21. package/dist/cjs/loader.cjs.js +1 -1
  22. package/dist/cjs/{overlays-D3xMmZCY.js → overlays-DxIZwUXI.js} +11 -15
  23. package/dist/collection/components/action-sheet/action-sheet.js +199 -4
  24. package/dist/collection/components/modal/modal.js +16 -86
  25. package/dist/collection/components/select/select.js +8 -3
  26. package/dist/collection/utils/overlays.js +11 -15
  27. package/dist/docs.json +14 -8
  28. package/dist/esm/index.js +1 -1
  29. package/dist/esm/ion-action-sheet.entry.js +184 -5
  30. package/dist/esm/ion-alert.entry.js +1 -1
  31. package/dist/esm/ion-datetime_3.entry.js +1 -1
  32. package/dist/esm/ion-loading.entry.js +1 -1
  33. package/dist/esm/ion-menu_3.entry.js +1 -1
  34. package/dist/esm/ion-modal.entry.js +17 -86
  35. package/dist/esm/ion-popover.entry.js +1 -1
  36. package/dist/esm/ion-select-modal.entry.js +1 -1
  37. package/dist/esm/ion-select_3.entry.js +9 -4
  38. package/dist/esm/ion-toast.entry.js +1 -1
  39. package/dist/esm/ionic.js +1 -1
  40. package/dist/esm/loader.js +1 -1
  41. package/dist/esm/{overlays-DYKBVm6h.js → overlays-BymNv-BL.js} +11 -15
  42. package/dist/ionic/index.esm.js +1 -1
  43. package/dist/ionic/ionic.esm.js +1 -1
  44. package/dist/ionic/{p-3fad4ab5.entry.js → p-0b80d700.entry.js} +1 -1
  45. package/dist/ionic/{p-a480563a.entry.js → p-15193d01.entry.js} +1 -1
  46. package/dist/ionic/p-5837f29f.entry.js +4 -0
  47. package/dist/ionic/{p-b4b6513a.entry.js → p-7da39a4d.entry.js} +1 -1
  48. package/dist/ionic/{p-caa8efa1.entry.js → p-83be404e.entry.js} +1 -1
  49. package/dist/ionic/p-8edc7565.entry.js +4 -0
  50. package/dist/ionic/{p-7928cc4d.entry.js → p-98fc09eb.entry.js} +1 -1
  51. package/dist/ionic/p-D87hU-Ly.js +4 -0
  52. package/dist/ionic/p-c69ff6d8.entry.js +4 -0
  53. package/dist/ionic/{p-985f02a8.entry.js → p-cb93126d.entry.js} +1 -1
  54. package/dist/ionic/{p-038f3a87.entry.js → p-e16b69e1.entry.js} +1 -1
  55. package/dist/types/components/action-sheet/action-sheet.d.ts +37 -0
  56. package/dist/types/components/modal/modal.d.ts +0 -13
  57. package/hydrate/index.js +220 -109
  58. package/hydrate/index.mjs +220 -109
  59. package/package.json +4 -1
  60. package/dist/ionic/p-1cf19c5a.entry.js +0 -4
  61. package/dist/ionic/p-9084d52f.entry.js +0 -4
  62. package/dist/ionic/p-CHK505Co.js +0 -4
  63. package/dist/ionic/p-ede27a66.entry.js +0 -4
package/hydrate/index.mjs CHANGED
@@ -6252,7 +6252,7 @@ const setRootAriaHidden = (hidden = false) => {
6252
6252
  }
6253
6253
  };
6254
6254
  const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts) => {
6255
- var _a, _b, _c;
6255
+ var _a, _b;
6256
6256
  if (overlay.presented) {
6257
6257
  return;
6258
6258
  }
@@ -6286,10 +6286,9 @@ const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts)
6286
6286
  */
6287
6287
  const overlayEl = overlay.el;
6288
6288
  const shouldTrapFocus = overlayEl.tagName !== 'ION-TOAST' && overlayEl.focusTrap !== false;
6289
- // Only lock out root content when backdrop is always active. Developers relying on
6290
- // showBackdrop=false or backdropBreakpoint expect background interaction at some point.
6291
- const backdropAlwaysActive = overlayEl.showBackdrop !== false && !(((_a = overlayEl.backdropBreakpoint) !== null && _a !== void 0 ? _a : 0) > 0);
6292
- const shouldLockRoot = shouldTrapFocus && backdropAlwaysActive;
6289
+ // Only lock out root content when backdrop is active. Developers relying on showBackdrop=false
6290
+ // expect background interaction to remain enabled.
6291
+ const shouldLockRoot = shouldTrapFocus && overlayEl.showBackdrop !== false;
6293
6292
  overlay.presented = true;
6294
6293
  overlay.willPresent.emit();
6295
6294
  if (shouldLockRoot) {
@@ -6301,7 +6300,7 @@ const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts)
6301
6300
  }
6302
6301
  document.body.classList.add(BACKDROP_NO_SCROLL);
6303
6302
  }
6304
- (_b = overlay.willPresentShorthand) === null || _b === void 0 ? void 0 : _b.emit();
6303
+ (_a = overlay.willPresentShorthand) === null || _a === void 0 ? void 0 : _a.emit();
6305
6304
  const mode = getIonMode$1(overlay);
6306
6305
  // get the user's animation fn if one was provided
6307
6306
  const animationBuilder = overlay.enterAnimation
@@ -6310,7 +6309,7 @@ const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation, opts)
6310
6309
  const completed = await overlayAnimation(overlay, animationBuilder, overlay.el, opts);
6311
6310
  if (completed) {
6312
6311
  overlay.didPresent.emit();
6313
- (_c = overlay.didPresentShorthand) === null || _c === void 0 ? void 0 : _c.emit();
6312
+ (_b = overlay.didPresentShorthand) === null || _b === void 0 ? void 0 : _b.emit();
6314
6313
  }
6315
6314
  /**
6316
6315
  * If the focused element is already
@@ -6388,7 +6387,7 @@ const restoreElementFocus = async (overlayEl) => {
6388
6387
  }
6389
6388
  };
6390
6389
  const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnimation, opts) => {
6391
- var _a, _b, _c;
6390
+ var _a, _b;
6392
6391
  if (!overlay.presented) {
6393
6392
  return false;
6394
6393
  }
@@ -6404,14 +6403,11 @@ const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnim
6404
6403
  * is dismissed.
6405
6404
  */
6406
6405
  const overlaysLockingRoot = presentedOverlays.filter((o) => {
6407
- var _a;
6408
6406
  const el = o;
6409
- const backdropAlwaysActive = el.showBackdrop !== false && !(((_a = el.backdropBreakpoint) !== null && _a !== void 0 ? _a : 0) > 0);
6410
- return el.tagName !== 'ION-TOAST' && el.focusTrap !== false && backdropAlwaysActive;
6407
+ return el.tagName !== 'ION-TOAST' && el.focusTrap !== false && el.showBackdrop !== false;
6411
6408
  });
6412
6409
  const overlayEl = overlay.el;
6413
- const backdropAlwaysActive = overlayEl.showBackdrop !== false && !(((_a = overlayEl.backdropBreakpoint) !== null && _a !== void 0 ? _a : 0) > 0);
6414
- const locksRoot = overlayEl.tagName !== 'ION-TOAST' && overlayEl.focusTrap !== false && backdropAlwaysActive;
6410
+ const locksRoot = overlayEl.tagName !== 'ION-TOAST' && overlayEl.focusTrap !== false && overlayEl.showBackdrop !== false;
6415
6411
  /**
6416
6412
  * If this is the last visible overlay that is trapping focus
6417
6413
  * then we want to re-add the root to the accessibility tree.
@@ -6426,7 +6422,7 @@ const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnim
6426
6422
  // Overlay contents should not be clickable during dismiss
6427
6423
  overlay.el.style.setProperty('pointer-events', 'none');
6428
6424
  overlay.willDismiss.emit({ data, role });
6429
- (_b = overlay.willDismissShorthand) === null || _b === void 0 ? void 0 : _b.emit({ data, role });
6425
+ (_a = overlay.willDismissShorthand) === null || _a === void 0 ? void 0 : _a.emit({ data, role });
6430
6426
  const mode = getIonMode$1(overlay);
6431
6427
  const animationBuilder = overlay.leaveAnimation
6432
6428
  ? overlay.leaveAnimation
@@ -6436,7 +6432,7 @@ const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLeaveAnim
6436
6432
  await overlayAnimation(overlay, animationBuilder, overlay.el, opts);
6437
6433
  }
6438
6434
  overlay.didDismiss.emit({ data, role });
6439
- (_c = overlay.didDismissShorthand) === null || _c === void 0 ? void 0 : _c.emit({ data, role });
6435
+ (_b = overlay.didDismissShorthand) === null || _b === void 0 ? void 0 : _b.emit({ data, role });
6440
6436
  // Get a reference to all animations currently assigned to this overlay
6441
6437
  // Then tear them down to return the overlay to its initial visual state
6442
6438
  const animations = activeAnimations.get(overlay) || [];
@@ -7615,6 +7611,7 @@ class ActionSheet {
7615
7611
  this.delegateController = createDelegateController(this);
7616
7612
  this.lockController = createLockController();
7617
7613
  this.triggerController = createTriggerController();
7614
+ this.hasRadioButtons = false;
7618
7615
  this.presented = false;
7619
7616
  /** @internal */
7620
7617
  this.hasController = false;
@@ -7659,6 +7656,19 @@ class ActionSheet {
7659
7656
  }
7660
7657
  };
7661
7658
  }
7659
+ buttonsChanged() {
7660
+ const radioButtons = this.getRadioButtons();
7661
+ this.hasRadioButtons = radioButtons.length > 0;
7662
+ // Initialize activeRadioId when buttons change
7663
+ if (this.hasRadioButtons) {
7664
+ const checkedButton = radioButtons.find((b) => { var _a; return ((_a = b.htmlAttributes) === null || _a === void 0 ? void 0 : _a['aria-checked']) === 'true'; });
7665
+ if (checkedButton) {
7666
+ const allButtons = this.getButtons();
7667
+ const checkedIndex = allButtons.indexOf(checkedButton);
7668
+ this.activeRadioId = this.getButtonId(checkedButton, checkedIndex);
7669
+ }
7670
+ }
7671
+ }
7662
7672
  onIsOpenChange(newValue, oldValue) {
7663
7673
  if (newValue === true && oldValue === false) {
7664
7674
  this.present();
@@ -7739,11 +7749,122 @@ class ActionSheet {
7739
7749
  }
7740
7750
  return true;
7741
7751
  }
7752
+ /**
7753
+ * Get all buttons regardless of role.
7754
+ */
7742
7755
  getButtons() {
7743
7756
  return this.buttons.map((b) => {
7744
7757
  return typeof b === 'string' ? { text: b } : b;
7745
7758
  });
7746
7759
  }
7760
+ /**
7761
+ * Get all radio buttons (buttons with role="radio").
7762
+ */
7763
+ getRadioButtons() {
7764
+ return this.getButtons().filter((b) => {
7765
+ var _a;
7766
+ const role = (_a = b.htmlAttributes) === null || _a === void 0 ? void 0 : _a.role;
7767
+ return role === 'radio' && !isCancel(role);
7768
+ });
7769
+ }
7770
+ /**
7771
+ * Handle radio button selection and update aria-checked state.
7772
+ *
7773
+ * @param button The radio button that was selected.
7774
+ */
7775
+ selectRadioButton(button) {
7776
+ const buttonId = this.getButtonId(button);
7777
+ // Set the active radio ID (this will trigger a re-render and update aria-checked)
7778
+ this.activeRadioId = buttonId;
7779
+ }
7780
+ /**
7781
+ * Get or generate an ID for a button.
7782
+ *
7783
+ * @param button The button for which to get the ID.
7784
+ * @param index Optional index of the button in the buttons array.
7785
+ * @returns The ID of the button.
7786
+ */
7787
+ getButtonId(button, index) {
7788
+ if (button.id) {
7789
+ return button.id;
7790
+ }
7791
+ const allButtons = this.getButtons();
7792
+ const buttonIndex = index !== undefined ? index : allButtons.indexOf(button);
7793
+ return `action-sheet-button-${this.overlayIndex}-${buttonIndex}`;
7794
+ }
7795
+ /**
7796
+ * When the action sheet has radio buttons, we want to follow the
7797
+ * keyboard navigation pattern for radio groups:
7798
+ * - Arrow Down/Right: Move to the next radio button (wrap to first if at end)
7799
+ * - Arrow Up/Left: Move to the previous radio button (wrap to last if at start)
7800
+ * - Space/Enter: Select the focused radio button and trigger its handler
7801
+ */
7802
+ onKeydown(ev) {
7803
+ // Only handle keyboard navigation if we have radio buttons
7804
+ if (!this.hasRadioButtons || !this.presented) {
7805
+ return;
7806
+ }
7807
+ const target = ev.target;
7808
+ // Ignore if the target element is not within the action sheet or not a radio button
7809
+ if (!this.el.contains(target) ||
7810
+ !target.classList.contains('action-sheet-button') ||
7811
+ target.getAttribute('role') !== 'radio') {
7812
+ return;
7813
+ }
7814
+ // Get all radio button elements and filter out disabled ones
7815
+ const radios = Array.from(this.el.querySelectorAll('.action-sheet-button[role="radio"]')).filter((el) => !el.disabled);
7816
+ const currentIndex = radios.findIndex((radio) => radio.id === target.id);
7817
+ if (currentIndex === -1) {
7818
+ return;
7819
+ }
7820
+ const allButtons = this.getButtons();
7821
+ const radioButtons = this.getRadioButtons();
7822
+ /**
7823
+ * Build a map of button element IDs to their ActionSheetButton
7824
+ * config objects.
7825
+ * This allows us to quickly look up which button config corresponds
7826
+ * to a DOM element when handling keyboard navigation
7827
+ * (e.g., whenuser presses Space/Enter or arrow keys).
7828
+ * The key is the ID that was set on the DOM element during render,
7829
+ * and the value is the ActionSheetButton config that contains the
7830
+ * handler and other properties.
7831
+ */
7832
+ const buttonIdMap = new Map();
7833
+ radioButtons.forEach((b) => {
7834
+ const allIndex = allButtons.indexOf(b);
7835
+ const buttonId = this.getButtonId(b, allIndex);
7836
+ buttonIdMap.set(buttonId, b);
7837
+ });
7838
+ let nextEl;
7839
+ if (['ArrowDown', 'ArrowRight'].includes(ev.key)) {
7840
+ ev.preventDefault();
7841
+ ev.stopPropagation();
7842
+ nextEl = currentIndex === radios.length - 1 ? radios[0] : radios[currentIndex + 1];
7843
+ }
7844
+ else if (['ArrowUp', 'ArrowLeft'].includes(ev.key)) {
7845
+ ev.preventDefault();
7846
+ ev.stopPropagation();
7847
+ nextEl = currentIndex === 0 ? radios[radios.length - 1] : radios[currentIndex - 1];
7848
+ }
7849
+ else if (ev.key === ' ' || ev.key === 'Enter') {
7850
+ ev.preventDefault();
7851
+ ev.stopPropagation();
7852
+ const button = buttonIdMap.get(target.id);
7853
+ if (button) {
7854
+ this.selectRadioButton(button);
7855
+ this.buttonClick(button);
7856
+ }
7857
+ return;
7858
+ }
7859
+ // Focus the next radio button
7860
+ if (nextEl) {
7861
+ const button = buttonIdMap.get(nextEl.id);
7862
+ if (button) {
7863
+ this.selectRadioButton(button);
7864
+ nextEl.focus();
7865
+ }
7866
+ }
7867
+ }
7747
7868
  connectedCallback() {
7748
7869
  prepareOverlay(this.el);
7749
7870
  this.triggerChanged();
@@ -7760,6 +7881,8 @@ class ActionSheet {
7760
7881
  if (!((_a = this.htmlAttributes) === null || _a === void 0 ? void 0 : _a.id)) {
7761
7882
  setOverlayId(this.el);
7762
7883
  }
7884
+ // Initialize activeRadioId for radio buttons
7885
+ this.buttonsChanged();
7763
7886
  }
7764
7887
  componentDidLoad() {
7765
7888
  /**
@@ -7797,22 +7920,74 @@ class ActionSheet {
7797
7920
  */
7798
7921
  this.triggerChanged();
7799
7922
  }
7923
+ renderActionSheetButtons(filteredButtons) {
7924
+ const mode = getIonMode$1(this);
7925
+ const { activeRadioId } = this;
7926
+ return filteredButtons.map((b, index) => {
7927
+ var _a;
7928
+ const isRadio = ((_a = b.htmlAttributes) === null || _a === void 0 ? void 0 : _a.role) === 'radio';
7929
+ const buttonId = this.getButtonId(b, index);
7930
+ const radioButtons = this.getRadioButtons();
7931
+ const isActiveRadio = isRadio && buttonId === activeRadioId;
7932
+ const isFirstRadio = isRadio && b === radioButtons[0];
7933
+ // For radio buttons, set tabindex: 0 for the active one, -1 for others
7934
+ // For non-radio buttons, use default tabindex (undefined, which means 0)
7935
+ /**
7936
+ * For radio buttons, set tabindex based on activeRadioId
7937
+ * - If the button is the active radio, tabindex is 0
7938
+ * - If no radio is active, the first radio button should have tabindex 0
7939
+ * - All other radio buttons have tabindex -1
7940
+ * For non-radio buttons, use default tabindex (undefined, which means 0)
7941
+ */
7942
+ let tabIndex;
7943
+ if (isRadio) {
7944
+ // Focus on the active radio button
7945
+ if (isActiveRadio) {
7946
+ tabIndex = 0;
7947
+ }
7948
+ else if (!activeRadioId && isFirstRadio) {
7949
+ // No active radio, first radio gets focus
7950
+ tabIndex = 0;
7951
+ }
7952
+ else {
7953
+ // All other radios are not focusable
7954
+ tabIndex = -1;
7955
+ }
7956
+ }
7957
+ else {
7958
+ tabIndex = undefined;
7959
+ }
7960
+ // For radio buttons, set aria-checked based on activeRadioId
7961
+ // Otherwise, use the value from htmlAttributes if provided
7962
+ const htmlAttrs = Object.assign({}, b.htmlAttributes);
7963
+ if (isRadio) {
7964
+ htmlAttrs['aria-checked'] = isActiveRadio ? 'true' : 'false';
7965
+ }
7966
+ 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: () => {
7967
+ if (isRadio) {
7968
+ this.selectRadioButton(b);
7969
+ }
7970
+ this.buttonClick(b);
7971
+ }, disabled: b.disabled, tabIndex: tabIndex }), hAsync("span", { class: "action-sheet-button-inner" }, b.icon && hAsync("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && hAsync("ion-ripple-effect", null)));
7972
+ });
7973
+ }
7800
7974
  render() {
7801
- const { header, htmlAttributes, overlayIndex } = this;
7975
+ const { header, htmlAttributes, overlayIndex, hasRadioButtons } = this;
7802
7976
  const mode = getIonMode$1(this);
7803
7977
  const allButtons = this.getButtons();
7804
7978
  const cancelButton = allButtons.find((b) => b.role === 'cancel');
7805
7979
  const buttons = allButtons.filter((b) => b.role !== 'cancel');
7806
7980
  const headerID = `action-sheet-${overlayIndex}-header`;
7807
- return (hAsync(Host, Object.assign({ key: '9fef156b2a1f09ca4a6c1fe1f37c374139bde03c', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
7981
+ return (hAsync(Host, Object.assign({ key: '173fcff5b1da7c33c267de4667591c946b8c8d03', role: "dialog", "aria-modal": "true", "aria-labelledby": header !== undefined ? headerID : null, tabindex: "-1" }, htmlAttributes, { style: {
7808
7982
  zIndex: `${20000 + this.overlayIndex}`,
7809
- }, 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: '81cf3f7d19864e041813987b46d2d115b8466819', tappable: this.backdropDismiss }), hAsync("div", { key: '791c6a976683646fc306a42c15c5078b6f06a45f', tabindex: "0", "aria-hidden": "true" }), hAsync("div", { key: 'a350b489ef7852eab9dc2227ce6d92da27dd9bf9', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: '69ba51ee13510c1a411d87cb4845b11b7302a36f', class: "action-sheet-container" }, hAsync("div", { key: 'bded15b8306c36591e526f0f99e1eeabcbab3915', class: "action-sheet-group", ref: (el) => (this.groupEl = el) }, header !== undefined && (hAsync("div", { key: '06b5147c0f6d9180fe8f12e75c9b4a0310226adc', id: headerID, class: {
7983
+ }, 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: '521ede659f747864f6c974e09016436eceb7158c', tappable: this.backdropDismiss }), hAsync("div", { key: '7a7946fc434bc444f16a70638f5e948c69d33fcd', tabindex: "0", "aria-hidden": "true" }), hAsync("div", { key: 'bcff39a580489dbafa255842e57aa8602c6d0f18', class: "action-sheet-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, hAsync("div", { key: '84bba13ce14261f0f0daa3f9c77648c9e7f36e0e', class: "action-sheet-container" }, hAsync("div", { key: 'd9c8ac404fd6719a7adf8cb36549f67616f9a0c4', class: "action-sheet-group", ref: (el) => (this.groupEl = el), role: hasRadioButtons ? 'radiogroup' : undefined }, header !== undefined && (hAsync("div", { key: '180433a8ad03ef5c54728a1a8f34715b6921d658', id: headerID, class: {
7810
7984
  'action-sheet-title': true,
7811
7985
  'action-sheet-has-sub-title': this.subHeader !== undefined,
7812
- } }, header, this.subHeader && hAsync("div", { key: '54874362a75c679aba803bf4f8768f5404d2dd28', class: "action-sheet-sub-title" }, this.subHeader))), buttons.map((b) => (hAsync("button", Object.assign({}, b.htmlAttributes, { type: "button", id: b.id, class: buttonClass$3(b), onClick: () => this.buttonClick(b), disabled: b.disabled }), hAsync("span", { class: "action-sheet-button-inner" }, b.icon && hAsync("ion-icon", { icon: b.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" }), b.text), mode === 'md' && hAsync("ion-ripple-effect", null))))), cancelButton && (hAsync("div", { key: '67b0de298eb424f3dea846a841b7a06d70e3930d', class: "action-sheet-group action-sheet-group-cancel" }, hAsync("button", Object.assign({ key: 'e7e3f9a5495eea9b97dbf885ef36944f2e420eff' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass$3(cancelButton), onClick: () => this.buttonClick(cancelButton) }), hAsync("span", { key: 'f889d29ed6c3d14bbc1d805888351d87f5122377', class: "action-sheet-button-inner" }, cancelButton.icon && (hAsync("ion-icon", { key: '7c05cf424b38c37fd40aaeb42a494387291571fb', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && hAsync("ion-ripple-effect", { key: 'bed927b477dc2708a5123ef560274fca9819b3d6' })))))), hAsync("div", { key: 'c5df1b11dc15a93892d57065d3dd5fbe02e43b39', tabindex: "0", "aria-hidden": "true" })));
7986
+ } }, header, this.subHeader && hAsync("div", { key: '7138e79e61b1a8f42bc5a9175c57fa2f15d7ec5a', class: "action-sheet-sub-title" }, this.subHeader))), this.renderActionSheetButtons(buttons)), cancelButton && (hAsync("div", { key: 'b617c722f5b8028d73ed34b69310f312c65f34a7', class: "action-sheet-group action-sheet-group-cancel" }, hAsync("button", Object.assign({ key: 'd0dd876fc48815df3710413c201c0b445a8e16c0' }, cancelButton.htmlAttributes, { type: "button", class: buttonClass$3(cancelButton), onClick: () => this.buttonClick(cancelButton) }), hAsync("span", { key: 'e7b960157cc6fc5fe92a12090b2be55e8ae072e4', class: "action-sheet-button-inner" }, cancelButton.icon && (hAsync("ion-icon", { key: '05498ffc60cab911dbff0ecbc6168dea59ada9a5', icon: cancelButton.icon, "aria-hidden": "true", lazy: false, class: "action-sheet-icon" })), cancelButton.text), mode === 'md' && hAsync("ion-ripple-effect", { key: '3d401346cea301be4ca03671f7370f6f4b0b6bde' })))))), hAsync("div", { key: '971f3c5fcc07f36c28eb469a47ec0290c692e139', tabindex: "0", "aria-hidden": "true" })));
7813
7987
  }
7814
7988
  get el() { return getElement(this); }
7815
7989
  static get watchers() { return {
7990
+ "buttons": ["buttonsChanged"],
7816
7991
  "isOpen": ["onIsOpenChange"],
7817
7992
  "trigger": ["triggerChanged"]
7818
7993
  }; }
@@ -7840,12 +8015,13 @@ class ActionSheet {
7840
8015
  "htmlAttributes": [16],
7841
8016
  "isOpen": [4, "is-open"],
7842
8017
  "trigger": [1],
8018
+ "activeRadioId": [32],
7843
8019
  "present": [64],
7844
8020
  "dismiss": [64],
7845
8021
  "onDidDismiss": [64],
7846
8022
  "onWillDismiss": [64]
7847
8023
  },
7848
- "$listeners$": undefined,
8024
+ "$listeners$": [[0, "keydown", "onKeydown"]],
7849
8025
  "$lazyBundleId$": "-",
7850
8026
  "$attrsToReflect$": []
7851
8027
  }; }
@@ -23017,13 +23193,7 @@ class Modal {
23017
23193
  };
23018
23194
  window.addEventListener(KEYBOARD_DID_OPEN, this.keyboardOpenCallback);
23019
23195
  }
23020
- /**
23021
- * Recalculate isSheetModal because framework bindings (e.g., Angular)
23022
- * may not have been applied when componentWillLoad ran.
23023
- */
23024
- const isSheetModal = this.breakpoints !== undefined && this.initialBreakpoint !== undefined;
23025
- this.isSheetModal = isSheetModal;
23026
- if (isSheetModal) {
23196
+ if (this.isSheetModal) {
23027
23197
  this.initSheetGesture();
23028
23198
  }
23029
23199
  else if (hasCardModal) {
@@ -23105,79 +23275,6 @@ class Modal {
23105
23275
  this.gesture = gesture;
23106
23276
  this.moveSheetToBreakpoint = moveSheetToBreakpoint;
23107
23277
  this.gesture.enable(true);
23108
- /**
23109
- * When backdrop interaction is allowed, nested router outlets from child routes
23110
- * may block pointer events to parent content. Apply passthrough styles only when
23111
- * the modal was the sole content of a child route page.
23112
- * See https://github.com/ionic-team/ionic-framework/issues/30700
23113
- */
23114
- const backdropNotBlocking = this.showBackdrop === false || this.focusTrap === false || backdropBreakpoint > 0;
23115
- if (backdropNotBlocking) {
23116
- this.setupChildRoutePassthrough();
23117
- }
23118
- }
23119
- /**
23120
- * For sheet modals that allow background interaction, sets up pointer-events
23121
- * passthrough on child route page wrappers and nested router outlets.
23122
- */
23123
- setupChildRoutePassthrough() {
23124
- var _a;
23125
- const pageParent = this.getOriginalPageParent();
23126
- // Skip ion-app (controller modals) and pages with other content (inline modals)
23127
- if (!pageParent || pageParent.tagName === 'ION-APP') {
23128
- return;
23129
- }
23130
- const hasVisibleContent = Array.from(pageParent.children).some((child) => {
23131
- var _a;
23132
- if (child === this.el)
23133
- return false;
23134
- if (child instanceof HTMLElement && window.getComputedStyle(child).display === 'none')
23135
- return false;
23136
- if (child.tagName === 'TEMPLATE' || child.tagName === 'SLOT')
23137
- return false;
23138
- if (child.nodeType === Node.TEXT_NODE && !((_a = child.textContent) === null || _a === void 0 ? void 0 : _a.trim()))
23139
- return false;
23140
- return true;
23141
- });
23142
- if (hasVisibleContent) {
23143
- return;
23144
- }
23145
- // Child route case: page only contained the modal
23146
- pageParent.classList.add('ion-page-overlay-passthrough');
23147
- // Also make nested router outlets passthrough
23148
- const routerOutlet = pageParent.parentElement;
23149
- if ((routerOutlet === null || routerOutlet === void 0 ? void 0 : routerOutlet.tagName) === 'ION-ROUTER-OUTLET' && ((_a = routerOutlet.parentElement) === null || _a === void 0 ? void 0 : _a.tagName) !== 'ION-APP') {
23150
- routerOutlet.style.setProperty('pointer-events', 'none');
23151
- routerOutlet.setAttribute('data-overlay-passthrough', 'true');
23152
- }
23153
- }
23154
- /**
23155
- * Finds the ion-page ancestor of the modal's original parent location.
23156
- */
23157
- getOriginalPageParent() {
23158
- if (!this.cachedOriginalParent) {
23159
- return null;
23160
- }
23161
- let pageParent = this.cachedOriginalParent;
23162
- while (pageParent && !pageParent.classList.contains('ion-page')) {
23163
- pageParent = pageParent.parentElement;
23164
- }
23165
- return pageParent;
23166
- }
23167
- /**
23168
- * Removes passthrough styles added by setupChildRoutePassthrough.
23169
- */
23170
- cleanupChildRoutePassthrough() {
23171
- const pageParent = this.getOriginalPageParent();
23172
- if (!pageParent) {
23173
- return;
23174
- }
23175
- pageParent.classList.remove('ion-page-overlay-passthrough');
23176
- const routerOutlet = pageParent.parentElement;
23177
- if (routerOutlet === null || routerOutlet === void 0 ? void 0 : routerOutlet.hasAttribute('data-overlay-passthrough')) {
23178
- routerOutlet.style.removeProperty('pointer-events');
23179
- routerOutlet.removeAttribute('data-overlay-passthrough');
23180
- }
23181
23278
  }
23182
23279
  sheetOnDismiss() {
23183
23280
  /**
@@ -23267,7 +23364,6 @@ class Modal {
23267
23364
  }
23268
23365
  this.cleanupViewTransitionListener();
23269
23366
  this.cleanupParentRemovalObserver();
23270
- this.cleanupChildRoutePassthrough();
23271
23367
  }
23272
23368
  this.currentBreakpoint = undefined;
23273
23369
  this.animation = undefined;
@@ -23464,6 +23560,17 @@ class Modal {
23464
23560
  this.cachedOriginalParent.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
23465
23561
  return;
23466
23562
  }
23563
+ /**
23564
+ * Don't observe for controller-based modals or when the parent is the
23565
+ * app root (document.body or ion-app). These parents won't be removed,
23566
+ * and observing document.body with subtree: true causes performance
23567
+ * issues with frameworks like Angular during change detection.
23568
+ */
23569
+ if (this.hasController ||
23570
+ this.cachedOriginalParent === document.body ||
23571
+ this.cachedOriginalParent.tagName === 'ION-APP') {
23572
+ return;
23573
+ }
23467
23574
  this.parentRemovalObserver = new MutationObserver((mutations) => {
23468
23575
  mutations.forEach((mutation) => {
23469
23576
  if (mutation.type === 'childList' && mutation.removedNodes.length > 0) {
@@ -23505,20 +23612,20 @@ class Modal {
23505
23612
  const isCardModal = presentingElement !== undefined && mode === 'ios';
23506
23613
  const isHandleCycle = handleBehavior === 'cycle';
23507
23614
  const isSheetModalWithHandle = isSheetModal && showHandle;
23508
- return (hAsync(Host, Object.assign({ key: '880d34a27983dde27c81a06bfed390bf38e43244', "no-router": true,
23615
+ return (hAsync(Host, Object.assign({ key: '5d8261a1a174d83642c0f7f2aa4f6c265f50fa57', "no-router": true,
23509
23616
  // Allow the modal to be navigable when the handle is focusable
23510
23617
  tabIndex: isHandleCycle && isSheetModalWithHandle ? 0 : -1 }, htmlAttributes, { style: {
23511
23618
  zIndex: `${20000 + this.overlayIndex}`,
23512
- }, 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: 'c674d142ace2b3e5bd38b302cf2984fc3fac11c8', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: 'ce83713b57960d354935ef8e65251892ed9d4e3b', class: "modal-shadow" }), hAsync("div", Object.assign({ key: '67c001e824f5c31eb58053eea71c884817479896',
23619
+ }, 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: 'bc165dd344e752c13076ca5ae37ea7d68d618d55', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: '4a2f6edaeeec2978f0cd7b2b93a44c2f0da3ab54', class: "modal-shadow" }), hAsync("div", Object.assign({ key: '13d662aa50871e97567270dbbce6825633c62bad',
23513
23620
  /*
23514
23621
  role and aria-modal must be used on the
23515
23622
  same element. They must also be set inside the
23516
23623
  shadow DOM otherwise ion-button will not be highlighted
23517
23624
  when using VoiceOver: https://bugs.webkit.org/show_bug.cgi?id=247134
23518
23625
  */
23519
- role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: '9263cbb0c5f550ef463b72446c21379ccaf0ccdd', class: "modal-handle",
23626
+ role: "dialog" }, inheritedAttributes, { "aria-modal": "true", class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }), showHandle && (hAsync("button", { key: 'e678cd3c64a0ab56636f68f9fa416741589f783c', class: "modal-handle",
23520
23627
  // Prevents the handle from receiving keyboard focus when it does not cycle
23521
- 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: '3ef07e617f2b1d46fca6a00b40119c35bff4215a', onSlotchange: this.onSlotChange }))));
23628
+ 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: '1ebc3549c5c67ea286384b9917ed4dd8958ea2ae', onSlotchange: this.onSlotChange }))));
23522
23629
  }
23523
23630
  get el() { return getElement(this); }
23524
23631
  static get watchers() { return {
@@ -23558,7 +23665,6 @@ class Modal {
23558
23665
  "keepContentsMounted": [4, "keep-contents-mounted"],
23559
23666
  "focusTrap": [4, "focus-trap"],
23560
23667
  "canDismiss": [4, "can-dismiss"],
23561
- "isSheetModal": [32],
23562
23668
  "presented": [32],
23563
23669
  "present": [64],
23564
23670
  "dismiss": [64],
@@ -33707,13 +33813,18 @@ class Select {
33707
33813
  .filter((cls) => cls !== 'hydrated')
33708
33814
  .join(' ');
33709
33815
  const optClass = `${OPTION_CLASS} ${copyClasses}`;
33816
+ const isSelected = isOptionSelected(selectValue, value, this.compareWith);
33710
33817
  return {
33711
- role: isOptionSelected(selectValue, value, this.compareWith) ? 'selected' : '',
33818
+ role: isSelected ? 'selected' : '',
33712
33819
  text: option.textContent,
33713
33820
  cssClass: optClass,
33714
33821
  handler: () => {
33715
33822
  this.setValue(value);
33716
33823
  },
33824
+ htmlAttributes: {
33825
+ 'aria-checked': isSelected ? 'true' : 'false',
33826
+ role: 'radio',
33827
+ },
33717
33828
  };
33718
33829
  });
33719
33830
  // Add "cancel" button
@@ -34094,7 +34205,7 @@ class Select {
34094
34205
  * TODO(FW-5592): Remove hasStartEndSlots condition
34095
34206
  */
34096
34207
  const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
34097
- return (hAsync(Host, { key: '35b5e18e6f79a802ff2d46d1242e80ff755cc0b9', onClick: this.onClick, class: createColorClasses$1(this.color, {
34208
+ return (hAsync(Host, { key: 'd8026835993d0e6dce747098f741a06ae4e4f54d', onClick: this.onClick, class: createColorClasses$1(this.color, {
34098
34209
  [mode]: true,
34099
34210
  'in-item': inItem,
34100
34211
  'in-item-color': hostContext('ion-item.ion-color', el),
@@ -34112,7 +34223,7 @@ class Select {
34112
34223
  [`select-justify-${justify}`]: justifyEnabled,
34113
34224
  [`select-shape-${shape}`]: shape !== undefined,
34114
34225
  [`select-label-placement-${labelPlacement}`]: true,
34115
- }) }, hAsync("label", { key: '6005b34a0c50bc4d7653a4276bc232ecd02e083c', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick }, this.renderLabelContainer(), hAsync("div", { key: 'c7e07aa81ae856c057f16275dd058f37c5670a47', class: "select-wrapper-inner" }, hAsync("slot", { key: '7fc2deefe0424404caacdbbd9e08ed43ba55d28a', name: "start" }), hAsync("div", { key: '157d74ee717b1bc30b5f1c233a09b0c8456aa68e', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), hAsync("slot", { key: 'ea66db304528b82bf9317730b6dce3db2612f235', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && hAsync("div", { key: '786eb1530b7476f0615d4e7c0bf4e7e4dc66509c', class: "select-highlight" })), this.renderBottomContent()));
34226
+ }) }, hAsync("label", { key: 'fcfb40209d6d07d49c7fdca4884b31abf6ac2567', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick }, this.renderLabelContainer(), hAsync("div", { key: 'f191664f2290c3890bde1156157c83a6ff17dbe2', class: "select-wrapper-inner" }, hAsync("slot", { key: '317a28d1115b4214f291e228ce0fe6fc782e57d5', name: "start" }), hAsync("div", { key: 'db68e18abd5ca3a1023d7c7b58bf89893ae18073', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), hAsync("slot", { key: '4274e042267c2234a198b0f65c89477898d08130', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && hAsync("div", { key: '2e2eb1ee2b2791e0683d9afb186fde6e938ca59c', class: "select-highlight" })), this.renderBottomContent()));
34116
34227
  }
34117
34228
  get el() { return getElement(this); }
34118
34229
  static get watchers() { return {
package/package.json CHANGED
@@ -1,7 +1,10 @@
1
1
  {
2
2
  "name": "@ionic/core",
3
- "version": "8.7.12-dev.11765060985.14ad27fb",
3
+ "version": "8.7.12-dev.11765231260.1def96ab",
4
4
  "description": "Base components for Ionic",
5
+ "engines": {
6
+ "node": "24.x"
7
+ },
5
8
  "keywords": [
6
9
  "ionic",
7
10
  "framework",
@@ -1,4 +0,0 @@
1
- /*!
2
- * (C) Ionic http://ionicframework.com - MIT License
3
- */
4
- import{r as t,c as o,a as e,h as i,d as n,g as a}from"./p-C8IsBmNU.js";import{c as r}from"./p-Dc45iWE4.js";import{r as s}from"./p-CTfR9YZG.js";import{c}from"./p-B-hirT0v.js";import{d,e as l,B as h,i as b,f as p,g as u,h as g,s as m,j as f,k as v}from"./p-CHK505Co.js";import{g as k}from"./p-DiVJyqlX.js";import{b as x}from"./p-BFvmZNyx.js";import{c as y}from"./p-DDb5r57F.js";import"./p-CKvCXMs9.js";import"./p-CIGNaXM1.js";import"./p-ZjP4CjeZ.js";import"./p-Cl0B-RWe.js";import"./p-BTEOs1at.js";import"./p-B0q1YL7N.js";import"./p-D-eFFUkA.js";const w=t=>{const o=y(),e=y(),i=y();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])},j=t=>{const o=y(),e=y(),i=y();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])},z=t=>{const o=y(),e=y(),i=y();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])},C=t=>{const o=y(),e=y(),i=y();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])},D=class{constructor(e){t(this,e),this.didPresent=o(this,"ionActionSheetDidPresent",7),this.willPresent=o(this,"ionActionSheetWillPresent",7),this.willDismiss=o(this,"ionActionSheetWillDismiss",7),this.didDismiss=o(this,"ionActionSheetDidDismiss",7),this.didPresentShorthand=o(this,"didPresent",7),this.willPresentShorthand=o(this,"willPresent",7),this.willDismissShorthand=o(this,"willDismiss",7),this.didDismissShorthand=o(this,"didDismiss",7),this.delegateController=d(this),this.lockController=c(),this.triggerController=l(),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,h)},this.dispatchCancelHandler=t=>{if(b(t.detail.role)){const t=this.getButtons().find((t=>"cancel"===t.role));this.callButtonHandler(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",w,z),t()}async dismiss(t,o){const e=await this.lockController.lock(),i=await u(this,t,o,"actionSheetLeave",j,C);return i&&this.delegateController.removeViewFromDom(),e(),i}onDidDismiss(){return g(this.el,"ionActionSheetDidDismiss")}onWillDismiss(){return g(this.el,"ionActionSheetWillDismiss")}async buttonClick(t){const o=t.role;return b(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))}connectedCallback(){f(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)||v(this.el)}componentDidLoad(){const{groupEl:t,wrapperEl:o}=this;!this.gesture&&"ios"===x(this)&&o&&t&&e((()=>{t.scrollHeight>t.clientHeight||(this.gesture=r(o,(t=>t.classList.contains("action-sheet-button"))),this.gesture.enable(!0))})),!0===this.isOpen&&s((()=>this.present())),this.triggerChanged()}render(){const{header:t,htmlAttributes:o,overlayIndex:e}=this,a=x(this),r=this.getButtons(),s=r.find((t=>"cancel"===t.role)),c=r.filter((t=>"cancel"!==t.role)),d=`action-sheet-${e}-header`;return i(n,Object.assign({key:"9fef156b2a1f09ca4a6c1fe1f37c374139bde03c",role:"dialog","aria-modal":"true","aria-labelledby":void 0!==t?d:null,tabindex:"-1"},o,{style:{zIndex:`${2e4+this.overlayIndex}`},class:Object.assign(Object.assign({[a]:!0},k(this.cssClass)),{"overlay-hidden":!0,"action-sheet-translucent":this.translucent}),onIonActionSheetWillDismiss:this.dispatchCancelHandler,onIonBackdropTap:this.onBackdropTap}),i("ion-backdrop",{key:"81cf3f7d19864e041813987b46d2d115b8466819",tappable:this.backdropDismiss}),i("div",{key:"791c6a976683646fc306a42c15c5078b6f06a45f",tabindex:"0","aria-hidden":"true"}),i("div",{key:"a350b489ef7852eab9dc2227ce6d92da27dd9bf9",class:"action-sheet-wrapper ion-overlay-wrapper",ref:t=>this.wrapperEl=t},i("div",{key:"69ba51ee13510c1a411d87cb4845b11b7302a36f",class:"action-sheet-container"},i("div",{key:"bded15b8306c36591e526f0f99e1eeabcbab3915",class:"action-sheet-group",ref:t=>this.groupEl=t},void 0!==t&&i("div",{key:"06b5147c0f6d9180fe8f12e75c9b4a0310226adc",id:d,class:{"action-sheet-title":!0,"action-sheet-has-sub-title":void 0!==this.subHeader}},t,this.subHeader&&i("div",{key:"54874362a75c679aba803bf4f8768f5404d2dd28",class:"action-sheet-sub-title"},this.subHeader)),c.map((t=>i("button",Object.assign({},t.htmlAttributes,{type:"button",id:t.id,class:B(t),onClick:()=>this.buttonClick(t),disabled:t.disabled}),i("span",{class:"action-sheet-button-inner"},t.icon&&i("ion-icon",{icon:t.icon,"aria-hidden":"true",lazy:!1,class:"action-sheet-icon"}),t.text),"md"===a&&i("ion-ripple-effect",null))))),s&&i("div",{key:"67b0de298eb424f3dea846a841b7a06d70e3930d",class:"action-sheet-group action-sheet-group-cancel"},i("button",Object.assign({key:"e7e3f9a5495eea9b97dbf885ef36944f2e420eff"},s.htmlAttributes,{type:"button",class:B(s),onClick:()=>this.buttonClick(s)}),i("span",{key:"f889d29ed6c3d14bbc1d805888351d87f5122377",class:"action-sheet-button-inner"},s.icon&&i("ion-icon",{key:"7c05cf424b38c37fd40aaeb42a494387291571fb",icon:s.icon,"aria-hidden":"true",lazy:!1,class:"action-sheet-icon"}),s.text),"md"===a&&i("ion-ripple-effect",{key:"bed927b477dc2708a5123ef560274fca9819b3d6"}))))),i("div",{key:"c5df1b11dc15a93892d57065d3dd5fbe02e43b39",tabindex:"0","aria-hidden":"true"}))}get el(){return a(this)}static get watchers(){return{isOpen:["onIsOpenChange"],trigger:["triggerChanged"]}}},B=t=>Object.assign({"action-sheet-button":!0,"ion-activatable":!t.disabled,"ion-focusable":!t.disabled,[`action-sheet-${t.role}`]:void 0!==t.role},k(t.cssClass));D.style={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}'};export{D as ion_action_sheet}