@ionic/core 8.7.3-dev.11755551681.10d084fd → 8.7.3-dev.11755622775.1fc05815
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-input.js +36 -5
- package/components/ion-item-divider.js +2 -2
- package/components/ion-item-group.js +1 -1
- package/components/ion-item-option.js +2 -2
- package/components/ion-item-options.js +1 -1
- package/components/ion-item-sliding.js +1 -1
- package/components/ion-loading.js +2 -2
- package/components/ion-menu-button.js +2 -2
- package/components/ion-menu-toggle.js +2 -2
- package/components/ion-menu.js +2 -2
- package/components/ion-nav-link.js +1 -1
- package/components/ion-nav.js +1 -1
- package/components/ion-note.js +2 -2
- package/components/ion-picker-legacy.js +2 -2
- package/components/ion-progress-bar.js +1 -1
- package/components/ion-range.js +3 -3
- package/components/ion-refresher-content.js +1 -1
- package/components/ion-refresher.js +1 -1
- package/components/ion-reorder-group.js +1 -1
- package/components/ion-reorder.js +1 -1
- package/components/ion-router-link.js +2 -2
- package/components/ion-router-outlet.js +1 -1
- package/components/ion-row.js +1 -1
- package/components/ion-searchbar.js +4 -4
- package/components/ion-segment-button.js +2 -2
- package/components/ion-segment-content.js +1 -1
- package/components/ion-segment-view.js +2 -2
- package/components/ion-segment.js +2 -2
- package/components/ion-select-option.js +1 -1
- package/components/ion-select.js +2 -2
- package/components/ion-skeleton-text.js +2 -2
- package/components/ion-split-pane.js +2 -2
- package/components/ion-tab-bar.js +2 -2
- package/components/ion-tab-button.js +2 -2
- package/components/ion-tab.js +2 -2
- package/components/ion-tabs.js +1 -1
- package/components/ion-text.js +2 -2
- package/components/ion-textarea.js +35 -4
- package/components/ion-thumbnail.js +1 -1
- package/components/ion-toast.js +2 -2
- package/components/ion-toggle.js +3 -3
- package/components/label.js +2 -2
- package/components/list-header.js +2 -2
- package/components/modal.js +4 -4
- package/components/picker-column-option.js +2 -2
- package/components/picker-column2.js +2 -2
- package/components/popover.js +2 -2
- package/components/radio-group.js +1 -1
- package/components/radio.js +3 -3
- package/components/ripple-effect.js +1 -1
- package/components/select-modal.js +1 -1
- package/components/select-popover.js +1 -1
- package/components/spinner.js +1 -1
- package/components/title.js +2 -2
- package/components/toolbar.js +2 -2
- package/dist/cjs/ion-app_8.cjs.entry.js +5 -5
- package/dist/cjs/ion-avatar_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-col_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-datetime_3.cjs.entry.js +4 -4
- package/dist/cjs/ion-input.cjs.entry.js +35 -5
- package/dist/cjs/ion-item-option_3.cjs.entry.js +4 -4
- package/dist/cjs/ion-item_8.cjs.entry.js +11 -11
- package/dist/cjs/ion-loading.cjs.entry.js +2 -2
- package/dist/cjs/ion-menu_3.cjs.entry.js +6 -6
- package/dist/cjs/ion-modal.cjs.entry.js +4 -4
- package/dist/cjs/ion-nav_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-picker-column-option.cjs.entry.js +2 -2
- package/dist/cjs/ion-popover.cjs.entry.js +2 -2
- package/dist/cjs/ion-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/ion-radio_2.cjs.entry.js +4 -4
- package/dist/cjs/ion-range.cjs.entry.js +3 -3
- package/dist/cjs/ion-refresher_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-reorder_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-ripple-effect.cjs.entry.js +1 -1
- package/dist/cjs/ion-route_4.cjs.entry.js +2 -2
- package/dist/cjs/ion-searchbar.cjs.entry.js +4 -4
- package/dist/cjs/ion-segment-content.cjs.entry.js +1 -1
- package/dist/cjs/ion-segment-view.cjs.entry.js +2 -2
- package/dist/cjs/ion-segment_2.cjs.entry.js +4 -4
- package/dist/cjs/ion-select-modal.cjs.entry.js +1 -1
- package/dist/cjs/ion-select_3.cjs.entry.js +4 -4
- package/dist/cjs/ion-spinner.cjs.entry.js +1 -1
- package/dist/cjs/ion-split-pane.cjs.entry.js +2 -2
- package/dist/cjs/ion-tab-bar_2.cjs.entry.js +4 -4
- package/dist/cjs/ion-tab_2.cjs.entry.js +3 -3
- package/dist/cjs/ion-text.cjs.entry.js +2 -2
- package/dist/cjs/ion-textarea.cjs.entry.js +34 -4
- package/dist/cjs/ion-toast.cjs.entry.js +2 -2
- package/dist/cjs/ion-toggle.cjs.entry.js +3 -3
- package/dist/cjs/ionic.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/input/input.js +37 -6
- package/dist/collection/components/item-divider/item-divider.js +2 -2
- package/dist/collection/components/item-group/item-group.js +1 -1
- package/dist/collection/components/item-option/item-option.js +2 -2
- package/dist/collection/components/item-options/item-options.js +1 -1
- package/dist/collection/components/item-sliding/item-sliding.js +1 -1
- package/dist/collection/components/label/label.js +2 -2
- package/dist/collection/components/list-header/list-header.js +2 -2
- package/dist/collection/components/loading/loading.js +2 -2
- package/dist/collection/components/menu/menu.js +2 -2
- package/dist/collection/components/menu-button/menu-button.js +2 -2
- package/dist/collection/components/menu-toggle/menu-toggle.js +2 -2
- package/dist/collection/components/modal/modal.js +4 -4
- package/dist/collection/components/nav/nav.js +1 -1
- package/dist/collection/components/nav-link/nav-link.js +1 -1
- package/dist/collection/components/note/note.js +2 -2
- package/dist/collection/components/picker-column-option/picker-column-option.js +2 -2
- package/dist/collection/components/picker-legacy/picker.js +2 -2
- package/dist/collection/components/picker-legacy-column/picker-column.js +2 -2
- package/dist/collection/components/popover/popover.js +2 -2
- package/dist/collection/components/progress-bar/progress-bar.js +1 -1
- package/dist/collection/components/radio/radio.js +3 -3
- package/dist/collection/components/radio-group/radio-group.js +1 -1
- package/dist/collection/components/range/range.js +3 -3
- package/dist/collection/components/refresher/refresher.js +1 -1
- package/dist/collection/components/refresher-content/refresher-content.js +1 -1
- package/dist/collection/components/reorder/reorder.js +1 -1
- package/dist/collection/components/reorder-group/reorder-group.js +1 -1
- package/dist/collection/components/ripple-effect/ripple-effect.js +1 -1
- package/dist/collection/components/router-link/router-link.js +2 -2
- package/dist/collection/components/router-outlet/router-outlet.js +1 -1
- package/dist/collection/components/row/row.js +1 -1
- package/dist/collection/components/searchbar/searchbar.js +4 -4
- package/dist/collection/components/segment/segment.js +2 -2
- package/dist/collection/components/segment-button/segment-button.js +2 -2
- package/dist/collection/components/segment-content/segment-content.js +1 -1
- package/dist/collection/components/segment-view/segment-view.js +2 -2
- package/dist/collection/components/select/select.js +2 -2
- package/dist/collection/components/select-modal/select-modal.js +1 -1
- package/dist/collection/components/select-option/select-option.js +1 -1
- package/dist/collection/components/select-popover/select-popover.js +1 -1
- package/dist/collection/components/skeleton-text/skeleton-text.js +2 -2
- package/dist/collection/components/spinner/spinner.js +1 -1
- package/dist/collection/components/split-pane/split-pane.js +2 -2
- package/dist/collection/components/tab/tab.js +2 -2
- package/dist/collection/components/tab-bar/tab-bar.js +2 -2
- package/dist/collection/components/tab-button/tab-button.js +2 -2
- package/dist/collection/components/tabs/tabs.js +1 -1
- package/dist/collection/components/text/text.js +2 -2
- package/dist/collection/components/textarea/textarea.js +36 -5
- package/dist/collection/components/thumbnail/thumbnail.js +1 -1
- package/dist/collection/components/title/title.js +2 -2
- package/dist/collection/components/toast/toast.js +2 -2
- package/dist/collection/components/toggle/toggle.js +3 -3
- package/dist/collection/components/toolbar/toolbar.js +2 -2
- package/dist/docs.json +1 -1
- package/dist/esm/ion-app_8.entry.js +5 -5
- package/dist/esm/ion-avatar_3.entry.js +1 -1
- package/dist/esm/ion-col_3.entry.js +1 -1
- package/dist/esm/ion-datetime_3.entry.js +4 -4
- package/dist/esm/ion-input.entry.js +35 -5
- package/dist/esm/ion-item-option_3.entry.js +4 -4
- package/dist/esm/ion-item_8.entry.js +11 -11
- package/dist/esm/ion-loading.entry.js +2 -2
- package/dist/esm/ion-menu_3.entry.js +6 -6
- package/dist/esm/ion-modal.entry.js +4 -4
- package/dist/esm/ion-nav_2.entry.js +2 -2
- package/dist/esm/ion-picker-column-option.entry.js +2 -2
- package/dist/esm/ion-popover.entry.js +2 -2
- package/dist/esm/ion-progress-bar.entry.js +1 -1
- package/dist/esm/ion-radio_2.entry.js +4 -4
- package/dist/esm/ion-range.entry.js +3 -3
- package/dist/esm/ion-refresher_2.entry.js +2 -2
- package/dist/esm/ion-reorder_2.entry.js +2 -2
- package/dist/esm/ion-ripple-effect.entry.js +1 -1
- package/dist/esm/ion-route_4.entry.js +2 -2
- package/dist/esm/ion-searchbar.entry.js +4 -4
- package/dist/esm/ion-segment-content.entry.js +1 -1
- package/dist/esm/ion-segment-view.entry.js +2 -2
- package/dist/esm/ion-segment_2.entry.js +4 -4
- package/dist/esm/ion-select-modal.entry.js +1 -1
- package/dist/esm/ion-select_3.entry.js +4 -4
- package/dist/esm/ion-spinner.entry.js +1 -1
- package/dist/esm/ion-split-pane.entry.js +2 -2
- package/dist/esm/ion-tab-bar_2.entry.js +4 -4
- package/dist/esm/ion-tab_2.entry.js +3 -3
- package/dist/esm/ion-text.entry.js +2 -2
- package/dist/esm/ion-textarea.entry.js +34 -4
- package/dist/esm/ion-toast.entry.js +2 -2
- package/dist/esm/ion-toggle.entry.js +3 -3
- 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-0f396661.entry.js +4 -0
- package/dist/ionic/{p-c32b6c20.entry.js → p-1191a2d9.entry.js} +1 -1
- package/dist/ionic/{p-78aff731.entry.js → p-16116947.entry.js} +1 -1
- package/dist/ionic/p-187aaf4a.entry.js +4 -0
- package/dist/ionic/{p-12b99129.entry.js → p-1bbd0a23.entry.js} +1 -1
- package/dist/ionic/p-1e34d434.entry.js +4 -0
- package/dist/ionic/{p-8ca65589.entry.js → p-29032e49.entry.js} +1 -1
- package/dist/ionic/{p-2e967897.entry.js → p-3624b640.entry.js} +1 -1
- package/dist/ionic/{p-0e45320b.entry.js → p-40d56a51.entry.js} +1 -1
- package/dist/ionic/{p-1e8b1767.entry.js → p-4f2c5845.entry.js} +1 -1
- package/dist/ionic/{p-ee881603.entry.js → p-528af4e6.entry.js} +1 -1
- package/dist/ionic/{p-70e05fd1.entry.js → p-54dec9b1.entry.js} +1 -1
- package/dist/ionic/{p-165d1309.entry.js → p-6383afc2.entry.js} +1 -1
- package/dist/ionic/{p-f4e6e570.entry.js → p-7a53f04c.entry.js} +1 -1
- package/dist/ionic/{p-165d8e84.entry.js → p-7b12d853.entry.js} +1 -1
- package/dist/ionic/{p-9cf01220.entry.js → p-7bac2c5f.entry.js} +1 -1
- package/dist/ionic/{p-332e4eac.entry.js → p-8cdb4ff5.entry.js} +1 -1
- package/dist/ionic/p-8d96a0cd.entry.js +4 -0
- package/dist/ionic/{p-039c8f8e.entry.js → p-92e8f208.entry.js} +1 -1
- package/dist/ionic/{p-c7d2c21b.entry.js → p-982fe1c4.entry.js} +1 -1
- package/dist/ionic/{p-82ce0043.entry.js → p-ab33ef20.entry.js} +1 -1
- package/dist/ionic/{p-f267c7dc.entry.js → p-ac434970.entry.js} +1 -1
- package/dist/ionic/{p-f550f186.entry.js → p-c0d58c8e.entry.js} +1 -1
- package/dist/ionic/{p-1cfb0bc4.entry.js → p-c575e7ce.entry.js} +1 -1
- package/dist/ionic/{p-5420fd3e.entry.js → p-cde6d39b.entry.js} +1 -1
- package/dist/ionic/{p-4c79bd85.entry.js → p-d04d66fc.entry.js} +1 -1
- package/dist/ionic/p-d3df6032.entry.js +4 -0
- package/dist/ionic/{p-e8429777.entry.js → p-dbba38cf.entry.js} +1 -1
- package/dist/ionic/p-e6c3214c.entry.js +4 -0
- package/dist/ionic/{p-22351d1b.entry.js → p-e6c465ff.entry.js} +1 -1
- package/dist/ionic/{p-e1310192.entry.js → p-ec76fec4.entry.js} +1 -1
- package/dist/ionic/{p-f5da8541.entry.js → p-f456d176.entry.js} +1 -1
- package/dist/ionic/{p-f868d51c.entry.js → p-f7db572a.entry.js} +1 -1
- package/dist/ionic/{p-0c580145.entry.js → p-f9eb54ee.entry.js} +1 -1
- package/dist/types/components/input/input.d.ts +9 -0
- package/dist/types/components/textarea/textarea.d.ts +9 -0
- package/hydrate/index.js +137 -101
- package/hydrate/index.mjs +137 -101
- package/package.json +1 -1
- package/dist/ionic/p-1488b7cc.entry.js +0 -4
- package/dist/ionic/p-3364562a.entry.js +0 -4
- package/dist/ionic/p-7922ca30.entry.js +0 -4
- package/dist/ionic/p-8de104c4.entry.js +0 -4
- package/dist/ionic/p-c91aa324.entry.js +0 -4
- package/dist/ionic/p-dff5b0b6.entry.js +0 -4
|
@@ -721,7 +721,7 @@ const Range = class {
|
|
|
721
721
|
const needsEndAdjustment = inItem && !hasEndContent;
|
|
722
722
|
const mode = getIonMode(this);
|
|
723
723
|
renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
|
|
724
|
-
return (h(Host, { key: '
|
|
724
|
+
return (h(Host, { key: 'ef7b01f80515bcaeb2983934ad7f10a6bd5d13ec', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses(this.color, {
|
|
725
725
|
[mode]: true,
|
|
726
726
|
'in-item': inItem,
|
|
727
727
|
'range-disabled': disabled,
|
|
@@ -730,10 +730,10 @@ const Range = class {
|
|
|
730
730
|
[`range-label-placement-${labelPlacement}`]: true,
|
|
731
731
|
'range-item-start-adjustment': needsStartAdjustment,
|
|
732
732
|
'range-item-end-adjustment': needsEndAdjustment,
|
|
733
|
-
}) }, h("label", { key: '
|
|
733
|
+
}) }, h("label", { key: 'fd8aa90a9d52be9da024b907e68858dae424449d', class: "range-wrapper", id: "range-label" }, h("div", { key: '2172b4f329c22017dd23475c80aac25ba6e753eb', class: {
|
|
734
734
|
'label-text-wrapper': true,
|
|
735
735
|
'label-text-wrapper-hidden': !hasLabel,
|
|
736
|
-
}, part: "label" }, label !== undefined ? h("div", { class: "label-text" }, label) : h("slot", { name: "label" })), h("div", { key: '
|
|
736
|
+
}, part: "label" }, label !== undefined ? h("div", { class: "label-text" }, label) : h("slot", { name: "label" })), h("div", { key: '3c318bf2ea0576646d4c010bf44573fd0f483186', class: "native-wrapper" }, h("slot", { key: '6586fd6fc96271e73f8a86c202d1913ad1a26f96', name: "start" }), this.renderRangeSlider(), h("slot", { key: '74ac0bc2d2cb66ef708bb729f88b6ecbc1b2155d', name: "end" })))));
|
|
737
737
|
}
|
|
738
738
|
get el() { return getElement(this); }
|
|
739
739
|
static get watchers() { return {
|
|
@@ -887,7 +887,7 @@ const Refresher = class {
|
|
|
887
887
|
}
|
|
888
888
|
render() {
|
|
889
889
|
const mode = getIonMode(this);
|
|
890
|
-
return (h(Host, { key: '
|
|
890
|
+
return (h(Host, { key: '2d1bd880877b698604542ab2d602d38b9504d975', slot: "fixed", class: {
|
|
891
891
|
[mode]: true,
|
|
892
892
|
// Used internally for styling
|
|
893
893
|
[`refresher-${mode}`]: true,
|
|
@@ -950,7 +950,7 @@ const RefresherContent = class {
|
|
|
950
950
|
const pullingIcon = this.pullingIcon;
|
|
951
951
|
const hasSpinner = pullingIcon != null && SPINNERS[pullingIcon] !== undefined;
|
|
952
952
|
const mode = getIonMode(this);
|
|
953
|
-
return (h(Host, { key: '
|
|
953
|
+
return (h(Host, { key: 'e235f8a9a84070ece2e2066ced234a64663bfa1d', class: mode }, h("div", { key: '9121691818ddaa35801a5f442e144ac27686cf19', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (h("div", { key: 'c8d65d740f1575041bd3b752c789077927397fe4', class: "refresher-pulling-icon" }, h("div", { key: '309dd904977eaa788b09ea95b7fa4996a73bec5b', class: "spinner-arrow-container" }, h("ion-spinner", { key: 'a2a1480f67775d56ca7822e76be1e9f983bca2f9', name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (h("div", { key: '811d7e06d324bf4b6a18a31427a43e5177f3ae3a', class: "arrow-container" }, h("ion-icon", { key: '86cc48e2e8dc054ff6ff1299094da35b524be63d', icon: caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (h("div", { key: '464ae097dbc95c18a2dd7dfd03f8489153dab719', class: "refresher-pulling-icon" }, h("ion-icon", { key: 'ed6875978b9035add562caa743a68353743d978f', icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), h("div", { key: 'aff891924e44354543fec484e5cde1ca92e69904', class: "refresher-refreshing" }, this.refreshingSpinner && (h("div", { key: '842d7ac4ff10a1058775493d62f31cbdcd34f7a0', class: "refresher-refreshing-icon" }, h("ion-spinner", { key: '8c3e6195501e7e78d5cde1e3ad1fef90fd4a953f', name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
|
|
954
954
|
}
|
|
955
955
|
get el() { return getElement(this); }
|
|
956
956
|
};
|
|
@@ -30,7 +30,7 @@ const Reorder = class {
|
|
|
30
30
|
render() {
|
|
31
31
|
const mode = getIonMode(this);
|
|
32
32
|
const reorderIcon = mode === 'ios' ? reorderThreeOutline : reorderTwoSharp;
|
|
33
|
-
return (h(Host, { key: '
|
|
33
|
+
return (h(Host, { key: 'e6807bb349725682e99e791ac65e729a360d64e8', class: mode }, h("slot", { key: '1c691cdbffa6427ba08dc12184c69559ed5d5506' }, h("ion-icon", { key: '8b4150302cdca475379582b2251737b5e74079b1', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
|
|
34
34
|
}
|
|
35
35
|
get el() { return getElement(this); }
|
|
36
36
|
};
|
|
@@ -293,7 +293,7 @@ const ReorderGroup = class {
|
|
|
293
293
|
}
|
|
294
294
|
render() {
|
|
295
295
|
const mode = getIonMode(this);
|
|
296
|
-
return (h(Host, { key: '
|
|
296
|
+
return (h(Host, { key: 'b9641f3061d67fbfe68317b901ec33267046e073', class: {
|
|
297
297
|
[mode]: true,
|
|
298
298
|
'reorder-enabled': !this.disabled,
|
|
299
299
|
'reorder-list-active': this.state !== 0 /* ReorderGroupState.Idle */,
|
|
@@ -72,7 +72,7 @@ const RippleEffect = class {
|
|
|
72
72
|
}
|
|
73
73
|
render() {
|
|
74
74
|
const mode = getIonMode(this);
|
|
75
|
-
return (h(Host, { key: '
|
|
75
|
+
return (h(Host, { key: 'ae9d3b1ed6773a9b9bb2267129f7e9af23b6c9fc', role: "presentation", class: {
|
|
76
76
|
[mode]: true,
|
|
77
77
|
unbounded: this.unbounded,
|
|
78
78
|
} }));
|
|
@@ -895,10 +895,10 @@ const RouterLink = class {
|
|
|
895
895
|
rel: this.rel,
|
|
896
896
|
target: this.target,
|
|
897
897
|
};
|
|
898
|
-
return (h(Host, { key: '
|
|
898
|
+
return (h(Host, { key: 'd7f2affcde45c5fbb6cb46cd1c30008ee92a68c5', onClick: this.onClick, class: createColorClasses(this.color, {
|
|
899
899
|
[mode]: true,
|
|
900
900
|
'ion-activatable': true,
|
|
901
|
-
}) }, h("a", Object.assign({ key: '
|
|
901
|
+
}) }, h("a", Object.assign({ key: 'babafae85ca5c6429958d383feff0493ff8cf33e' }, attrs), h("slot", { key: '50314e9555bbf6dffa0c50c3f763009dee59b10b' }))));
|
|
902
902
|
}
|
|
903
903
|
};
|
|
904
904
|
RouterLink.style = routerLinkCss;
|
|
@@ -436,8 +436,8 @@ const Searchbar = class {
|
|
|
436
436
|
const clearIcon = this.clearIcon || (mode === 'ios' ? closeCircle : closeSharp);
|
|
437
437
|
const searchIcon = this.searchIcon || (mode === 'ios' ? searchOutline : searchSharp);
|
|
438
438
|
const shouldShowCancelButton = this.shouldShowCancelButton();
|
|
439
|
-
const cancelButton = this.showCancelButton !== 'never' && (h("button", { key: '
|
|
440
|
-
return (h(Host, { key: '
|
|
439
|
+
const cancelButton = this.showCancelButton !== 'never' && (h("button", { key: '19e18775856db87daeb4b9e3d7bca0461915a0df', "aria-label": cancelButtonText, "aria-hidden": shouldShowCancelButton ? undefined : 'true', type: "button", tabIndex: mode === 'ios' && !shouldShowCancelButton ? -1 : undefined, onMouseDown: this.onCancelSearchbar, onTouchStart: this.onCancelSearchbar, class: "searchbar-cancel-button" }, h("div", { key: 'b3bbdcc033f3bd3441d619e4a252cef0dad4d07e', "aria-hidden": "true" }, mode === 'md' ? (h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
|
|
440
|
+
return (h(Host, { key: '074aa60e051bfb3225e87d44bbb6346c59c73574', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses(this.color, {
|
|
441
441
|
[mode]: true,
|
|
442
442
|
'searchbar-animated': animated,
|
|
443
443
|
'searchbar-disabled': this.disabled,
|
|
@@ -447,14 +447,14 @@ const Searchbar = class {
|
|
|
447
447
|
'searchbar-has-focus': this.focused,
|
|
448
448
|
'searchbar-should-show-clear': this.shouldShowClearButton(),
|
|
449
449
|
'searchbar-should-show-cancel': this.shouldShowCancelButton(),
|
|
450
|
-
}) }, h("div", { key: '
|
|
450
|
+
}) }, h("div", { key: '54f58a79fe36e85d9295157303f1be89c98bbdaf', class: "searchbar-input-container" }, h("input", Object.assign({ key: 'f991a37fcf54d26b7ad10d89084764e03d97b9de', "aria-label": "search text", disabled: this.disabled, ref: (el) => (this.nativeInput = el), class: "searchbar-input", inputMode: this.inputmode, enterKeyHint: this.enterkeyhint, name: this.name, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, minLength: this.minlength, maxLength: this.maxlength, placeholder: this.placeholder, type: this.type, value: this.getValue(), autoCapitalize: autocapitalize === 'default' ? undefined : autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, h("ion-icon", { key: '8b44dd90a3292c5cf872ef16a8520675f5673494', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), h("button", { key: '79d9cfed8f01268044f82811a35d323a12dca749', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
|
|
451
451
|
/**
|
|
452
452
|
* This prevents mobile browsers from
|
|
453
453
|
* blurring the input when the clear
|
|
454
454
|
* button is activated.
|
|
455
455
|
*/
|
|
456
456
|
ev.preventDefault();
|
|
457
|
-
}, onClick: () => this.onClearInput(true) }, h("ion-icon", { key: '
|
|
457
|
+
}, onClick: () => this.onClearInput(true) }, h("ion-icon", { key: 'aa3b9fa8a61f853236783ac7bcd0b113ea65ece2', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
|
|
458
458
|
}
|
|
459
459
|
get el() { return getElement(this); }
|
|
460
460
|
static get watchers() { return {
|
|
@@ -10,7 +10,7 @@ const SegmentContent = class {
|
|
|
10
10
|
registerInstance(this, hostRef);
|
|
11
11
|
}
|
|
12
12
|
render() {
|
|
13
|
-
return (h(Host, { key: '
|
|
13
|
+
return (h(Host, { key: 'db6876f2aee7afa1ea8bc147337670faa68fae1c' }, h("slot", { key: 'bc05714a973a5655668679033f5809a1da6db8cc' })));
|
|
14
14
|
}
|
|
15
15
|
};
|
|
16
16
|
SegmentContent.style = segmentContentCss;
|
|
@@ -103,10 +103,10 @@ const SegmentView = class {
|
|
|
103
103
|
}
|
|
104
104
|
render() {
|
|
105
105
|
const { disabled, isManualScroll } = this;
|
|
106
|
-
return (h(Host, { key: '
|
|
106
|
+
return (h(Host, { key: '754a374e89fd4dd682eb00497e717242a6f83357', class: {
|
|
107
107
|
'segment-view-disabled': disabled,
|
|
108
108
|
'segment-view-scroll-disabled': isManualScroll === false,
|
|
109
|
-
} }, h("slot", { key: '
|
|
109
|
+
} }, h("slot", { key: '77366044eb61f0d4bba305bd6f0ef8fd1e25194b' })));
|
|
110
110
|
}
|
|
111
111
|
get el() { return getElement(this); }
|
|
112
112
|
};
|
|
@@ -547,14 +547,14 @@ const Segment = class {
|
|
|
547
547
|
}
|
|
548
548
|
render() {
|
|
549
549
|
const mode = getIonMode(this);
|
|
550
|
-
return (h(Host, { key: '
|
|
550
|
+
return (h(Host, { key: 'e67ed512739cf2cfe657b0c44ebc3dfb1e9fbb79', role: "tablist", onClick: this.onClick, class: createColorClasses(this.color, {
|
|
551
551
|
[mode]: true,
|
|
552
552
|
'in-toolbar': hostContext('ion-toolbar', this.el),
|
|
553
553
|
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
|
|
554
554
|
'segment-activated': this.activated,
|
|
555
555
|
'segment-disabled': this.disabled,
|
|
556
556
|
'segment-scrollable': this.scrollable,
|
|
557
|
-
}) }, h("slot", { key: '
|
|
557
|
+
}) }, h("slot", { key: '804d8acfcb9abfeeee38244b015fbc5c36330b9e', onSlotchange: this.onSlottedItemsChange })));
|
|
558
558
|
}
|
|
559
559
|
get el() { return getElement(this); }
|
|
560
560
|
static get watchers() { return {
|
|
@@ -672,7 +672,7 @@ const SegmentButton = class {
|
|
|
672
672
|
const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
|
|
673
673
|
const mode = getIonMode(this);
|
|
674
674
|
const hasSegmentColor = () => (segmentEl === null || segmentEl === void 0 ? void 0 : segmentEl.color) !== undefined;
|
|
675
|
-
return (h(Host, { key: '
|
|
675
|
+
return (h(Host, { key: '26cb7ee90455bcaa6416125802d7e5729fa05b5b', class: {
|
|
676
676
|
[mode]: true,
|
|
677
677
|
'in-toolbar': hostContext('ion-toolbar', this.el),
|
|
678
678
|
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
|
|
@@ -688,7 +688,7 @@ const SegmentButton = class {
|
|
|
688
688
|
'ion-activatable': true,
|
|
689
689
|
'ion-activatable-instant': true,
|
|
690
690
|
'ion-focusable': true,
|
|
691
|
-
} }, h("button", Object.assign({ key: '
|
|
691
|
+
} }, h("button", Object.assign({ key: '75add37f11c107d1e2cfdb154e08004e9579e863', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), h("span", { key: '8e720d2a3e304903685bf09d226a64e944d78a22', class: "button-inner" }, h("slot", { key: 'c8e7b3ebf8f03042a1001155643b585283c73c65' })), mode === 'md' && h("ion-ripple-effect", { key: '3586ac317b8d82c92b0ccfbfae42f8778612321b' })), h("div", { key: '9cf93957da9e8dc333c8b05327bb903385b1c5f4', part: "indicator", class: "segment-button-indicator segment-button-indicator-animated" }, h("div", { key: 'd3b6f0b3860ec6896b46703f64ed1cc8c75612e3', part: "indicator-background", class: "segment-button-indicator-background" }))));
|
|
692
692
|
}
|
|
693
693
|
get el() { return getElement(this); }
|
|
694
694
|
static get watchers() { return {
|
|
@@ -88,7 +88,7 @@ const SelectModal = class {
|
|
|
88
88
|
} }, option.text))));
|
|
89
89
|
}
|
|
90
90
|
render() {
|
|
91
|
-
return (h(Host, { key: '
|
|
91
|
+
return (h(Host, { key: 'b6c0dec240b2e41985b15fdf4e5a6d3a145c1567', class: getIonMode(this) }, h("ion-header", { key: 'cd177e85ee0f62a60a3a708342d6ab6eb19a44dc' }, h("ion-toolbar", { key: 'aee8222a5a4daa540ad202b2e4cac1ef93d9558c' }, this.header !== undefined && h("ion-title", { key: '5f8fecc764d97bf840d3d4cfddeeccd118ab4436' }, this.header), h("ion-buttons", { key: '919033950d7c2b0101f96a9c9698219de9f568ea', slot: "end" }, h("ion-button", { key: '34b571cab6dced4bde555a077a21e91800829931', onClick: () => this.closeModal() }, "Close")))), h("ion-content", { key: '3c9153d26ba7a5a03d3b20fcd628d0c3031661a7' }, h("ion-list", { key: 'e00b222c071bc97c82ad1bba4db95a8a5c43ed6d' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
|
|
92
92
|
}
|
|
93
93
|
get el() { return getElement(this); }
|
|
94
94
|
};
|
|
@@ -735,7 +735,7 @@ const Select = class {
|
|
|
735
735
|
* TODO(FW-5592): Remove hasStartEndSlots condition
|
|
736
736
|
*/
|
|
737
737
|
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
|
|
738
|
-
return (h(Host, { key: '
|
|
738
|
+
return (h(Host, { key: 'c03fb65e8fc9f9aab295e07b282377d57d910519', onClick: this.onClick, class: createColorClasses(this.color, {
|
|
739
739
|
[mode]: true,
|
|
740
740
|
'in-item': inItem,
|
|
741
741
|
'in-item-color': hostContext('ion-item.ion-color', el),
|
|
@@ -753,7 +753,7 @@ const Select = class {
|
|
|
753
753
|
[`select-justify-${justify}`]: justifyEnabled,
|
|
754
754
|
[`select-shape-${shape}`]: shape !== undefined,
|
|
755
755
|
[`select-label-placement-${labelPlacement}`]: true,
|
|
756
|
-
}) }, h("label", { key: '
|
|
756
|
+
}) }, h("label", { key: '0d0c8ec55269adcac625f2899a547f4e7f3e3741', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick }, this.renderLabelContainer(), h("div", { key: 'f6dfc93c0e23cbe75a2947abde67d842db2dad78', class: "select-wrapper-inner" }, h("slot", { key: '957bfadf9f101f519091419a362d3abdc2be66f6', name: "start" }), h("div", { key: 'ca349202a484e7f2e884533fd330f0b136754f7d', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: 'f0e62a6533ff1c8f62bd2d27f60b23385c4fa9ed', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'fb840d46bafafb09898ebeebbe8c181906a3d8a2', class: "select-highlight" })), this.renderBottomContent()));
|
|
757
757
|
}
|
|
758
758
|
get el() { return getElement(this); }
|
|
759
759
|
static get watchers() { return {
|
|
@@ -815,7 +815,7 @@ const SelectOption = class {
|
|
|
815
815
|
this.disabled = false;
|
|
816
816
|
}
|
|
817
817
|
render() {
|
|
818
|
-
return h(Host, { key: '
|
|
818
|
+
return h(Host, { key: '3a70eea9fa03a9acba582180761d18347c72acee', role: "option", id: this.inputId, class: getIonMode(this) });
|
|
819
819
|
}
|
|
820
820
|
get el() { return getElement(this); }
|
|
821
821
|
};
|
|
@@ -920,7 +920,7 @@ const SelectPopover = class {
|
|
|
920
920
|
render() {
|
|
921
921
|
const { header, message, options, subHeader } = this;
|
|
922
922
|
const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
|
|
923
|
-
return (h(Host, { key: '
|
|
923
|
+
return (h(Host, { key: 'ab931b49b59283825bd2afa3f7f995b0e6e05bef', class: getIonMode(this) }, h("ion-list", { key: '3bd12b67832607596b912a73d5b3ae9b954b244d' }, header !== undefined && h("ion-list-header", { key: '97da930246edf7423a039c030d40e3ff7a5148a3' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: 'c579df6ea8fac07bb0c59d34c69b149656863224' }, h("ion-label", { key: 'af699c5f465710ccb13b8cf8e7be66f0e8acfad1', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'df9a936d42064b134e843c7229f314a2a3ec7e80' }, subHeader), message !== undefined && h("p", { key: '9c3ddad378df00f106afa94e9928cf68c17124dd' }, message)))), this.renderOptions(options))));
|
|
924
924
|
}
|
|
925
925
|
get el() { return getElement(this); }
|
|
926
926
|
};
|
|
@@ -42,7 +42,7 @@ const Spinner = class {
|
|
|
42
42
|
svgs.push(buildLine(spinner, duration, i, spinner.lines));
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
|
-
return (h(Host, { key: '
|
|
45
|
+
return (h(Host, { key: 'a33d6421fcc885995fbc7a348516525f68ca496c', class: createColorClasses(self.color, {
|
|
46
46
|
[mode]: true,
|
|
47
47
|
[`spinner-${spinnerName}`]: true,
|
|
48
48
|
'spinner-paused': self.paused || config.getBoolean('_testing'),
|
|
@@ -126,12 +126,12 @@ const SplitPane = class {
|
|
|
126
126
|
}
|
|
127
127
|
render() {
|
|
128
128
|
const mode = getIonMode(this);
|
|
129
|
-
return (h(Host, { key: '
|
|
129
|
+
return (h(Host, { key: 'd5e30df12f1f1f855da4c66f98076b9dce762c59', class: {
|
|
130
130
|
[mode]: true,
|
|
131
131
|
// Used internally for styling
|
|
132
132
|
[`split-pane-${mode}`]: true,
|
|
133
133
|
'split-pane-visible': this.visible,
|
|
134
|
-
} }, h("slot", { key: '
|
|
134
|
+
} }, h("slot", { key: '3e30d7cf3bc1cf434e16876a0cb2a36377b8e00f' })));
|
|
135
135
|
}
|
|
136
136
|
get el() { return getElement(this); }
|
|
137
137
|
static get watchers() { return {
|
|
@@ -63,11 +63,11 @@ const TabBar = class {
|
|
|
63
63
|
const { color, translucent, keyboardVisible } = this;
|
|
64
64
|
const mode = getIonMode(this);
|
|
65
65
|
const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
|
|
66
|
-
return (h(Host, { key: '
|
|
66
|
+
return (h(Host, { key: '275dc6c1b30f6928ce9039b2f445208bb3500ddc', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
|
|
67
67
|
[mode]: true,
|
|
68
68
|
'tab-bar-translucent': translucent,
|
|
69
69
|
'tab-bar-hidden': shouldHide,
|
|
70
|
-
}) }, h("slot", { key: '
|
|
70
|
+
}) }, h("slot", { key: 'ceac20128d75c6a4a0f445f2df8deb8cc71fc4da' })));
|
|
71
71
|
}
|
|
72
72
|
get el() { return getElement(this); }
|
|
73
73
|
static get watchers() { return {
|
|
@@ -145,7 +145,7 @@ const TabButton = class {
|
|
|
145
145
|
rel,
|
|
146
146
|
target,
|
|
147
147
|
};
|
|
148
|
-
return (h(Host, { key: '
|
|
148
|
+
return (h(Host, { key: 'ce9d29ced0c781d6b2fa62cd5feb801c11fc42e8', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
|
|
149
149
|
[mode]: true,
|
|
150
150
|
'tab-selected': selected,
|
|
151
151
|
'tab-disabled': disabled,
|
|
@@ -157,7 +157,7 @@ const TabButton = class {
|
|
|
157
157
|
'ion-activatable': true,
|
|
158
158
|
'ion-selectable': true,
|
|
159
159
|
'ion-focusable': true,
|
|
160
|
-
} }, h("a", Object.assign({ key: '
|
|
160
|
+
} }, h("a", Object.assign({ key: '01cb0ed2e77c5c1a8abd48da1bb07ac1b305d0b6' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), h("span", { key: 'd0240c05f42217cfb186b86ff8a0c9cd70b9c8df', class: "button-inner" }, h("slot", { key: '0a20b84925037dbaa8bb4a495b813d3f7c2e58ac' })), mode === 'md' && h("ion-ripple-effect", { key: '4c92c27178cdac89d69cffef8d2c39c3644914e8', type: "unbounded" }))));
|
|
161
161
|
}
|
|
162
162
|
get el() { return getElement(this); }
|
|
163
163
|
};
|
|
@@ -43,10 +43,10 @@ const Tab = class {
|
|
|
43
43
|
}
|
|
44
44
|
render() {
|
|
45
45
|
const { tab, active, component } = this;
|
|
46
|
-
return (h(Host, { key: '
|
|
46
|
+
return (h(Host, { key: 'dbad8fe9f1566277d14647626308eaf1601ab01f', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
|
|
47
47
|
'ion-page': component === undefined,
|
|
48
48
|
'tab-hidden': !active,
|
|
49
|
-
} }, h("slot", { key: '
|
|
49
|
+
} }, h("slot", { key: '3be64f4e7161f6769aaf8e4dcb5293fcaa09af45' })));
|
|
50
50
|
}
|
|
51
51
|
get el() { return getElement(this); }
|
|
52
52
|
static get watchers() { return {
|
|
@@ -216,7 +216,7 @@ const Tabs = class {
|
|
|
216
216
|
return Array.from(this.el.querySelectorAll('ion-tab'));
|
|
217
217
|
}
|
|
218
218
|
render() {
|
|
219
|
-
return (h(Host, { key: '
|
|
219
|
+
return (h(Host, { key: '6dd1d17cc5a7aff4b910303006b4478080ca97af', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: 'db54a692d1a825498a116f090eb305f7cceceb5a', name: "top" }), h("div", { key: 'e1b7d49ba7032e9071de2029695254e2a8303be9', class: "tabs-inner" }, h("slot", { key: '4c3b58d5292c8c834e7532c51de0861068943d79' })), h("slot", { key: 'dd59c0b9b217dfbfb0fccdbc6896b593278549cc', name: "bottom" })));
|
|
220
220
|
}
|
|
221
221
|
get el() { return getElement(this); }
|
|
222
222
|
};
|
|
@@ -13,9 +13,9 @@ const Text = class {
|
|
|
13
13
|
}
|
|
14
14
|
render() {
|
|
15
15
|
const mode = getIonMode(this);
|
|
16
|
-
return (h(Host, { key: '
|
|
16
|
+
return (h(Host, { key: '361035eae7b92dc109794348d39bad2f596eb6be', class: createColorClasses(this.color, {
|
|
17
17
|
[mode]: true,
|
|
18
|
-
}) }, h("slot", { key: '
|
|
18
|
+
}) }, h("slot", { key: 'c7b8835cf485ba9ecd73298f0529276ce1ea0852' })));
|
|
19
19
|
}
|
|
20
20
|
};
|
|
21
21
|
Text.style = textCss;
|
|
@@ -40,6 +40,10 @@ const Textarea = class {
|
|
|
40
40
|
* is applied in both cases.
|
|
41
41
|
*/
|
|
42
42
|
this.hasFocus = false;
|
|
43
|
+
/**
|
|
44
|
+
* Track validation state for proper aria-live announcements
|
|
45
|
+
*/
|
|
46
|
+
this.isInvalid = false;
|
|
43
47
|
/**
|
|
44
48
|
* Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
|
|
45
49
|
* Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
|
|
@@ -186,10 +190,31 @@ const Textarea = class {
|
|
|
186
190
|
this.el.click();
|
|
187
191
|
}
|
|
188
192
|
}
|
|
193
|
+
/**
|
|
194
|
+
* Checks if the textarea is in an invalid state based on validation classes
|
|
195
|
+
*/
|
|
196
|
+
checkValidationState() {
|
|
197
|
+
return this.el.classList.contains('ion-touched') && this.el.classList.contains('ion-invalid');
|
|
198
|
+
}
|
|
189
199
|
connectedCallback() {
|
|
190
200
|
const { el } = this;
|
|
191
201
|
this.slotMutationController = createSlotMutationController(el, ['label', 'start', 'end'], () => forceUpdate(this));
|
|
192
202
|
this.notchController = createNotchController(el, () => this.notchSpacerEl, () => this.labelSlot);
|
|
203
|
+
// Watch for class changes to update validation state
|
|
204
|
+
if (typeof MutationObserver !== 'undefined') {
|
|
205
|
+
this.validationObserver = new MutationObserver(() => {
|
|
206
|
+
const newIsInvalid = this.checkValidationState();
|
|
207
|
+
if (this.isInvalid !== newIsInvalid) {
|
|
208
|
+
this.isInvalid = newIsInvalid;
|
|
209
|
+
}
|
|
210
|
+
});
|
|
211
|
+
this.validationObserver.observe(el, {
|
|
212
|
+
attributes: true,
|
|
213
|
+
attributeFilter: ['class'],
|
|
214
|
+
});
|
|
215
|
+
}
|
|
216
|
+
// Always set initial state
|
|
217
|
+
this.isInvalid = this.checkValidationState();
|
|
193
218
|
this.debounceChanged();
|
|
194
219
|
{
|
|
195
220
|
document.dispatchEvent(new CustomEvent('ionInputDidLoad', {
|
|
@@ -211,6 +236,11 @@ const Textarea = class {
|
|
|
211
236
|
this.notchController.destroy();
|
|
212
237
|
this.notchController = undefined;
|
|
213
238
|
}
|
|
239
|
+
// Clean up validation observer to prevent memory leaks
|
|
240
|
+
if (this.validationObserver) {
|
|
241
|
+
this.validationObserver.disconnect();
|
|
242
|
+
this.validationObserver = undefined;
|
|
243
|
+
}
|
|
214
244
|
}
|
|
215
245
|
componentWillLoad() {
|
|
216
246
|
this.inheritedAttributes = Object.assign(Object.assign({}, inheritAriaAttributes(this.el)), inheritAttributes(this.el, ['data-form-type', 'title', 'tabindex', 'dir']));
|
|
@@ -388,8 +418,8 @@ const Textarea = class {
|
|
|
388
418
|
];
|
|
389
419
|
}
|
|
390
420
|
getHintTextID() {
|
|
391
|
-
const {
|
|
392
|
-
if (
|
|
421
|
+
const { isInvalid, helperText, errorText, helperTextId, errorTextId } = this;
|
|
422
|
+
if (isInvalid && errorText) {
|
|
393
423
|
return errorTextId;
|
|
394
424
|
}
|
|
395
425
|
if (helperText) {
|
|
@@ -448,7 +478,7 @@ const Textarea = class {
|
|
|
448
478
|
* TODO(FW-5592): Remove hasStartEndSlots condition
|
|
449
479
|
*/
|
|
450
480
|
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
|
|
451
|
-
return (h(Host, { key: '
|
|
481
|
+
return (h(Host, { key: 'de258335fde7fa934cf3bd58c469525440457468', class: createColorClasses(this.color, {
|
|
452
482
|
[mode]: true,
|
|
453
483
|
'has-value': hasValue,
|
|
454
484
|
'has-focus': hasFocus,
|
|
@@ -457,7 +487,7 @@ const Textarea = class {
|
|
|
457
487
|
[`textarea-shape-${shape}`]: shape !== undefined,
|
|
458
488
|
[`textarea-label-placement-${labelPlacement}`]: true,
|
|
459
489
|
'textarea-disabled': disabled,
|
|
460
|
-
}) }, h("label", { key: '
|
|
490
|
+
}) }, h("label", { key: '79fc87122871d45316b1c5fd0a467bf85351e804', class: "textarea-wrapper", htmlFor: inputId, onClick: this.onLabelClick }, this.renderLabelContainer(), h("div", { key: '2375888a47557b41ea3b3bf8eae1fd3f2a4032bd', class: "textarea-wrapper-inner" }, h("div", { key: 'c5af683527a870bd85256b6de8a7d216283403dd', class: "start-slot-wrapper" }, h("slot", { key: 'd972e5784403c5cc6ed067ae578ce23ff8303e1e', name: "start" })), h("div", { key: '1092067609d912a76a8679767611e4ca3e071c6f', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: 'cd23a4bad4d5b460830340009d24d0618f14fd73', class: "native-textarea", ref: (el) => (this.nativeInput = el), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, minLength: this.minlength, maxLength: this.maxlength, name: this.name, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown, "aria-describedby": this.getHintTextID(), "aria-invalid": this.isInvalid ? 'true' : undefined }, this.inheritedAttributes), value)), h("div", { key: 'c91a5456f4490ef8699f2e44b4a6c64f6084f5fd', class: "end-slot-wrapper" }, h("slot", { key: 'b71ba7ba0d74091e81784432dcffa832b66f3f25', name: "end" }))), shouldRenderHighlight && h("div", { key: '757c3287e1cea5ee851227407685a437f8408c54', class: "textarea-highlight" })), this.renderBottomContent()));
|
|
461
491
|
}
|
|
462
492
|
get el() { return getElement(this); }
|
|
463
493
|
static get watchers() { return {
|
|
@@ -849,9 +849,9 @@ const Toast = class {
|
|
|
849
849
|
if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
|
|
850
850
|
printIonWarning('[ion-toast] - This toast is using start and end buttons with the stacked toast layout. We recommend following the best practice of using either start or end buttons with the stacked toast layout.', el);
|
|
851
851
|
}
|
|
852
|
-
return (h(Host, Object.assign({ key: '
|
|
852
|
+
return (h(Host, Object.assign({ key: 'd1ecd90c87700aad4685e230cdd430aa286b8791', tabindex: "-1" }, this.htmlAttributes, { style: {
|
|
853
853
|
zIndex: `${60000 + this.overlayIndex}`,
|
|
854
|
-
}, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '
|
|
854
|
+
}, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '4bfc863417324de69e222054d5cf9c452038b41e', class: wrapperClass }, h("div", { key: '3417940afec0392e81b7d54c7cb00f3ab6c30d47', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: '6bf878fbc85c01e1e5faa9d97d46255a6511a952', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '54b500348a9c37660c3aff37436d9188e4374947', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
|
|
855
855
|
}
|
|
856
856
|
get el() { return getElement(this); }
|
|
857
857
|
static get watchers() { return {
|
|
@@ -239,7 +239,7 @@ const Toggle = class {
|
|
|
239
239
|
const value = this.getValue();
|
|
240
240
|
const rtl = isRTL(el) ? 'rtl' : 'ltr';
|
|
241
241
|
renderHiddenInput(true, el, name, checked ? value : '', disabled);
|
|
242
|
-
return (h(Host, { key: '
|
|
242
|
+
return (h(Host, { key: '21037ea2e8326f58c84becadde475f007f931924', role: "switch", "aria-checked": `${checked}`, "aria-describedby": this.getHintTextID(), "aria-invalid": this.getHintTextID() === errorTextId, onClick: this.onClick, "aria-labelledby": hasLabel ? inputLabelId : null, "aria-label": inheritedAttributes['aria-label'] || null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? undefined : 0, onKeyDown: this.onKeyDown, class: createColorClasses(color, {
|
|
243
243
|
[mode]: true,
|
|
244
244
|
'in-item': hostContext('ion-item', el),
|
|
245
245
|
'toggle-activated': activated,
|
|
@@ -249,10 +249,10 @@ const Toggle = class {
|
|
|
249
249
|
[`toggle-alignment-${alignment}`]: alignment !== undefined,
|
|
250
250
|
[`toggle-label-placement-${labelPlacement}`]: true,
|
|
251
251
|
[`toggle-${rtl}`]: true,
|
|
252
|
-
}) }, h("label", { key: '
|
|
252
|
+
}) }, h("label", { key: '4d153679d118d01286f6633d1c19558a97745ff6', class: "toggle-wrapper", htmlFor: inputId }, h("input", Object.assign({ key: '0dfcd4df15b8d41bec5ff5f8912503afbb7bec53', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl), required: required }, inheritedAttributes)), h("div", { key: 'ffed3a07ba2ab70e5b232e6041bc3b6b34be8331', class: {
|
|
253
253
|
'label-text-wrapper': true,
|
|
254
254
|
'label-text-wrapper-hidden': !hasLabel,
|
|
255
|
-
}, part: "label", id: inputLabelId, onClick: this.onDivLabelClick }, h("slot", { key: '
|
|
255
|
+
}, part: "label", id: inputLabelId, onClick: this.onDivLabelClick }, h("slot", { key: 'd88e1e3dcdd8293f6b61f237cd7a0511dcbce300' }), this.renderHintText()), h("div", { key: '0e924225f5f0caf3c88738acb6c557bd8c1b68f6', class: "native-wrapper" }, this.renderToggleControl()))));
|
|
256
256
|
}
|
|
257
257
|
get el() { return getElement(this); }
|
|
258
258
|
static get watchers() { return {
|