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.
- package/components/ion-checkbox.js +1 -1
- package/components/ion-datetime.js +1 -1
- package/components/ion-input-otp.js +1 -1
- package/components/ion-modal.js +1 -1
- package/components/ion-picker-column.js +1 -1
- package/components/ion-select-modal.js +1 -1
- package/components/ion-select-popover.js +1 -1
- package/components/ion-select.js +1 -1
- package/components/p-BI7WNErr.js +4 -0
- package/components/{p-Bum_LjMh.js → p-BTF2nRLo.js} +1 -1
- package/components/{p-CVF7ukTk.js → p-EK4xUz-q.js} +1 -1
- package/components/p-FBcnjE5W.js +4 -0
- package/components/p-SBseW5KJ.js +4 -0
- package/css/palettes/dark.always.css +1 -1
- package/css/palettes/dark.always.css.map +1 -1
- package/css/palettes/dark.class.css +1 -1
- package/css/palettes/dark.class.css.map +1 -1
- package/css/palettes/dark.system.css +1 -1
- package/css/palettes/dark.system.css.map +1 -1
- package/css/palettes/high-contrast-dark.always.css +1 -1
- package/css/palettes/high-contrast-dark.always.css.map +1 -1
- package/css/palettes/high-contrast-dark.class.css +1 -1
- package/css/palettes/high-contrast-dark.class.css.map +1 -1
- package/css/palettes/high-contrast-dark.system.css +1 -1
- package/css/palettes/high-contrast-dark.system.css.map +1 -1
- package/dist/cjs/ion-checkbox.cjs.entry.js +41 -31
- package/dist/cjs/ion-datetime_3.cjs.entry.js +22 -6
- package/dist/cjs/ion-input-otp.cjs.entry.js +21 -6
- package/dist/cjs/ion-modal.cjs.entry.js +1 -0
- package/dist/cjs/ion-picker-column.cjs.entry.js +4 -4
- package/dist/cjs/ionic.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/checkbox/checkbox.js +42 -31
- package/dist/collection/components/datetime/datetime.js +22 -6
- package/dist/collection/components/input-otp/input-otp.js +21 -6
- package/dist/collection/components/modal/gestures/swipe-to-close.js +1 -0
- package/dist/collection/components/picker-column/picker-column.js +5 -5
- package/dist/docs.json +1 -1
- package/dist/esm/ion-checkbox.entry.js +41 -31
- package/dist/esm/ion-datetime_3.entry.js +22 -6
- package/dist/esm/ion-input-otp.entry.js +21 -6
- package/dist/esm/ion-modal.entry.js +1 -0
- package/dist/esm/ion-picker-column.entry.js +5 -5
- package/dist/esm/ionic.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-078037da.entry.js +4 -0
- package/dist/ionic/p-23ec35e4.entry.js +4 -0
- package/dist/ionic/p-4c67ce4c.entry.js +4 -0
- package/dist/ionic/p-87125490.entry.js +4 -0
- package/dist/ionic/p-cb78f5a0.entry.js +4 -0
- package/dist/types/components/checkbox/checkbox.d.ts +1 -0
- package/dist/types/components/datetime/datetime.d.ts +1 -0
- package/hydrate/index.js +55 -21
- package/hydrate/index.mjs +55 -21
- package/package.json +4 -4
- package/components/p-BFxT89Wl.js +0 -4
- package/components/p-C7AoMl7c.js +0 -4
- package/components/p-DyqE5ywQ.js +0 -4
- package/dist/ionic/p-3e143d1d.entry.js +0 -4
- package/dist/ionic/p-8d7886fe.entry.js +0 -4
- package/dist/ionic/p-9fae83d8.entry.js +0 -4
- package/dist/ionic/p-aa47f46e.entry.js +0 -4
- 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: '
|
|
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: '
|
|
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: '
|
|
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:
|
|
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
|
-
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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 =
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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:
|
|
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
|
-
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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 =
|
|
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: '
|
|
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: '
|
|
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: '
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
70
|
+
"playwright-core": "^1.58.2",
|
|
71
71
|
"prettier": "^2.6.1",
|
|
72
72
|
"rollup": "^2.26.4",
|
|
73
73
|
"sass": "^1.33.0",
|
package/components/p-BFxT89Wl.js
DELETED
|
@@ -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}
|
package/components/p-C7AoMl7c.js
DELETED
|
@@ -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}
|