voyager-ionic-core 8.8.1 → 8.8.4

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 (64) hide show
  1. package/components/ion-checkbox.js +1 -1
  2. package/components/ion-datetime.js +1 -1
  3. package/components/ion-input-otp.js +1 -1
  4. package/components/ion-modal.js +1 -1
  5. package/components/ion-picker-column.js +1 -1
  6. package/components/ion-select-modal.js +1 -1
  7. package/components/ion-select-popover.js +1 -1
  8. package/components/ion-select.js +1 -1
  9. package/components/p-BI7WNErr.js +4 -0
  10. package/components/{p-Bum_LjMh.js → p-BTF2nRLo.js} +1 -1
  11. package/components/{p-CVF7ukTk.js → p-EK4xUz-q.js} +1 -1
  12. package/components/p-FBcnjE5W.js +4 -0
  13. package/components/p-SBseW5KJ.js +4 -0
  14. package/css/palettes/dark.always.css +1 -1
  15. package/css/palettes/dark.always.css.map +1 -1
  16. package/css/palettes/dark.class.css +1 -1
  17. package/css/palettes/dark.class.css.map +1 -1
  18. package/css/palettes/dark.system.css +1 -1
  19. package/css/palettes/dark.system.css.map +1 -1
  20. package/css/palettes/high-contrast-dark.always.css +1 -1
  21. package/css/palettes/high-contrast-dark.always.css.map +1 -1
  22. package/css/palettes/high-contrast-dark.class.css +1 -1
  23. package/css/palettes/high-contrast-dark.class.css.map +1 -1
  24. package/css/palettes/high-contrast-dark.system.css +1 -1
  25. package/css/palettes/high-contrast-dark.system.css.map +1 -1
  26. package/dist/cjs/ion-checkbox.cjs.entry.js +41 -31
  27. package/dist/cjs/ion-datetime_3.cjs.entry.js +22 -6
  28. package/dist/cjs/ion-input-otp.cjs.entry.js +21 -6
  29. package/dist/cjs/ion-modal.cjs.entry.js +1 -0
  30. package/dist/cjs/ion-picker-column.cjs.entry.js +4 -4
  31. package/dist/cjs/ionic.cjs.js +1 -1
  32. package/dist/cjs/loader.cjs.js +1 -1
  33. package/dist/collection/components/checkbox/checkbox.js +42 -31
  34. package/dist/collection/components/datetime/datetime.js +22 -6
  35. package/dist/collection/components/input-otp/input-otp.js +21 -6
  36. package/dist/collection/components/modal/gestures/swipe-to-close.js +1 -0
  37. package/dist/collection/components/picker-column/picker-column.js +5 -5
  38. package/dist/docs.json +1 -1
  39. package/dist/esm/ion-checkbox.entry.js +41 -31
  40. package/dist/esm/ion-datetime_3.entry.js +22 -6
  41. package/dist/esm/ion-input-otp.entry.js +21 -6
  42. package/dist/esm/ion-modal.entry.js +1 -0
  43. package/dist/esm/ion-picker-column.entry.js +5 -5
  44. package/dist/esm/ionic.js +1 -1
  45. package/dist/esm/loader.js +1 -1
  46. package/dist/ionic/ionic.esm.js +1 -1
  47. package/dist/ionic/p-078037da.entry.js +4 -0
  48. package/dist/ionic/p-23ec35e4.entry.js +4 -0
  49. package/dist/ionic/p-4c67ce4c.entry.js +4 -0
  50. package/dist/ionic/p-87125490.entry.js +4 -0
  51. package/dist/ionic/p-cb78f5a0.entry.js +4 -0
  52. package/dist/types/components/checkbox/checkbox.d.ts +1 -0
  53. package/dist/types/components/datetime/datetime.d.ts +1 -0
  54. package/hydrate/index.js +55 -21
  55. package/hydrate/index.mjs +55 -21
  56. package/package.json +4 -4
  57. package/components/p-BFxT89Wl.js +0 -4
  58. package/components/p-C7AoMl7c.js +0 -4
  59. package/components/p-DyqE5ywQ.js +0 -4
  60. package/dist/ionic/p-3e143d1d.entry.js +0 -4
  61. package/dist/ionic/p-8d7886fe.entry.js +0 -4
  62. package/dist/ionic/p-9fae83d8.entry.js +0 -4
  63. package/dist/ionic/p-aa47f46e.entry.js +0 -4
  64. package/dist/ionic/p-b440381f.entry.js +0 -4
package/hydrate/index.js CHANGED
@@ -12005,6 +12005,7 @@ class Checkbox {
12005
12005
  * Track validation state for proper aria-live announcements.
12006
12006
  */
12007
12007
  this.isInvalid = false;
12008
+ this.hasLabelContent = false;
12008
12009
  /**
12009
12010
  * Sets the checked property and emits
12010
12011
  * the ionChange event. Use this to update the
@@ -12055,6 +12056,7 @@ class Checkbox {
12055
12056
  const { el } = this;
12056
12057
  // Always set initial state
12057
12058
  this.isInvalid = checkInvalidState(el);
12059
+ this.hasLabelContent = this.el.textContent !== '';
12058
12060
  }
12059
12061
  componentWillLoad() {
12060
12062
  this.inheritedAttributes = Object.assign({}, inheritAriaAttributes(this.el));
@@ -12101,11 +12103,10 @@ class Checkbox {
12101
12103
  const { color, checked, disabled, el, getSVGPath, indeterminate, inheritedAttributes, inputId, justify, labelPlacement, name, value, alignment, required, } = this;
12102
12104
  const mode = getIonMode$1(this);
12103
12105
  const path = getSVGPath(mode, indeterminate);
12104
- const hasLabelContent = el.textContent !== '';
12105
12106
  renderHiddenInput(true, el, name, checked ? value : '', disabled);
12106
12107
  // The host element must have a checkbox role to ensure proper VoiceOver
12107
12108
  // support in Safari for accessibility.
12108
- return (hAsync(Host, { key: 'ae0fbd4b21accbac132e6b85c513512ad9179394', role: "checkbox", "aria-checked": indeterminate ? 'mixed' : `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": hasLabelContent ? this.inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, "aria-required": required ? 'true' : undefined, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
12109
+ return (hAsync(Host, { key: '0da370f94c5cdf3b08bc9008395558334a300f35', role: "checkbox", "aria-checked": indeterminate ? 'mixed' : `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": this.hasLabelContent ? this.inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, "aria-required": required ? 'true' : undefined, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
12109
12110
  [mode]: true,
12110
12111
  'in-item': hostContext('ion-item', el),
12111
12112
  'checkbox-checked': checked,
@@ -12115,10 +12116,10 @@ class Checkbox {
12115
12116
  [`checkbox-justify-${justify}`]: justify !== undefined,
12116
12117
  [`checkbox-alignment-${alignment}`]: alignment !== undefined,
12117
12118
  [`checkbox-label-placement-${labelPlacement}`]: true,
12118
- }) }, hAsync("label", { key: '7a3d7f3c27dde514f2dbf2e34f4629fad33ec3bf', class: "checkbox-wrapper", htmlFor: inputId }, hAsync("input", Object.assign({ key: '4130d77ddf034271fecccda14e101a5a809921b6', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, required: required }, inheritedAttributes)), hAsync("div", { key: '5daa74f4e62b0947e37764762524001ee42609d9', class: {
12119
+ }) }, hAsync("label", { key: '991f1763356671230af119a5fbdc22d0a39974e7', class: "checkbox-wrapper", htmlFor: inputId }, hAsync("input", Object.assign({ key: '982f8a7f84d013b272b17607936355d2b6c251f4', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, required: required }, inheritedAttributes)), hAsync("div", { key: 'c8f9e8baa20ac68e69fd3c6fcf0e7a26a1084d83', class: {
12119
12120
  'label-text-wrapper': true,
12120
- 'label-text-wrapper-hidden': !hasLabelContent,
12121
- }, part: "label", id: this.inputLabelId, onClick: this.onDivLabelClick }, hAsync("slot", { key: '23ff66138f8c3a2f56f39113fc842d54b2f7952a' }), this.renderHintText()), hAsync("div", { key: 'ab914d9623c19fc46821d5e62db92f1192ebbe7e', class: "native-wrapper" }, hAsync("svg", { key: '66e3f4f5dcaa9756fb0e9452299954f9ed3dcb7b', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container", "aria-hidden": "true" }, path)))));
12121
+ 'label-text-wrapper-hidden': !this.hasLabelContent,
12122
+ }, part: "label", id: this.inputLabelId, onClick: this.onDivLabelClick }, hAsync("slot", { key: '6018205e0a73dec826c7881d687f1c2ca8dcb0ab' }), this.renderHintText()), hAsync("div", { key: '57530b9d6ff59ee7ab98f960cd65d66ee87cfd1d', class: "native-wrapper" }, hAsync("svg", { key: '63d719154ff44459e9ca448e3f5d7de94d9ab248', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container", "aria-hidden": "true" }, path)))));
12122
12123
  }
12123
12124
  getSVGPath(mode, indeterminate) {
12124
12125
  let path = indeterminate ? (hAsync("path", { d: "M6 12L18 12", part: "mark" })) : (hAsync("path", { d: "M5.9,12.5l3.8,3.8l8.8-8.8", part: "mark" }));
@@ -12149,6 +12150,7 @@ class Checkbox {
12149
12150
  "alignment": [1],
12150
12151
  "required": [4],
12151
12152
  "isInvalid": [32],
12153
+ "hasLabelContent": [32],
12152
12154
  "hintTextId": [32],
12153
12155
  "setFocus": [64]
12154
12156
  },
@@ -15260,12 +15262,17 @@ class Datetime {
15260
15262
  * if we did not do this.
15261
15263
  */
15262
15264
  writeTask(() => {
15265
+ var _a;
15263
15266
  this.setWorkingParts(Object.assign(Object.assign({}, this.workingParts), { month, day: day, year }));
15264
15267
  calendarBodyRef.scrollLeft = workingMonth.clientWidth * (isRTL$1(this.el) ? -1 : 1);
15265
15268
  calendarBodyRef.style.removeProperty('overflow');
15266
15269
  if (this.resolveForceDateScrolling) {
15267
15270
  this.resolveForceDateScrolling();
15268
15271
  }
15272
+ const activeEl = this.el.shadowRoot.activeElement;
15273
+ if (activeEl && activeEl.classList.contains('calendar-day')) {
15274
+ (_a = activeEl.closest('.calendar-body')) === null || _a === void 0 ? void 0 : _a.focus();
15275
+ }
15269
15276
  });
15270
15277
  };
15271
15278
  /**
@@ -15341,6 +15348,12 @@ class Datetime {
15341
15348
  this.el.classList.add('datetime-ready');
15342
15349
  });
15343
15350
  };
15351
+ this.loadTimeoutCleanup = () => {
15352
+ if (this.loadTimeout) {
15353
+ clearTimeout(this.loadTimeout);
15354
+ this.loadTimeout = undefined;
15355
+ }
15356
+ };
15344
15357
  this.processValue = (value) => {
15345
15358
  const hasValue = value !== null && value !== undefined && value !== '' && (!Array.isArray(value) || value.length > 0);
15346
15359
  const valueToProcess = hasValue ? parseDate(value) : this.defaultParts;
@@ -15488,9 +15501,10 @@ class Datetime {
15488
15501
  if (!prevMonth) {
15489
15502
  return;
15490
15503
  }
15504
+ const left = prevMonth.offsetWidth * 2;
15491
15505
  calendarBodyRef.scrollTo({
15492
15506
  top: 0,
15493
- left: 0,
15507
+ left: left * (isRTL$1(this.el) ? 1 : -1),
15494
15508
  behavior: 'smooth',
15495
15509
  });
15496
15510
  };
@@ -15612,15 +15626,16 @@ class Datetime {
15612
15626
  }
15613
15627
  connectedCallback() {
15614
15628
  this.clearFocusVisible = startFocusVisible(this.el).destroy;
15629
+ this.loadTimeout = setTimeout(() => {
15630
+ this.ensureReadyIfVisible();
15631
+ }, 100);
15615
15632
  }
15616
15633
  disconnectedCallback() {
15617
15634
  if (this.clearFocusVisible) {
15618
15635
  this.clearFocusVisible();
15619
15636
  this.clearFocusVisible = undefined;
15620
15637
  }
15621
- if (this.loadTimeout) {
15622
- clearTimeout(this.loadTimeout);
15623
- }
15638
+ this.loadTimeoutCleanup();
15624
15639
  }
15625
15640
  initializeListeners() {
15626
15641
  this.initializeCalendarListener();
@@ -15668,7 +15683,10 @@ class Datetime {
15668
15683
  * we still initialize listeners and mark the component as ready.
15669
15684
  *
15670
15685
  * We schedule this after everything has had a chance to run.
15686
+ *
15687
+ * We also clean up the load timeout to ensure that we don't have multiple timeouts running.
15671
15688
  */
15689
+ this.loadTimeoutCleanup();
15672
15690
  this.loadTimeout = setTimeout(() => {
15673
15691
  this.ensureReadyIfVisible();
15674
15692
  }, 100);
@@ -16427,7 +16445,7 @@ class Datetime {
16427
16445
  const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
16428
16446
  const hasWheelVariant = hasDatePresentation && preferWheel;
16429
16447
  renderHiddenInput(true, el, name, formatValue(value), disabled);
16430
- return (hAsync(Host, { key: '0039549c1a4098672eb827c3d6b2c8fcf8f41c53', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
16448
+ return (hAsync(Host, { key: '59e0811aa273e88dfb8e4b703e6824088a457380', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
16431
16449
  [mode]: true,
16432
16450
  ['datetime-readonly']: readonly,
16433
16451
  ['datetime-disabled']: disabled,
@@ -16437,7 +16455,7 @@ class Datetime {
16437
16455
  [`datetime-size-${size}`]: true,
16438
16456
  [`datetime-prefer-wheel`]: hasWheelVariant,
16439
16457
  [`datetime-grid`]: isGridStyle,
16440
- })) }, hAsync("div", { key: '72f0860a8c46aa493af28819d2e49689358b8357', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
16458
+ })) }, hAsync("div", { key: '3753ff3dde3085070916c3de83687a219a49e553', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
16441
16459
  }
16442
16460
  get el() { return getElement(this); }
16443
16461
  static get watchers() { return {
@@ -19598,9 +19616,18 @@ class InputOTP {
19598
19616
  * - Tab: Allows normal tab navigation between components
19599
19617
  */
19600
19618
  this.onKeyDown = (index) => (event) => {
19601
- const { length } = this;
19619
+ const { disabled, length, readonly } = this;
19602
19620
  const rtl = isRTL$1(this.el);
19603
19621
  const input = event.target;
19622
+ if (disabled) {
19623
+ return;
19624
+ }
19625
+ if (readonly) {
19626
+ if (event.key === 'Backspace' || event.key === 'Delete') {
19627
+ event.preventDefault();
19628
+ return;
19629
+ }
19630
+ }
19604
19631
  // Meta shortcuts are used to copy, paste, and select text
19605
19632
  // We don't want to handle these keys here
19606
19633
  const metaShortcuts = ['a', 'c', 'v', 'x', 'r', 'z', 'y'];
@@ -19663,10 +19690,13 @@ class InputOTP {
19663
19690
  */
19664
19691
  this.onInput = (index) => (event) => {
19665
19692
  var _a, _b;
19666
- const { length, validKeyPattern } = this;
19693
+ const { disabled, length, readonly, validKeyPattern } = this;
19667
19694
  const input = event.target;
19668
19695
  const value = input.value;
19669
19696
  const previousValue = this.previousInputValues[index] || '';
19697
+ if (disabled || readonly) {
19698
+ return;
19699
+ }
19670
19700
  // 1. Autofill handling
19671
19701
  // If the length of the value increases by more than 1 from the previous
19672
19702
  // value, treat this as autofill. This is to prevent the case where the
@@ -19785,8 +19815,11 @@ class InputOTP {
19785
19815
  */
19786
19816
  this.onPaste = (event) => {
19787
19817
  var _a, _b;
19788
- const { inputRefs, length, validKeyPattern } = this;
19818
+ const { disabled, inputRefs, length, readonly, validKeyPattern } = this;
19789
19819
  event.preventDefault();
19820
+ if (disabled || readonly) {
19821
+ return;
19822
+ }
19790
19823
  const pastedText = (_a = event.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text');
19791
19824
  // If there is no pasted text, still emit the input change event
19792
19825
  // because this is how the native input element behaves
@@ -20073,7 +20106,7 @@ class InputOTP {
20073
20106
  const tabbableIndex = this.getTabbableIndex();
20074
20107
  const pattern = this.getPattern();
20075
20108
  const hasDescription = ((_b = (_a = el.querySelector('.input-otp-description')) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim()) !== '';
20076
- return (hAsync(Host, { key: 'f15a29fb17b681ef55885ca36d3d5f899cbaca83', class: createColorClasses$1(color, {
20109
+ return (hAsync(Host, { key: '5c1386ae6b8038ec33ca94fd818c9353b1b37f75', class: createColorClasses$1(color, {
20077
20110
  [mode]: true,
20078
20111
  'has-focus': hasFocus,
20079
20112
  [`input-otp-size-${size}`]: true,
@@ -20081,10 +20114,10 @@ class InputOTP {
20081
20114
  [`input-otp-fill-${fill}`]: true,
20082
20115
  'input-otp-disabled': disabled,
20083
20116
  'input-otp-readonly': readonly,
20084
- }) }, hAsync("div", Object.assign({ key: 'd7e1d4edd8aafcf2ed4313301287282e90fc7e82', role: "group", "aria-label": "One-time password input", class: "input-otp-group" }, inheritedAttributes), Array.from({ length }).map((_, index) => (hAsync(Fragment, null, hAsync("div", { class: "native-wrapper" }, hAsync("input", { class: "native-input", id: `${inputId}-${index}`, "aria-label": `Input ${index + 1} of ${length}`, type: "text", autoCapitalize: autocapitalize, inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index === tabbableIndex ? 0 : -1, value: inputValues[index] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index] = el), onInput: this.onInput(index), onBlur: this.onBlur, onFocus: this.onFocus(index), onKeyDown: this.onKeyDown(index), onPaste: this.onPaste })), this.showSeparator(index) && hAsync("div", { class: "input-otp-separator" }))))), hAsync("div", { key: '3724a3159d02860971879a906092f9965f5a7c47', class: {
20117
+ }) }, hAsync("div", Object.assign({ key: '9a19129688e55095f8386826c73ef3f9744becff', role: "group", "aria-label": "One-time password input", class: "input-otp-group" }, inheritedAttributes), Array.from({ length }).map((_, index) => (hAsync(Fragment, null, hAsync("div", { class: "native-wrapper" }, hAsync("input", { class: "native-input", id: `${inputId}-${index}`, "aria-label": `Input ${index + 1} of ${length}`, type: "text", autoCapitalize: autocapitalize, inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index === tabbableIndex ? 0 : -1, value: inputValues[index] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index] = el), onInput: this.onInput(index), onBlur: this.onBlur, onFocus: this.onFocus(index), onKeyDown: this.onKeyDown(index), onPaste: this.onPaste })), this.showSeparator(index) && hAsync("div", { class: "input-otp-separator" }))))), hAsync("div", { key: '7853819c3610c4691191f1836b947bf4ec17939d', class: {
20085
20118
  'input-otp-description': true,
20086
20119
  'input-otp-description-hidden': !hasDescription,
20087
- } }, hAsync("slot", { key: '11baa2624926a08274508afe0833d9237a8dc35c' }))));
20120
+ } }, hAsync("slot", { key: 'f4674d47d3d3991f21a0a79321ebc323968071dc' }))));
20088
20121
  }
20089
20122
  get el() { return getElement(this); }
20090
20123
  static get watchers() { return {
@@ -23824,6 +23857,7 @@ const createSwipeToCloseGesture = (el, animation, statusBarStyle, onDismiss, onD
23824
23857
  deltaY: detail.deltaY,
23825
23858
  velocityY: detail.velocityY,
23826
23859
  progress: calculateProgress(el, detail.deltaY),
23860
+ snapBreakpoint: shouldComplete ? 0 : 1,
23827
23861
  };
23828
23862
  onDragEnd(eventDetail);
23829
23863
  };
@@ -28584,7 +28618,7 @@ class PickerColumn {
28584
28618
  * Because this initial call to scrollActiveItemIntoView has to fire before
28585
28619
  * the scroll listener is set up, we need to manage the active class manually.
28586
28620
  */
28587
- const oldActive = getElementRoot(el).querySelector(`.${PICKER_ITEM_ACTIVE_CLASS}`);
28621
+ const oldActive = el.querySelector(`.${PICKER_ITEM_ACTIVE_CLASS}`);
28588
28622
  if (oldActive) {
28589
28623
  this.setPickerItemActiveState(oldActive, false);
28590
28624
  }
@@ -28684,14 +28718,14 @@ class PickerColumn {
28684
28718
  render() {
28685
28719
  const { color, disabled, isActive, numericInput } = this;
28686
28720
  const mode = getIonMode$1(this);
28687
- return (hAsync(Host, { key: 'db903fd415f8a2d91994dececca481c1af8ba6a9', class: createColorClasses$1(color, {
28721
+ return (hAsync(Host, { key: '234c96a501d7ac413b9b0ea56b33017681e25b40', class: createColorClasses$1(color, {
28688
28722
  [mode]: true,
28689
28723
  ['picker-column-active']: isActive,
28690
28724
  ['picker-column-numeric-input']: numericInput,
28691
28725
  ['picker-column-disabled']: disabled,
28692
- }) }, hAsync("slot", { key: '02ce9e1dd7df91afcd50b06416552bcffb5dec98', name: "prefix" }), hAsync("div", { key: '6dfd7d2429bec19244a6b1afb4448121963a031b', class: "picker-opts", ref: (el) => {
28726
+ }) }, hAsync("slot", { key: '9dc15ea0601ddd2cb2e0a745e91e036a8bd96f8b', name: "prefix" }), hAsync("div", { key: 'de4fe28ee4bc46b7c0420d6ab0df0e7809443da9', class: "picker-opts", ref: (el) => {
28693
28727
  this.scrollEl = el;
28694
- }, role: "slider", tabindex: this.disabled ? undefined : 0, "aria-label": this.ariaLabel, "aria-valuemin": 0, "aria-valuemax": 0, "aria-valuenow": 0, "aria-valuetext": this.getOptionValueText(this.activeItem), "aria-orientation": "vertical", onKeyDown: (ev) => this.onKeyDown(ev) }, hAsync("div", { key: 'e30ce0b9cefbfe4d4441fa33acf595da31855c3f', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '8be2bd293c12c6ba720d9b31d0d561a96f42e97d', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '8afdcddddabbf646fbb55cb0ba4448309a2c1dd9', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("slot", { key: '6aa0dacc34d6848575ad5b122b9046982308ca43' }), hAsync("div", { key: '92ec8a357414c1b779b11d1dd18fb87a7ee63982', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: 'b89457cb74b5907c25594ff6720ac54ca537e933', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '5bbc92e6bc24de08e39873bf08c5b668373ac0f8', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), hAsync("slot", { key: 'd7bf2b519214f0f3576a4ca79844ad97827dd97f', name: "suffix" })));
28728
+ }, role: "slider", tabindex: this.disabled ? undefined : 0, "aria-label": this.ariaLabel, "aria-valuemin": 0, "aria-valuemax": 0, "aria-valuenow": 0, "aria-valuetext": this.getOptionValueText(this.activeItem), "aria-orientation": "vertical", onKeyDown: (ev) => this.onKeyDown(ev) }, hAsync("div", { key: '5297617462cc30e9444039ae032d8bdf718349af', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '55ea39ef867bcb1a11a912d52ecd20cb886c5fb3', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '3496730ce6182ebfd33e0ee4bafc130feb575a31', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("slot", { key: '44c3628aa957d60f799dc7019f72fe8b676c7843' }), hAsync("div", { key: '5a1809f6c949678a67e0d4b5bfe93ea335c0161d', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '98fd57f1c66dbaebc2db2dd5da142671b3159fd1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '85590708abddfa885994e549deac64866fec938f', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), hAsync("slot", { key: 'bb7e674f543696a80fcbfb1f68f2e975826898a6', name: "suffix" })));
28695
28729
  }
28696
28730
  get el() { return getElement(this); }
28697
28731
  static get watchers() { return {
package/hydrate/index.mjs CHANGED
@@ -12003,6 +12003,7 @@ class Checkbox {
12003
12003
  * Track validation state for proper aria-live announcements.
12004
12004
  */
12005
12005
  this.isInvalid = false;
12006
+ this.hasLabelContent = false;
12006
12007
  /**
12007
12008
  * Sets the checked property and emits
12008
12009
  * the ionChange event. Use this to update the
@@ -12053,6 +12054,7 @@ class Checkbox {
12053
12054
  const { el } = this;
12054
12055
  // Always set initial state
12055
12056
  this.isInvalid = checkInvalidState(el);
12057
+ this.hasLabelContent = this.el.textContent !== '';
12056
12058
  }
12057
12059
  componentWillLoad() {
12058
12060
  this.inheritedAttributes = Object.assign({}, inheritAriaAttributes(this.el));
@@ -12099,11 +12101,10 @@ class Checkbox {
12099
12101
  const { color, checked, disabled, el, getSVGPath, indeterminate, inheritedAttributes, inputId, justify, labelPlacement, name, value, alignment, required, } = this;
12100
12102
  const mode = getIonMode$1(this);
12101
12103
  const path = getSVGPath(mode, indeterminate);
12102
- const hasLabelContent = el.textContent !== '';
12103
12104
  renderHiddenInput(true, el, name, checked ? value : '', disabled);
12104
12105
  // The host element must have a checkbox role to ensure proper VoiceOver
12105
12106
  // support in Safari for accessibility.
12106
- return (hAsync(Host, { key: 'ae0fbd4b21accbac132e6b85c513512ad9179394', role: "checkbox", "aria-checked": indeterminate ? 'mixed' : `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": hasLabelContent ? this.inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, "aria-required": required ? 'true' : undefined, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
12107
+ return (hAsync(Host, { key: '0da370f94c5cdf3b08bc9008395558334a300f35', role: "checkbox", "aria-checked": indeterminate ? 'mixed' : `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": this.hasLabelContent ? this.inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, "aria-required": required ? 'true' : undefined, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
12107
12108
  [mode]: true,
12108
12109
  'in-item': hostContext('ion-item', el),
12109
12110
  'checkbox-checked': checked,
@@ -12113,10 +12114,10 @@ class Checkbox {
12113
12114
  [`checkbox-justify-${justify}`]: justify !== undefined,
12114
12115
  [`checkbox-alignment-${alignment}`]: alignment !== undefined,
12115
12116
  [`checkbox-label-placement-${labelPlacement}`]: true,
12116
- }) }, hAsync("label", { key: '7a3d7f3c27dde514f2dbf2e34f4629fad33ec3bf', class: "checkbox-wrapper", htmlFor: inputId }, hAsync("input", Object.assign({ key: '4130d77ddf034271fecccda14e101a5a809921b6', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, required: required }, inheritedAttributes)), hAsync("div", { key: '5daa74f4e62b0947e37764762524001ee42609d9', class: {
12117
+ }) }, hAsync("label", { key: '991f1763356671230af119a5fbdc22d0a39974e7', class: "checkbox-wrapper", htmlFor: inputId }, hAsync("input", Object.assign({ key: '982f8a7f84d013b272b17607936355d2b6c251f4', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, required: required }, inheritedAttributes)), hAsync("div", { key: 'c8f9e8baa20ac68e69fd3c6fcf0e7a26a1084d83', class: {
12117
12118
  'label-text-wrapper': true,
12118
- 'label-text-wrapper-hidden': !hasLabelContent,
12119
- }, part: "label", id: this.inputLabelId, onClick: this.onDivLabelClick }, hAsync("slot", { key: '23ff66138f8c3a2f56f39113fc842d54b2f7952a' }), this.renderHintText()), hAsync("div", { key: 'ab914d9623c19fc46821d5e62db92f1192ebbe7e', class: "native-wrapper" }, hAsync("svg", { key: '66e3f4f5dcaa9756fb0e9452299954f9ed3dcb7b', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container", "aria-hidden": "true" }, path)))));
12119
+ 'label-text-wrapper-hidden': !this.hasLabelContent,
12120
+ }, part: "label", id: this.inputLabelId, onClick: this.onDivLabelClick }, hAsync("slot", { key: '6018205e0a73dec826c7881d687f1c2ca8dcb0ab' }), this.renderHintText()), hAsync("div", { key: '57530b9d6ff59ee7ab98f960cd65d66ee87cfd1d', class: "native-wrapper" }, hAsync("svg", { key: '63d719154ff44459e9ca448e3f5d7de94d9ab248', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container", "aria-hidden": "true" }, path)))));
12120
12121
  }
12121
12122
  getSVGPath(mode, indeterminate) {
12122
12123
  let path = indeterminate ? (hAsync("path", { d: "M6 12L18 12", part: "mark" })) : (hAsync("path", { d: "M5.9,12.5l3.8,3.8l8.8-8.8", part: "mark" }));
@@ -12147,6 +12148,7 @@ class Checkbox {
12147
12148
  "alignment": [1],
12148
12149
  "required": [4],
12149
12150
  "isInvalid": [32],
12151
+ "hasLabelContent": [32],
12150
12152
  "hintTextId": [32],
12151
12153
  "setFocus": [64]
12152
12154
  },
@@ -15258,12 +15260,17 @@ class Datetime {
15258
15260
  * if we did not do this.
15259
15261
  */
15260
15262
  writeTask(() => {
15263
+ var _a;
15261
15264
  this.setWorkingParts(Object.assign(Object.assign({}, this.workingParts), { month, day: day, year }));
15262
15265
  calendarBodyRef.scrollLeft = workingMonth.clientWidth * (isRTL$1(this.el) ? -1 : 1);
15263
15266
  calendarBodyRef.style.removeProperty('overflow');
15264
15267
  if (this.resolveForceDateScrolling) {
15265
15268
  this.resolveForceDateScrolling();
15266
15269
  }
15270
+ const activeEl = this.el.shadowRoot.activeElement;
15271
+ if (activeEl && activeEl.classList.contains('calendar-day')) {
15272
+ (_a = activeEl.closest('.calendar-body')) === null || _a === void 0 ? void 0 : _a.focus();
15273
+ }
15267
15274
  });
15268
15275
  };
15269
15276
  /**
@@ -15339,6 +15346,12 @@ class Datetime {
15339
15346
  this.el.classList.add('datetime-ready');
15340
15347
  });
15341
15348
  };
15349
+ this.loadTimeoutCleanup = () => {
15350
+ if (this.loadTimeout) {
15351
+ clearTimeout(this.loadTimeout);
15352
+ this.loadTimeout = undefined;
15353
+ }
15354
+ };
15342
15355
  this.processValue = (value) => {
15343
15356
  const hasValue = value !== null && value !== undefined && value !== '' && (!Array.isArray(value) || value.length > 0);
15344
15357
  const valueToProcess = hasValue ? parseDate(value) : this.defaultParts;
@@ -15486,9 +15499,10 @@ class Datetime {
15486
15499
  if (!prevMonth) {
15487
15500
  return;
15488
15501
  }
15502
+ const left = prevMonth.offsetWidth * 2;
15489
15503
  calendarBodyRef.scrollTo({
15490
15504
  top: 0,
15491
- left: 0,
15505
+ left: left * (isRTL$1(this.el) ? 1 : -1),
15492
15506
  behavior: 'smooth',
15493
15507
  });
15494
15508
  };
@@ -15610,15 +15624,16 @@ class Datetime {
15610
15624
  }
15611
15625
  connectedCallback() {
15612
15626
  this.clearFocusVisible = startFocusVisible(this.el).destroy;
15627
+ this.loadTimeout = setTimeout(() => {
15628
+ this.ensureReadyIfVisible();
15629
+ }, 100);
15613
15630
  }
15614
15631
  disconnectedCallback() {
15615
15632
  if (this.clearFocusVisible) {
15616
15633
  this.clearFocusVisible();
15617
15634
  this.clearFocusVisible = undefined;
15618
15635
  }
15619
- if (this.loadTimeout) {
15620
- clearTimeout(this.loadTimeout);
15621
- }
15636
+ this.loadTimeoutCleanup();
15622
15637
  }
15623
15638
  initializeListeners() {
15624
15639
  this.initializeCalendarListener();
@@ -15666,7 +15681,10 @@ class Datetime {
15666
15681
  * we still initialize listeners and mark the component as ready.
15667
15682
  *
15668
15683
  * We schedule this after everything has had a chance to run.
15684
+ *
15685
+ * We also clean up the load timeout to ensure that we don't have multiple timeouts running.
15669
15686
  */
15687
+ this.loadTimeoutCleanup();
15670
15688
  this.loadTimeout = setTimeout(() => {
15671
15689
  this.ensureReadyIfVisible();
15672
15690
  }, 100);
@@ -16425,7 +16443,7 @@ class Datetime {
16425
16443
  const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
16426
16444
  const hasWheelVariant = hasDatePresentation && preferWheel;
16427
16445
  renderHiddenInput(true, el, name, formatValue(value), disabled);
16428
- return (hAsync(Host, { key: '0039549c1a4098672eb827c3d6b2c8fcf8f41c53', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
16446
+ return (hAsync(Host, { key: '59e0811aa273e88dfb8e4b703e6824088a457380', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: Object.assign({}, createColorClasses$1(color, {
16429
16447
  [mode]: true,
16430
16448
  ['datetime-readonly']: readonly,
16431
16449
  ['datetime-disabled']: disabled,
@@ -16435,7 +16453,7 @@ class Datetime {
16435
16453
  [`datetime-size-${size}`]: true,
16436
16454
  [`datetime-prefer-wheel`]: hasWheelVariant,
16437
16455
  [`datetime-grid`]: isGridStyle,
16438
- })) }, hAsync("div", { key: '72f0860a8c46aa493af28819d2e49689358b8357', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
16456
+ })) }, hAsync("div", { key: '3753ff3dde3085070916c3de83687a219a49e553', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(mode)));
16439
16457
  }
16440
16458
  get el() { return getElement(this); }
16441
16459
  static get watchers() { return {
@@ -19596,9 +19614,18 @@ class InputOTP {
19596
19614
  * - Tab: Allows normal tab navigation between components
19597
19615
  */
19598
19616
  this.onKeyDown = (index) => (event) => {
19599
- const { length } = this;
19617
+ const { disabled, length, readonly } = this;
19600
19618
  const rtl = isRTL$1(this.el);
19601
19619
  const input = event.target;
19620
+ if (disabled) {
19621
+ return;
19622
+ }
19623
+ if (readonly) {
19624
+ if (event.key === 'Backspace' || event.key === 'Delete') {
19625
+ event.preventDefault();
19626
+ return;
19627
+ }
19628
+ }
19602
19629
  // Meta shortcuts are used to copy, paste, and select text
19603
19630
  // We don't want to handle these keys here
19604
19631
  const metaShortcuts = ['a', 'c', 'v', 'x', 'r', 'z', 'y'];
@@ -19661,10 +19688,13 @@ class InputOTP {
19661
19688
  */
19662
19689
  this.onInput = (index) => (event) => {
19663
19690
  var _a, _b;
19664
- const { length, validKeyPattern } = this;
19691
+ const { disabled, length, readonly, validKeyPattern } = this;
19665
19692
  const input = event.target;
19666
19693
  const value = input.value;
19667
19694
  const previousValue = this.previousInputValues[index] || '';
19695
+ if (disabled || readonly) {
19696
+ return;
19697
+ }
19668
19698
  // 1. Autofill handling
19669
19699
  // If the length of the value increases by more than 1 from the previous
19670
19700
  // value, treat this as autofill. This is to prevent the case where the
@@ -19783,8 +19813,11 @@ class InputOTP {
19783
19813
  */
19784
19814
  this.onPaste = (event) => {
19785
19815
  var _a, _b;
19786
- const { inputRefs, length, validKeyPattern } = this;
19816
+ const { disabled, inputRefs, length, readonly, validKeyPattern } = this;
19787
19817
  event.preventDefault();
19818
+ if (disabled || readonly) {
19819
+ return;
19820
+ }
19788
19821
  const pastedText = (_a = event.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text');
19789
19822
  // If there is no pasted text, still emit the input change event
19790
19823
  // because this is how the native input element behaves
@@ -20071,7 +20104,7 @@ class InputOTP {
20071
20104
  const tabbableIndex = this.getTabbableIndex();
20072
20105
  const pattern = this.getPattern();
20073
20106
  const hasDescription = ((_b = (_a = el.querySelector('.input-otp-description')) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.trim()) !== '';
20074
- return (hAsync(Host, { key: 'f15a29fb17b681ef55885ca36d3d5f899cbaca83', class: createColorClasses$1(color, {
20107
+ return (hAsync(Host, { key: '5c1386ae6b8038ec33ca94fd818c9353b1b37f75', class: createColorClasses$1(color, {
20075
20108
  [mode]: true,
20076
20109
  'has-focus': hasFocus,
20077
20110
  [`input-otp-size-${size}`]: true,
@@ -20079,10 +20112,10 @@ class InputOTP {
20079
20112
  [`input-otp-fill-${fill}`]: true,
20080
20113
  'input-otp-disabled': disabled,
20081
20114
  'input-otp-readonly': readonly,
20082
- }) }, hAsync("div", Object.assign({ key: 'd7e1d4edd8aafcf2ed4313301287282e90fc7e82', role: "group", "aria-label": "One-time password input", class: "input-otp-group" }, inheritedAttributes), Array.from({ length }).map((_, index) => (hAsync(Fragment, null, hAsync("div", { class: "native-wrapper" }, hAsync("input", { class: "native-input", id: `${inputId}-${index}`, "aria-label": `Input ${index + 1} of ${length}`, type: "text", autoCapitalize: autocapitalize, inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index === tabbableIndex ? 0 : -1, value: inputValues[index] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index] = el), onInput: this.onInput(index), onBlur: this.onBlur, onFocus: this.onFocus(index), onKeyDown: this.onKeyDown(index), onPaste: this.onPaste })), this.showSeparator(index) && hAsync("div", { class: "input-otp-separator" }))))), hAsync("div", { key: '3724a3159d02860971879a906092f9965f5a7c47', class: {
20115
+ }) }, hAsync("div", Object.assign({ key: '9a19129688e55095f8386826c73ef3f9744becff', role: "group", "aria-label": "One-time password input", class: "input-otp-group" }, inheritedAttributes), Array.from({ length }).map((_, index) => (hAsync(Fragment, null, hAsync("div", { class: "native-wrapper" }, hAsync("input", { class: "native-input", id: `${inputId}-${index}`, "aria-label": `Input ${index + 1} of ${length}`, type: "text", autoCapitalize: autocapitalize, inputmode: inputmode, pattern: pattern, disabled: disabled, readOnly: readonly, tabIndex: index === tabbableIndex ? 0 : -1, value: inputValues[index] || '', autocomplete: "one-time-code", ref: (el) => (inputRefs[index] = el), onInput: this.onInput(index), onBlur: this.onBlur, onFocus: this.onFocus(index), onKeyDown: this.onKeyDown(index), onPaste: this.onPaste })), this.showSeparator(index) && hAsync("div", { class: "input-otp-separator" }))))), hAsync("div", { key: '7853819c3610c4691191f1836b947bf4ec17939d', class: {
20083
20116
  'input-otp-description': true,
20084
20117
  'input-otp-description-hidden': !hasDescription,
20085
- } }, hAsync("slot", { key: '11baa2624926a08274508afe0833d9237a8dc35c' }))));
20118
+ } }, hAsync("slot", { key: 'f4674d47d3d3991f21a0a79321ebc323968071dc' }))));
20086
20119
  }
20087
20120
  get el() { return getElement(this); }
20088
20121
  static get watchers() { return {
@@ -23822,6 +23855,7 @@ const createSwipeToCloseGesture = (el, animation, statusBarStyle, onDismiss, onD
23822
23855
  deltaY: detail.deltaY,
23823
23856
  velocityY: detail.velocityY,
23824
23857
  progress: calculateProgress(el, detail.deltaY),
23858
+ snapBreakpoint: shouldComplete ? 0 : 1,
23825
23859
  };
23826
23860
  onDragEnd(eventDetail);
23827
23861
  };
@@ -28582,7 +28616,7 @@ class PickerColumn {
28582
28616
  * Because this initial call to scrollActiveItemIntoView has to fire before
28583
28617
  * the scroll listener is set up, we need to manage the active class manually.
28584
28618
  */
28585
- const oldActive = getElementRoot(el).querySelector(`.${PICKER_ITEM_ACTIVE_CLASS}`);
28619
+ const oldActive = el.querySelector(`.${PICKER_ITEM_ACTIVE_CLASS}`);
28586
28620
  if (oldActive) {
28587
28621
  this.setPickerItemActiveState(oldActive, false);
28588
28622
  }
@@ -28682,14 +28716,14 @@ class PickerColumn {
28682
28716
  render() {
28683
28717
  const { color, disabled, isActive, numericInput } = this;
28684
28718
  const mode = getIonMode$1(this);
28685
- return (hAsync(Host, { key: 'db903fd415f8a2d91994dececca481c1af8ba6a9', class: createColorClasses$1(color, {
28719
+ return (hAsync(Host, { key: '234c96a501d7ac413b9b0ea56b33017681e25b40', class: createColorClasses$1(color, {
28686
28720
  [mode]: true,
28687
28721
  ['picker-column-active']: isActive,
28688
28722
  ['picker-column-numeric-input']: numericInput,
28689
28723
  ['picker-column-disabled']: disabled,
28690
- }) }, hAsync("slot", { key: '02ce9e1dd7df91afcd50b06416552bcffb5dec98', name: "prefix" }), hAsync("div", { key: '6dfd7d2429bec19244a6b1afb4448121963a031b', class: "picker-opts", ref: (el) => {
28724
+ }) }, hAsync("slot", { key: '9dc15ea0601ddd2cb2e0a745e91e036a8bd96f8b', name: "prefix" }), hAsync("div", { key: 'de4fe28ee4bc46b7c0420d6ab0df0e7809443da9', class: "picker-opts", ref: (el) => {
28691
28725
  this.scrollEl = el;
28692
- }, role: "slider", tabindex: this.disabled ? undefined : 0, "aria-label": this.ariaLabel, "aria-valuemin": 0, "aria-valuemax": 0, "aria-valuenow": 0, "aria-valuetext": this.getOptionValueText(this.activeItem), "aria-orientation": "vertical", onKeyDown: (ev) => this.onKeyDown(ev) }, hAsync("div", { key: 'e30ce0b9cefbfe4d4441fa33acf595da31855c3f', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '8be2bd293c12c6ba720d9b31d0d561a96f42e97d', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '8afdcddddabbf646fbb55cb0ba4448309a2c1dd9', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("slot", { key: '6aa0dacc34d6848575ad5b122b9046982308ca43' }), hAsync("div", { key: '92ec8a357414c1b779b11d1dd18fb87a7ee63982', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: 'b89457cb74b5907c25594ff6720ac54ca537e933', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '5bbc92e6bc24de08e39873bf08c5b668373ac0f8', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), hAsync("slot", { key: 'd7bf2b519214f0f3576a4ca79844ad97827dd97f', name: "suffix" })));
28726
+ }, role: "slider", tabindex: this.disabled ? undefined : 0, "aria-label": this.ariaLabel, "aria-valuemin": 0, "aria-valuemax": 0, "aria-valuenow": 0, "aria-valuetext": this.getOptionValueText(this.activeItem), "aria-orientation": "vertical", onKeyDown: (ev) => this.onKeyDown(ev) }, hAsync("div", { key: '5297617462cc30e9444039ae032d8bdf718349af', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '55ea39ef867bcb1a11a912d52ecd20cb886c5fb3', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '3496730ce6182ebfd33e0ee4bafc130feb575a31', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("slot", { key: '44c3628aa957d60f799dc7019f72fe8b676c7843' }), hAsync("div", { key: '5a1809f6c949678a67e0d4b5bfe93ea335c0161d', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '98fd57f1c66dbaebc2db2dd5da142671b3159fd1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), hAsync("div", { key: '85590708abddfa885994e549deac64866fec938f', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), hAsync("slot", { key: 'bb7e674f543696a80fcbfb1f68f2e975826898a6', name: "suffix" })));
28693
28727
  }
28694
28728
  get el() { return getElement(this); }
28695
28729
  static get watchers() { return {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "voyager-ionic-core",
3
- "version": "8.8.1",
3
+ "version": "8.8.4",
4
4
  "description": "Base components for Ionic",
5
5
  "engines": {
6
6
  "node": ">= 16"
@@ -39,14 +39,14 @@
39
39
  "tslib": "^2.1.0"
40
40
  },
41
41
  "devDependencies": {
42
- "@axe-core/playwright": "^4.11.0",
42
+ "@axe-core/playwright": "^4.11.1",
43
43
  "@capacitor/core": "^8.0.0",
44
44
  "@capacitor/haptics": "^8.0.0",
45
45
  "@capacitor/keyboard": "^8.0.0",
46
46
  "@capacitor/status-bar": "^8.0.0",
47
47
  "@ionic/eslint-config": "^0.3.0",
48
48
  "@ionic/prettier-config": "^2.0.0",
49
- "@playwright/test": "^1.56.1",
49
+ "@playwright/test": "^1.58.2",
50
50
  "@rollup/plugin-node-resolve": "^8.4.0",
51
51
  "@rollup/plugin-virtual": "^2.0.3",
52
52
  "@stencil/angular-output-target": "^0.10.0",
@@ -67,7 +67,7 @@
67
67
  "fs-extra": "^9.0.1",
68
68
  "jest": "^29.7.0",
69
69
  "jest-cli": "^29.7.0",
70
- "playwright-core": "^1.56.1",
70
+ "playwright-core": "^1.58.2",
71
71
  "prettier": "^2.6.1",
72
72
  "rollup": "^2.26.4",
73
73
  "sass": "^1.33.0",
@@ -1,4 +0,0 @@
1
- /*!
2
- * (C) Ionic http://ionicframework.com - MIT License
3
- */
4
- import{p as e,H as t,e as o,h as r,d as c,t as i}from"./p-BJoMtgfR.js";import{i as a,e as n}from"./p-DgbT0exM.js";import{c as s}from"./p-DJztqcrH.js";import{c as l,h}from"./p-DiVJyqlX.js";import{b}from"./p-CDfQnFrd.js";const p=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.ionChange=o(this,"ionChange",7),this.ionFocus=o(this,"ionFocus",7),this.ionBlur=o(this,"ionBlur",7),this.inputId="ion-cb-"+x++,this.inputLabelId=`${this.inputId}-lbl`,this.helperTextId=`${this.inputId}-helper-text`,this.errorTextId=`${this.inputId}-error-text`,this.inheritedAttributes={},this.name=this.inputId,this.checked=!1,this.indeterminate=!1,this.disabled=!1,this.value="on",this.labelPlacement="start",this.required=!1,this.isInvalid=!1,this.setChecked=e=>{const t=this.checked=e;this.ionChange.emit({checked:t,value:this.value})},this.toggleChecked=e=>{e.preventDefault(),this.setChecked(!this.checked),this.indeterminate=!1},this.onFocus=()=>{this.ionFocus.emit()},this.onBlur=()=>{this.ionBlur.emit()},this.onKeyDown=e=>{" "===e.key&&(e.preventDefault(),this.disabled||this.toggleChecked(e))},this.onClick=e=>{this.disabled||this.toggleChecked(e)},this.onDivLabelClick=e=>{e.stopPropagation()}}connectedCallback(){const{el:e}=this;"undefined"!=typeof MutationObserver&&(this.validationObserver=new MutationObserver((()=>{const t=s(e);this.isInvalid!==t&&(this.isInvalid=t,Promise.resolve().then((()=>{this.hintTextId=this.getHintTextId()})))})),this.validationObserver.observe(e,{attributes:!0,attributeFilter:["class"]})),this.isInvalid=s(e)}componentWillLoad(){this.inheritedAttributes=Object.assign({},a(this.el)),this.hintTextId=this.getHintTextId()}disconnectedCallback(){this.validationObserver&&(this.validationObserver.disconnect(),this.validationObserver=void 0)}async setFocus(){this.el.focus()}getHintTextId(){const{helperText:e,errorText:t,helperTextId:o,errorTextId:r,isInvalid:c}=this;return c&&t?r:e?o:void 0}renderHintText(){const{helperText:e,errorText:t,helperTextId:o,errorTextId:c,isInvalid:i}=this;if(e||t)return r("div",{class:"checkbox-bottom"},r("div",{id:o,class:"helper-text",part:"supporting-text helper-text","aria-live":"polite"},i?null:e),r("div",{id:c,class:"error-text",part:"supporting-text error-text",role:"alert"},i?t:null))}render(){const{color:e,checked:t,disabled:o,el:i,getSVGPath:a,indeterminate:s,inheritedAttributes:p,inputId:x,justify:d,labelPlacement:k,name:m,value:f,alignment:g,required:w}=this,u=b(this),v=a(u,s),y=""!==i.textContent;return n(!0,i,m,t?f:"",o),r(c,{key:"ae0fbd4b21accbac132e6b85c513512ad9179394",role:"checkbox","aria-checked":s?"mixed":`${t}`,"aria-describedby":this.hintTextId,"aria-invalid":this.isInvalid?"true":void 0,"aria-labelledby":y?this.inputLabelId:null,"aria-label":p["aria-label"]||null,"aria-disabled":o?"true":null,"aria-required":w?"true":void 0,tabindex:o?void 0:0,onKeyDown:this.onKeyDown,onFocus:this.onFocus,onBlur:this.onBlur,onClick:this.onClick,class:l(e,{[u]:!0,"in-item":h("ion-item",i),"checkbox-checked":t,"checkbox-disabled":o,"checkbox-indeterminate":s,interactive:!0,[`checkbox-justify-${d}`]:void 0!==d,[`checkbox-alignment-${g}`]:void 0!==g,[`checkbox-label-placement-${k}`]:!0})},r("label",{key:"7a3d7f3c27dde514f2dbf2e34f4629fad33ec3bf",class:"checkbox-wrapper",htmlFor:x},r("input",Object.assign({key:"4130d77ddf034271fecccda14e101a5a809921b6",type:"checkbox",checked:!!t||void 0,disabled:o,id:x,onChange:this.toggleChecked,required:w},p)),r("div",{key:"5daa74f4e62b0947e37764762524001ee42609d9",class:{"label-text-wrapper":!0,"label-text-wrapper-hidden":!y},part:"label",id:this.inputLabelId,onClick:this.onDivLabelClick},r("slot",{key:"23ff66138f8c3a2f56f39113fc842d54b2f7952a"}),this.renderHintText()),r("div",{key:"ab914d9623c19fc46821d5e62db92f1192ebbe7e",class:"native-wrapper"},r("svg",{key:"66e3f4f5dcaa9756fb0e9452299954f9ed3dcb7b",class:"checkbox-icon",viewBox:"0 0 24 24",part:"container","aria-hidden":"true"},v))))}getSVGPath(e,t){let o=r("path",t?{d:"M6 12L18 12",part:"mark"}:{d:"M5.9,12.5l3.8,3.8l8.8-8.8",part:"mark"});return"md"===e&&(o=r("path",t?{d:"M2 12H22",part:"mark"}:{d:"M1.73,12.91 8.1,19.28 22.79,4.59",part:"mark"})),o}get el(){return this}static get style(){return{ios:":host{--checkbox-background-checked:var(--ion-color-primary, #0054e9);--border-color-checked:var(--ion-color-primary, #0054e9);--checkmark-color:var(--ion-color-primary-contrast, #fff);--transition:none;display:inline-block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0;width:100%;height:100%}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}:host(.ion-color){--checkbox-background-checked:var(--ion-color-base);--border-color-checked:var(--ion-color-base);--checkmark-color:var(--ion-color-contrast)}.checkbox-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:inherit;cursor:inherit}.label-text-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host(.in-item) .label-text-wrapper,:host(.in-item:not(.checkbox-label-placement-stacked):not([slot])) .native-wrapper{margin-top:10px;margin-bottom:10px}:host(.in-item.checkbox-label-placement-stacked) .label-text-wrapper{margin-top:10px;margin-bottom:16px}:host(.in-item.checkbox-label-placement-stacked) .native-wrapper{margin-bottom:10px}.label-text-wrapper-hidden{display:none}input{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.checkbox-icon{border-radius:var(--border-radius);position:relative;width:var(--size);height:var(--size);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--checkbox-background);-webkit-box-sizing:border-box;box-sizing:border-box}.checkbox-icon path{fill:none;stroke:var(--checkmark-color);stroke-width:var(--checkmark-width);opacity:0}.checkbox-bottom{padding-top:4px;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;font-size:0.75rem;white-space:normal}:host(.checkbox-label-placement-stacked) .checkbox-bottom{font-size:1rem}.checkbox-bottom .error-text{display:none;color:var(--ion-color-danger, #c5000f)}.checkbox-bottom .helper-text{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}:host(.ion-touched.ion-invalid) .checkbox-bottom .error-text{display:block}:host(.ion-touched.ion-invalid) .checkbox-bottom .helper-text{display:none}:host(.checkbox-label-placement-start) .checkbox-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.checkbox-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.checkbox-label-placement-end) .checkbox-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse;-ms-flex-pack:start;justify-content:start}:host(.checkbox-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.checkbox-label-placement-stacked) .checkbox-wrapper{-ms-flex-direction:column;flex-direction:column;text-align:center}:host(.checkbox-label-placement-stacked) .label-text-wrapper{-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:16px;max-width:calc(100% / 0.75)}:host(.checkbox-label-placement-stacked.checkbox-alignment-start) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host-context([dir=rtl]):host(.checkbox-label-placement-stacked.checkbox-alignment-start) .label-text-wrapper,:host-context([dir=rtl]).checkbox-label-placement-stacked.checkbox-alignment-start .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){:host(.checkbox-label-placement-stacked.checkbox-alignment-start:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}}:host(.checkbox-label-placement-stacked.checkbox-alignment-center) .label-text-wrapper{-webkit-transform-origin:center top;transform-origin:center top}:host-context([dir=rtl]):host(.checkbox-label-placement-stacked.checkbox-alignment-center) .label-text-wrapper,:host-context([dir=rtl]).checkbox-label-placement-stacked.checkbox-alignment-center .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}@supports selector(:dir(rtl)){:host(.checkbox-label-placement-stacked.checkbox-alignment-center:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}}:host(.checkbox-justify-space-between) .checkbox-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.checkbox-justify-start) .checkbox-wrapper{-ms-flex-pack:start;justify-content:start}:host(.checkbox-justify-end) .checkbox-wrapper{-ms-flex-pack:end;justify-content:end}:host(.checkbox-alignment-start) .checkbox-wrapper{-ms-flex-align:start;align-items:start}:host(.checkbox-alignment-center) .checkbox-wrapper{-ms-flex-align:center;align-items:center}:host(.checkbox-justify-space-between),:host(.checkbox-justify-start),:host(.checkbox-justify-end),:host(.checkbox-alignment-start),:host(.checkbox-alignment-center){display:block}:host(.checkbox-checked) .checkbox-icon,:host(.checkbox-indeterminate) .checkbox-icon{border-color:var(--border-color-checked);background:var(--checkbox-background-checked)}:host(.checkbox-checked) .checkbox-icon path,:host(.checkbox-indeterminate) .checkbox-icon path{opacity:1}:host(.checkbox-disabled){pointer-events:none}:host{--border-radius:50%;--border-width:0.125rem;--border-style:solid;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.23);--checkbox-background:var(--ion-item-background, var(--ion-background-color, #fff));--size:min(1.375rem, 55.836px);--checkmark-width:1.5px}:host(.checkbox-disabled){opacity:0.3}",md:":host{--checkbox-background-checked:var(--ion-color-primary, #0054e9);--border-color-checked:var(--ion-color-primary, #0054e9);--checkmark-color:var(--ion-color-primary-contrast, #fff);--transition:none;display:inline-block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0;width:100%;height:100%}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}:host(.ion-color){--checkbox-background-checked:var(--ion-color-base);--border-color-checked:var(--ion-color-base);--checkmark-color:var(--ion-color-contrast)}.checkbox-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:inherit;cursor:inherit}.label-text-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host(.in-item) .label-text-wrapper,:host(.in-item:not(.checkbox-label-placement-stacked):not([slot])) .native-wrapper{margin-top:10px;margin-bottom:10px}:host(.in-item.checkbox-label-placement-stacked) .label-text-wrapper{margin-top:10px;margin-bottom:16px}:host(.in-item.checkbox-label-placement-stacked) .native-wrapper{margin-bottom:10px}.label-text-wrapper-hidden{display:none}input{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.checkbox-icon{border-radius:var(--border-radius);position:relative;width:var(--size);height:var(--size);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--checkbox-background);-webkit-box-sizing:border-box;box-sizing:border-box}.checkbox-icon path{fill:none;stroke:var(--checkmark-color);stroke-width:var(--checkmark-width);opacity:0}.checkbox-bottom{padding-top:4px;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;font-size:0.75rem;white-space:normal}:host(.checkbox-label-placement-stacked) .checkbox-bottom{font-size:1rem}.checkbox-bottom .error-text{display:none;color:var(--ion-color-danger, #c5000f)}.checkbox-bottom .helper-text{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}:host(.ion-touched.ion-invalid) .checkbox-bottom .error-text{display:block}:host(.ion-touched.ion-invalid) .checkbox-bottom .helper-text{display:none}:host(.checkbox-label-placement-start) .checkbox-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.checkbox-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.checkbox-label-placement-end) .checkbox-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse;-ms-flex-pack:start;justify-content:start}:host(.checkbox-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.checkbox-label-placement-stacked) .checkbox-wrapper{-ms-flex-direction:column;flex-direction:column;text-align:center}:host(.checkbox-label-placement-stacked) .label-text-wrapper{-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:16px;max-width:calc(100% / 0.75)}:host(.checkbox-label-placement-stacked.checkbox-alignment-start) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host-context([dir=rtl]):host(.checkbox-label-placement-stacked.checkbox-alignment-start) .label-text-wrapper,:host-context([dir=rtl]).checkbox-label-placement-stacked.checkbox-alignment-start .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){:host(.checkbox-label-placement-stacked.checkbox-alignment-start:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}}:host(.checkbox-label-placement-stacked.checkbox-alignment-center) .label-text-wrapper{-webkit-transform-origin:center top;transform-origin:center top}:host-context([dir=rtl]):host(.checkbox-label-placement-stacked.checkbox-alignment-center) .label-text-wrapper,:host-context([dir=rtl]).checkbox-label-placement-stacked.checkbox-alignment-center .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}@supports selector(:dir(rtl)){:host(.checkbox-label-placement-stacked.checkbox-alignment-center:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}}:host(.checkbox-justify-space-between) .checkbox-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.checkbox-justify-start) .checkbox-wrapper{-ms-flex-pack:start;justify-content:start}:host(.checkbox-justify-end) .checkbox-wrapper{-ms-flex-pack:end;justify-content:end}:host(.checkbox-alignment-start) .checkbox-wrapper{-ms-flex-align:start;align-items:start}:host(.checkbox-alignment-center) .checkbox-wrapper{-ms-flex-align:center;align-items:center}:host(.checkbox-justify-space-between),:host(.checkbox-justify-start),:host(.checkbox-justify-end),:host(.checkbox-alignment-start),:host(.checkbox-alignment-center){display:block}:host(.checkbox-checked) .checkbox-icon,:host(.checkbox-indeterminate) .checkbox-icon{border-color:var(--border-color-checked);background:var(--checkbox-background-checked)}:host(.checkbox-checked) .checkbox-icon path,:host(.checkbox-indeterminate) .checkbox-icon path{opacity:1}:host(.checkbox-disabled){pointer-events:none}:host{--border-radius:calc(var(--size) * .125);--border-width:2px;--border-style:solid;--border-color:rgb(var(--ion-text-color-rgb, 0, 0, 0), 0.6);--checkmark-width:3;--checkbox-background:var(--ion-item-background, var(--ion-background-color, #fff));--transition:background 180ms cubic-bezier(0.4, 0, 0.2, 1);--size:18px}.checkbox-icon path{stroke-dasharray:30;stroke-dashoffset:30}:host(.checkbox-checked) .checkbox-icon path,:host(.checkbox-indeterminate) .checkbox-icon path{stroke-dashoffset:0;-webkit-transition:stroke-dashoffset 90ms linear 90ms;transition:stroke-dashoffset 90ms linear 90ms}:host(.checkbox-disabled) .label-text-wrapper{opacity:0.38}:host(.checkbox-disabled) .native-wrapper{opacity:0.63}"}}},[289,"ion-checkbox",{color:[513],name:[1],checked:[1028],indeterminate:[1028],disabled:[4],errorText:[1,"error-text"],helperText:[1,"helper-text"],value:[8],labelPlacement:[1,"label-placement"],justify:[1],alignment:[1],required:[4],isInvalid:[32],hintTextId:[32],setFocus:[64]}]);let x=0;function d(){"undefined"!=typeof customElements&&["ion-checkbox"].forEach((e=>{"ion-checkbox"===e&&(customElements.get(i(e))||customElements.define(i(e),p))}))}export{p as C,d}
@@ -1,4 +0,0 @@
1
- /*!
2
- * (C) Ionic http://ionicframework.com - MIT License
3
- */
4
- import{p as t,H as i,e,h as s,d as n,t as a}from"./p-BJoMtgfR.js";import{d as o}from"./p-ZjP4CjeZ.js";import{r as l,g as r}from"./p-DgbT0exM.js";import{b as c,a as d,h as p}from"./p-cyNmxje6.js";import{a as h,b as u}from"./p-CDfQnFrd.js";import{c as m}from"./p-DiVJyqlX.js";const b=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.ionChange=e(this,"ionChange",7),this.isScrolling=!1,this.isColumnVisible=!1,this.canExitInputMode=!0,this.updateValueTextOnScroll=!1,this.ariaLabel=null,this.isActive=!1,this.disabled=!1,this.color="primary",this.numericInput=!1,this.centerPickerItemInView=(t,i=!0,e=!0)=>{const{isColumnVisible:s,scrollEl:n}=this;if(s&&n){const s=t.offsetTop-3*t.clientHeight+t.clientHeight/2;n.scrollTop!==s&&(this.canExitInputMode=e,this.updateValueTextOnScroll=!1,n.scroll({top:s,left:0,behavior:i?"smooth":void 0}))}},this.setPickerItemActiveState=(t,i)=>{i?t.classList.add(f):t.classList.remove(f)},this.inputModeChange=t=>{if(!this.numericInput)return;const{useInputMode:i,inputModeColumn:e}=t.detail;this.setInputModeActive(!(!i||void 0!==e&&e!==this.el))},this.setInputModeActive=t=>{this.isScrolling?this.scrollEndCallback=()=>{this.isActive=t}:this.isActive=t},this.initializeScrollListener=()=>{const t=h("ios"),{el:i,scrollEl:e}=this;let s,n=this.activeItem;const a=()=>{l((()=>{var a;if(!e)return;s&&(clearTimeout(s),s=void 0),this.isScrolling||(t&&c(),this.isScrolling=!0);const l=e.getBoundingClientRect(),r=l.x+l.width/2,h=l.y+l.height/2,u=i.getRootNode(),m=u instanceof ShadowRoot?u:o;if(void 0===m)return;let b=m.elementsFromPoint(r,h).find((t=>"ION-PICKER-COLUMN-OPTION"===t.tagName));if(void 0===b){const t=m.elementFromPoint(r,h);"ION-PICKER-COLUMN-OPTION"===(null==t?void 0:t.tagName)&&(b=t)}void 0!==n&&this.setPickerItemActiveState(n,!1),void 0===b||b.disabled||(b!==n&&(t&&d(),this.canExitInputMode&&this.exitInputMode()),n=b,this.setPickerItemActiveState(b,!0),this.updateValueTextOnScroll&&(null===(a=this.assistiveFocusable)||void 0===a||a.setAttribute("aria-valuetext",this.getOptionValueText(b))),s=setTimeout((()=>{this.isScrolling=!1,this.updateValueTextOnScroll=!0,t&&p();const{scrollEndCallback:i}=this;i&&(i(),this.scrollEndCallback=void 0),this.canExitInputMode=!0,this.setValue(b.value)}),250))}))};l((()=>{e&&(e.addEventListener("scroll",a),this.destroyScrollListener=()=>{e.removeEventListener("scroll",a)})}))},this.exitInputMode=()=>{const{parentEl:t}=this;null!=t&&(t.exitInputMode(),this.el.classList.remove("picker-column-active"))},this.findNextOption=(t=1)=>{const{activeItem:i}=this;if(!i)return null;let e=i,s=i.nextElementSibling;for(;null!=s;){if(t>0&&t--,"ION-PICKER-COLUMN-OPTION"===s.tagName&&!s.disabled&&0===t)return s;e=s,s=s.nextElementSibling}return e},this.findPreviousOption=(t=1)=>{const{activeItem:i}=this;if(!i)return null;let e=i,s=i.previousElementSibling;for(;null!=s;){if(t>0&&t--,"ION-PICKER-COLUMN-OPTION"===s.tagName&&!s.disabled&&0===t)return s;e=s,s=s.previousElementSibling}return e},this.onKeyDown=t=>{const i=h("mobile");let e=null;switch(t.key){case"ArrowDown":e=i?this.findPreviousOption():this.findNextOption();break;case"ArrowUp":e=i?this.findNextOption():this.findPreviousOption();break;case"PageUp":e=i?this.findNextOption(5):this.findPreviousOption(5);break;case"PageDown":e=i?this.findPreviousOption(5):this.findNextOption(5);break;case"Home":e=this.el.querySelector("ion-picker-column-option:first-of-type");break;case"End":e=this.el.querySelector("ion-picker-column-option:last-of-type")}null!==e&&(this.setValue(e.value),t.preventDefault())},this.getOptionValueText=t=>{var i;return t?null!==(i=t.getAttribute("aria-label"))&&void 0!==i?i:t.innerText:""}}ariaLabelChanged(t){this.ariaLabel=t}valueChange(){this.isColumnVisible&&this.scrollActiveItemIntoView(!0)}componentWillLoad(){const t=this.parentEl=this.el.closest("ion-picker");new IntersectionObserver((t=>{if(t[t.length-1].isIntersecting){const{activeItem:t,el:i}=this;this.isColumnVisible=!0;const e=r(i).querySelector(`.${f}`);e&&this.setPickerItemActiveState(e,!1),this.scrollActiveItemIntoView(),t&&this.setPickerItemActiveState(t,!0),this.initializeScrollListener()}else this.isColumnVisible=!1,this.destroyScrollListener&&(this.destroyScrollListener(),this.destroyScrollListener=void 0)}),{threshold:.001,root:this.parentEl}).observe(this.el),null!==t&&t.addEventListener("ionInputModeChange",(t=>this.inputModeChange(t)))}componentDidRender(){const{el:t,activeItem:i,isColumnVisible:e,value:s}=this;if(e&&!i){const i=t.querySelector("ion-picker-column-option");null!==i&&i.value!==s&&this.setValue(i.value)}}async scrollActiveItemIntoView(t=!1){const i=this.activeItem;i&&this.centerPickerItemInView(i,t,!1)}async setValue(t){!0!==this.disabled&&this.value!==t&&(this.value=t,this.ionChange.emit({value:t}))}async setFocus(){this.assistiveFocusable&&this.assistiveFocusable.focus()}connectedCallback(){var t;this.ariaLabel=null!==(t=this.el.getAttribute("aria-label"))&&void 0!==t?t:"Select a value"}get activeItem(){const{value:t}=this;return Array.from(this.el.querySelectorAll("ion-picker-column-option")).find((i=>!(!this.disabled&&i.disabled)&&i.value===t))}render(){const{color:t,disabled:i,isActive:e,numericInput:a}=this,o=u(this);return s(n,{key:"db903fd415f8a2d91994dececca481c1af8ba6a9",class:m(t,{[o]:!0,"picker-column-active":e,"picker-column-numeric-input":a,"picker-column-disabled":i})},s("slot",{key:"02ce9e1dd7df91afcd50b06416552bcffb5dec98",name:"prefix"}),s("div",{key:"6dfd7d2429bec19244a6b1afb4448121963a031b",class:"picker-opts",ref:t=>{this.scrollEl=t},role:"slider",tabindex:this.disabled?void 0:0,"aria-label":this.ariaLabel,"aria-valuemin":0,"aria-valuemax":0,"aria-valuenow":0,"aria-valuetext":this.getOptionValueText(this.activeItem),"aria-orientation":"vertical",onKeyDown:t=>this.onKeyDown(t)},s("div",{key:"e30ce0b9cefbfe4d4441fa33acf595da31855c3f",class:"picker-item-empty","aria-hidden":"true"}," "),s("div",{key:"8be2bd293c12c6ba720d9b31d0d561a96f42e97d",class:"picker-item-empty","aria-hidden":"true"}," "),s("div",{key:"8afdcddddabbf646fbb55cb0ba4448309a2c1dd9",class:"picker-item-empty","aria-hidden":"true"}," "),s("slot",{key:"6aa0dacc34d6848575ad5b122b9046982308ca43"}),s("div",{key:"92ec8a357414c1b779b11d1dd18fb87a7ee63982",class:"picker-item-empty","aria-hidden":"true"}," "),s("div",{key:"b89457cb74b5907c25594ff6720ac54ca537e933",class:"picker-item-empty","aria-hidden":"true"}," "),s("div",{key:"5bbc92e6bc24de08e39873bf08c5b668373ac0f8",class:"picker-item-empty","aria-hidden":"true"}," ")),s("slot",{key:"d7bf2b519214f0f3576a4ca79844ad97827dd97f",name:"suffix"}))}get el(){return this}static get watchers(){return{"aria-label":[{ariaLabelChanged:0}],value:[{valueChange:0}]}}static get style(){return":host{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;max-width:100%;height:200px;font-size:22px;text-align:center}.assistive-focusable{left:0;right:0;top:0;bottom:0;position:absolute;z-index:1;pointer-events:none}.assistive-focusable:focus{outline:none}.picker-opts{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0px;padding-bottom:0px;min-width:26px;max-height:200px;outline:none;text-align:inherit;-webkit-scroll-snap-type:y mandatory;-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory;overflow-x:hidden;overflow-y:scroll;scrollbar-width:none}.picker-item-empty{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:100%;height:34px;border:0px;outline:none;background:transparent;color:inherit;font-family:var(--ion-font-family, inherit);font-size:inherit;line-height:34px;text-align:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.picker-opts::-webkit-scrollbar{display:none}::slotted(ion-picker-column-option){display:block;scroll-snap-align:center}.picker-item-empty,:host(:not([disabled])) ::slotted(ion-picker-column-option.option-disabled){scroll-snap-align:none}::slotted([slot=prefix]),::slotted([slot=suffix]){max-width:200px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::slotted([slot=prefix]){-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0;padding-bottom:0;-ms-flex-pack:end;justify-content:end}::slotted([slot=suffix]){-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0;padding-bottom:0;-ms-flex-pack:start;justify-content:start}:host(.picker-column-disabled) .picker-opts{overflow-y:hidden}:host(.picker-column-disabled) ::slotted(ion-picker-column-option){cursor:default;opacity:0.4;pointer-events:none}@media (any-hover: hover){:host(:focus) .picker-opts{outline:none;background:rgba(var(--ion-color-base-rgb), 0.2)}}"}},[257,"ion-picker-column",{disabled:[4],value:[1032],color:[513],numericInput:[4,"numeric-input"],ariaLabel:[32],isActive:[32],scrollActiveItemIntoView:[64],setValue:[64],setFocus:[64]},void 0,{"aria-label":[{ariaLabelChanged:0}],value:[{valueChange:0}]}]),f="option-active";function v(){"undefined"!=typeof customElements&&["ion-picker-column"].forEach((t=>{"ion-picker-column"===t&&(customElements.get(a(t))||customElements.define(a(t),b))}))}export{b as P,v as d}