@ionic/core 8.8.19-dev.11786730389.1a1927bf → 8.8.19-dev.11786832241.150538c7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/ion-action-sheet.js +1 -1
- package/components/ion-alert.js +1 -1
- package/components/ion-back-button.js +1 -1
- package/components/ion-button.js +1 -1
- package/components/ion-card.js +1 -1
- package/components/ion-chip.js +1 -1
- package/components/ion-datetime-button.js +1 -1
- package/components/ion-datetime.js +1 -1
- package/components/ion-fab-button.js +1 -1
- package/components/ion-infinite-scroll-content.js +1 -1
- package/components/ion-input-otp.js +1 -1
- package/components/ion-input-password-toggle.js +1 -1
- package/components/ion-input.js +1 -1
- package/components/ion-item-divider.js +1 -1
- package/components/ion-item-group.js +1 -1
- package/components/ion-item-option.js +1 -1
- package/components/ion-item-options.js +1 -1
- package/components/ion-item-sliding.js +1 -1
- package/components/ion-item.js +1 -1
- package/components/ion-label.js +1 -1
- package/components/ion-list-header.js +1 -1
- package/components/ion-list.js +1 -1
- package/components/ion-loading.js +1 -1
- package/components/ion-menu-button.js +1 -1
- package/components/ion-menu-toggle.js +1 -1
- package/components/ion-menu.js +1 -1
- package/components/ion-modal.js +1 -1
- package/components/ion-nav-link.js +1 -1
- package/components/ion-nav.js +1 -1
- package/components/ion-note.js +1 -1
- package/components/ion-picker-column-option.js +1 -1
- package/components/ion-popover.js +1 -1
- package/components/ion-progress-bar.js +1 -1
- package/components/ion-radio-group.js +1 -1
- package/components/ion-radio.js +1 -1
- package/components/ion-range.js +1 -1
- 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-ripple-effect.js +1 -1
- package/components/ion-router-link.js +1 -1
- package/components/ion-router-outlet.js +1 -1
- package/components/ion-row.js +1 -1
- package/components/ion-searchbar.js +1 -1
- package/components/ion-segment-button.js +1 -1
- package/components/ion-segment-content.js +1 -1
- package/components/ion-segment-view.js +1 -1
- package/components/ion-segment.js +1 -1
- package/components/ion-select-modal.js +1 -1
- package/components/ion-select-option.js +1 -1
- package/components/ion-select-popover.js +1 -1
- package/components/ion-select.js +1 -1
- package/components/ion-skeleton-text.js +1 -1
- package/components/ion-spinner.js +1 -1
- package/components/ion-split-pane.js +1 -1
- package/components/ion-tab-bar.js +1 -1
- package/components/ion-tab-button.js +1 -1
- package/components/ion-tab.js +1 -1
- package/components/ion-tabs.js +1 -1
- package/components/ion-text.js +1 -1
- package/components/ion-textarea.js +1 -1
- package/components/ion-thumbnail.js +1 -1
- package/components/ion-title.js +1 -1
- package/components/ion-toast.js +1 -1
- package/components/ion-toggle.js +1 -1
- package/components/ion-toolbar.js +1 -1
- package/components/{p-C1O9GEug.js → p--m5cCjbK.js} +1 -1
- package/components/{p-CfnGxjv-.js → p-B4uHHhPK.js} +1 -1
- package/components/{p-BxUIQcD9.js → p-BOvLNVKq.js} +1 -1
- package/components/{p-D_XD0pVT.js → p-BWBigMsI.js} +1 -1
- package/components/{p-xOjr4bwc.js → p-BZ4-QTes.js} +1 -1
- package/components/{p-tYCT3JGl.js → p-BjluhQMI.js} +1 -1
- package/components/{p-ClFYbgND.js → p-BlsIikdZ.js} +1 -1
- package/components/{p-Obm7si-x.js → p-Blug1Vxu.js} +1 -1
- package/components/{p-DTY4otpr.js → p-C91npEel.js} +1 -1
- package/components/{p-CVnwvOBD.js → p-CVb3x_r3.js} +1 -1
- package/components/{p-B6dUPQXq.js → p-CWLrHG8Y.js} +1 -1
- package/components/{p-0Pyit076.js → p-CfnNZz_d.js} +1 -1
- package/components/{p-DyePCNGr.js → p-DKrhJJV0.js} +1 -1
- package/components/p-DSzSbVP2.js +4 -0
- package/components/{p-BsVxQGUT.js → p-DgZOZQjJ.js} +1 -1
- package/components/{p-BO4sUqUv.js → p-Dmd2xqCe.js} +1 -1
- package/components/{p-83oP9gzn.js → p-GG5GhznE.js} +1 -1
- package/components/{p-Bc4wROfM.js → p-UQSiXX2Z.js} +1 -1
- package/components/{p-Dm7h4Nyv.js → p-qT1szVjw.js} +1 -1
- package/components/p-ypuYdSDB.js +4 -0
- package/dist/cjs/input.utils-BZdMWVrt.js +35 -0
- 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-input-otp.cjs.entry.js +3 -3
- package/dist/cjs/ion-input-password-toggle.cjs.entry.js +3 -3
- package/dist/cjs/ion-input.cjs.entry.js +42 -56
- package/dist/cjs/ion-item-option_3.cjs.entry.js +4 -4
- package/dist/cjs/ion-item_8.cjs.entry.js +12 -12
- 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 +41 -59
- 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 +44 -55
- package/dist/cjs/ion-toast.cjs.entry.js +2 -2
- package/dist/cjs/ion-toggle.cjs.entry.js +4 -4
- package/dist/cjs/slot-mutation-controller-CgTGFqlW.js +397 -0
- package/dist/collection/components/input/input.ios.css +56 -24
- package/dist/collection/components/input/input.js +36 -51
- package/dist/collection/components/input/input.md.css +78 -41
- package/dist/collection/components/input-otp/input-otp.js +3 -3
- package/dist/collection/components/input-password-toggle/input-password-toggle.js +3 -3
- 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/list.js +1 -1
- 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/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.ios.css +63 -69
- package/dist/collection/components/select/select.js +40 -55
- package/dist/collection/components/select/select.md.css +85 -85
- 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.ios.css +94 -62
- package/dist/collection/components/textarea/textarea.js +39 -51
- package/dist/collection/components/textarea/textarea.md.css +103 -77
- 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/collection/utils/forms/index.js +1 -0
- package/dist/collection/utils/forms/start-container-controller.js +132 -0
- package/dist/docs.json +22 -6
- package/dist/esm/input.utils-B1ValN_N.js +33 -0
- 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-input-otp.entry.js +3 -3
- package/dist/esm/ion-input-password-toggle.entry.js +3 -3
- package/dist/esm/ion-input.entry.js +40 -54
- package/dist/esm/ion-item-option_3.entry.js +4 -4
- package/dist/esm/ion-item_8.entry.js +12 -12
- 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 +40 -58
- 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 +43 -54
- package/dist/esm/ion-toast.entry.js +2 -2
- package/dist/esm/ion-toggle.entry.js +4 -4
- package/dist/esm/slot-mutation-controller-u741eD3Z.js +393 -0
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/{p-dbfd2d52.entry.js → p-06533d51.entry.js} +1 -1
- package/dist/ionic/{p-a641d428.entry.js → p-141f5b47.entry.js} +1 -1
- package/dist/ionic/p-14a5e8f5.entry.js +4 -0
- package/dist/ionic/{p-12589d59.entry.js → p-19269e04.entry.js} +1 -1
- package/dist/ionic/{p-efef6788.entry.js → p-19abbc33.entry.js} +1 -1
- package/dist/ionic/{p-5394e1d4.entry.js → p-4204184c.entry.js} +1 -1
- package/dist/ionic/p-4bc3ecdb.entry.js +4 -0
- package/dist/ionic/{p-21a7fb2a.entry.js → p-4eed9ca1.entry.js} +1 -1
- package/dist/ionic/p-5521dc1f.entry.js +4 -0
- package/dist/ionic/p-5c3626de.entry.js +4 -0
- package/dist/ionic/{p-374b10cb.entry.js → p-5d3b411c.entry.js} +1 -1
- package/dist/ionic/p-60576951.entry.js +4 -0
- package/dist/ionic/{p-1d2e53e8.entry.js → p-711a8319.entry.js} +1 -1
- package/dist/ionic/{p-48b6835f.entry.js → p-71419a55.entry.js} +1 -1
- package/dist/ionic/{p-ba8a598f.entry.js → p-79325ffe.entry.js} +1 -1
- package/dist/ionic/p-84a38904.entry.js +4 -0
- package/dist/ionic/{p-bf7c1f05.entry.js → p-8f204f1e.entry.js} +1 -1
- package/dist/ionic/p-9055e897.entry.js +4 -0
- package/dist/ionic/{p-6277efba.entry.js → p-9658e083.entry.js} +1 -1
- package/dist/ionic/{p-74f30659.entry.js → p-988baee1.entry.js} +1 -1
- package/dist/ionic/p-DAztxQR0.js +4 -0
- package/dist/ionic/p-DkUB-ROc.js +4 -0
- package/dist/ionic/{p-3835a020.entry.js → p-a71232d6.entry.js} +1 -1
- package/dist/ionic/{p-08f1ed1c.entry.js → p-a73d8742.entry.js} +1 -1
- package/dist/ionic/{p-8a21bdbd.entry.js → p-a8421d18.entry.js} +1 -1
- package/dist/ionic/{p-2ce59395.entry.js → p-a8c2c343.entry.js} +1 -1
- package/dist/ionic/{p-c3f65965.entry.js → p-bc2bad5f.entry.js} +1 -1
- package/dist/ionic/{p-f622796d.entry.js → p-be08d500.entry.js} +1 -1
- package/dist/ionic/p-be9a4f51.entry.js +4 -0
- package/dist/ionic/{p-33829e94.entry.js → p-ccc5044d.entry.js} +1 -1
- package/dist/ionic/{p-3c5fdd27.entry.js → p-ce32912b.entry.js} +1 -1
- package/dist/ionic/p-ded69ceb.entry.js +4 -0
- package/dist/ionic/{p-cec87704.entry.js → p-e0c6e31e.entry.js} +1 -1
- package/dist/ionic/{p-09b47b7d.entry.js → p-e8c3e08a.entry.js} +1 -1
- package/dist/ionic/{p-8f3a1995.entry.js → p-ed5d540d.entry.js} +1 -1
- package/dist/ionic/{p-6b286c5c.entry.js → p-f2802440.entry.js} +1 -1
- package/dist/ionic/{p-62e71297.entry.js → p-fe1bfbcf.entry.js} +1 -1
- package/dist/types/components/input/input.d.ts +11 -5
- package/dist/types/components/select/select.d.ts +12 -6
- package/dist/types/components/textarea/textarea.d.ts +12 -5
- package/dist/types/utils/forms/index.d.ts +1 -0
- package/dist/types/utils/forms/start-container-controller.d.ts +34 -0
- package/hydrate/index.js +350 -267
- package/hydrate/index.mjs +350 -267
- package/package.json +4 -4
- package/components/p-DIgGHN7D.js +0 -4
- package/components/p-MCJ7HjWe.js +0 -4
- package/dist/cjs/input.utils-CP4fzrqk.js +0 -149
- package/dist/cjs/notch-controller-BEUpEgb5.js +0 -155
- package/dist/esm/input.utils-J6HWocLA.js +0 -146
- package/dist/esm/notch-controller-CrUGyHYz.js +0 -153
- package/dist/ionic/p-0266b7e1.entry.js +0 -4
- package/dist/ionic/p-214e000a.entry.js +0 -4
- package/dist/ionic/p-91c6faf1.entry.js +0 -4
- package/dist/ionic/p-9b865fe6.entry.js +0 -4
- package/dist/ionic/p-BnMQxWON.js +0 -4
- package/dist/ionic/p-ac6ef997.entry.js +0 -4
- package/dist/ionic/p-b24dc0a1.entry.js +0 -4
- package/dist/ionic/p-c8fbe544.entry.js +0 -4
- package/dist/ionic/p-cb12f6c3.entry.js +0 -4
- package/dist/ionic/p-ede019ef.entry.js +0 -4
- package/dist/ionic/p-kJA95YWg.js +0 -4
package/hydrate/index.js
CHANGED
|
@@ -13228,6 +13228,148 @@ const createNotchController = (el, getNotchSpacerEl, getLabelSlot) => {
|
|
|
13228
13228
|
};
|
|
13229
13229
|
};
|
|
13230
13230
|
|
|
13231
|
+
/**
|
|
13232
|
+
* Returns `true` if the document or host element
|
|
13233
|
+
* has a `dir` set to `rtl`. The host value will always
|
|
13234
|
+
* take priority over the root document value.
|
|
13235
|
+
*/
|
|
13236
|
+
const isRTL$1 = (hostEl) => {
|
|
13237
|
+
if (hostEl) {
|
|
13238
|
+
if (hostEl.dir !== '') {
|
|
13239
|
+
return hostEl.dir.toLowerCase() === 'rtl';
|
|
13240
|
+
}
|
|
13241
|
+
}
|
|
13242
|
+
return document?.dir.toLowerCase() === 'rtl';
|
|
13243
|
+
};
|
|
13244
|
+
|
|
13245
|
+
/**
|
|
13246
|
+
* Applied to the host while the label is being repositioned. The
|
|
13247
|
+
* component stylesheets style this class, so it must stay in sync with
|
|
13248
|
+
* the `skip-label-transition` selector in those files. Renaming it here
|
|
13249
|
+
* requires renaming it there too.
|
|
13250
|
+
*/
|
|
13251
|
+
const SKIP_LABEL_TRANSITION_CLASS = 'skip-label-transition';
|
|
13252
|
+
/**
|
|
13253
|
+
* Set on the host as an inline style. The component stylesheets declare
|
|
13254
|
+
* this property and read it with `var()`, so it must stay in sync with
|
|
13255
|
+
* the `--internal-start-container-adjustment` references in those files.
|
|
13256
|
+
* Renaming it here requires renaming it there too.
|
|
13257
|
+
*/
|
|
13258
|
+
const START_CONTAINER_ADJUSTMENT_VAR = '--internal-start-container-adjustment';
|
|
13259
|
+
/**
|
|
13260
|
+
* A utility to measure and update the start container width adjustment
|
|
13261
|
+
* for form components (input, textarea, select) with `fill="outline"`.
|
|
13262
|
+
* This adjustment compensates for the start container width when
|
|
13263
|
+
* positioning floating/stacked labels within the outline border.
|
|
13264
|
+
*
|
|
13265
|
+
* Measurement is deferred with raf() to avoid forcing layout during
|
|
13266
|
+
* component updates, and a ResizeObserver watches for dynamic width
|
|
13267
|
+
* changes (e.g., when web fonts load or async content changes).
|
|
13268
|
+
*
|
|
13269
|
+
* @internal
|
|
13270
|
+
* @param el - The host element (ion-input, ion-textarea, or ion-select).
|
|
13271
|
+
* @param getStartContainer - A callback that returns the start container element.
|
|
13272
|
+
* @param shouldApplyAdjustment - A callback that determines whether the adjustment should be applied.
|
|
13273
|
+
*/
|
|
13274
|
+
const createStartContainerController = (el, getStartContainer, shouldApplyAdjustment) => {
|
|
13275
|
+
let resizeObserver;
|
|
13276
|
+
let observedContainer;
|
|
13277
|
+
let measurementRaf;
|
|
13278
|
+
let transitionRaf;
|
|
13279
|
+
let appliedAdjustment;
|
|
13280
|
+
const calculateAdjustment = () => {
|
|
13281
|
+
const startSlot = getStartContainer();
|
|
13282
|
+
if (!startSlot || !shouldApplyAdjustment()) {
|
|
13283
|
+
return '';
|
|
13284
|
+
}
|
|
13285
|
+
/*
|
|
13286
|
+
* Round to one decimal place so fractional widths produce a stable
|
|
13287
|
+
* label offset when the start container is added, removed, or resized.
|
|
13288
|
+
*/
|
|
13289
|
+
const startContainerWidth = startSlot.getBoundingClientRect().width;
|
|
13290
|
+
const roundedWidth = Math.round(startContainerWidth * 10) / 10;
|
|
13291
|
+
const sign = isRTL$1(el) ? '' : '-';
|
|
13292
|
+
return roundedWidth ? `${sign}${roundedWidth}px` : '0px';
|
|
13293
|
+
};
|
|
13294
|
+
const scheduleAdjustmentUpdate = () => {
|
|
13295
|
+
// Return if there is already a measurement queued to avoid a flicker
|
|
13296
|
+
if (measurementRaf !== undefined) {
|
|
13297
|
+
return;
|
|
13298
|
+
}
|
|
13299
|
+
/*
|
|
13300
|
+
* Defer the measurement until the next animation frame so layout
|
|
13301
|
+
* is measured after the current update has been applied.
|
|
13302
|
+
*/
|
|
13303
|
+
measurementRaf = raf(() => {
|
|
13304
|
+
measurementRaf = undefined;
|
|
13305
|
+
const adjustment = calculateAdjustment();
|
|
13306
|
+
// Only suppress the label transition when the label has to move
|
|
13307
|
+
if (adjustment !== appliedAdjustment) {
|
|
13308
|
+
// Discard a removal queued by an earlier change
|
|
13309
|
+
if (transitionRaf !== undefined) {
|
|
13310
|
+
cancelAnimationFrame(transitionRaf);
|
|
13311
|
+
}
|
|
13312
|
+
el.classList.add(SKIP_LABEL_TRANSITION_CLASS);
|
|
13313
|
+
el.style.setProperty(START_CONTAINER_ADJUSTMENT_VAR, adjustment);
|
|
13314
|
+
appliedAdjustment = adjustment;
|
|
13315
|
+
// Re-enable the transition once the new offset has been painted
|
|
13316
|
+
transitionRaf = raf(() => {
|
|
13317
|
+
transitionRaf = undefined;
|
|
13318
|
+
el.classList.remove(SKIP_LABEL_TRANSITION_CLASS);
|
|
13319
|
+
});
|
|
13320
|
+
}
|
|
13321
|
+
setupResizeObserver();
|
|
13322
|
+
});
|
|
13323
|
+
};
|
|
13324
|
+
const disconnectResizeObserver = () => {
|
|
13325
|
+
if (resizeObserver) {
|
|
13326
|
+
resizeObserver.disconnect();
|
|
13327
|
+
resizeObserver = undefined;
|
|
13328
|
+
observedContainer = undefined;
|
|
13329
|
+
}
|
|
13330
|
+
};
|
|
13331
|
+
const setupResizeObserver = () => {
|
|
13332
|
+
const startSlot = getStartContainer();
|
|
13333
|
+
// Stop watching once the adjustment no longer applies
|
|
13334
|
+
if (!startSlot || !shouldApplyAdjustment()) {
|
|
13335
|
+
disconnectResizeObserver();
|
|
13336
|
+
return;
|
|
13337
|
+
}
|
|
13338
|
+
// Return when prerendering or already watching this container
|
|
13339
|
+
if (typeof ResizeObserver !== 'function' || (resizeObserver && observedContainer === startSlot)) {
|
|
13340
|
+
return;
|
|
13341
|
+
}
|
|
13342
|
+
disconnectResizeObserver();
|
|
13343
|
+
resizeObserver = new ResizeObserver(() => {
|
|
13344
|
+
scheduleAdjustmentUpdate();
|
|
13345
|
+
});
|
|
13346
|
+
observedContainer = startSlot;
|
|
13347
|
+
resizeObserver.observe(startSlot);
|
|
13348
|
+
};
|
|
13349
|
+
const calculateStartContainerWidth = () => {
|
|
13350
|
+
scheduleAdjustmentUpdate();
|
|
13351
|
+
};
|
|
13352
|
+
const destroy = () => {
|
|
13353
|
+
disconnectResizeObserver();
|
|
13354
|
+
if (measurementRaf !== undefined) {
|
|
13355
|
+
cancelAnimationFrame(measurementRaf);
|
|
13356
|
+
measurementRaf = undefined;
|
|
13357
|
+
}
|
|
13358
|
+
// Tearing down mid-toggle would leave the transition disabled
|
|
13359
|
+
if (transitionRaf !== undefined) {
|
|
13360
|
+
cancelAnimationFrame(transitionRaf);
|
|
13361
|
+
transitionRaf = undefined;
|
|
13362
|
+
el.classList.remove(SKIP_LABEL_TRANSITION_CLASS);
|
|
13363
|
+
}
|
|
13364
|
+
// Re-apply from scratch if the element is connected again
|
|
13365
|
+
appliedAdjustment = undefined;
|
|
13366
|
+
};
|
|
13367
|
+
return {
|
|
13368
|
+
calculateStartContainerWidth,
|
|
13369
|
+
destroy,
|
|
13370
|
+
};
|
|
13371
|
+
};
|
|
13372
|
+
|
|
13231
13373
|
/**
|
|
13232
13374
|
* Uses the compareWith param to compare two values to determine if they are equal.
|
|
13233
13375
|
*
|
|
@@ -13904,20 +14046,6 @@ class Col {
|
|
|
13904
14046
|
}; }
|
|
13905
14047
|
}
|
|
13906
14048
|
|
|
13907
|
-
/**
|
|
13908
|
-
* Returns `true` if the document or host element
|
|
13909
|
-
* has a `dir` set to `rtl`. The host value will always
|
|
13910
|
-
* take priority over the root document value.
|
|
13911
|
-
*/
|
|
13912
|
-
const isRTL$1 = (hostEl) => {
|
|
13913
|
-
if (hostEl) {
|
|
13914
|
-
if (hostEl.dir !== '') {
|
|
13915
|
-
return hostEl.dir.toLowerCase() === 'rtl';
|
|
13916
|
-
}
|
|
13917
|
-
}
|
|
13918
|
-
return document?.dir.toLowerCase() === 'rtl';
|
|
13919
|
-
};
|
|
13920
|
-
|
|
13921
14049
|
const contentCss = () => `:host{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000);--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}:host(.ion-color) .inner-scroll{background:var(--ion-color-base);color:var(--ion-color-contrast)}#background-content{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom) + var(--internal-content-safe-area-padding-bottom, 0px));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-ms-touch-action:pan-x pan-y pinch-zoom;touch-action:pan-x pan-y pinch-zoom}.scroll-y,.scroll-x{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}.scroll-y{overflow-y:var(--overflow);overscroll-behavior-y:contain}.scroll-x{overflow-x:var(--overflow);overscroll-behavior-x:contain}.overscroll::before,.overscroll::after{position:absolute;width:1px;height:1px;content:""}.overscroll::before{bottom:-1px}.overscroll::after{top:-1px}:host(.content-sizing){display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:0;contain:none}:host(.content-sizing) .inner-scroll{position:relative;top:0;bottom:0;margin-top:calc(var(--offset-top) * -1);margin-bottom:calc(var(--offset-bottom) * -1)}.transition-effect{display:none;position:absolute;width:100%;height:100vh;opacity:0;pointer-events:none}:host(.content-ltr) .transition-effect{left:-100%;}:host(.content-rtl) .transition-effect{right:-100%;}.transition-cover{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}.transition-shadow{display:block;position:absolute;width:100%;height:100%;-webkit-box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03);box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03)}:host(.content-ltr) .transition-shadow{right:0;}:host(.content-rtl) .transition-shadow{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}::slotted([slot=fixed]){position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}`;
|
|
13922
14050
|
|
|
13923
14051
|
/**
|
|
@@ -21033,9 +21161,9 @@ const defaultCounterFormatter = (length, maxlength) => {
|
|
|
21033
21161
|
return `${length} / ${maxlength}`;
|
|
21034
21162
|
};
|
|
21035
21163
|
|
|
21036
|
-
const inputIosCss = () => `.sc-ion-input-ios-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--background:transparent;--color:initial;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;padding:0 !important;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item[slot=start].sc-ion-input-ios-h,ion-item [slot=start].sc-ion-input-ios-h,ion-item[slot=end].sc-ion-input-ios-h,ion-item [slot=end].sc-ion-input-ios-h{width:auto}.ion-color.sc-ion-input-ios-h{--highlight-color-focused:var(--ion-color-base)}.input-label-placement-floating.sc-ion-input-ios-h,.input-label-placement-stacked.sc-ion-input-ios-h{min-height:56px}.native-input.sc-ion-input-ios{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;height:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:1}.native-input.sc-ion-input-ios::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-ios:invalid{-webkit-box-shadow:none;box-shadow:none}.native-input.sc-ion-input-ios::-ms-clear{display:none}.cloned-input.sc-ion-input-ios{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-input-ios:disabled{opacity:1}.input-clear-icon.sc-ion-input-ios{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:auto;margin-bottom:auto;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:30px;height:30px;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;color:var(--ion-color-step-600, var(--ion-text-color-step-400, #666666));visibility:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.in-item-color.sc-ion-input-ios-h .input-clear-icon.sc-ion-input-ios{color:inherit}.input-clear-icon.sc-ion-input-ios:focus{opacity:0.5}.has-value.sc-ion-input-ios-h .input-clear-icon.sc-ion-input-ios{visibility:visible}.input-wrapper.sc-ion-input-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:stretch;align-items:stretch;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.native-wrapper.sc-ion-input-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;width:100%}.ion-touched.ion-invalid.sc-ion-input-ios-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-input-ios-h{--highlight-color:var(--highlight-color-valid)}.input-bottom.sc-ion-input-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-input-ios-h,.ion-touched.ion-invalid.sc-ion-input-ios-h{--border-color:var(--highlight-color)}.input-bottom.sc-ion-input-ios .error-text.sc-ion-input-ios{display:none;color:var(--highlight-color-invalid)}.input-bottom.sc-ion-input-ios .helper-text.sc-ion-input-ios{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-input-ios-h .input-bottom.sc-ion-input-ios .error-text.sc-ion-input-ios{display:block}.ion-touched.ion-invalid.sc-ion-input-ios-h .input-bottom.sc-ion-input-ios .helper-text.sc-ion-input-ios{display:none}.input-bottom.sc-ion-input-ios .counter.sc-ion-input-ios{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.has-focus.sc-ion-input-ios-h input.sc-ion-input-ios{caret-color:var(--highlight-color)}.label-text-wrapper.sc-ion-input-ios{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.label-text.sc-ion-input-ios,.sc-ion-input-ios-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-input-ios,.input-outline-notch-hidden.sc-ion-input-ios{display:none}.input-wrapper.sc-ion-input-ios input.sc-ion-input-ios{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.input-label-placement-start.sc-ion-input-ios-h .input-wrapper.sc-ion-input-ios{-ms-flex-direction:row;flex-direction:row}.input-label-placement-start.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-end.sc-ion-input-ios-h .input-wrapper.sc-ion-input-ios{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.input-label-placement-end.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-ios-h .label-text.sc-ion-input-ios{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.input-label-placement-stacked.sc-ion-input-ios-h .input-wrapper.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h .input-wrapper.sc-ion-input-ios{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform-origin:left top;transform-origin:left top;max-width:100%;z-index:2}[dir=rtl].sc-ion-input-ios-h -no-combinator.input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .sc-ion-input-ios-h -no-combinator.input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl].input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl].sc-ion-input-ios-h -no-combinator.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .sc-ion-input-ios-h -no-combinator.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl].input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.input-label-placement-stacked.sc-ion-input-ios-h:dir(rtl) .label-text-wrapper.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h:dir(rtl) .label-text-wrapper.sc-ion-input-ios{-webkit-transform-origin:right top;transform-origin:right top}}.input-label-placement-stacked.sc-ion-input-ios-h input.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios{margin-left:0;margin-right:0;margin-top:1px;margin-bottom:0}.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios{opacity:0}.has-focus.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios,.has-value.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios{opacity:1}.label-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.sc-ion-input-ios-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-input-ios-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.sc-ion-input-ios-h[disabled].sc-ion-input-ios-s>ion-input-password-toggle,.sc-ion-input-ios-h[disabled] .sc-ion-input-ios-s>ion-input-password-toggle,.sc-ion-input-ios-h[readonly].sc-ion-input-ios-s>ion-input-password-toggle,.sc-ion-input-ios-h[readonly] .sc-ion-input-ios-s>ion-input-password-toggle{visibility:hidden}.sc-ion-input-ios-h{--border-width:0.55px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--highlight-height:0px;font-size:inherit}.input-clear-icon.sc-ion-input-ios ion-icon.sc-ion-input-ios{font-size:18px}.input-disabled.sc-ion-input-ios-h{opacity:0.3}.sc-ion-input-ios-s>ion-button[slot=start].button-has-icon-only,.sc-ion-input-ios-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;aspect-ratio:1}`;
|
|
21164
|
+
const inputIosCss = () => `.sc-ion-input-ios-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--background:transparent;--color:initial;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;padding:0 !important;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item[slot=start].sc-ion-input-ios-h,ion-item [slot=start].sc-ion-input-ios-h,ion-item[slot=end].sc-ion-input-ios-h,ion-item [slot=end].sc-ion-input-ios-h{width:auto}.ion-color.sc-ion-input-ios-h{--highlight-color-focused:var(--ion-color-base)}.input-label-placement-floating.sc-ion-input-ios-h,.input-label-placement-stacked.sc-ion-input-ios-h{min-height:56px}.native-input.sc-ion-input-ios{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;height:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:1}.native-input.sc-ion-input-ios::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-ios:invalid{-webkit-box-shadow:none;box-shadow:none}.native-input.sc-ion-input-ios::-ms-clear{display:none}.cloned-input.sc-ion-input-ios{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-input-ios:disabled{opacity:1}.input-clear-icon.sc-ion-input-ios{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:30px;height:30px;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;color:var(--ion-color-step-600, var(--ion-text-color-step-400, #666666));visibility:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.in-item-color.sc-ion-input-ios-h .input-clear-icon.sc-ion-input-ios{color:inherit}.input-clear-icon.sc-ion-input-ios:focus{opacity:0.5}.has-value.sc-ion-input-ios-h .input-clear-icon.sc-ion-input-ios{visibility:visible}.input-wrapper.sc-ion-input-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:stretch;align-items:stretch;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.input-control.sc-ion-input-ios{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;width:100%;min-width:0}.native-wrapper.sc-ion-input-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;width:100%}.input-label-placement-start.sc-ion-input-ios-h .native-wrapper.sc-ion-input-ios,.input-label-placement-end.sc-ion-input-ios-h .native-wrapper.sc-ion-input-ios,.input-label-placement-fixed.sc-ion-input-ios-h .native-wrapper.sc-ion-input-ios{-ms-flex:1 1 0px;flex:1 1 0}.input-start.sc-ion-input-ios,.input-end.sc-ion-input-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center}.ion-touched.ion-invalid.sc-ion-input-ios-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-input-ios-h{--highlight-color:var(--highlight-color-valid)}.input-bottom.sc-ion-input-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-input-ios-h,.ion-touched.ion-invalid.sc-ion-input-ios-h{--border-color:var(--highlight-color)}.input-bottom.sc-ion-input-ios .error-text.sc-ion-input-ios{display:none;color:var(--highlight-color-invalid)}.input-bottom.sc-ion-input-ios .helper-text.sc-ion-input-ios{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-input-ios-h .input-bottom.sc-ion-input-ios .error-text.sc-ion-input-ios{display:block}.ion-touched.ion-invalid.sc-ion-input-ios-h .input-bottom.sc-ion-input-ios .helper-text.sc-ion-input-ios{display:none}.input-bottom.sc-ion-input-ios .counter.sc-ion-input-ios{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.has-focus.sc-ion-input-ios-h input.sc-ion-input-ios{caret-color:var(--highlight-color)}.label-text-wrapper.sc-ion-input-ios{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-width:0;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.skip-label-transition.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transition:none;transition:none}.label-text.sc-ion-input-ios,.sc-ion-input-ios-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-input-ios,.input-outline-notch-hidden.sc-ion-input-ios{display:none}.input-wrapper.sc-ion-input-ios input.sc-ion-input-ios{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.input-label-placement-start.sc-ion-input-ios-h .input-control.sc-ion-input-ios{-ms-flex-direction:row;flex-direction:row}.input-label-placement-start.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-end.sc-ion-input-ios-h .input-control.sc-ion-input-ios{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.input-label-placement-end.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-ios-h .label-text.sc-ion-input-ios{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.input-label-placement-stacked.sc-ion-input-ios-h .input-control.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h .input-control.sc-ion-input-ios{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform-origin:left top;transform-origin:left top;max-width:100%;z-index:2}[dir=rtl].sc-ion-input-ios-h -no-combinator.input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .sc-ion-input-ios-h -no-combinator.input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl].input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .input-label-placement-stacked.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl].sc-ion-input-ios-h -no-combinator.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .sc-ion-input-ios-h -no-combinator.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl].input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios,[dir=rtl] .input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.input-label-placement-stacked.sc-ion-input-ios-h:dir(rtl) .label-text-wrapper.sc-ion-input-ios,.input-label-placement-floating.sc-ion-input-ios-h:dir(rtl) .label-text-wrapper.sc-ion-input-ios{-webkit-transform-origin:right top;transform-origin:right top}}.input-label-placement-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios{opacity:0}.has-focus.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios,.has-value.input-label-placement-floating.sc-ion-input-ios-h input.sc-ion-input-ios{opacity:1}.label-floating.sc-ion-input-ios-h .label-text-wrapper.sc-ion-input-ios{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.sc-ion-input-ios-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-input-ios-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.sc-ion-input-ios-h[disabled].sc-ion-input-ios-s>ion-input-password-toggle,.sc-ion-input-ios-h[disabled] .sc-ion-input-ios-s>ion-input-password-toggle,.sc-ion-input-ios-h[readonly].sc-ion-input-ios-s>ion-input-password-toggle,.sc-ion-input-ios-h[readonly] .sc-ion-input-ios-s>ion-input-password-toggle{visibility:hidden}.sc-ion-input-ios-h{--border-width:0.55px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--highlight-height:0px;font-size:inherit}.input-clear-icon.sc-ion-input-ios ion-icon.sc-ion-input-ios{font-size:18px}.input-disabled.sc-ion-input-ios-h{opacity:0.3}.sc-ion-input-ios-s>ion-button[slot=start].button-has-icon-only,.sc-ion-input-ios-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;aspect-ratio:1}`;
|
|
21037
21165
|
|
|
21038
|
-
const inputMdCss = () => `.sc-ion-input-md-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--background:transparent;--color:initial;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;padding:0 !important;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item[slot=start].sc-ion-input-md-h,ion-item [slot=start].sc-ion-input-md-h,ion-item[slot=end].sc-ion-input-md-h,ion-item [slot=end].sc-ion-input-md-h{width:auto}.ion-color.sc-ion-input-md-h{--highlight-color-focused:var(--ion-color-base)}.input-label-placement-floating.sc-ion-input-md-h,.input-label-placement-stacked.sc-ion-input-md-h{min-height:56px}.native-input.sc-ion-input-md{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;height:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:1}.native-input.sc-ion-input-md::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-md:invalid{-webkit-box-shadow:none;box-shadow:none}.native-input.sc-ion-input-md::-ms-clear{display:none}.cloned-input.sc-ion-input-md{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-input-md:disabled{opacity:1}.input-clear-icon.sc-ion-input-md{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:auto;margin-bottom:auto;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:30px;height:30px;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;color:var(--ion-color-step-600, var(--ion-text-color-step-400, #666666));visibility:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.in-item-color.sc-ion-input-md-h .input-clear-icon.sc-ion-input-md{color:inherit}.input-clear-icon.sc-ion-input-md:focus{opacity:0.5}.has-value.sc-ion-input-md-h .input-clear-icon.sc-ion-input-md{visibility:visible}.input-wrapper.sc-ion-input-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:stretch;align-items:stretch;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.native-wrapper.sc-ion-input-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;width:100%}.ion-touched.ion-invalid.sc-ion-input-md-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-input-md-h{--highlight-color:var(--highlight-color-valid)}.input-bottom.sc-ion-input-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-input-md-h,.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}.input-bottom.sc-ion-input-md .error-text.sc-ion-input-md{display:none;color:var(--highlight-color-invalid)}.input-bottom.sc-ion-input-md .helper-text.sc-ion-input-md{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-input-md-h .input-bottom.sc-ion-input-md .error-text.sc-ion-input-md{display:block}.ion-touched.ion-invalid.sc-ion-input-md-h .input-bottom.sc-ion-input-md .helper-text.sc-ion-input-md{display:none}.input-bottom.sc-ion-input-md .counter.sc-ion-input-md{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.has-focus.sc-ion-input-md-h input.sc-ion-input-md{caret-color:var(--highlight-color)}.label-text-wrapper.sc-ion-input-md{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.label-text.sc-ion-input-md,.sc-ion-input-md-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-input-md,.input-outline-notch-hidden.sc-ion-input-md{display:none}.input-wrapper.sc-ion-input-md input.sc-ion-input-md{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.input-label-placement-start.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{-ms-flex-direction:row;flex-direction:row}.input-label-placement-start.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-end.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.input-label-placement-end.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-md-h .label-text.sc-ion-input-md{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.input-label-placement-stacked.sc-ion-input-md-h .input-wrapper.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:left top;transform-origin:left top;max-width:100%;z-index:2}[dir=rtl].sc-ion-input-md-h -no-combinator.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].sc-ion-input-md-h -no-combinator.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.input-label-placement-stacked.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}}.input-label-placement-stacked.sc-ion-input-md-h input.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md{margin-left:0;margin-right:0;margin-top:1px;margin-bottom:0}.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md{opacity:0}.has-focus.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md,.has-value.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md{opacity:1}.label-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.sc-ion-input-md-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-input-md-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.sc-ion-input-md-h[disabled].sc-ion-input-md-s>ion-input-password-toggle,.sc-ion-input-md-h[disabled] .sc-ion-input-md-s>ion-input-password-toggle,.sc-ion-input-md-h[readonly].sc-ion-input-md-s>ion-input-password-toggle,.sc-ion-input-md-h[readonly] .sc-ion-input-md-s>ion-input-password-toggle{visibility:hidden}.input-fill-solid.sc-ion-input-md-h{--background:var(--ion-color-step-50, var(--ion-background-color-step-50, #f2f2f2));--border-color:var(--ion-color-step-500, var(--ion-background-color-step-500, gray));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}.input-fill-solid.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{border-bottom:var(--border-width) var(--border-style) var(--border-color)}.has-focus.input-fill-solid.ion-valid.sc-ion-input-md-h,.input-fill-solid.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}.input-fill-solid.sc-ion-input-md-h .input-bottom.sc-ion-input-md{border-top:none}@media (any-hover: hover){.input-fill-solid.sc-ion-input-md-h:hover{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.input-fill-solid.has-focus.sc-ion-input-md-h{--background:var(--ion-color-step-150, var(--ion-background-color-step-150, #d9d9d9));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}.input-fill-solid.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0px;border-end-start-radius:0px}.label-floating.input-fill-solid.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{max-width:calc(100% / 0.75)}.input-fill-outline.sc-ion-input-md-h{--border-color:var(--ion-color-step-300, var(--ion-background-color-step-300, #b3b3b3));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}.input-fill-outline.input-shape-round.sc-ion-input-md-h{--border-radius:28px;--padding-start:32px;--padding-end:32px}.has-focus.input-fill-outline.ion-valid.sc-ion-input-md-h,.input-fill-outline.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}@media (any-hover: hover){.input-fill-outline.sc-ion-input-md-h:hover{--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.input-fill-outline.has-focus.sc-ion-input-md-h{--border-width:var(--highlight-height);--border-color:var(--highlight-color)}.input-fill-outline.sc-ion-input-md-h .input-bottom.sc-ion-input-md{border-top:none}.input-fill-outline.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{border-bottom:none}.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:left top;transform-origin:left top;position:absolute;max-width:calc(100% - var(--padding-start) - var(--padding-end))}[dir=rtl].sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md,.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}}.input-fill-outline.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{position:relative}.label-floating.input-fill-outline.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform:translateY(-32%) scale(0.75);transform:translateY(-32%) scale(0.75);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;max-width:calc((100% - var(--padding-start) - var(--padding-end) - 8px) / 0.75)}.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h input.sc-ion-input-md,.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md{margin-left:0;margin-right:0;margin-top:6px;margin-bottom:6px}.input-fill-outline.sc-ion-input-md-h .input-outline-container.sc-ion-input-md{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;width:100%;height:100%}.input-fill-outline.sc-ion-input-md-h .input-outline-start.sc-ion-input-md,.input-fill-outline.sc-ion-input-md-h .input-outline-end.sc-ion-input-md{pointer-events:none}.input-fill-outline.sc-ion-input-md-h .input-outline-start.sc-ion-input-md,.input-fill-outline.sc-ion-input-md-h .input-outline-notch.sc-ion-input-md,.input-fill-outline.sc-ion-input-md-h .input-outline-end.sc-ion-input-md{border-top:var(--border-width) var(--border-style) var(--border-color);border-bottom:var(--border-width) var(--border-style) var(--border-color)}.input-fill-outline.sc-ion-input-md-h .input-outline-notch.sc-ion-input-md{max-width:calc(100% - var(--padding-start) - var(--padding-end))}.input-fill-outline.sc-ion-input-md-h .notch-spacer.sc-ion-input-md{-webkit-padding-end:8px;padding-inline-end:8px;font-size:calc(1em * 0.75);opacity:0;pointer-events:none;-webkit-box-sizing:content-box;box-sizing:content-box}.input-fill-outline.sc-ion-input-md-h .input-outline-start.sc-ion-input-md{border-start-start-radius:var(--border-radius);border-start-end-radius:0px;border-end-end-radius:0px;border-end-start-radius:var(--border-radius);-webkit-border-start:var(--border-width) var(--border-style) var(--border-color);border-inline-start:var(--border-width) var(--border-style) var(--border-color);width:calc(var(--padding-start) - 4px)}.input-fill-outline.sc-ion-input-md-h .input-outline-end.sc-ion-input-md{-webkit-border-end:var(--border-width) var(--border-style) var(--border-color);border-inline-end:var(--border-width) var(--border-style) var(--border-color);border-start-start-radius:0px;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);border-end-start-radius:0px;-ms-flex-positive:1;flex-grow:1}.label-floating.input-fill-outline.sc-ion-input-md-h .input-outline-notch.sc-ion-input-md{border-top:none}.sc-ion-input-md-h{--border-width:1px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.13)))));--highlight-height:2px;font-size:inherit}.input-clear-icon.sc-ion-input-md ion-icon.sc-ion-input-md{font-size:22px}.input-disabled.sc-ion-input-md-h{opacity:0.38}.has-focus.ion-valid.sc-ion-input-md-h,.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}.input-bottom.sc-ion-input-md .counter.sc-ion-input-md{letter-spacing:0.0333333333em}.input-label-placement-floating.has-focus.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-stacked.has-focus.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{color:var(--highlight-color)}.has-focus.input-label-placement-floating.ion-valid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-floating.ion-touched.ion-invalid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.has-focus.input-label-placement-stacked.ion-valid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-stacked.ion-touched.ion-invalid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{color:var(--highlight-color)}.input-highlight.sc-ion-input-md{bottom:-1px;position:absolute;width:100%;height:var(--highlight-height);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform 200ms;transition:-webkit-transform 200ms;transition:transform 200ms;transition:transform 200ms, -webkit-transform 200ms;background:var(--highlight-color)}.input-highlight.sc-ion-input-md{inset-inline-start:0}.has-focus.sc-ion-input-md-h .input-highlight.sc-ion-input-md{-webkit-transform:scale(1);transform:scale(1)}.in-item.sc-ion-input-md-h .input-highlight.sc-ion-input-md{bottom:0}.in-item.sc-ion-input-md-h .input-highlight.sc-ion-input-md{inset-inline-start:0}.input-shape-round.sc-ion-input-md-h{--border-radius:16px}.sc-ion-input-md-s>ion-button[slot=start].button-has-icon-only,.sc-ion-input-md-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:8px;--padding-end:8px;--padding-top:8px;--padding-bottom:8px;aspect-ratio:1;min-height:40px}`;
|
|
21166
|
+
const inputMdCss = () => `.sc-ion-input-md-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--background:transparent;--color:initial;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;padding:0 !important;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item[slot=start].sc-ion-input-md-h,ion-item [slot=start].sc-ion-input-md-h,ion-item[slot=end].sc-ion-input-md-h,ion-item [slot=end].sc-ion-input-md-h{width:auto}.ion-color.sc-ion-input-md-h{--highlight-color-focused:var(--ion-color-base)}.input-label-placement-floating.sc-ion-input-md-h,.input-label-placement-stacked.sc-ion-input-md-h{min-height:56px}.native-input.sc-ion-input-md{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;height:100%;max-height:100%;border:0;outline:none;background:transparent;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:1}.native-input.sc-ion-input-md::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-md:invalid{-webkit-box-shadow:none;box-shadow:none}.native-input.sc-ion-input-md::-ms-clear{display:none}.cloned-input.sc-ion-input-md{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-input-md:disabled{opacity:1}.input-clear-icon.sc-ion-input-md{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:30px;height:30px;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;color:var(--ion-color-step-600, var(--ion-text-color-step-400, #666666));visibility:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.in-item-color.sc-ion-input-md-h .input-clear-icon.sc-ion-input-md{color:inherit}.input-clear-icon.sc-ion-input-md:focus{opacity:0.5}.has-value.sc-ion-input-md-h .input-clear-icon.sc-ion-input-md{visibility:visible}.input-wrapper.sc-ion-input-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:stretch;align-items:stretch;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.input-control.sc-ion-input-md{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;width:100%;min-width:0}.native-wrapper.sc-ion-input-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;width:100%}.input-label-placement-start.sc-ion-input-md-h .native-wrapper.sc-ion-input-md,.input-label-placement-end.sc-ion-input-md-h .native-wrapper.sc-ion-input-md,.input-label-placement-fixed.sc-ion-input-md-h .native-wrapper.sc-ion-input-md{-ms-flex:1 1 0px;flex:1 1 0}.input-start.sc-ion-input-md,.input-end.sc-ion-input-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center}.ion-touched.ion-invalid.sc-ion-input-md-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-input-md-h{--highlight-color:var(--highlight-color-valid)}.input-bottom.sc-ion-input-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-input-md-h,.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}.input-bottom.sc-ion-input-md .error-text.sc-ion-input-md{display:none;color:var(--highlight-color-invalid)}.input-bottom.sc-ion-input-md .helper-text.sc-ion-input-md{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-input-md-h .input-bottom.sc-ion-input-md .error-text.sc-ion-input-md{display:block}.ion-touched.ion-invalid.sc-ion-input-md-h .input-bottom.sc-ion-input-md .helper-text.sc-ion-input-md{display:none}.input-bottom.sc-ion-input-md .counter.sc-ion-input-md{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.has-focus.sc-ion-input-md-h input.sc-ion-input-md{caret-color:var(--highlight-color)}.label-text-wrapper.sc-ion-input-md{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-width:0;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.skip-label-transition.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transition:none;transition:none}.label-text.sc-ion-input-md,.sc-ion-input-md-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-input-md,.input-outline-notch-hidden.sc-ion-input-md{display:none}.input-wrapper.sc-ion-input-md input.sc-ion-input-md{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.input-label-placement-start.sc-ion-input-md-h .input-control.sc-ion-input-md{-ms-flex-direction:row;flex-direction:row}.input-label-placement-start.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-end.sc-ion-input-md-h .input-control.sc-ion-input-md{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.input-label-placement-end.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.input-label-placement-fixed.sc-ion-input-md-h .label-text.sc-ion-input-md{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.input-label-placement-stacked.sc-ion-input-md-h .input-control.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h .input-control.sc-ion-input-md{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:left top;transform-origin:left top;max-width:100%;z-index:2}[dir=rtl].sc-ion-input-md-h -no-combinator.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].sc-ion-input-md-h -no-combinator.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.input-label-placement-stacked.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md,.input-label-placement-floating.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}}.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md{opacity:0}.has-focus.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md,.has-value.input-label-placement-floating.sc-ion-input-md-h input.sc-ion-input-md{opacity:1}.label-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.sc-ion-input-md-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-input-md-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.sc-ion-input-md-h[disabled].sc-ion-input-md-s>ion-input-password-toggle,.sc-ion-input-md-h[disabled] .sc-ion-input-md-s>ion-input-password-toggle,.sc-ion-input-md-h[readonly].sc-ion-input-md-s>ion-input-password-toggle,.sc-ion-input-md-h[readonly] .sc-ion-input-md-s>ion-input-password-toggle{visibility:hidden}.input-fill-solid.sc-ion-input-md-h{--background:var(--ion-color-step-50, var(--ion-background-color-step-50, #f2f2f2));--border-color:var(--ion-color-step-500, var(--ion-background-color-step-500, gray));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}.input-fill-solid.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{border-bottom:var(--border-width) var(--border-style) var(--border-color)}.has-focus.input-fill-solid.ion-valid.sc-ion-input-md-h,.input-fill-solid.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}.input-fill-solid.sc-ion-input-md-h .input-bottom.sc-ion-input-md{border-top:none}@media (any-hover: hover){.input-fill-solid.sc-ion-input-md-h:hover{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.input-fill-solid.has-focus.sc-ion-input-md-h{--background:var(--ion-color-step-150, var(--ion-background-color-step-150, #d9d9d9));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}.input-fill-solid.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0px;border-end-start-radius:0px}.label-floating.input-fill-solid.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{max-width:calc(100% / 0.75)}.input-fill-outline.sc-ion-input-md-h{--border-color:var(--ion-color-step-300, var(--ion-background-color-step-300, #b3b3b3));--border-radius:4px;--padding-start:16px;--padding-end:16px;--internal-start-container-adjustment:0px;min-height:56px}.input-fill-outline.input-shape-round.sc-ion-input-md-h{--border-radius:28px;--padding-start:32px;--padding-end:32px}.has-focus.input-fill-outline.ion-valid.sc-ion-input-md-h,.input-fill-outline.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}@media (any-hover: hover){.input-fill-outline.sc-ion-input-md-h:hover{--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.input-fill-outline.has-focus.sc-ion-input-md-h{--border-width:var(--highlight-height);--border-color:var(--highlight-color)}.input-fill-outline.sc-ion-input-md-h .input-bottom.sc-ion-input-md{border-top:none}.input-fill-outline.sc-ion-input-md-h .input-wrapper.sc-ion-input-md{border-bottom:none}.input-fill-outline.sc-ion-input-md-h:not(.label-floating) .input-control.sc-ion-input-md{position:relative}.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:left top;transform-origin:left top;position:absolute;max-width:100%}[dir=rtl].sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h -no-combinator.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl].input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,[dir=rtl] .input-fill-outline.input-label-placement-floating.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.input-fill-outline.input-label-placement-stacked.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md,.input-fill-outline.input-label-placement-floating.sc-ion-input-md-h:dir(rtl) .label-text-wrapper.sc-ion-input-md{-webkit-transform-origin:right top;transform-origin:right top}}.input-fill-outline.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{position:relative}.label-floating.input-fill-outline.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{-webkit-transform:translate(var(--internal-start-container-adjustment, 0px), -32%) scale(0.75);transform:translate(var(--internal-start-container-adjustment, 0px), -32%) scale(0.75);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;max-width:calc((100% - var(--padding-start) - var(--padding-end) - 8px) / 0.75)}.input-fill-outline.sc-ion-input-md-h .input-outline-container.sc-ion-input-md{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;width:100%;height:100%}.input-fill-outline.sc-ion-input-md-h .input-outline-start.sc-ion-input-md,.input-fill-outline.sc-ion-input-md-h .input-outline-end.sc-ion-input-md{pointer-events:none}.input-fill-outline.sc-ion-input-md-h .input-outline-start.sc-ion-input-md,.input-fill-outline.sc-ion-input-md-h .input-outline-notch.sc-ion-input-md,.input-fill-outline.sc-ion-input-md-h .input-outline-end.sc-ion-input-md{border-top:var(--border-width) var(--border-style) var(--border-color);border-bottom:var(--border-width) var(--border-style) var(--border-color)}.input-fill-outline.sc-ion-input-md-h .input-outline-notch.sc-ion-input-md{max-width:calc(100% - var(--padding-start) - var(--padding-end))}.input-fill-outline.sc-ion-input-md-h .notch-spacer.sc-ion-input-md{-webkit-padding-end:8px;padding-inline-end:8px;font-size:calc(1em * 0.75);opacity:0;pointer-events:none;-webkit-box-sizing:content-box;box-sizing:content-box}.input-fill-outline.sc-ion-input-md-h .input-outline-start.sc-ion-input-md{border-start-start-radius:var(--border-radius);border-start-end-radius:0px;border-end-end-radius:0px;border-end-start-radius:var(--border-radius);-webkit-border-start:var(--border-width) var(--border-style) var(--border-color);border-inline-start:var(--border-width) var(--border-style) var(--border-color);width:calc(var(--padding-start) - 4px)}.input-fill-outline.sc-ion-input-md-h .input-outline-end.sc-ion-input-md{-webkit-border-end:var(--border-width) var(--border-style) var(--border-color);border-inline-end:var(--border-width) var(--border-style) var(--border-color);border-start-start-radius:0px;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);border-end-start-radius:0px;-ms-flex-positive:1;flex-grow:1}.label-floating.input-fill-outline.sc-ion-input-md-h .input-outline-notch.sc-ion-input-md{border-top:none}.sc-ion-input-md-h{--border-width:1px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.13)))));--highlight-height:2px;font-size:inherit}.input-clear-icon.sc-ion-input-md ion-icon.sc-ion-input-md{font-size:22px}.input-disabled.sc-ion-input-md-h{opacity:0.38}.has-focus.ion-valid.sc-ion-input-md-h,.ion-touched.ion-invalid.sc-ion-input-md-h{--border-color:var(--highlight-color)}.input-bottom.sc-ion-input-md .counter.sc-ion-input-md{letter-spacing:0.0333333333em}.input-label-placement-floating.has-focus.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-stacked.has-focus.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{color:var(--highlight-color)}.has-focus.input-label-placement-floating.ion-valid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-floating.ion-touched.ion-invalid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.has-focus.input-label-placement-stacked.ion-valid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md,.input-label-placement-stacked.ion-touched.ion-invalid.sc-ion-input-md-h .label-text-wrapper.sc-ion-input-md{color:var(--highlight-color)}.input-highlight.sc-ion-input-md{bottom:-1px;position:absolute;width:100%;height:var(--highlight-height);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform 200ms;transition:-webkit-transform 200ms;transition:transform 200ms;transition:transform 200ms, -webkit-transform 200ms;background:var(--highlight-color)}.input-highlight.sc-ion-input-md{inset-inline-start:0}.has-focus.sc-ion-input-md-h .input-highlight.sc-ion-input-md{-webkit-transform:scale(1);transform:scale(1)}.in-item.sc-ion-input-md-h .input-highlight.sc-ion-input-md{bottom:0}.in-item.sc-ion-input-md-h .input-highlight.sc-ion-input-md{inset-inline-start:0}.input-shape-round.sc-ion-input-md-h{--border-radius:16px}.sc-ion-input-md-s>ion-button[slot=start].button-has-icon-only,.sc-ion-input-md-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:8px;--padding-end:8px;--padding-top:8px;--padding-bottom:8px;aspect-ratio:1;min-height:40px}`;
|
|
21039
21167
|
|
|
21040
21168
|
/**
|
|
21041
21169
|
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
|
@@ -21062,6 +21190,8 @@ class Input {
|
|
|
21062
21190
|
slotMutationController;
|
|
21063
21191
|
notchController;
|
|
21064
21192
|
notchSpacerEl;
|
|
21193
|
+
startContainerController;
|
|
21194
|
+
startContainerEl;
|
|
21065
21195
|
originalIonInput;
|
|
21066
21196
|
/**
|
|
21067
21197
|
* `true` if the input was cleared as a result of the user typing
|
|
@@ -21355,10 +21485,15 @@ class Input {
|
|
|
21355
21485
|
connectedCallback() {
|
|
21356
21486
|
const { el } = this;
|
|
21357
21487
|
this.slotMutationController = createSlotMutationController(el, ['label', 'start', 'end'], () => {
|
|
21488
|
+
this.startContainerController?.calculateStartContainerWidth();
|
|
21358
21489
|
this.setSlottedLabelId();
|
|
21359
21490
|
});
|
|
21360
21491
|
this.setSlottedLabelId();
|
|
21361
21492
|
this.notchController = createNotchController(el, () => this.notchSpacerEl, () => this.labelSlot);
|
|
21493
|
+
this.startContainerController = createStartContainerController(el, () => this.startContainerEl, () => {
|
|
21494
|
+
return Build.isBrowser;
|
|
21495
|
+
});
|
|
21496
|
+
this.startContainerController.calculateStartContainerWidth();
|
|
21362
21497
|
// Always set initial state
|
|
21363
21498
|
this.isInvalid = checkInvalidState(el);
|
|
21364
21499
|
this.debounceChanged();
|
|
@@ -21376,6 +21511,7 @@ class Input {
|
|
|
21376
21511
|
}
|
|
21377
21512
|
componentDidRender() {
|
|
21378
21513
|
this.notchController?.calculateNotchWidth();
|
|
21514
|
+
this.startContainerController?.calculateStartContainerWidth();
|
|
21379
21515
|
}
|
|
21380
21516
|
disconnectedCallback() {
|
|
21381
21517
|
if (this.slotMutationController) {
|
|
@@ -21386,6 +21522,10 @@ class Input {
|
|
|
21386
21522
|
this.notchController.destroy();
|
|
21387
21523
|
this.notchController = undefined;
|
|
21388
21524
|
}
|
|
21525
|
+
if (this.startContainerController) {
|
|
21526
|
+
this.startContainerController.destroy();
|
|
21527
|
+
this.startContainerController = undefined;
|
|
21528
|
+
}
|
|
21389
21529
|
// Clean up validation observer to prevent memory leaks
|
|
21390
21530
|
if (this.validationObserver) {
|
|
21391
21531
|
this.validationObserver.disconnect();
|
|
@@ -21626,47 +21766,32 @@ class Input {
|
|
|
21626
21766
|
return this.label !== undefined || this.labelSlot !== null;
|
|
21627
21767
|
}
|
|
21628
21768
|
/**
|
|
21629
|
-
* Stops propagation
|
|
21630
|
-
*
|
|
21769
|
+
* Stops propagation for clicks on the input's own content (label text,
|
|
21770
|
+
* input field) to prevent double-click events. Allows clicks on slotted
|
|
21771
|
+
* content to propagate so event delegation works for parent handlers.
|
|
21772
|
+
*
|
|
21773
|
+
* Only slots belonging directly to this input should be considered.
|
|
21774
|
+
* The input itself may have a slot attribute when placed in an item
|
|
21775
|
+
* or toolbar, which does not make its content slotted content.
|
|
21631
21776
|
*/
|
|
21632
21777
|
onLabelClick = (ev) => {
|
|
21633
|
-
|
|
21634
|
-
|
|
21635
|
-
if (
|
|
21778
|
+
const target = ev.target;
|
|
21779
|
+
const slotted = target.closest('[slot="start"], [slot="end"]');
|
|
21780
|
+
if (slotted === null || slotted === this.el || !this.el.contains(slotted)) {
|
|
21636
21781
|
ev.stopPropagation();
|
|
21637
21782
|
}
|
|
21638
21783
|
};
|
|
21639
21784
|
/**
|
|
21640
|
-
* Renders the border
|
|
21641
|
-
* when fill="outline".
|
|
21785
|
+
* Renders the outline border with a notch for the label.
|
|
21642
21786
|
*/
|
|
21643
|
-
|
|
21644
|
-
|
|
21645
|
-
|
|
21646
|
-
|
|
21647
|
-
|
|
21648
|
-
* The outline fill has a special outline
|
|
21649
|
-
* that appears around the input and the label.
|
|
21650
|
-
* Certain stacked and floating label placements cause the
|
|
21651
|
-
* label to translate up and create a "cut out"
|
|
21652
|
-
* inside of that border by using the notch-spacer element.
|
|
21653
|
-
*/
|
|
21654
|
-
return [
|
|
21655
|
-
hAsync("div", { class: "input-outline-container" }, hAsync("div", { class: "input-outline-start" }), hAsync("div", { class: {
|
|
21656
|
-
'input-outline-notch': true,
|
|
21657
|
-
'input-outline-notch-hidden': !this.hasLabel,
|
|
21658
|
-
} }, hAsync("div", { class: "notch-spacer", "aria-hidden": "true", ref: (el) => (this.notchSpacerEl = el) }, this.label)), hAsync("div", { class: "input-outline-end" })),
|
|
21659
|
-
this.renderLabel(),
|
|
21660
|
-
];
|
|
21661
|
-
}
|
|
21662
|
-
/**
|
|
21663
|
-
* If not using the outline style,
|
|
21664
|
-
* we can render just the label.
|
|
21665
|
-
*/
|
|
21666
|
-
return this.renderLabel();
|
|
21787
|
+
renderOutlineContainer() {
|
|
21788
|
+
return (hAsync("div", { class: "input-outline-container" }, hAsync("div", { class: "input-outline-start" }), hAsync("div", { class: {
|
|
21789
|
+
'input-outline-notch': true,
|
|
21790
|
+
'input-outline-notch-hidden': !this.hasLabel,
|
|
21791
|
+
} }, hAsync("div", { class: "notch-spacer", "aria-hidden": "true", ref: (el) => (this.notchSpacerEl = el) }, this.label)), hAsync("div", { class: "input-outline-end" })));
|
|
21667
21792
|
}
|
|
21668
21793
|
render() {
|
|
21669
|
-
const { disabled, fill, readonly, shape, inputId, labelPlacement,
|
|
21794
|
+
const { disabled, fill, readonly, shape, inputId, labelPlacement, hasFocus, clearInputIcon } = this;
|
|
21670
21795
|
const mode = getIonMode$1(this);
|
|
21671
21796
|
const value = this.getValue();
|
|
21672
21797
|
const inItem = hostContext('ion-item', this.el);
|
|
@@ -21674,26 +21799,14 @@ class Input {
|
|
|
21674
21799
|
const defaultClearIcon = mode === 'ios' ? closeCircle : closeSharp;
|
|
21675
21800
|
const clearIconData = clearInputIcon ?? defaultClearIcon;
|
|
21676
21801
|
const hasValue = this.hasValue();
|
|
21677
|
-
const
|
|
21802
|
+
const hasOutlineFill = mode === 'md' && fill === 'outline';
|
|
21678
21803
|
/**
|
|
21679
21804
|
* If the label is stacked, it should always sit above the input.
|
|
21680
21805
|
* For floating labels, the label should move above the input if
|
|
21681
|
-
* the input has a value
|
|
21682
|
-
* the start or end slot.
|
|
21683
|
-
*
|
|
21684
|
-
* If there is content in the start slot, the label would overlap
|
|
21685
|
-
* it if not forced to float. This is also applied to the end slot
|
|
21686
|
-
* because with the default or solid fills, the input is not
|
|
21687
|
-
* vertically centered in the container, but the label is. This
|
|
21688
|
-
* causes the slots and label to appear vertically offset from each
|
|
21689
|
-
* other when the label isn't floating above the input. This doesn't
|
|
21690
|
-
* apply to the outline fill, but this was not accounted for to keep
|
|
21691
|
-
* things consistent.
|
|
21692
|
-
*
|
|
21693
|
-
* TODO(FW-5592): Remove hasStartEndSlots condition
|
|
21806
|
+
* the input has a value or is focused.
|
|
21694
21807
|
*/
|
|
21695
|
-
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus
|
|
21696
|
-
return (hAsync(Host, { key: '
|
|
21808
|
+
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus));
|
|
21809
|
+
return (hAsync(Host, { key: '9e9495b8f962372d526343ff76b80fb9700fce19', class: createColorClasses$1(this.color, {
|
|
21697
21810
|
[mode]: true,
|
|
21698
21811
|
'has-value': hasValue,
|
|
21699
21812
|
'has-focus': hasFocus,
|
|
@@ -21704,14 +21817,14 @@ class Input {
|
|
|
21704
21817
|
'in-item': inItem,
|
|
21705
21818
|
'in-item-color': hostContext('ion-item.ion-color', this.el),
|
|
21706
21819
|
'input-disabled': disabled,
|
|
21707
|
-
}) }, hAsync("label", { key: '
|
|
21820
|
+
}) }, hAsync("label", { key: '7121f34ed782caf7a7b82703b94fc9d6c78ce5ba', class: "input-wrapper", htmlFor: inputId, onClick: this.onLabelClick }, hasOutlineFill && this.renderOutlineContainer(), hAsync("div", { key: '0c1f8526d86c8a2433c23873fa64b1edc0eafe29', class: "input-start", ref: (el) => (this.startContainerEl = el) }, hAsync("slot", { key: 'a50323fde0fb12997c2324eded132908680ea450', name: "start" })), hAsync("div", { key: '626360c4e115a5286baab49680b2a02cd39614c8', class: "input-control" }, this.renderLabel(), hAsync("div", { key: '1cefd9d8cd6ed96fab7b58237f8f8b0c5e1be92e', class: "native-wrapper", onClick: this.onLabelClick }, hAsync("input", { key: '3dee5302f3a685a848fedd7e1face5095e3ac64b', class: "native-input", ref: (input) => (this.nativeInput = input), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect ? 'on' : 'off', autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type, value: value, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd, "aria-describedby": this.getHintTextID(), "aria-invalid": this.isInvalid ? 'true' : undefined, "aria-labelledby": this.getLabelledById(), ...this.inheritedAttributes }))), hAsync("div", { key: '39fff82e00e63963fe5f17794900ace2a3faa208', class: "input-end" }, this.clearInput && !readonly && !disabled && (hAsync("button", { key: '1fa86fdb5baf4a7cd531ee0fe767a42b44fb33fc', "aria-label": "reset", type: "button", class: "input-clear-icon", onPointerDown: (ev) => {
|
|
21708
21821
|
/**
|
|
21709
21822
|
* This prevents mobile browsers from
|
|
21710
21823
|
* blurring the input when the clear
|
|
21711
21824
|
* button is activated.
|
|
21712
21825
|
*/
|
|
21713
21826
|
ev.preventDefault();
|
|
21714
|
-
}, onClick: this.clearTextInput }, hAsync("ion-icon", { key: '
|
|
21827
|
+
}, onClick: this.clearTextInput }, hAsync("ion-icon", { key: 'ced39304f97e56870f7480afa025ffe232010cfb', "aria-hidden": "true", icon: clearIconData }))), hAsync("slot", { key: 'f4098769eef1cc5aa2074c369f757ccb94a98e1c', name: "end" })), shouldRenderHighlight && hAsync("div", { key: '258fe6ff8f9f57836f2a3a0b6163bd2b7dbf0699', class: "input-highlight" })), this.renderBottomContent()));
|
|
21715
21828
|
}
|
|
21716
21829
|
static get watchers() { return {
|
|
21717
21830
|
"debounce": [{
|
|
@@ -22468,7 +22581,7 @@ class InputOTP {
|
|
|
22468
22581
|
const tabbableIndex = this.getTabbableIndex();
|
|
22469
22582
|
const pattern = this.getPattern();
|
|
22470
22583
|
const hasDescription = el.querySelector('.input-otp-description')?.textContent?.trim() !== '';
|
|
22471
|
-
return (hAsync(Host, { key: '
|
|
22584
|
+
return (hAsync(Host, { key: 'bd37661e13cde21feff30c663e6813ce3fff0d9a', class: createColorClasses$1(color, {
|
|
22472
22585
|
[mode]: true,
|
|
22473
22586
|
'has-focus': hasFocus,
|
|
22474
22587
|
[`input-otp-size-${size}`]: true,
|
|
@@ -22476,10 +22589,10 @@ class InputOTP {
|
|
|
22476
22589
|
[`input-otp-fill-${fill}`]: true,
|
|
22477
22590
|
'input-otp-disabled': disabled,
|
|
22478
22591
|
'input-otp-readonly': readonly,
|
|
22479
|
-
}) }, hAsync("div", { key: '
|
|
22592
|
+
}) }, hAsync("div", { key: '5e206f870024f1ecfebda999ff31e6e815774deb', 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: 'c268f838ddab2c8d6a612a11c7d38e6ca076436d', class: {
|
|
22480
22593
|
'input-otp-description': true,
|
|
22481
22594
|
'input-otp-description-hidden': !hasDescription,
|
|
22482
|
-
} }, hAsync("slot", { key: '
|
|
22595
|
+
} }, hAsync("slot", { key: 'c0736359b26f609b795e399fc1ad9b540632af18' }))));
|
|
22483
22596
|
}
|
|
22484
22597
|
static get watchers() { return {
|
|
22485
22598
|
"value": [{
|
|
@@ -22599,16 +22712,16 @@ class InputPasswordToggle {
|
|
|
22599
22712
|
const showPasswordIcon = this.showIcon ?? eye;
|
|
22600
22713
|
const hidePasswordIcon = this.hideIcon ?? eyeOff;
|
|
22601
22714
|
const isPasswordVisible = type === 'text';
|
|
22602
|
-
return (hAsync(Host, { key: '
|
|
22715
|
+
return (hAsync(Host, { key: '15a29e51abc236cc21943225ed377f5edca7d103', class: createColorClasses$1(color, {
|
|
22603
22716
|
[mode]: true,
|
|
22604
|
-
}) }, hAsync("ion-button", { key: '
|
|
22717
|
+
}) }, hAsync("ion-button", { key: 'cc9c290e809db66c14aaf63eb496ccf94d3f6414', mode: mode, color: color, fill: "clear", shape: "round", "aria-label": isPasswordVisible ? 'Hide password' : 'Show password', "aria-pressed": isPasswordVisible ? 'true' : 'false', type: "button", onPointerDown: (ev) => {
|
|
22605
22718
|
/**
|
|
22606
22719
|
* This prevents mobile browsers from
|
|
22607
22720
|
* blurring the input when the password toggle
|
|
22608
22721
|
* button is activated.
|
|
22609
22722
|
*/
|
|
22610
22723
|
ev.preventDefault();
|
|
22611
|
-
}, onClick: this.togglePasswordVisibility }, hAsync("ion-icon", { key: '
|
|
22724
|
+
}, onClick: this.togglePasswordVisibility }, hAsync("ion-icon", { key: '8d1f5143bedabcff2a8792f35ef07fdac1236fd5', slot: "icon-only", "aria-hidden": "true", icon: isPasswordVisible ? hidePasswordIcon : showPasswordIcon }))));
|
|
22612
22725
|
}
|
|
22613
22726
|
static get watchers() { return {
|
|
22614
22727
|
"type": [{
|
|
@@ -23063,11 +23176,11 @@ class ItemDivider {
|
|
|
23063
23176
|
sticky = false;
|
|
23064
23177
|
render() {
|
|
23065
23178
|
const mode = getIonMode$1(this);
|
|
23066
|
-
return (hAsync(Host, { key: '
|
|
23179
|
+
return (hAsync(Host, { key: 'b191727cc26c600287fd856e49216bf1ae1d5aad', class: createColorClasses$1(this.color, {
|
|
23067
23180
|
[mode]: true,
|
|
23068
23181
|
'item-divider-sticky': this.sticky,
|
|
23069
23182
|
item: true,
|
|
23070
|
-
}) }, hAsync("slot", { key: '
|
|
23183
|
+
}) }, hAsync("slot", { key: 'a8e2eb48ca858b64da8ad018fa8d1667030b7143', name: "start" }), hAsync("div", { key: '3219e0b76ac4a96db50a67f1f2794a235111c613', class: "item-divider-inner", part: "inner" }, hAsync("div", { key: '31a64775153cd8704458e0e2a4a512096585deb4', class: "item-divider-wrapper", part: "container" }, hAsync("slot", { key: 'd46dfb578028790eb6ccaac5e6009a5d96aa831a' })), hAsync("slot", { key: 'a5fc7ac27e418ea82d9dcc913a8dae7e35493760', name: "end" }))));
|
|
23071
23184
|
}
|
|
23072
23185
|
static get style() { return {
|
|
23073
23186
|
ios: itemDividerIosCss(),
|
|
@@ -23096,7 +23209,7 @@ class ItemGroup {
|
|
|
23096
23209
|
}
|
|
23097
23210
|
render() {
|
|
23098
23211
|
const mode = getIonMode$1(this);
|
|
23099
|
-
return (hAsync(Host, { key: '
|
|
23212
|
+
return (hAsync(Host, { key: 'd24ee9c70a99d11b7d95dfb4a8066670bdfcbc1d', role: "group", class: {
|
|
23100
23213
|
[mode]: true,
|
|
23101
23214
|
// Used internally for styling
|
|
23102
23215
|
[`item-group-${mode}`]: true,
|
|
@@ -23198,12 +23311,12 @@ class ItemOption {
|
|
|
23198
23311
|
href: this.href,
|
|
23199
23312
|
target: this.target,
|
|
23200
23313
|
};
|
|
23201
|
-
return (hAsync(Host, { key: '
|
|
23314
|
+
return (hAsync(Host, { key: 'a10d36e60d61865141c57c03a114e4845b400a55', onClick: this.onClick, class: createColorClasses$1(this.color, {
|
|
23202
23315
|
[mode]: true,
|
|
23203
23316
|
'item-option-disabled': disabled,
|
|
23204
23317
|
'item-option-expandable': expandable,
|
|
23205
23318
|
'ion-activatable': true,
|
|
23206
|
-
}) }, hAsync(TagType, { key: '
|
|
23319
|
+
}) }, hAsync(TagType, { key: '5cc49ef73318213f6202d1d0f460f629ea65f17f', ...attrs, class: "button-native", part: "native", disabled: disabled }, hAsync("span", { key: '0643b16660b4ca00b0f3b4dbe2739e9ce076abea', class: "button-inner", part: "inner" }, hAsync("slot", { key: '8778d6d09aa9e0db278ce00c5456a1acfe82c15f', name: "top" }), hAsync("div", { key: '4fc849494c8cb2380015161e096b5c61cf517d90', class: "horizontal-wrapper", part: "container" }, hAsync("slot", { key: '9d0c0a5a63d8ec636df9c85d48bbdb39fb63af5e', name: "start" }), hAsync("slot", { key: 'a40561497c7e7d73173edd24ed335230e6eebb2b', name: "icon-only" }), hAsync("slot", { key: 'b94f2a4aa5bf4a1104497ced1920d6ee43d33659' }), hAsync("slot", { key: '91713dbb3e6a617c00f950857f2ed5e5ffceaa9a', name: "end" })), hAsync("slot", { key: 'f5af33c3bfb50fc629a06e1120bba55da07b2afb', name: "bottom" })), mode === 'md' && hAsync("ion-ripple-effect", { key: 'fc56e1644ef9c5b2e1e66683465a7fd09c05215c' }))));
|
|
23207
23320
|
}
|
|
23208
23321
|
static get style() { return {
|
|
23209
23322
|
ios: itemOptionIosCss(),
|
|
@@ -23256,7 +23369,7 @@ class ItemOptions {
|
|
|
23256
23369
|
render() {
|
|
23257
23370
|
const mode = getIonMode$1(this);
|
|
23258
23371
|
const isEnd = isEndSide(this.side);
|
|
23259
|
-
return (hAsync(Host, { key: '
|
|
23372
|
+
return (hAsync(Host, { key: '6e60ff004d48bf7701711e518ec0b21264496ae8', class: {
|
|
23260
23373
|
[mode]: true,
|
|
23261
23374
|
// Used internally for styling
|
|
23262
23375
|
[`item-options-${mode}`]: true,
|
|
@@ -23728,7 +23841,7 @@ class ItemSliding {
|
|
|
23728
23841
|
}
|
|
23729
23842
|
render() {
|
|
23730
23843
|
const mode = getIonMode$1(this);
|
|
23731
|
-
return (hAsync(Host, { key: '
|
|
23844
|
+
return (hAsync(Host, { key: '15f6a98f8c888e86c29827cdf55d98ace08699dd', class: {
|
|
23732
23845
|
[mode]: true,
|
|
23733
23846
|
'item-sliding-active-slide': this.state !== 2 /* SlidingState.Disabled */,
|
|
23734
23847
|
'item-sliding-active-options-end': (this.state & 8 /* SlidingState.End */) !== 0,
|
|
@@ -23861,13 +23974,13 @@ class Label {
|
|
|
23861
23974
|
render() {
|
|
23862
23975
|
const position = this.position;
|
|
23863
23976
|
const mode = getIonMode$1(this);
|
|
23864
|
-
return (hAsync(Host, { key: '
|
|
23977
|
+
return (hAsync(Host, { key: '461604c1887f322dc13d7df3d5cdbb7ee1361117', class: createColorClasses$1(this.color, {
|
|
23865
23978
|
[mode]: true,
|
|
23866
23979
|
'in-item-color': hostContext('ion-item.ion-color', this.el),
|
|
23867
23980
|
[`label-${position}`]: position !== undefined,
|
|
23868
23981
|
[`label-no-animate`]: this.noAnimate,
|
|
23869
23982
|
'label-rtl': document.dir === 'rtl',
|
|
23870
|
-
}) }, hAsync("slot", { key: '
|
|
23983
|
+
}) }, hAsync("slot", { key: 'a7005d0a217641278aa8e95144e8e4b9ae87a1c5' })));
|
|
23871
23984
|
}
|
|
23872
23985
|
static get watchers() { return {
|
|
23873
23986
|
"color": [{
|
|
@@ -23931,7 +24044,7 @@ class List {
|
|
|
23931
24044
|
render() {
|
|
23932
24045
|
const mode = getIonMode$1(this);
|
|
23933
24046
|
const { lines, inset } = this;
|
|
23934
|
-
return (hAsync(Host, { key: '
|
|
24047
|
+
return (hAsync(Host, { key: 'b21e063d568b07331ea9443647b3faf33265256a', role: "list", class: {
|
|
23935
24048
|
[mode]: true,
|
|
23936
24049
|
// Used internally for styling
|
|
23937
24050
|
[`list-${mode}`]: true,
|
|
@@ -23984,10 +24097,10 @@ class ListHeader {
|
|
|
23984
24097
|
render() {
|
|
23985
24098
|
const { lines } = this;
|
|
23986
24099
|
const mode = getIonMode$1(this);
|
|
23987
|
-
return (hAsync(Host, { key: '
|
|
24100
|
+
return (hAsync(Host, { key: '92ab17533e169b1a1c990285449e0546aac98021', class: createColorClasses$1(this.color, {
|
|
23988
24101
|
[mode]: true,
|
|
23989
24102
|
[`list-header-lines-${lines}`]: lines !== undefined,
|
|
23990
|
-
}) }, hAsync("div", { key: '
|
|
24103
|
+
}) }, hAsync("div", { key: '26639255577380a8e70b61f753aa9ed57590694f', class: "list-header-inner", part: "inner" }, hAsync("slot", { key: 'f69055e7a7a47ae8dcbbe289e18b6630f0792714' }))));
|
|
23991
24104
|
}
|
|
23992
24105
|
static get style() { return {
|
|
23993
24106
|
ios: listHeaderIosCss(),
|
|
@@ -24353,14 +24466,14 @@ class Loading {
|
|
|
24353
24466
|
* Otherwise, don't set aria-labelledby.
|
|
24354
24467
|
*/
|
|
24355
24468
|
const ariaLabelledBy = message !== undefined ? msgId : null;
|
|
24356
|
-
return (hAsync(Host, { key: '
|
|
24469
|
+
return (hAsync(Host, { key: '2d14122ff3081de73631a7fdd4affdd5c73b8618', role: "dialog", "aria-modal": "true", "aria-labelledby": ariaLabelledBy, tabindex: "-1", ...htmlAttributes, style: {
|
|
24357
24470
|
zIndex: `${40000 + this.overlayIndex}`,
|
|
24358
24471
|
}, onIonBackdropTap: this.onBackdropTap, class: {
|
|
24359
24472
|
...getClassMap(this.cssClass),
|
|
24360
24473
|
[mode]: true,
|
|
24361
24474
|
'overlay-hidden': true,
|
|
24362
24475
|
'loading-translucent': this.translucent,
|
|
24363
|
-
} }, hAsync("ion-backdrop", { key: '
|
|
24476
|
+
} }, hAsync("ion-backdrop", { key: 'b7d5bb0d670a20c159d7f67327bf3b1489449188', visible: this.showBackdrop, tappable: this.backdropDismiss }), hAsync("div", { key: '085ce92bd2004d323ab47eb472b83826e48dc619', tabindex: "0", "aria-hidden": "true" }), hAsync("div", { key: '4ecd5bfc0bbd3da434d32f0f319f867a44c5e1f1', class: "loading-wrapper ion-overlay-wrapper" }, spinner && (hAsync("div", { key: '5a4498e1421e09d01c0ee4312eae5272e95c3127', class: "loading-spinner" }, hAsync("ion-spinner", { key: '1b3bc7d45d775195657ead3535f65e6b79f37e84', name: spinner, "aria-hidden": "true" }))), message !== undefined && this.renderLoadingMessage(msgId)), hAsync("div", { key: 'bc7c5467b9f1c6ab957f79934e97acc713bdec37', tabindex: "0", "aria-hidden": "true" })));
|
|
24364
24477
|
}
|
|
24365
24478
|
static get watchers() { return {
|
|
24366
24479
|
"isOpen": [{
|
|
@@ -25455,14 +25568,14 @@ class Menu {
|
|
|
25455
25568
|
* the ionBackButton listener in the menu controller
|
|
25456
25569
|
* will handle closing the menu when Escape is pressed.
|
|
25457
25570
|
*/
|
|
25458
|
-
return (hAsync(Host, { key: '
|
|
25571
|
+
return (hAsync(Host, { key: 'ca4856cbc46001fc95a47591031c00a100555dcf', onKeyDown: shouldUseCloseWatcher() ? null : this.onKeydown, role: "navigation", "aria-label": inheritedAttributes['aria-label'] || 'menu', class: {
|
|
25459
25572
|
[mode]: true,
|
|
25460
25573
|
[`menu-type-${type}`]: true,
|
|
25461
25574
|
'menu-enabled': !disabled,
|
|
25462
25575
|
[`menu-side-${side}`]: true,
|
|
25463
25576
|
'menu-pane-visible': isPaneVisible,
|
|
25464
25577
|
'split-pane-side': hostContext('ion-split-pane', el),
|
|
25465
|
-
} }, hAsync("div", { key: '
|
|
25578
|
+
} }, hAsync("div", { key: '155564ac239dba04b0b41ad194598a23c8d72d3f', class: "menu-inner", part: "container", ref: (el) => (this.menuInnerEl = el) }, hAsync("slot", { key: 'b960042d1e86fd6220f1d862033e79e2dbbe7bcb' })), hAsync("ion-backdrop", { key: '28589933d545b14d063c62fbe61116132d808adf', ref: (el) => (this.backdropEl = el), class: "menu-backdrop", tappable: false, stopPropagation: false, part: "backdrop" })));
|
|
25466
25579
|
}
|
|
25467
25580
|
static get watchers() { return {
|
|
25468
25581
|
"type": [{
|
|
@@ -25588,7 +25701,7 @@ class MenuButton {
|
|
|
25588
25701
|
type: this.type,
|
|
25589
25702
|
};
|
|
25590
25703
|
const ariaLabel = inheritedAttributes['aria-label'] || 'menu';
|
|
25591
|
-
return (hAsync(Host, { key: '
|
|
25704
|
+
return (hAsync(Host, { key: 'b8869377822b082c6c4d3f16135b50b733eabf65', onClick: this.onClick, "aria-disabled": disabled ? 'true' : null, "aria-hidden": hidden ? 'true' : null, class: createColorClasses$1(color, {
|
|
25592
25705
|
[mode]: true,
|
|
25593
25706
|
button: true, // ion-buttons target .button
|
|
25594
25707
|
'menu-button-hidden': hidden,
|
|
@@ -25597,7 +25710,7 @@ class MenuButton {
|
|
|
25597
25710
|
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
|
|
25598
25711
|
'ion-activatable': true,
|
|
25599
25712
|
'ion-focusable': true,
|
|
25600
|
-
}) }, hAsync("button", { key: '
|
|
25713
|
+
}) }, hAsync("button", { key: '48fc0a7011414b60dd7d5136f247e937ae4bb8c8', ...attrs, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, hAsync("span", { key: '8c712f28c5afd345e403a9afc525931112852708', class: "button-inner" }, hAsync("slot", { key: 'dd872325e42baf435188478c8d1cfc416075089d' }, hAsync("ion-icon", { key: 'a4f02bdb715b07792c17e12c7837873d70171f88', part: "icon", icon: menuIcon, mode: mode, lazy: false, "aria-hidden": "true" }))), mode === 'md' && hAsync("ion-ripple-effect", { key: '564e2a8a804e14d1135502f7b17d8b7b9862e81b', type: "unbounded" }))));
|
|
25601
25714
|
}
|
|
25602
25715
|
static get style() { return {
|
|
25603
25716
|
ios: menuButtonIosCss(),
|
|
@@ -25658,10 +25771,10 @@ class MenuToggle {
|
|
|
25658
25771
|
render() {
|
|
25659
25772
|
const mode = getIonMode$1(this);
|
|
25660
25773
|
const hidden = this.autoHide && !this.visible;
|
|
25661
|
-
return (hAsync(Host, { key: '
|
|
25774
|
+
return (hAsync(Host, { key: '76d21ea6493b8161860c941e3754fef1e20395cc', onClick: this.onClick, "aria-hidden": hidden ? 'true' : null, class: {
|
|
25662
25775
|
[mode]: true,
|
|
25663
25776
|
'menu-toggle-hidden': hidden,
|
|
25664
|
-
} }, hAsync("slot", { key: '
|
|
25777
|
+
} }, hAsync("slot", { key: '9383610fd3105e1928a38788eb596e313e2b07f8' })));
|
|
25665
25778
|
}
|
|
25666
25779
|
static get style() { return menuToggleCss(); }
|
|
25667
25780
|
static get cmpMeta() { return {
|
|
@@ -29275,7 +29388,7 @@ class Modal {
|
|
|
29275
29388
|
const isCardModal = presentingElement !== undefined && mode === 'ios';
|
|
29276
29389
|
const isHandleCycle = handleBehavior === 'cycle';
|
|
29277
29390
|
const isSheetModalWithHandle = isSheetModal && showHandle;
|
|
29278
|
-
return (hAsync(Host, { key: '
|
|
29391
|
+
return (hAsync(Host, { key: 'a471c293319cb6ee5ffb7ffafec0b8413e4289de', "no-router": true,
|
|
29279
29392
|
// Allow the modal to be navigable when the handle is focusable
|
|
29280
29393
|
tabIndex: isHandleCycle && isSheetModalWithHandle ? 0 : -1, ...htmlAttributes, style: {
|
|
29281
29394
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
@@ -29288,7 +29401,7 @@ class Modal {
|
|
|
29288
29401
|
'overlay-hidden': true,
|
|
29289
29402
|
[FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false,
|
|
29290
29403
|
...getClassMap(this.cssClass),
|
|
29291
|
-
}, onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle, onFocus: this.onModalFocus }, hAsync("ion-backdrop", { key: '
|
|
29404
|
+
}, onIonBackdropTap: this.onBackdropTap, onIonModalDidPresent: this.onLifecycle, onIonModalWillPresent: this.onLifecycle, onIonModalWillDismiss: this.onLifecycle, onIonModalDidDismiss: this.onLifecycle, onFocus: this.onModalFocus }, hAsync("ion-backdrop", { key: 'f67934afd4ddad64623856fb641cb6db846df428', ref: (el) => (this.backdropEl = el), visible: this.showBackdrop, tappable: this.backdropDismiss, part: "backdrop" }), mode === 'ios' && hAsync("div", { key: 'a23f5cb6cf60c8f717c1dd556bce375829c80a43', class: "modal-shadow" }), hAsync("div", { key: '51eb6cd1070e4b7e49840a78dc7437238c867a01',
|
|
29292
29405
|
/*
|
|
29293
29406
|
role and aria-modal must be used on the
|
|
29294
29407
|
same element. They must also be set inside the
|
|
@@ -29301,9 +29414,9 @@ class Modal {
|
|
|
29301
29414
|
without the tabindex focus() would be a no-op and screen readers
|
|
29302
29415
|
may not properly announce the dialog and its content when it opens.
|
|
29303
29416
|
*/
|
|
29304
|
-
role: "dialog", ...inheritedAttributes, "aria-modal": "true", tabIndex: -1, class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }, showHandle && (hAsync("button", { key: '
|
|
29417
|
+
role: "dialog", ...inheritedAttributes, "aria-modal": "true", tabIndex: -1, class: "modal-wrapper ion-overlay-wrapper", part: "content", ref: (el) => (this.wrapperEl = el) }, showHandle && (hAsync("button", { key: 'f49a144642b5c227c0c2b00b33f4c7e37a2bf088', class: "modal-handle",
|
|
29305
29418
|
// Prevents the handle from receiving keyboard focus when it does not cycle
|
|
29306
|
-
tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle", ref: (el) => (this.dragHandleEl = el) })), hAsync("slot", { key: '
|
|
29419
|
+
tabIndex: !isHandleCycle ? -1 : 0, "aria-label": "Activate to adjust the size of the dialog overlaying the screen", onClick: isHandleCycle ? this.onHandleClick : undefined, part: "handle", ref: (el) => (this.dragHandleEl = el) })), hAsync("slot", { key: 'e781c0d5881762c6b61aa432721a38b49580ff64', onSlotchange: this.onSlotChange }))));
|
|
29307
29420
|
}
|
|
29308
29421
|
static get watchers() { return {
|
|
29309
29422
|
"isOpen": [{
|
|
@@ -30189,7 +30302,7 @@ class Nav {
|
|
|
30189
30302
|
}
|
|
30190
30303
|
}
|
|
30191
30304
|
render() {
|
|
30192
|
-
return hAsync("slot", { key: '
|
|
30305
|
+
return hAsync("slot", { key: '1886154d3c2fa8511af4d641d269aaa4c0f45c05' });
|
|
30193
30306
|
}
|
|
30194
30307
|
static get watchers() { return {
|
|
30195
30308
|
"swipeGesture": [{
|
|
@@ -30276,7 +30389,7 @@ class NavLink {
|
|
|
30276
30389
|
return navLink(this.el, this.routerDirection, this.component, this.componentProps, this.routerAnimation);
|
|
30277
30390
|
};
|
|
30278
30391
|
render() {
|
|
30279
|
-
return hAsync(Host, { key: '
|
|
30392
|
+
return hAsync(Host, { key: '4bcaa74015462824b3f19253b04a77ce83389ca0', onClick: this.onClick });
|
|
30280
30393
|
}
|
|
30281
30394
|
static get cmpMeta() { return {
|
|
30282
30395
|
"$flags$": 512,
|
|
@@ -30312,9 +30425,9 @@ class Note {
|
|
|
30312
30425
|
color;
|
|
30313
30426
|
render() {
|
|
30314
30427
|
const mode = getIonMode$1(this);
|
|
30315
|
-
return (hAsync(Host, { key: '
|
|
30428
|
+
return (hAsync(Host, { key: 'ffe9b4de8bbd89b1ef427f6cd5dbcd354d715e6b', class: createColorClasses$1(this.color, {
|
|
30316
30429
|
[mode]: true,
|
|
30317
|
-
}) }, hAsync("slot", { key: '
|
|
30430
|
+
}) }, hAsync("slot", { key: '42fa3ca3f98208ea2a5057da25b7f9d371c5ba1f' })));
|
|
30318
30431
|
}
|
|
30319
30432
|
static get style() { return {
|
|
30320
30433
|
ios: noteIosCss(),
|
|
@@ -31522,10 +31635,10 @@ class PickerColumnOption {
|
|
|
31522
31635
|
render() {
|
|
31523
31636
|
const { color, disabled, ariaLabel } = this;
|
|
31524
31637
|
const mode = getIonMode$1(this);
|
|
31525
|
-
return (hAsync(Host, { key: '
|
|
31638
|
+
return (hAsync(Host, { key: '81f1938e0114392a6e035442b8bc9fcdf73fda84', class: createColorClasses$1(color, {
|
|
31526
31639
|
[mode]: true,
|
|
31527
31640
|
['option-disabled']: disabled,
|
|
31528
|
-
}) }, hAsync("div", { key: '
|
|
31641
|
+
}) }, hAsync("div", { key: 'b0bb84fd39ea38ea3037ad43c6be8e8dfca2e7d1', class: 'picker-column-option-button', role: "button", "aria-label": ariaLabel, onClick: () => this.onClick() }, hAsync("slot", { key: 'e0305b721618aef05823032ccd58214b0f184ca9' }))));
|
|
31529
31642
|
}
|
|
31530
31643
|
static get watchers() { return {
|
|
31531
31644
|
"aria-label": [{
|
|
@@ -33195,7 +33308,7 @@ class Popover {
|
|
|
33195
33308
|
const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes, focusTrap } = this;
|
|
33196
33309
|
const desktop = isPlatform('desktop');
|
|
33197
33310
|
const enableArrow = arrow && !parentPopover;
|
|
33198
|
-
return (hAsync(Host, { key: '
|
|
33311
|
+
return (hAsync(Host, { key: '52ffc7116969ae1b8b927e67f2acbfe5f5434f70', "aria-modal": "true", "no-router": true, tabindex: "-1", ...htmlAttributes, style: {
|
|
33199
33312
|
zIndex: `${20000 + this.overlayIndex}`,
|
|
33200
33313
|
}, class: {
|
|
33201
33314
|
...getClassMap(this.cssClass),
|
|
@@ -33206,7 +33319,7 @@ class Popover {
|
|
|
33206
33319
|
[`popover-side-${side}`]: true,
|
|
33207
33320
|
[FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false,
|
|
33208
33321
|
'popover-nested': !!parentPopover,
|
|
33209
|
-
}, onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }, !parentPopover && hAsync("ion-backdrop", { key: '
|
|
33322
|
+
}, onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }, !parentPopover && hAsync("ion-backdrop", { key: '79a8e851dbd22119e21ffb2f4709c555251045c8', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), hAsync("div", { key: 'c46c9f62c3ef3f902e23f27404eaa446a5d8cf88', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && hAsync("div", { key: '9fdcbbc4ea6c7bde74f646d48eb77296b2c9dd83', class: "popover-arrow", part: "arrow" }), hAsync("div", { key: '138e56bb83462ebb0908edb522b45ecf94b82aeb', class: "popover-content", part: "content" }, hAsync("slot", { key: 'daeefcf002e8d89e91d6e0faf7f63f75b68a2dbe' })))));
|
|
33210
33323
|
}
|
|
33211
33324
|
static get watchers() { return {
|
|
33212
33325
|
"trigger": [{
|
|
@@ -33322,7 +33435,7 @@ class ProgressBar {
|
|
|
33322
33435
|
const mode = getIonMode$1(this);
|
|
33323
33436
|
// If the progress is displayed as a solid bar.
|
|
33324
33437
|
const progressSolid = buffer === 1;
|
|
33325
|
-
return (hAsync(Host, { key: '
|
|
33438
|
+
return (hAsync(Host, { key: 'd53d39a3e2c0198164a9face62d3775f357b6914', role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: createColorClasses$1(color, {
|
|
33326
33439
|
[mode]: true,
|
|
33327
33440
|
[`progress-bar-${type}`]: true,
|
|
33328
33441
|
'progress-paused': paused,
|
|
@@ -33551,7 +33664,7 @@ class Radio {
|
|
|
33551
33664
|
const mode = getIonMode$1(this);
|
|
33552
33665
|
const inItem = hostContext('ion-item', el);
|
|
33553
33666
|
const inMultipleInputsItem = hostContext('ion-item.item-multiple-inputs', el);
|
|
33554
|
-
return (hAsync(Host, { key: '
|
|
33667
|
+
return (hAsync(Host, { key: 'ad7ac0bdc4d3216ecc19402e5b8d6f9e4d09334b', onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: createColorClasses$1(color, {
|
|
33555
33668
|
[mode]: true,
|
|
33556
33669
|
'in-item': inItem,
|
|
33557
33670
|
'radio-checked': checked,
|
|
@@ -33564,10 +33677,10 @@ class Radio {
|
|
|
33564
33677
|
// styling stays suppressed either way.
|
|
33565
33678
|
'ion-activatable': !inItem,
|
|
33566
33679
|
'ion-focusable': !inItem || inMultipleInputsItem,
|
|
33567
|
-
}), role: "radio", "aria-checked": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabindex: buttonTabindex }, hAsync("label", { key: '
|
|
33680
|
+
}), role: "radio", "aria-checked": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabindex: buttonTabindex }, hAsync("label", { key: '59c09125633120e2000447b8a3bc24c54490aa85', class: "radio-wrapper" }, hAsync("div", { key: '1a98f3e0027deeac52647ba37aa9a99be0231966', class: {
|
|
33568
33681
|
'label-text-wrapper': true,
|
|
33569
33682
|
'label-text-wrapper-hidden': !hasLabel,
|
|
33570
|
-
}, part: "label" }, hAsync("slot", { key: '
|
|
33683
|
+
}, part: "label" }, hAsync("slot", { key: '6a48e76ac8793d2aacebd3a8f193e3537272e5c2' })), hAsync("div", { key: '68e4350bac8dad29c6b7a180560de2bb4dfc8c41', class: "native-wrapper" }, this.renderRadioControl()))));
|
|
33571
33684
|
}
|
|
33572
33685
|
static get watchers() { return {
|
|
33573
33686
|
"value": [{
|
|
@@ -33856,7 +33969,7 @@ class RadioGroup {
|
|
|
33856
33969
|
const { label, labelId, el, name, value } = this;
|
|
33857
33970
|
const mode = getIonMode$1(this);
|
|
33858
33971
|
renderHiddenInput(true, el, name, value, false);
|
|
33859
|
-
return (hAsync(Host, { key: '
|
|
33972
|
+
return (hAsync(Host, { key: '8d926a17e800adf0184274215c9689c96a8d6dfd', role: "radiogroup", "aria-labelledby": label ? labelId : null, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, onClick: this.onClick, class: mode }, this.renderHintText(), hAsync("slot", { key: '2ff891123d5971a581b70d0886d23a074358c2dc' })));
|
|
33860
33973
|
}
|
|
33861
33974
|
static get watchers() { return {
|
|
33862
33975
|
"value": [{
|
|
@@ -34763,7 +34876,7 @@ class Range {
|
|
|
34763
34876
|
const valueAtMin = dualKnobs ? this.valA === min || this.valB === min : this.valA === min;
|
|
34764
34877
|
const valueAtMax = dualKnobs ? this.valA === max || this.valB === max : this.valA === max;
|
|
34765
34878
|
renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
|
|
34766
|
-
return (hAsync(Host, { key: '
|
|
34879
|
+
return (hAsync(Host, { key: 'c9e2fd903e9a4dc8fc6c6d11695c830010d04705', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses$1(this.color, {
|
|
34767
34880
|
[mode]: true,
|
|
34768
34881
|
'in-item': inItem,
|
|
34769
34882
|
'range-disabled': disabled,
|
|
@@ -34777,10 +34890,10 @@ class Range {
|
|
|
34777
34890
|
'range-item-end-adjustment': needsEndAdjustment,
|
|
34778
34891
|
'range-value-min': valueAtMin,
|
|
34779
34892
|
'range-value-max': valueAtMax,
|
|
34780
|
-
}) }, hAsync("label", { key: '
|
|
34893
|
+
}) }, hAsync("label", { key: '034b9fdf0cfb8574f0deaa082da0d09d49416a69', class: "range-wrapper", id: "range-label" }, hAsync("div", { key: 'a47912d48e1a71746aeb506e14a59ff84af43682', class: {
|
|
34781
34894
|
'label-text-wrapper': true,
|
|
34782
34895
|
'label-text-wrapper-hidden': !hasLabel,
|
|
34783
|
-
}, part: "label" }, label !== undefined ? hAsync("div", { class: "label-text" }, label) : hAsync("slot", { name: "label" })), hAsync("div", { key: '
|
|
34896
|
+
}, part: "label" }, label !== undefined ? hAsync("div", { class: "label-text" }, label) : hAsync("slot", { name: "label" })), hAsync("div", { key: '4eeea5baa3f1c9cb365385910b53bde578cae119', class: "native-wrapper" }, hAsync("slot", { key: '6a62a106648d301b9fdb20e89f359317e4f552fa', name: "start" }), this.renderRangeSlider(), hAsync("slot", { key: '03c8bd01a7465ba78f6e45405facd243c1aaf526', name: "end" })))));
|
|
34784
34897
|
}
|
|
34785
34898
|
static get watchers() { return {
|
|
34786
34899
|
"debounce": [{
|
|
@@ -35911,7 +36024,7 @@ class Refresher {
|
|
|
35911
36024
|
}
|
|
35912
36025
|
render() {
|
|
35913
36026
|
const mode = getIonMode$1(this);
|
|
35914
|
-
return (hAsync(Host, { key: '
|
|
36027
|
+
return (hAsync(Host, { key: 'b76e9fb79121799717063137135e448a3c784d82', slot: "fixed", class: {
|
|
35915
36028
|
[mode]: true,
|
|
35916
36029
|
// Used internally for styling
|
|
35917
36030
|
[`refresher-${mode}`]: true,
|
|
@@ -36175,7 +36288,7 @@ class RefresherContent {
|
|
|
36175
36288
|
const pullingIcon = this.pullingIcon;
|
|
36176
36289
|
const hasSpinner = pullingIcon != null && SPINNERS[pullingIcon] !== undefined;
|
|
36177
36290
|
const mode = getIonMode$1(this);
|
|
36178
|
-
return (hAsync(Host, { key: '
|
|
36291
|
+
return (hAsync(Host, { key: 'a1546008813bbcfa70f97e9b9025846ee0aed722', class: mode }, hAsync("div", { key: '5422771d67fe201e22d4f9d7db6b685f3db5d99d', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (hAsync("div", { key: '5c2b6dfc3f01b42586ea83380548d454b220a7ca', class: "refresher-pulling-icon" }, hAsync("div", { key: '2c3799ca3f66960d7081c63c5a0840951f694baf', class: "spinner-arrow-container" }, hAsync("ion-spinner", { key: '03f766a9b9354dcb8f6975757a9b882c2eb5cf4a', name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (hAsync("div", { key: 'e5f4ba7c6a70adb71f8985af0e23aca07d7b005a', class: "arrow-container" }, hAsync("ion-icon", { key: 'ddccbd9164ae8daa97178fc53b52f74f1fd298ef', icon: caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (hAsync("div", { key: '6fb742f47f9149fa6dc3daefe5aaa77f925da4bd', class: "refresher-pulling-icon" }, hAsync("ion-icon", { key: '907657135eeac4c394be1eae4a659664a7bfacb0', icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), hAsync("div", { key: 'fb3094b3ed7e100ab9641c3221770889088e27f3', class: "refresher-refreshing" }, this.refreshingSpinner && (hAsync("div", { key: 'bc8078f94e7cea3cb6f03a09e98540f0e0b38721', class: "refresher-refreshing-icon" }, hAsync("ion-spinner", { key: '8f39524f073aa828e941bcdd4d48e4d5dfc759c6', name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
|
|
36179
36292
|
}
|
|
36180
36293
|
static get cmpMeta() { return {
|
|
36181
36294
|
"$flags$": 512,
|
|
@@ -36216,7 +36329,7 @@ class Reorder {
|
|
|
36216
36329
|
render() {
|
|
36217
36330
|
const mode = getIonMode$1(this);
|
|
36218
36331
|
const reorderIcon = mode === 'ios' ? reorderThreeOutline : reorderTwoSharp;
|
|
36219
|
-
return (hAsync(Host, { key: '
|
|
36332
|
+
return (hAsync(Host, { key: 'f278c473b4695a6a93565100e4fcaa7f9e3e9ff5', class: mode }, hAsync("slot", { key: 'cc26b5ed297f68a0bea82e27e34a7fe945186f4e' }, hAsync("ion-icon", { key: '696f5e4c2b09e64bd08abf0d0818b1554cd29737', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
|
|
36220
36333
|
}
|
|
36221
36334
|
static get style() { return {
|
|
36222
36335
|
ios: reorderIosCss(),
|
|
@@ -36517,7 +36630,7 @@ class ReorderGroup {
|
|
|
36517
36630
|
}
|
|
36518
36631
|
render() {
|
|
36519
36632
|
const mode = getIonMode$1(this);
|
|
36520
|
-
return (hAsync(Host, { key: '
|
|
36633
|
+
return (hAsync(Host, { key: '779332508f44409696b6bab80eda72f9b1d7869d', class: {
|
|
36521
36634
|
[mode]: true,
|
|
36522
36635
|
'reorder-enabled': !this.disabled,
|
|
36523
36636
|
'reorder-list-active': this.state !== 0 /* ReorderGroupState.Idle */,
|
|
@@ -36635,7 +36748,7 @@ class RippleEffect {
|
|
|
36635
36748
|
}
|
|
36636
36749
|
render() {
|
|
36637
36750
|
const mode = getIonMode$1(this);
|
|
36638
|
-
return (hAsync(Host, { key: '
|
|
36751
|
+
return (hAsync(Host, { key: '371350cb76e98338ef7467191aaaf817b1298b3f', role: "presentation", class: {
|
|
36639
36752
|
[mode]: true,
|
|
36640
36753
|
unbounded: this.unbounded,
|
|
36641
36754
|
} }));
|
|
@@ -37872,10 +37985,10 @@ class RouterLink {
|
|
|
37872
37985
|
rel: this.rel,
|
|
37873
37986
|
target: this.target,
|
|
37874
37987
|
};
|
|
37875
|
-
return (hAsync(Host, { key: '
|
|
37988
|
+
return (hAsync(Host, { key: '8aaf732d8f5cc4ced351e2b3164605c10bd90cad', onClick: this.onClick, class: createColorClasses$1(this.color, {
|
|
37876
37989
|
[mode]: true,
|
|
37877
37990
|
'ion-activatable': true,
|
|
37878
|
-
}) }, hAsync("a", { key: '
|
|
37991
|
+
}) }, hAsync("a", { key: '8f291ffbbce5b08dd10720d855eb020880bf1be1', ...attrs }, hAsync("slot", { key: '24dc388a49204011e1c1f0a1131c9a1b0a4ae4da' }))));
|
|
37879
37992
|
}
|
|
37880
37993
|
static get style() { return routerLinkCss(); }
|
|
37881
37994
|
static get cmpMeta() { return {
|
|
@@ -38113,7 +38226,7 @@ class RouterOutlet {
|
|
|
38113
38226
|
return true;
|
|
38114
38227
|
}
|
|
38115
38228
|
render() {
|
|
38116
|
-
return hAsync("slot", { key: '
|
|
38229
|
+
return hAsync("slot", { key: '249e7d8a063c781db52fa535e42d648c7bf2909a' });
|
|
38117
38230
|
}
|
|
38118
38231
|
static get watchers() { return {
|
|
38119
38232
|
"swipeGesture": [{
|
|
@@ -38151,7 +38264,7 @@ class Row {
|
|
|
38151
38264
|
registerInstance(this, hostRef);
|
|
38152
38265
|
}
|
|
38153
38266
|
render() {
|
|
38154
|
-
return (hAsync(Host, { key: '
|
|
38267
|
+
return (hAsync(Host, { key: '12b7419dd67ff18dd00e1bf5093299bd94c75503', class: getIonMode$1(this) }, hAsync("slot", { key: '43fc76a289ecaf398a77a90034ee576003a826fd' })));
|
|
38155
38268
|
}
|
|
38156
38269
|
static get style() { return rowCss(); }
|
|
38157
38270
|
static get cmpMeta() { return {
|
|
@@ -38716,8 +38829,8 @@ class Searchbar {
|
|
|
38716
38829
|
const clearIcon = this.clearIcon || (mode === 'ios' ? closeCircle : closeSharp);
|
|
38717
38830
|
const searchIcon = this.searchIcon || (mode === 'ios' ? searchOutline : searchSharp);
|
|
38718
38831
|
const shouldShowCancelButton = this.shouldShowCancelButton();
|
|
38719
|
-
const cancelButton = this.showCancelButton !== 'never' && (hAsync("button", { key: '
|
|
38720
|
-
return (hAsync(Host, { key: '
|
|
38832
|
+
const cancelButton = this.showCancelButton !== 'never' && (hAsync("button", { key: '47ee586db12684db8b2d16a790976bd247cbbc62', "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" }, hAsync("div", { key: '55e6b556a46e7bba14c2cfe1b58542499d2334ab', "aria-hidden": "true" }, mode === 'md' ? (hAsync("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
|
|
38833
|
+
return (hAsync(Host, { key: '468d524b52a0d29d840e2c3cdafba46152716b15', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses$1(this.color, {
|
|
38721
38834
|
[mode]: true,
|
|
38722
38835
|
'searchbar-animated': animated,
|
|
38723
38836
|
'searchbar-disabled': this.disabled,
|
|
@@ -38727,14 +38840,14 @@ class Searchbar {
|
|
|
38727
38840
|
'searchbar-has-focus': this.focused,
|
|
38728
38841
|
'searchbar-should-show-clear': this.shouldShowClearButton(),
|
|
38729
38842
|
'searchbar-should-show-cancel': this.shouldShowCancelButton(),
|
|
38730
|
-
}) }, hAsync("div", { key: '
|
|
38843
|
+
}) }, hAsync("div", { key: '94378bdfdf883c28941ef770d64347705d6f8345', class: "searchbar-input-container" }, hAsync("input", { key: 'deea2190823bf8652703148d308aa21473605930', "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 ? 'on' : 'off', spellcheck: this.spellcheck, ...this.inheritedAttributes }), mode === 'md' && cancelButton, hAsync("ion-icon", { key: '0ecc28496ab545f2064b71b994b4cbf0968c2108', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), hAsync("button", { key: '1bcc77d70eaa08f2ae7fc6173642f114fe387fb7', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
|
|
38731
38844
|
/**
|
|
38732
38845
|
* This prevents mobile browsers from
|
|
38733
38846
|
* blurring the input when the clear
|
|
38734
38847
|
* button is activated.
|
|
38735
38848
|
*/
|
|
38736
38849
|
ev.preventDefault();
|
|
38737
|
-
}, onClick: () => this.onClearInput(true) }, hAsync("ion-icon", { key: '
|
|
38850
|
+
}, onClick: () => this.onClearInput(true) }, hAsync("ion-icon", { key: 'bbf8d05eb1070a0d34a22236dfaaf11d8dcc06af', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
|
|
38738
38851
|
}
|
|
38739
38852
|
static get watchers() { return {
|
|
38740
38853
|
"lang": [{
|
|
@@ -39379,14 +39492,14 @@ class Segment {
|
|
|
39379
39492
|
}
|
|
39380
39493
|
render() {
|
|
39381
39494
|
const mode = getIonMode$1(this);
|
|
39382
|
-
return (hAsync(Host, { key: '
|
|
39495
|
+
return (hAsync(Host, { key: 'f74bd72f10f966129528497aa47b2c683a62d59e', role: "tablist", onClick: this.onClick, class: createColorClasses$1(this.color, {
|
|
39383
39496
|
[mode]: true,
|
|
39384
39497
|
'in-toolbar': hostContext('ion-toolbar', this.el),
|
|
39385
39498
|
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
|
|
39386
39499
|
'segment-activated': this.activated,
|
|
39387
39500
|
'segment-disabled': this.disabled,
|
|
39388
39501
|
'segment-scrollable': this.scrollable,
|
|
39389
|
-
}) }, hAsync("slot", { key: '
|
|
39502
|
+
}) }, hAsync("slot", { key: '79b0c6cce9d83d147b190ae5d77df7de29a6b42d', onSlotchange: this.onSlottedItemsChange })));
|
|
39390
39503
|
}
|
|
39391
39504
|
static get watchers() { return {
|
|
39392
39505
|
"color": [{
|
|
@@ -39541,7 +39654,7 @@ class SegmentButton {
|
|
|
39541
39654
|
const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
|
|
39542
39655
|
const mode = getIonMode$1(this);
|
|
39543
39656
|
const hasSegmentColor = () => segmentEl?.color !== undefined;
|
|
39544
|
-
return (hAsync(Host, { key: '
|
|
39657
|
+
return (hAsync(Host, { key: '2b4b7ad8b981d2ee39aba5b9c734de8a5bd045ba', class: {
|
|
39545
39658
|
[mode]: true,
|
|
39546
39659
|
'in-toolbar': hostContext('ion-toolbar', this.el),
|
|
39547
39660
|
'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
|
|
@@ -39557,7 +39670,7 @@ class SegmentButton {
|
|
|
39557
39670
|
'ion-activatable': true,
|
|
39558
39671
|
'ion-activatable-instant': true,
|
|
39559
39672
|
'ion-focusable': true,
|
|
39560
|
-
} }, hAsync("button", { key: '
|
|
39673
|
+
} }, hAsync("button", { key: '9cc58cfbe70844a0f5e1a307002e0d04e044be99', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled, ...this.inheritedAttributes }, hAsync("span", { key: '6443551951ce589efdb2d0e1fd1a14e35b82ed19', class: "button-inner" }, hAsync("slot", { key: 'c3548b469ae6e5477d8372cb28bc70dff3a24d18' })), mode === 'md' && hAsync("ion-ripple-effect", { key: 'fb176415ca1702766c4d7a5964ec0bb467bdcb55' })), hAsync("div", { key: 'aa22b4752f8336d0e232a1e0894e87023b284a08', part: "indicator", class: "segment-button-indicator segment-button-indicator-animated" }, hAsync("div", { key: '61e29ea52048fa0583fce6c20c81614a4d0199cb', part: "indicator-background", class: "segment-button-indicator-background" }))));
|
|
39561
39674
|
}
|
|
39562
39675
|
static get watchers() { return {
|
|
39563
39676
|
"value": [{
|
|
@@ -39593,7 +39706,7 @@ class SegmentContent {
|
|
|
39593
39706
|
registerInstance(this, hostRef);
|
|
39594
39707
|
}
|
|
39595
39708
|
render() {
|
|
39596
|
-
return (hAsync(Host, { key: '
|
|
39709
|
+
return (hAsync(Host, { key: 'b03079d7cfd78724828a4f42d7a7030457682b25' }, hAsync("slot", { key: 'c4c86280e5e577ee31a181758fea27a788fd87fa' })));
|
|
39597
39710
|
}
|
|
39598
39711
|
static get style() { return segmentContentCss(); }
|
|
39599
39712
|
static get cmpMeta() { return {
|
|
@@ -39724,11 +39837,11 @@ class SegmentView {
|
|
|
39724
39837
|
}
|
|
39725
39838
|
render() {
|
|
39726
39839
|
const { disabled, isManualScroll, swipeGesture } = this;
|
|
39727
|
-
return (hAsync(Host, { key: '
|
|
39840
|
+
return (hAsync(Host, { key: 'b3cd48fead5d2877ead68cf6d81955fc31530c7a', class: {
|
|
39728
39841
|
'segment-view-disabled': disabled,
|
|
39729
39842
|
'segment-view-scroll-disabled': isManualScroll === false,
|
|
39730
39843
|
'segment-view-swipe-disabled': swipeGesture === false,
|
|
39731
|
-
} }, hAsync("slot", { key: '
|
|
39844
|
+
} }, hAsync("slot", { key: 'ad5aa8b79790c490e13438afa0cbb2c241eab0a1' })));
|
|
39732
39845
|
}
|
|
39733
39846
|
static get style() { return {
|
|
39734
39847
|
ios: segmentViewIosCss(),
|
|
@@ -39749,9 +39862,9 @@ class SegmentView {
|
|
|
39749
39862
|
}; }
|
|
39750
39863
|
}
|
|
39751
39864
|
|
|
39752
|
-
const selectIosCss = () => `:host{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--placeholder-color:currentColor;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--background:transparent;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--select-text-media-height:1.5em;--select-text-media-width:1.5em;--select-text-gap:12px;--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;font-family:var(--ion-font-family, inherit);white-space:nowrap;cursor:pointer;z-index:2}:host(.select-label-placement-floating),:host(.select-label-placement-stacked){min-height:56px}:host(.ion-color){--highlight-color-focused:var(--ion-color-base)}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0}:host(.select-disabled){pointer-events:none}:host(.has-focus) button{border:2px solid #5e9ed6}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.select-placeholder{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}button{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}.select-icon{-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0;position:relative;-ms-flex-negative:0;flex-shrink:0}:host(.in-item-color) .select-icon{color:inherit}
|
|
39865
|
+
const selectIosCss = () => `:host{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--placeholder-color:currentColor;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--background:transparent;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--select-text-media-height:1.5em;--select-text-media-width:1.5em;--select-text-gap:12px;--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;font-family:var(--ion-font-family, inherit);white-space:nowrap;cursor:pointer;z-index:2}:host(.select-label-placement-floating),:host(.select-label-placement-stacked){min-height:56px}:host(.ion-color){--highlight-color-focused:var(--ion-color-base)}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0}:host(.select-disabled){pointer-events:none}:host(.has-focus) button{border:2px solid #5e9ed6}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.select-placeholder{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}button{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}.select-icon{-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0;position:relative;-ms-flex-negative:0;flex-shrink:0}:host(.in-item-color) .select-icon{color:inherit}.select-text{-ms-flex:1;flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:inherit;overflow:hidden}.select-text>*+*{-webkit-margin-start:var(--select-text-gap);margin-inline-start:var(--select-text-gap)}.select-text img,.select-text ion-img,.select-text ion-icon,.select-text ion-thumbnail,.select-text ion-avatar{border-radius:var(--select-text-media-border-radius);width:var(--select-text-media-width);height:var(--select-text-media-height);border-width:var(--select-text-media-border-width);border-style:var(--select-text-media-border-style);border-color:var(--select-text-media-border-color)}.select-wrapper{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal;cursor:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}.select-wrapper .select-placeholder{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.select-control{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:inherit;justify-content:inherit;min-width:0}:host(.ion-touched.ion-invalid){--highlight-color:var(--highlight-color-invalid)}:host(.ion-valid){--highlight-color:var(--highlight-color-valid)}.select-bottom{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}:host(.has-focus.ion-valid),:host(.select-expanded.ion-valid),:host(.ion-touched.ion-invalid),:host(.select-expanded.ion-touched.ion-invalid){--border-color:var(--highlight-color)}.select-bottom .error-text{display:none;color:var(--highlight-color-invalid)}.select-bottom .helper-text{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}:host(.ion-touched.ion-invalid) .select-bottom .error-text{display:block}:host(.ion-touched.ion-invalid) .select-bottom .helper-text{display:none}.label-text-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-width:0;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}:host(.skip-label-transition) .label-text-wrapper{-webkit-transition:none;transition:none}.label-text,::slotted([slot=label]){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden,.select-outline-notch-hidden{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-negative:100000;flex-shrink:100000;-ms-flex-align:center;align-items:center;-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden}:host(.select-justify-space-between) .select-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.select-justify-start) .select-wrapper{-ms-flex-pack:start;justify-content:start}:host(.select-justify-end) .select-wrapper{-ms-flex-pack:end;justify-content:end}:host(.select-label-placement-start) .select-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.select-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.select-label-placement-end) .select-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.select-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.select-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.select-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.select-label-placement-stacked) .select-control,:host(.select-label-placement-floating) .select-control{-ms-flex-direction:column;flex-direction:column;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:start}:host(.select-label-placement-stacked) .label-text-wrapper,:host(.select-label-placement-floating) .label-text-wrapper{max-width:100%}:host(.select-ltr.select-label-placement-stacked) .label-text-wrapper,:host(.select-ltr.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host(.select-rtl.select-label-placement-stacked) .label-text-wrapper,:host(.select-rtl.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}:host(.select-label-placement-stacked) .native-wrapper,:host(.select-label-placement-floating) .native-wrapper{-ms-flex-positive:1;flex-grow:1;width:100%}:host(.select-label-placement-floating) .label-text-wrapper{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}:host(.select-label-placement-floating) .native-wrapper .select-placeholder{opacity:0}:host(.label-floating.select-label-placement-floating) .native-wrapper .select-placeholder{opacity:var(--placeholder-opacity)}:host(.label-floating) .label-text-wrapper{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.select-start,.select-end{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center}::slotted([slot=start]),::slotted([slot=end]){-ms-flex-negative:0;flex-shrink:0}::slotted([slot=start]:last-of-type){-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}::slotted([slot=end]:first-of-type){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host{--border-width:0.55px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--highlight-height:0px}.select-icon{width:1.125rem;height:1.125rem;color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}:host(.select-disabled){opacity:0.3}::slotted(ion-button[slot=start].button-has-icon-only),::slotted(ion-button[slot=end].button-has-icon-only){--border-radius:50%;--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;aspect-ratio:1}`;
|
|
39753
39866
|
|
|
39754
|
-
const selectMdCss = () => `:host{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--placeholder-color:currentColor;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--background:transparent;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--select-text-media-height:1.5em;--select-text-media-width:1.5em;--select-text-gap:12px;--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;font-family:var(--ion-font-family, inherit);white-space:nowrap;cursor:pointer;z-index:2}:host(.select-label-placement-floating),:host(.select-label-placement-stacked){min-height:56px}:host(.ion-color){--highlight-color-focused:var(--ion-color-base)}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0}:host(.select-disabled){pointer-events:none}:host(.has-focus) button{border:2px solid #5e9ed6}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.select-placeholder{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}button{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}.select-icon{-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0;position:relative;-ms-flex-negative:0;flex-shrink:0}:host(.in-item-color) .select-icon{color:inherit}:host(.select-label-placement-stacked) .select-icon,:host(.select-label-placement-floating) .select-icon{position:absolute;height:100%}:host(.select-ltr.select-label-placement-stacked) .select-icon,:host(.select-ltr.select-label-placement-floating) .select-icon{right:var(--padding-end, 0)}:host(.select-rtl.select-label-placement-stacked) .select-icon,:host(.select-rtl.select-label-placement-floating) .select-icon{left:var(--padding-start, 0)}.select-text{-ms-flex:1;flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:inherit;overflow:hidden}.select-text>*+*{-webkit-margin-start:var(--select-text-gap);margin-inline-start:var(--select-text-gap)}.select-text img,.select-text ion-img,.select-text ion-icon,.select-text ion-thumbnail,.select-text ion-avatar{border-radius:var(--select-text-media-border-radius);width:var(--select-text-media-width);height:var(--select-text-media-height);border-width:var(--select-text-media-border-width);border-style:var(--select-text-media-border-style);border-color:var(--select-text-media-border-color)}.select-wrapper{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal;cursor:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}.select-wrapper .select-placeholder{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.select-wrapper-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;overflow:hidden}:host(.select-label-placement-stacked) .select-wrapper-inner,:host(.select-label-placement-floating) .select-wrapper-inner{-ms-flex-positive:1;flex-grow:1}:host(.ion-touched.ion-invalid){--highlight-color:var(--highlight-color-invalid)}:host(.ion-valid){--highlight-color:var(--highlight-color-valid)}.select-bottom{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}:host(.has-focus.ion-valid),:host(.select-expanded.ion-valid),:host(.ion-touched.ion-invalid),:host(.select-expanded.ion-touched.ion-invalid){--border-color:var(--highlight-color)}.select-bottom .error-text{display:none;color:var(--highlight-color-invalid)}.select-bottom .helper-text{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}:host(.ion-touched.ion-invalid) .select-bottom .error-text{display:block}:host(.ion-touched.ion-invalid) .select-bottom .helper-text{display:none}.label-text-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.label-text,::slotted([slot=label]){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden,.select-outline-notch-hidden{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden}:host(.select-justify-space-between) .select-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.select-justify-start) .select-wrapper{-ms-flex-pack:start;justify-content:start}:host(.select-justify-end) .select-wrapper{-ms-flex-pack:end;justify-content:end}:host(.select-label-placement-start) .select-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.select-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.select-label-placement-end) .select-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.select-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.select-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.select-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.select-label-placement-stacked) .select-wrapper,:host(.select-label-placement-floating) .select-wrapper{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}:host(.select-label-placement-stacked) .label-text-wrapper,:host(.select-label-placement-floating) .label-text-wrapper{max-width:100%}:host(.select-ltr.select-label-placement-stacked) .label-text-wrapper,:host(.select-ltr.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host(.select-rtl.select-label-placement-stacked) .label-text-wrapper,:host(.select-rtl.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}:host(.select-label-placement-stacked) .native-wrapper,:host(.select-label-placement-floating) .native-wrapper{margin-left:0;margin-right:0;margin-top:1px;margin-bottom:0;-ms-flex-positive:1;flex-grow:1;width:100%}:host(.select-label-placement-floating) .label-text-wrapper{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}:host(.select-label-placement-floating:not(.label-floating)) .native-wrapper .select-placeholder{opacity:0}:host(.select-expanded.select-label-placement-floating) .native-wrapper .select-placeholder,:host(.has-focus.select-label-placement-floating) .native-wrapper .select-placeholder,:host(.has-value.select-label-placement-floating) .native-wrapper .select-placeholder{opacity:1}:host(.label-floating) .label-text-wrapper{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}::slotted([slot=start]),::slotted([slot=end]){-ms-flex-negative:0;flex-shrink:0}::slotted([slot=start]:last-of-type){-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}::slotted([slot=end]:first-of-type){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host(.select-fill-solid){--background:var(--ion-color-step-50, var(--ion-background-color-step-50, #f2f2f2));--border-color:var(--ion-color-step-500, var(--ion-background-color-step-500, gray));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}:host(.select-fill-solid) .select-wrapper{border-bottom:var(--border-width) var(--border-style) var(--border-color)}:host(.select-expanded.select-fill-solid.ion-valid),:host(.has-focus.select-fill-solid.ion-valid),:host(.select-fill-solid.ion-touched.ion-invalid){--border-color:var(--highlight-color)}:host(.select-fill-solid) .select-bottom{border-top:none}@media (any-hover: hover){:host(.select-fill-solid:hover){--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}:host(.select-fill-solid.select-expanded),:host(.select-fill-solid.has-focus){--background:var(--ion-color-step-150, var(--ion-background-color-step-150, #d9d9d9));--border-color:var(--highlight-color)}:host(.select-fill-solid) .select-wrapper{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0px;border-end-start-radius:0px}:host(.label-floating.select-fill-solid) .label-text-wrapper{max-width:calc(100% / 0.75)}:host(.in-item.select-expanded.select-fill-solid) .select-wrapper .select-icon,:host(.in-item.has-focus.select-fill-solid) .select-wrapper .select-icon,:host(.in-item.has-focus.ion-valid.select-fill-solid) .select-wrapper .select-icon,:host(.in-item.ion-touched.ion-invalid.select-fill-solid) .select-wrapper .select-icon{color:var(--highlight-color)}:host(.select-fill-outline){--border-color:var(--ion-color-step-300, var(--ion-background-color-step-300, #b3b3b3));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}:host(.select-fill-outline.select-shape-round){--border-radius:28px;--padding-start:32px;--padding-end:32px}:host(.has-focus.select-fill-outline.ion-valid),:host(.select-fill-outline.ion-touched.ion-invalid){--border-color:var(--highlight-color)}@media (any-hover: hover){:host(.select-fill-outline:hover){--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}:host(.select-fill-outline.select-expanded),:host(.select-fill-outline.has-focus){--border-width:var(--highlight-height);--border-color:var(--highlight-color)}:host(.select-fill-outline) .select-bottom{border-top:none}:host(.select-fill-outline) .select-wrapper{border-bottom:none}:host(.select-ltr.select-fill-outline.select-label-placement-stacked) .label-text-wrapper,:host(.select-ltr.select-fill-outline.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host(.select-rtl.select-fill-outline.select-label-placement-stacked) .label-text-wrapper,:host(.select-rtl.select-fill-outline.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}:host(.select-fill-outline.select-label-placement-stacked) .label-text-wrapper,:host(.select-fill-outline.select-label-placement-floating) .label-text-wrapper{position:absolute;max-width:calc(100% - var(--padding-start) - var(--padding-end))}:host(.select-fill-outline) .label-text-wrapper{position:relative;z-index:1}:host(.label-floating.select-fill-outline) .label-text-wrapper{-webkit-transform:translateY(-32%) scale(0.75);transform:translateY(-32%) scale(0.75);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;max-width:calc((100% - var(--padding-start) - var(--padding-end) - 8px) / 0.75)}:host(.select-fill-outline.select-label-placement-stacked) select,:host(.select-fill-outline.select-label-placement-floating) select{margin-left:0;margin-right:0;margin-top:6px;margin-bottom:6px}:host(.select-fill-outline) .select-outline-container{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;width:100%;height:100%}:host(.select-fill-outline) .select-outline-start,:host(.select-fill-outline) .select-outline-end{pointer-events:none}:host(.select-fill-outline) .select-outline-start,:host(.select-fill-outline) .select-outline-notch,:host(.select-fill-outline) .select-outline-end{border-top:var(--border-width) var(--border-style) var(--border-color);border-bottom:var(--border-width) var(--border-style) var(--border-color);-webkit-box-sizing:border-box;box-sizing:border-box}:host(.select-fill-outline) .select-outline-notch{max-width:calc(100% - var(--padding-start) - var(--padding-end))}:host(.select-fill-outline) .notch-spacer{-webkit-padding-end:8px;padding-inline-end:8px;font-size:calc(1em * 0.75);opacity:0;pointer-events:none}:host(.select-fill-outline) .select-outline-start{-webkit-border-start:var(--border-width) var(--border-style) var(--border-color);border-inline-start:var(--border-width) var(--border-style) var(--border-color)}:host(.select-fill-outline) .select-outline-start{border-start-start-radius:var(--border-radius);border-start-end-radius:0px;border-end-end-radius:0px;border-end-start-radius:var(--border-radius)}:host(.select-fill-outline) .select-outline-start{width:calc(var(--padding-start) - 4px)}:host(.select-fill-outline) .select-outline-end{-webkit-border-end:var(--border-width) var(--border-style) var(--border-color);border-inline-end:var(--border-width) var(--border-style) var(--border-color)}:host(.select-fill-outline) .select-outline-end{border-start-start-radius:0px;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);border-end-start-radius:0px}:host(.select-fill-outline) .select-outline-end{-ms-flex-positive:1;flex-grow:1}:host(.label-floating.select-fill-outline) .select-outline-notch{border-top:none}:host(.in-item.select-expanded.select-fill-outline) .select-wrapper .select-icon,:host(.in-item.has-focus.select-fill-outline) .select-wrapper .select-icon,:host(.in-item.has-focus.ion-valid.select-fill-outline) .select-wrapper .select-icon,:host(.in-item.ion-touched.ion-invalid.select-fill-outline) .select-wrapper .select-icon{color:var(--highlight-color)}:host{--border-width:1px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.13)))));--highlight-height:2px}:host(.select-label-placement-floating.select-expanded) .label-text-wrapper,:host(.select-label-placement-floating.has-focus) .label-text-wrapper,:host(.select-label-placement-stacked.select-expanded) .label-text-wrapper,:host(.select-label-placement-stacked.has-focus) .label-text-wrapper{color:var(--highlight-color)}:host(.has-focus.select-label-placement-floating.ion-valid) .label-text-wrapper,:host(.select-label-placement-floating.ion-touched.ion-invalid) .label-text-wrapper,:host(.has-focus.select-label-placement-stacked.ion-valid) .label-text-wrapper,:host(.select-label-placement-stacked.ion-touched.ion-invalid) .label-text-wrapper{color:var(--highlight-color)}.select-highlight{bottom:-1px;position:absolute;width:100%;height:var(--highlight-height);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform 200ms;transition:-webkit-transform 200ms;transition:transform 200ms;transition:transform 200ms, -webkit-transform 200ms;background:var(--highlight-color)}.select-highlight{inset-inline-start:0}:host(.select-expanded) .select-highlight,:host(.has-focus) .select-highlight{-webkit-transform:scale(1);transform:scale(1)}:host(.in-item) .select-highlight{bottom:0}:host(.in-item) .select-highlight{inset-inline-start:0}.select-icon{width:0.8125rem;-webkit-transition:-webkit-transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host(.select-expanded:not(.has-expanded-icon)) .select-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host(.in-item.select-expanded) .select-wrapper .select-icon,:host(.in-item.has-focus) .select-wrapper .select-icon,:host(.in-item.has-focus.ion-valid) .select-wrapper .select-icon,:host(.in-item.ion-touched.ion-invalid) .select-wrapper .select-icon{color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host(.select-expanded) .select-wrapper .select-icon,:host(.has-focus.ion-valid) .select-wrapper .select-icon,:host(.ion-touched.ion-invalid) .select-wrapper .select-icon,:host(.has-focus) .select-wrapper .select-icon{color:var(--highlight-color)}:host(.select-shape-round){--border-radius:16px}:host(.select-label-placement-stacked) .select-wrapper-inner,:host(.select-label-placement-floating) .select-wrapper-inner{width:calc(100% - 0.8125rem - 4px)}:host(.select-disabled){opacity:0.38}::slotted(ion-button[slot=start].button-has-icon-only),::slotted(ion-button[slot=end].button-has-icon-only){--border-radius:50%;--padding-start:8px;--padding-end:8px;--padding-top:8px;--padding-bottom:8px;aspect-ratio:1;min-height:40px}`;
|
|
39867
|
+
const selectMdCss = () => `:host{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--placeholder-color:currentColor;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--background:transparent;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--select-text-media-height:1.5em;--select-text-media-width:1.5em;--select-text-gap:12px;--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;font-family:var(--ion-font-family, inherit);white-space:nowrap;cursor:pointer;z-index:2}:host(.select-label-placement-floating),:host(.select-label-placement-stacked){min-height:56px}:host(.ion-color){--highlight-color-focused:var(--ion-color-base)}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0}:host(.select-disabled){pointer-events:none}:host(.has-focus) button{border:2px solid #5e9ed6}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.select-placeholder{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}button{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}.select-icon{-webkit-margin-start:4px;margin-inline-start:4px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0;position:relative;-ms-flex-negative:0;flex-shrink:0}:host(.in-item-color) .select-icon{color:inherit}.select-text{-ms-flex:1;flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:inherit;overflow:hidden}.select-text>*+*{-webkit-margin-start:var(--select-text-gap);margin-inline-start:var(--select-text-gap)}.select-text img,.select-text ion-img,.select-text ion-icon,.select-text ion-thumbnail,.select-text ion-avatar{border-radius:var(--select-text-media-border-radius);width:var(--select-text-media-width);height:var(--select-text-media-height);border-width:var(--select-text-media-border-width);border-style:var(--select-text-media-border-style);border-color:var(--select-text-media-border-color)}.select-wrapper{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:justify;justify-content:space-between;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal;cursor:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}.select-wrapper .select-placeholder{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.select-control{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:inherit;justify-content:inherit;min-width:0}:host(.ion-touched.ion-invalid){--highlight-color:var(--highlight-color-invalid)}:host(.ion-valid){--highlight-color:var(--highlight-color-valid)}.select-bottom{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}:host(.has-focus.ion-valid),:host(.select-expanded.ion-valid),:host(.ion-touched.ion-invalid),:host(.select-expanded.ion-touched.ion-invalid){--border-color:var(--highlight-color)}.select-bottom .error-text{display:none;color:var(--highlight-color-invalid)}.select-bottom .helper-text{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}:host(.ion-touched.ion-invalid) .select-bottom .error-text{display:block}:host(.ion-touched.ion-invalid) .select-bottom .helper-text{display:none}.label-text-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-width:0;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}:host(.skip-label-transition) .label-text-wrapper{-webkit-transition:none;transition:none}.label-text,::slotted([slot=label]){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden,.select-outline-notch-hidden{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-negative:100000;flex-shrink:100000;-ms-flex-align:center;align-items:center;-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden}:host(.select-justify-space-between) .select-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.select-justify-start) .select-wrapper{-ms-flex-pack:start;justify-content:start}:host(.select-justify-end) .select-wrapper{-ms-flex-pack:end;justify-content:end}:host(.select-label-placement-start) .select-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.select-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.select-label-placement-end) .select-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.select-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.select-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.select-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.select-label-placement-stacked) .select-control,:host(.select-label-placement-floating) .select-control{-ms-flex-direction:column;flex-direction:column;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:start}:host(.select-label-placement-stacked) .label-text-wrapper,:host(.select-label-placement-floating) .label-text-wrapper{max-width:100%}:host(.select-ltr.select-label-placement-stacked) .label-text-wrapper,:host(.select-ltr.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host(.select-rtl.select-label-placement-stacked) .label-text-wrapper,:host(.select-rtl.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}:host(.select-label-placement-stacked) .native-wrapper,:host(.select-label-placement-floating) .native-wrapper{-ms-flex-positive:1;flex-grow:1;width:100%}:host(.select-label-placement-floating) .label-text-wrapper{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}:host(.select-label-placement-floating) .native-wrapper .select-placeholder{opacity:0}:host(.label-floating.select-label-placement-floating) .native-wrapper .select-placeholder{opacity:var(--placeholder-opacity)}:host(.label-floating) .label-text-wrapper{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.select-start,.select-end{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center}::slotted([slot=start]),::slotted([slot=end]){-ms-flex-negative:0;flex-shrink:0}::slotted([slot=start]:last-of-type){-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}::slotted([slot=end]:first-of-type){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host(.select-fill-solid){--background:var(--ion-color-step-50, var(--ion-background-color-step-50, #f2f2f2));--border-color:var(--ion-color-step-500, var(--ion-background-color-step-500, gray));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}:host(.select-fill-solid) .select-wrapper{border-bottom:var(--border-width) var(--border-style) var(--border-color)}:host(.select-expanded.select-fill-solid.ion-valid),:host(.has-focus.select-fill-solid.ion-valid),:host(.select-fill-solid.ion-touched.ion-invalid){--border-color:var(--highlight-color)}:host(.select-fill-solid) .select-bottom{border-top:none}@media (any-hover: hover){:host(.select-fill-solid:hover){--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}:host(.select-fill-solid.select-expanded),:host(.select-fill-solid.has-focus){--background:var(--ion-color-step-150, var(--ion-background-color-step-150, #d9d9d9));--border-color:var(--highlight-color)}:host(.select-fill-solid) .select-wrapper{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0px;border-end-start-radius:0px}:host(.label-floating.select-fill-solid) .label-text-wrapper{max-width:calc(100% / 0.75)}:host(.in-item.select-expanded.select-fill-solid) .select-wrapper .select-icon,:host(.in-item.has-focus.select-fill-solid) .select-wrapper .select-icon,:host(.in-item.has-focus.ion-valid.select-fill-solid) .select-wrapper .select-icon,:host(.in-item.ion-touched.ion-invalid.select-fill-solid) .select-wrapper .select-icon{color:var(--highlight-color)}:host(.select-fill-outline){--border-color:var(--ion-color-step-300, var(--ion-background-color-step-300, #b3b3b3));--border-radius:4px;--padding-start:16px;--padding-end:16px;--internal-start-container-adjustment:0px;min-height:56px}:host(.select-fill-outline.select-shape-round){--border-radius:28px;--padding-start:32px;--padding-end:32px}:host(.has-focus.select-fill-outline.ion-valid),:host(.select-fill-outline.ion-touched.ion-invalid){--border-color:var(--highlight-color)}@media (any-hover: hover){:host(.select-fill-outline:hover){--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}:host(.select-fill-outline.select-expanded),:host(.select-fill-outline.has-focus){--border-width:var(--highlight-height);--border-color:var(--highlight-color)}:host(.select-fill-outline) .select-bottom{border-top:none}:host(.select-fill-outline) .select-wrapper{border-bottom:none}:host(.select-ltr.select-fill-outline.select-label-placement-stacked) .label-text-wrapper,:host(.select-ltr.select-fill-outline.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host(.select-rtl.select-fill-outline.select-label-placement-stacked) .label-text-wrapper,:host(.select-rtl.select-fill-outline.select-label-placement-floating) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}:host(.select-fill-outline.select-label-placement-stacked) .label-text-wrapper,:host(.select-fill-outline.select-label-placement-floating) .label-text-wrapper{position:absolute;max-width:100%}:host(.select-fill-outline) .label-text-wrapper{position:relative;z-index:1}:host(.select-fill-outline:not(.label-floating)) .select-control{position:relative}:host(.label-floating.select-fill-outline) .label-text-wrapper{-webkit-transform:translate(var(--internal-start-container-adjustment, 0px), -32%) scale(0.75);transform:translate(var(--internal-start-container-adjustment, 0px), -32%) scale(0.75);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;max-width:calc((100% - var(--padding-start) - var(--padding-end) - 8px) / 0.75)}:host(.select-fill-outline.select-label-placement-stacked) select,:host(.select-fill-outline.select-label-placement-floating) select{margin-left:0;margin-right:0;margin-top:6px;margin-bottom:6px}:host(.select-fill-outline) .select-outline-container{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;width:100%;height:100%}:host(.select-fill-outline) .select-outline-start,:host(.select-fill-outline) .select-outline-end{pointer-events:none}:host(.select-fill-outline) .select-outline-start,:host(.select-fill-outline) .select-outline-notch,:host(.select-fill-outline) .select-outline-end{border-top:var(--border-width) var(--border-style) var(--border-color);border-bottom:var(--border-width) var(--border-style) var(--border-color);-webkit-box-sizing:border-box;box-sizing:border-box}:host(.select-fill-outline) .select-outline-notch{max-width:calc(100% - var(--padding-start) - var(--padding-end))}:host(.select-fill-outline) .notch-spacer{-webkit-padding-end:8px;padding-inline-end:8px;font-size:calc(1em * 0.75);opacity:0;pointer-events:none}:host(.select-fill-outline) .select-outline-start{-webkit-border-start:var(--border-width) var(--border-style) var(--border-color);border-inline-start:var(--border-width) var(--border-style) var(--border-color);border-start-start-radius:var(--border-radius);border-start-end-radius:0px;border-end-end-radius:0px;border-end-start-radius:var(--border-radius);width:calc(var(--padding-start) - 4px)}:host(.select-fill-outline) .select-outline-end{-webkit-border-end:var(--border-width) var(--border-style) var(--border-color);border-inline-end:var(--border-width) var(--border-style) var(--border-color);border-start-start-radius:0px;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);border-end-start-radius:0px;-ms-flex-positive:1;flex-grow:1}:host(.label-floating.select-fill-outline) .select-outline-notch{border-top:none}:host(.in-item.select-expanded.select-fill-outline) .select-wrapper .select-icon,:host(.in-item.has-focus.select-fill-outline) .select-wrapper .select-icon,:host(.in-item.has-focus.ion-valid.select-fill-outline) .select-wrapper .select-icon,:host(.in-item.ion-touched.ion-invalid.select-fill-outline) .select-wrapper .select-icon{color:var(--highlight-color)}:host{--border-width:1px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.13)))));--highlight-height:2px}:host(.select-label-placement-floating.select-expanded) .label-text-wrapper,:host(.select-label-placement-floating.has-focus) .label-text-wrapper,:host(.select-label-placement-stacked.select-expanded) .label-text-wrapper,:host(.select-label-placement-stacked.has-focus) .label-text-wrapper{color:var(--highlight-color)}:host(.has-focus.select-label-placement-floating.ion-valid) .label-text-wrapper,:host(.select-label-placement-floating.ion-touched.ion-invalid) .label-text-wrapper,:host(.has-focus.select-label-placement-stacked.ion-valid) .label-text-wrapper,:host(.select-label-placement-stacked.ion-touched.ion-invalid) .label-text-wrapper{color:var(--highlight-color)}.select-highlight{bottom:-1px;position:absolute;width:100%;height:var(--highlight-height);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform 200ms;transition:-webkit-transform 200ms;transition:transform 200ms;transition:transform 200ms, -webkit-transform 200ms;background:var(--highlight-color)}.select-highlight{inset-inline-start:0}:host(.select-expanded) .select-highlight,:host(.has-focus) .select-highlight{-webkit-transform:scale(1);transform:scale(1)}:host(.in-item) .select-highlight{bottom:0}:host(.in-item) .select-highlight{inset-inline-start:0}.select-icon{width:0.8125rem;-webkit-transition:-webkit-transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);transition:transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host(.select-expanded:not(.has-expanded-icon)) .select-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host(.in-item.select-expanded) .select-wrapper .select-icon,:host(.in-item.has-focus) .select-wrapper .select-icon,:host(.in-item.has-focus.ion-valid) .select-wrapper .select-icon,:host(.in-item.ion-touched.ion-invalid) .select-wrapper .select-icon{color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host(.select-expanded) .select-wrapper .select-icon,:host(.has-focus.ion-valid) .select-wrapper .select-icon,:host(.ion-touched.ion-invalid) .select-wrapper .select-icon,:host(.has-focus) .select-wrapper .select-icon{color:var(--highlight-color)}:host(.select-shape-round){--border-radius:16px}:host(.select-disabled){opacity:0.38}::slotted(ion-button[slot=start].button-has-icon-only),::slotted(ion-button[slot=end].button-has-icon-only){--border-radius:50%;--padding-start:8px;--padding-end:8px;--padding-top:8px;--padding-bottom:8px;aspect-ratio:1;min-height:40px}`;
|
|
39755
39868
|
|
|
39756
39869
|
// TODO(FW-2832): types
|
|
39757
39870
|
/**
|
|
@@ -39771,7 +39884,9 @@ const selectMdCss = () => `:host{--padding-top:0px;--padding-end:0px;--padding-b
|
|
|
39771
39884
|
* @part error-text - Supporting text displayed beneath the select when the select is invalid and touched.
|
|
39772
39885
|
* @part bottom - The container element for helper text, error text, and counter.
|
|
39773
39886
|
* @part wrapper - The clickable label element that wraps the entire form field (label text, slots, selected values or placeholder, and toggle icons).
|
|
39774
|
-
* @part
|
|
39887
|
+
* @part start - The wrapper element for the content in the start slot.
|
|
39888
|
+
* @part control - The wrapper element containing the label and native select control. When the label is not floating or stacked, this part also contains the dropdown icon.
|
|
39889
|
+
* @part end - The wrapper element for the content in the end slot. When the label is floating or stacked, this part also contains the dropdown icon.
|
|
39775
39890
|
*/
|
|
39776
39891
|
class Select {
|
|
39777
39892
|
constructor(hostRef) {
|
|
@@ -39790,10 +39905,13 @@ class Select {
|
|
|
39790
39905
|
focusEl;
|
|
39791
39906
|
mutationO;
|
|
39792
39907
|
inheritedAttributes = {};
|
|
39908
|
+
slotMutationController;
|
|
39793
39909
|
nativeWrapperEl;
|
|
39794
39910
|
notchSpacerEl;
|
|
39795
39911
|
validationObserver;
|
|
39796
39912
|
notchController;
|
|
39913
|
+
startContainerController;
|
|
39914
|
+
startContainerEl;
|
|
39797
39915
|
customHTMLEnabled = config.get('innerHTMLTemplatesEnabled', ENABLE_HTML_CONTENT_DEFAULT);
|
|
39798
39916
|
get el() { return getElement(this); }
|
|
39799
39917
|
isExpanded = false;
|
|
@@ -40004,7 +40122,14 @@ class Select {
|
|
|
40004
40122
|
}
|
|
40005
40123
|
async connectedCallback() {
|
|
40006
40124
|
const { el } = this;
|
|
40125
|
+
this.slotMutationController = createSlotMutationController(el, ['label', 'start', 'end'], () => {
|
|
40126
|
+
this.startContainerController?.calculateStartContainerWidth();
|
|
40127
|
+
});
|
|
40007
40128
|
this.notchController = createNotchController(el, () => this.notchSpacerEl, () => this.labelSlot);
|
|
40129
|
+
this.startContainerController = createStartContainerController(el, () => this.startContainerEl, () => {
|
|
40130
|
+
return Build.isBrowser;
|
|
40131
|
+
});
|
|
40132
|
+
this.startContainerController.calculateStartContainerWidth();
|
|
40008
40133
|
this.updateOverlayOptions();
|
|
40009
40134
|
this.emitStyle();
|
|
40010
40135
|
this.mutationO = watchForOptions(this.el, 'ion-select-option', async () => {
|
|
@@ -40035,10 +40160,18 @@ class Select {
|
|
|
40035
40160
|
this.mutationO.disconnect();
|
|
40036
40161
|
this.mutationO = undefined;
|
|
40037
40162
|
}
|
|
40163
|
+
if (this.slotMutationController) {
|
|
40164
|
+
this.slotMutationController.destroy();
|
|
40165
|
+
this.slotMutationController = undefined;
|
|
40166
|
+
}
|
|
40038
40167
|
if (this.notchController) {
|
|
40039
40168
|
this.notchController.destroy();
|
|
40040
40169
|
this.notchController = undefined;
|
|
40041
40170
|
}
|
|
40171
|
+
if (this.startContainerController) {
|
|
40172
|
+
this.startContainerController.destroy();
|
|
40173
|
+
this.startContainerController = undefined;
|
|
40174
|
+
}
|
|
40042
40175
|
// Clean up validation observer to prevent memory leaks.
|
|
40043
40176
|
if (this.validationObserver) {
|
|
40044
40177
|
this.validationObserver.disconnect();
|
|
@@ -40508,6 +40641,7 @@ class Select {
|
|
|
40508
40641
|
}
|
|
40509
40642
|
componentDidRender() {
|
|
40510
40643
|
this.notchController?.calculateNotchWidth();
|
|
40644
|
+
this.startContainerController?.calculateStartContainerWidth();
|
|
40511
40645
|
}
|
|
40512
40646
|
/**
|
|
40513
40647
|
* Gets any content passed into the `label` slot,
|
|
@@ -40526,44 +40660,24 @@ class Select {
|
|
|
40526
40660
|
return this.label !== undefined || this.labelSlot !== null;
|
|
40527
40661
|
}
|
|
40528
40662
|
/**
|
|
40529
|
-
* Stops propagation when
|
|
40530
|
-
*
|
|
40663
|
+
* Stops propagation for re-dispatched clicks (when already expanded) to
|
|
40664
|
+
* prevent double-click events. Allows initial button clicks (from keyboard
|
|
40665
|
+
* or mouse) and slotted content clicks to propagate so event delegation
|
|
40666
|
+
* works for parent handlers.
|
|
40531
40667
|
*/
|
|
40532
40668
|
onLabelClick = (ev) => {
|
|
40533
|
-
|
|
40534
|
-
// and not on the input or other child elements
|
|
40535
|
-
if (ev.target === ev.currentTarget) {
|
|
40669
|
+
if (ev.target === this.focusEl && this.isExpanded) {
|
|
40536
40670
|
ev.stopPropagation();
|
|
40537
40671
|
}
|
|
40538
40672
|
};
|
|
40539
40673
|
/**
|
|
40540
|
-
* Renders the border
|
|
40541
|
-
* when fill="outline".
|
|
40674
|
+
* Renders the outline border with a notch for the label.
|
|
40542
40675
|
*/
|
|
40543
|
-
|
|
40544
|
-
|
|
40545
|
-
|
|
40546
|
-
|
|
40547
|
-
|
|
40548
|
-
* The outline fill has a special outline
|
|
40549
|
-
* that appears around the select and the label.
|
|
40550
|
-
* Certain stacked and floating label placements cause the
|
|
40551
|
-
* label to translate up and create a "cut out"
|
|
40552
|
-
* inside of that border by using the notch-spacer element.
|
|
40553
|
-
*/
|
|
40554
|
-
return [
|
|
40555
|
-
hAsync("div", { class: "select-outline-container" }, hAsync("div", { class: "select-outline-start" }), hAsync("div", { class: {
|
|
40556
|
-
'select-outline-notch': true,
|
|
40557
|
-
'select-outline-notch-hidden': !this.hasLabel,
|
|
40558
|
-
} }, hAsync("div", { class: "notch-spacer", "aria-hidden": "true", ref: (el) => (this.notchSpacerEl = el) }, this.label)), hAsync("div", { class: "select-outline-end" })),
|
|
40559
|
-
this.renderLabel(),
|
|
40560
|
-
];
|
|
40561
|
-
}
|
|
40562
|
-
/**
|
|
40563
|
-
* If not using the outline style,
|
|
40564
|
-
* we can render just the label.
|
|
40565
|
-
*/
|
|
40566
|
-
return this.renderLabel();
|
|
40676
|
+
renderOutlineContainer() {
|
|
40677
|
+
return (hAsync("div", { class: "select-outline-container" }, hAsync("div", { class: "select-outline-start" }), hAsync("div", { class: {
|
|
40678
|
+
'select-outline-notch': true,
|
|
40679
|
+
'select-outline-notch-hidden': !this.hasLabel,
|
|
40680
|
+
} }, hAsync("div", { class: "notch-spacer", "aria-hidden": "true", ref: (el) => (this.notchSpacerEl = el) }, this.label)), hAsync("div", { class: "select-outline-end" })));
|
|
40567
40681
|
}
|
|
40568
40682
|
/**
|
|
40569
40683
|
* Wraps text nodes in the select text with span elements
|
|
@@ -40723,28 +40837,10 @@ class Select {
|
|
|
40723
40837
|
const inItem = hostContext('ion-item', this.el);
|
|
40724
40838
|
const shouldRenderHighlight = mode === 'md' && fill !== 'outline' && !inItem;
|
|
40725
40839
|
const hasValue = this.hasValue();
|
|
40726
|
-
const
|
|
40840
|
+
const hasOutlineFill = mode === 'md' && fill === 'outline';
|
|
40727
40841
|
renderHiddenInput(true, el, name, parseValue(value), disabled);
|
|
40728
|
-
|
|
40729
|
-
|
|
40730
|
-
* For floating labels, the label should move above the select if
|
|
40731
|
-
* the select has a value, is open, or has anything in either
|
|
40732
|
-
* the start or end slot.
|
|
40733
|
-
*
|
|
40734
|
-
* If there is content in the start slot, the label would overlap
|
|
40735
|
-
* it if not forced to float. This is also applied to the end slot
|
|
40736
|
-
* because with the default or solid fills, the select is not
|
|
40737
|
-
* vertically centered in the container, but the label is. This
|
|
40738
|
-
* causes the slots and label to appear vertically offset from each
|
|
40739
|
-
* other when the label isn't floating above the input. This doesn't
|
|
40740
|
-
* apply to the outline fill, but this was not accounted for to keep
|
|
40741
|
-
* things consistent.
|
|
40742
|
-
*
|
|
40743
|
-
* TODO(FW-5592): Remove hasStartEndSlots condition
|
|
40744
|
-
*/
|
|
40745
|
-
const labelShouldFloat = labelPlacement === 'stacked' ||
|
|
40746
|
-
(labelPlacement === 'floating' && (hasValue || hasFocus || isExpanded || hasStartEndSlots));
|
|
40747
|
-
return (hAsync(Host, { key: 'e693afee7852c89be122b785230ed8fc9be5ba61', onClick: this.onClick, class: createColorClasses$1(this.color, {
|
|
40842
|
+
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || isExpanded));
|
|
40843
|
+
return (hAsync(Host, { key: '5d1e5bf46d0f204efdcb55cc42cfde52e6db304b', onClick: this.onClick, class: createColorClasses$1(this.color, {
|
|
40748
40844
|
[mode]: true,
|
|
40749
40845
|
'in-item': inItem,
|
|
40750
40846
|
'in-item-color': hostContext('ion-item.ion-color', el),
|
|
@@ -40762,7 +40858,7 @@ class Select {
|
|
|
40762
40858
|
[`select-justify-${justify}`]: justifyEnabled,
|
|
40763
40859
|
[`select-shape-${shape}`]: shape !== undefined,
|
|
40764
40860
|
[`select-label-placement-${labelPlacement}`]: true,
|
|
40765
|
-
}) }, hAsync("label", { key: '
|
|
40861
|
+
}) }, hAsync("label", { key: '15fd1f8e06510ae8472c621cf8cf90e51172e0be', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick, part: "wrapper" }, hasOutlineFill && this.renderOutlineContainer(), hAsync("div", { key: '7964e3d9351671899793b117896acdda25ec24c4', class: "select-start", part: "start", ref: (el) => (this.startContainerEl = el) }, hAsync("slot", { key: 'aa309ef155c4025acfd7ed5739b5221c85097b36', name: "start" })), hAsync("div", { key: '23d5a9dfea64a9d81b0b36d9426b15bed98901b9', class: "select-control", part: "control" }, this.renderLabel(), hAsync("div", { key: '810da9fbfa8771e09b5fb768d64e5f04858b5833', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox(), !hasFloatingOrStackedLabel && this.renderSelectIcon())), hAsync("div", { key: 'bf1c04704326ecfa14cf2e49bb76d3fb45beb08d', class: "select-end", part: "end" }, hasFloatingOrStackedLabel && this.renderSelectIcon(), hAsync("slot", { key: '76a8bcaeefdcaa908aebd820d93171b08165cee3', name: "end" })), shouldRenderHighlight && hAsync("div", { key: '55a9c417a82323a44e16328fd62a634d9d7c558b', class: "select-highlight" })), this.renderBottomContent()));
|
|
40766
40862
|
}
|
|
40767
40863
|
static get watchers() { return {
|
|
40768
40864
|
"disabled": [{
|
|
@@ -41193,7 +41289,7 @@ class SelectModal {
|
|
|
41193
41289
|
});
|
|
41194
41290
|
}
|
|
41195
41291
|
render() {
|
|
41196
|
-
return (hAsync(Host, { key: '
|
|
41292
|
+
return (hAsync(Host, { key: '791e95b985dd4b135db17a25fc678e9f8b73c597', class: getIonMode$1(this) }, hAsync("ion-header", { key: '697d18eef394c4c11c73afe69b9eadd1bad97d38' }, hAsync("ion-toolbar", { key: '036968824ad8771020fe2b7604a6e72b73efc8ae' }, this.header !== undefined && hAsync("ion-title", { key: '102e0346be83e879e733f9b410437b26216156aa' }, this.header), hAsync("ion-buttons", { key: '436b997e990ce2f5e12e1651f8afc31ae231f7b0', slot: "end" }, hAsync("ion-button", { key: 'ee4ddfd0612d33583aa0b93ebdb5257b10d4fda5', onClick: () => this.closeModal() }, this.cancelText)))), hAsync("ion-content", { key: '38ea098f85ac69226e614e0a09f668e9209f7ea1' }, hAsync("ion-list", { key: '20becc2537a1a027915fe0598203039ceb8ba4f3' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
|
|
41197
41293
|
}
|
|
41198
41294
|
static get style() { return {
|
|
41199
41295
|
ionic: ionicSelectModalMdCss(),
|
|
@@ -41273,7 +41369,7 @@ class SelectOption {
|
|
|
41273
41369
|
*/
|
|
41274
41370
|
justify;
|
|
41275
41371
|
render() {
|
|
41276
|
-
return hAsync(Host, { key: '
|
|
41372
|
+
return hAsync(Host, { key: '01275b5a613c4b065b24e0d939f611f6ed1fc9ee', role: "option", id: this.inputId, class: getIonMode$1(this) });
|
|
41277
41373
|
}
|
|
41278
41374
|
static get style() { return selectOptionCss(); }
|
|
41279
41375
|
static get cmpMeta() { return {
|
|
@@ -41470,7 +41566,7 @@ class SelectPopover {
|
|
|
41470
41566
|
render() {
|
|
41471
41567
|
const { header, message, options, subHeader } = this;
|
|
41472
41568
|
const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
|
|
41473
|
-
return (hAsync(Host, { key: '
|
|
41569
|
+
return (hAsync(Host, { key: '4b4ac4a4b6523147e7c1f5e29dd8043867f2baea', class: getIonMode$1(this) }, hAsync("ion-list", { key: 'f700d3dc3ce68c20a4d981164b29262564097fb4' }, header !== undefined && hAsync("ion-list-header", { key: '196bcd7963f13ef8bc46231545eee4cb8d526f5e' }, header), hasSubHeaderOrMessage && (hAsync("ion-item", { key: 'bb108e0aa2409997df35f52cb67e58e55e0fd630' }, hAsync("ion-label", { key: '59e8d9196ff976f3835766662654c0f085e58ec3', class: "ion-text-wrap" }, subHeader !== undefined && hAsync("h3", { key: '532f75d7c129ffadca4e6cbb619a4427aaede65c' }, subHeader), message !== undefined && hAsync("p", { key: 'fc42c91594b9001e983cb5e4176fc4c9bff0f708' }, message)))), this.renderOptions(options))));
|
|
41474
41570
|
}
|
|
41475
41571
|
static get style() { return {
|
|
41476
41572
|
ios: selectPopoverIosCss(),
|
|
@@ -41525,11 +41621,11 @@ class SkeletonText {
|
|
|
41525
41621
|
const animated = this.animated && config.getBoolean('animated', true);
|
|
41526
41622
|
const inMedia = hostContext('ion-avatar', this.el) || hostContext('ion-thumbnail', this.el);
|
|
41527
41623
|
const mode = getIonMode$1(this);
|
|
41528
|
-
return (hAsync(Host, { key: '
|
|
41624
|
+
return (hAsync(Host, { key: '1114e5caf6419e9458db8256480b39e6989963b2', class: {
|
|
41529
41625
|
[mode]: true,
|
|
41530
41626
|
'skeleton-text-animated': animated,
|
|
41531
41627
|
'in-media': inMedia,
|
|
41532
|
-
} }, hAsync("span", { key: '
|
|
41628
|
+
} }, hAsync("span", { key: '9137cf837f163fc0653437fc003666cddac103b0' }, "\u00A0")));
|
|
41533
41629
|
}
|
|
41534
41630
|
static get style() { return skeletonTextCss(); }
|
|
41535
41631
|
static get cmpMeta() { return {
|
|
@@ -41594,7 +41690,7 @@ class Spinner {
|
|
|
41594
41690
|
svgs.push(buildLine(spinner, duration, i, spinner.lines));
|
|
41595
41691
|
}
|
|
41596
41692
|
}
|
|
41597
|
-
return (hAsync(Host, { key: '
|
|
41693
|
+
return (hAsync(Host, { key: '87102ff9ea58b0ecde5d0978386374f7d0e9cf98', class: createColorClasses$1(self.color, {
|
|
41598
41694
|
[mode]: true,
|
|
41599
41695
|
[`spinner-${spinnerName}`]: true,
|
|
41600
41696
|
'spinner-paused': self.paused || config.getBoolean('_testing'),
|
|
@@ -41707,12 +41803,12 @@ class SplitPane {
|
|
|
41707
41803
|
}
|
|
41708
41804
|
render() {
|
|
41709
41805
|
const mode = getIonMode$1(this);
|
|
41710
|
-
return (hAsync(Host, { key: '
|
|
41806
|
+
return (hAsync(Host, { key: '652bc0965ae962dc36a67fd7129dacaa1ba8e551', class: {
|
|
41711
41807
|
[mode]: true,
|
|
41712
41808
|
// Used internally for styling
|
|
41713
41809
|
[`split-pane-${mode}`]: true,
|
|
41714
41810
|
'split-pane-visible': this.visible,
|
|
41715
|
-
} }, hAsync("slot", { key: '
|
|
41811
|
+
} }, hAsync("slot", { key: '9eac85f4c4e33ec00e8e16e2679f5975d7652452' })));
|
|
41716
41812
|
}
|
|
41717
41813
|
static get watchers() { return {
|
|
41718
41814
|
"visible": [{
|
|
@@ -41803,10 +41899,10 @@ class Tab {
|
|
|
41803
41899
|
}
|
|
41804
41900
|
render() {
|
|
41805
41901
|
const { tab, active, component } = this;
|
|
41806
|
-
return (hAsync(Host, { key: '
|
|
41902
|
+
return (hAsync(Host, { key: '8ecbd7a85d3370ed8ed40561cd8134e71584d6aa', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
|
|
41807
41903
|
'ion-page': component === undefined,
|
|
41808
41904
|
'tab-hidden': !active,
|
|
41809
|
-
} }, hAsync("slot", { key: '
|
|
41905
|
+
} }, hAsync("slot", { key: '8d6326d75812888e33fd09665b7e588e1e270df1' })));
|
|
41810
41906
|
}
|
|
41811
41907
|
static get watchers() { return {
|
|
41812
41908
|
"active": [{
|
|
@@ -41939,11 +42035,11 @@ class TabBar {
|
|
|
41939
42035
|
const { color, translucent, keyboardVisible } = this;
|
|
41940
42036
|
const mode = getIonMode$1(this);
|
|
41941
42037
|
const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
|
|
41942
|
-
return (hAsync(Host, { key: '
|
|
42038
|
+
return (hAsync(Host, { key: '5c56cffd380df7720f3309af7cfca71500817678', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses$1(color, {
|
|
41943
42039
|
[mode]: true,
|
|
41944
42040
|
'tab-bar-translucent': translucent,
|
|
41945
42041
|
'tab-bar-hidden': shouldHide,
|
|
41946
|
-
}) }, hAsync("slot", { key: '
|
|
42042
|
+
}) }, hAsync("slot", { key: 'a98d3298320f864578e30e0fb79a2cc0cccb46d9' })));
|
|
41947
42043
|
}
|
|
41948
42044
|
static get watchers() { return {
|
|
41949
42045
|
"selectedTab": [{
|
|
@@ -42081,7 +42177,7 @@ class TabButton {
|
|
|
42081
42177
|
rel,
|
|
42082
42178
|
target,
|
|
42083
42179
|
};
|
|
42084
|
-
return (hAsync(Host, { key: '
|
|
42180
|
+
return (hAsync(Host, { key: '45bb7ffa6d8764202adc2c5c393748d4003e86fe', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
|
|
42085
42181
|
[mode]: true,
|
|
42086
42182
|
'tab-selected': selected,
|
|
42087
42183
|
'tab-disabled': disabled,
|
|
@@ -42093,7 +42189,7 @@ class TabButton {
|
|
|
42093
42189
|
'ion-activatable': true,
|
|
42094
42190
|
'ion-selectable': true,
|
|
42095
42191
|
'ion-focusable': true,
|
|
42096
|
-
} }, hAsync("a", { key: '
|
|
42192
|
+
} }, hAsync("a", { key: '78c416609a2b86a6e7c5f217ffd2a6b9f80a5103', ...attrs, class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined, ...inheritedAttributes }, hAsync("span", { key: '62934156439ffd0ab86674b9cf89d9cfa0d3589c', class: "button-inner" }, hAsync("slot", { key: '293ba8f5ef50373c4e6e492dcaa55b3d2aae8d2f' })), mode === 'md' && hAsync("ion-ripple-effect", { key: '360b010afedcf17fc1f3ab6d192f0f8c7b1cf112', type: "unbounded" }))));
|
|
42097
42193
|
}
|
|
42098
42194
|
static get style() { return {
|
|
42099
42195
|
ios: tabButtonIosCss(),
|
|
@@ -42298,7 +42394,7 @@ class Tabs {
|
|
|
42298
42394
|
}
|
|
42299
42395
|
};
|
|
42300
42396
|
render() {
|
|
42301
|
-
return (hAsync(Host, { key: '
|
|
42397
|
+
return (hAsync(Host, { key: '7b8c6455e0673e343d0c759ed85e0d9970de3bb8', onIonTabButtonClick: this.onTabClicked }, hAsync("slot", { key: '7d0d840ae03312ca22bcb694ffca738d6648218e', name: "top" }), hAsync("div", { key: 'f336d903800af34af0d36adfc94223b940111e6a', class: "tabs-inner" }, hAsync("slot", { key: '14656154959a24ae176eff20f6463043180d2eae' })), hAsync("slot", { key: '2be4d114f058d24b0e70fb12cfb0eccd3d6e6a74', name: "bottom" })));
|
|
42302
42398
|
}
|
|
42303
42399
|
static get style() { return tabsCss(); }
|
|
42304
42400
|
static get cmpMeta() { return {
|
|
@@ -42343,9 +42439,9 @@ class Text {
|
|
|
42343
42439
|
color;
|
|
42344
42440
|
render() {
|
|
42345
42441
|
const mode = getIonMode$1(this);
|
|
42346
|
-
return (hAsync(Host, { key: '
|
|
42442
|
+
return (hAsync(Host, { key: 'b6f604df1b7aa5705a5b9a458e669a6a921c02a1', class: createColorClasses$1(this.color, {
|
|
42347
42443
|
[mode]: true,
|
|
42348
|
-
}) }, hAsync("slot", { key: '
|
|
42444
|
+
}) }, hAsync("slot", { key: '055d07b024a6554dfcf959fc8ed7b405e2730af2' })));
|
|
42349
42445
|
}
|
|
42350
42446
|
static get style() { return textCss(); }
|
|
42351
42447
|
static get cmpMeta() { return {
|
|
@@ -42360,9 +42456,9 @@ class Text {
|
|
|
42360
42456
|
}; }
|
|
42361
42457
|
}
|
|
42362
42458
|
|
|
42363
|
-
const textareaIosCss = () => `.sc-ion-textarea-ios-h{--background:initial;--color:initial;--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0;--padding-end:0;--padding-bottom:8px;--padding-start:0;--border-radius:0;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}.textarea-label-placement-floating.sc-ion-textarea-ios-h,.textarea-label-placement-stacked.sc-ion-textarea-ios-h{--padding-top:0px;min-height:56px}[cols].sc-ion-textarea-ios-h:not([auto-grow]){width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.ion-color.sc-ion-textarea-ios-h{--highlight-color-focused:var(--ion-color-base);background:initial}ion-item.sc-ion-textarea-ios-h,ion-item .sc-ion-textarea-ios-h{-ms-flex-item-align:baseline;align-self:baseline}ion-item[slot=start].sc-ion-textarea-ios-h,ion-item [slot=start].sc-ion-textarea-ios-h,ion-item[slot=end].sc-ion-textarea-ios-h,ion-item [slot=end].sc-ion-textarea-ios-h{width:auto}.native-textarea.sc-ion-textarea-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;white-space:pre-wrap;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.native-textarea.sc-ion-textarea-ios::-webkit-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::-moz-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios:-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.cloned-input.sc-ion-textarea-ios{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-textarea-ios:disabled{opacity:1}[auto-grow].sc-ion-textarea-ios-h .cloned-input.sc-ion-textarea-ios{height:100%}[auto-grow].sc-ion-textarea-ios-h .native-textarea.sc-ion-textarea-ios{overflow:hidden}.textarea-wrapper.sc-ion-textarea-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:0px;padding-bottom:0px;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:flex-start;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.native-wrapper.sc-ion-textarea-ios{position:relative;width:100%;height:100%}.has-focus.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios{caret-color:var(--highlight-color)}.native-wrapper.sc-ion-textarea-ios textarea.sc-ion-textarea-ios{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom)}.native-wrapper.sc-ion-textarea-ios{display:grid;min-width:inherit;max-width:inherit;min-height:inherit;max-height:inherit;grid-auto-rows:100%}.native-wrapper.sc-ion-textarea-ios::after{white-space:pre-wrap;content:attr(data-replicated-value) " ";visibility:hidden}.native-wrapper.sc-ion-textarea-ios::after{padding-left:0;padding-right:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;border-radius:var(--border-radius);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.textarea-wrapper-inner.sc-ion-textarea-ios{display:-ms-flexbox;display:flex;width:100%;min-height:inherit}.ion-touched.ion-invalid.sc-ion-textarea-ios-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-textarea-ios-h{--highlight-color:var(--highlight-color-valid)}.textarea-bottom.sc-ion-textarea-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-textarea-ios-h,.ion-touched.ion-invalid.sc-ion-textarea-ios-h{--border-color:var(--highlight-color)}.textarea-bottom.sc-ion-textarea-ios .error-text.sc-ion-textarea-ios{display:none;color:var(--highlight-color-invalid)}.textarea-bottom.sc-ion-textarea-ios .helper-text.sc-ion-textarea-ios{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-textarea-ios-h .textarea-bottom.sc-ion-textarea-ios .error-text.sc-ion-textarea-ios{display:block}.ion-touched.ion-invalid.sc-ion-textarea-ios-h .textarea-bottom.sc-ion-textarea-ios .helper-text.sc-ion-textarea-ios{display:none}.textarea-bottom.sc-ion-textarea-ios .counter.sc-ion-textarea-ios{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.label-text-wrapper.sc-ion-textarea-ios{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.label-text.sc-ion-textarea-ios,.sc-ion-textarea-ios-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-textarea-ios,.textarea-outline-notch-hidden.sc-ion-textarea-ios{display:none}.textarea-wrapper.sc-ion-textarea-ios textarea.sc-ion-textarea-ios{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.textarea-label-placement-start.sc-ion-textarea-ios-h .textarea-wrapper.sc-ion-textarea-ios{-ms-flex-direction:row;flex-direction:row}.textarea-label-placement-start.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-end.sc-ion-textarea-ios-h .textarea-wrapper.sc-ion-textarea-ios{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.textarea-label-placement-end.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-ios-h .label-text.sc-ion-textarea-ios{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.textarea-label-placement-stacked.sc-ion-textarea-ios-h .textarea-wrapper.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h .textarea-wrapper.sc-ion-textarea-ios{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform-origin:left top;transform-origin:left top;-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;max-width:100%;z-index:2}[dir=rtl].sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl].textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl].sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl].textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.textarea-label-placement-stacked.sc-ion-textarea-ios-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform-origin:right top;transform-origin:right top}}.textarea-label-placement-stacked.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios,.textarea-label-placement-stacked[auto-grow].sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios::after,.textarea-label-placement-floating[auto-grow].sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios::after{-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:8px;margin-bottom:0px}.sc-ion-textarea-ios-h.textarea-label-placement-stacked.sc-ion-textarea-ios-s>[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-stacked .sc-ion-textarea-ios-s>[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-stacked.sc-ion-textarea-ios-s>[slot=end],.sc-ion-textarea-ios-h.textarea-label-placement-stacked .sc-ion-textarea-ios-s>[slot=end],.sc-ion-textarea-ios-h.textarea-label-placement-floating.sc-ion-textarea-ios-s>[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-floating .sc-ion-textarea-ios-s>[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-floating.sc-ion-textarea-ios-s>[slot=end],.sc-ion-textarea-ios-h.textarea-label-placement-floating .sc-ion-textarea-ios-s>[slot=end]{margin-top:8px}.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios{opacity:0}.has-focus.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios,.has-value.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios{opacity:1}.label-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.start-slot-wrapper.sc-ion-textarea-ios,.end-slot-wrapper.sc-ion-textarea-ios{padding-left:0;padding-right:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:start;align-self:start}.sc-ion-textarea-ios-s>[slot=start],.sc-ion-textarea-ios-s>[slot=end]{margin-top:0}.sc-ion-textarea-ios-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-textarea-ios-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.sc-ion-textarea-ios-h{--border-width:0.55px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--padding-top:10px;--padding-end:0px;--padding-bottom:8px;--padding-start:0px;--highlight-height:0px;font-size:inherit}.textarea-disabled.sc-ion-textarea-ios-h{opacity:0.3}.sc-ion-textarea-ios-s>ion-button[slot=start].button-has-icon-only,.sc-ion-textarea-ios-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;aspect-ratio:1}`;
|
|
42459
|
+
const textareaIosCss = () => `.sc-ion-textarea-ios-h{--background:initial;--color:initial;--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0;--padding-end:0;--padding-bottom:8px;--padding-start:0;--border-radius:0;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}[cols].sc-ion-textarea-ios-h:not([auto-grow]){width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.ion-color.sc-ion-textarea-ios-h{--highlight-color-focused:var(--ion-color-base);background:initial}ion-item.sc-ion-textarea-ios-h,ion-item .sc-ion-textarea-ios-h{-ms-flex-item-align:baseline;align-self:baseline}ion-item[slot=start].sc-ion-textarea-ios-h,ion-item [slot=start].sc-ion-textarea-ios-h,ion-item[slot=end].sc-ion-textarea-ios-h,ion-item [slot=end].sc-ion-textarea-ios-h{width:auto}.native-textarea.sc-ion-textarea-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;white-space:pre-wrap;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.native-textarea.sc-ion-textarea-ios::-webkit-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::-moz-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios:-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios::placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-ios{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.cloned-input.sc-ion-textarea-ios{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-textarea-ios:disabled{opacity:1}[auto-grow].sc-ion-textarea-ios-h .cloned-input.sc-ion-textarea-ios{height:100%}[auto-grow].sc-ion-textarea-ios-h .native-textarea.sc-ion-textarea-ios{overflow:hidden}.textarea-wrapper.sc-ion-textarea-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:0;padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:flex-start;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.textarea-control.sc-ion-textarea-ios{padding-left:0;padding-right:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:start;-ms-flex-item-align:stretch;align-self:stretch;width:100%;min-width:0}.native-wrapper.sc-ion-textarea-ios{position:relative;width:100%;height:100%}.textarea-label-placement-start.sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios,.textarea-label-placement-end.sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios,.textarea-label-placement-fixed.sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios{-ms-flex:1 1 0px;flex:1 1 0}.has-focus.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios{caret-color:var(--highlight-color)}.native-wrapper.sc-ion-textarea-ios{display:grid;min-width:inherit;max-width:inherit;min-height:inherit;max-height:inherit;grid-auto-rows:100%}.native-wrapper.sc-ion-textarea-ios::after{white-space:pre-wrap;content:attr(data-replicated-value) " ";visibility:hidden}.native-wrapper.sc-ion-textarea-ios::after{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;border-radius:var(--border-radius);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.ion-touched.ion-invalid.sc-ion-textarea-ios-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-textarea-ios-h{--highlight-color:var(--highlight-color-valid)}.textarea-bottom.sc-ion-textarea-ios{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-textarea-ios-h,.ion-touched.ion-invalid.sc-ion-textarea-ios-h{--border-color:var(--highlight-color)}.textarea-bottom.sc-ion-textarea-ios .error-text.sc-ion-textarea-ios{display:none;color:var(--highlight-color-invalid)}.textarea-bottom.sc-ion-textarea-ios .helper-text.sc-ion-textarea-ios{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-textarea-ios-h .textarea-bottom.sc-ion-textarea-ios .error-text.sc-ion-textarea-ios{display:block}.ion-touched.ion-invalid.sc-ion-textarea-ios-h .textarea-bottom.sc-ion-textarea-ios .helper-text.sc-ion-textarea-ios{display:none}.textarea-bottom.sc-ion-textarea-ios .counter.sc-ion-textarea-ios{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.label-text-wrapper.sc-ion-textarea-ios{min-width:0;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.skip-label-transition.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transition:none;transition:none}.label-text.sc-ion-textarea-ios,.sc-ion-textarea-ios-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-textarea-ios,.textarea-outline-notch-hidden.sc-ion-textarea-ios{display:none}.textarea-wrapper.sc-ion-textarea-ios textarea.sc-ion-textarea-ios{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.textarea-label-placement-start.sc-ion-textarea-ios-h .textarea-control.sc-ion-textarea-ios{-ms-flex-direction:row;flex-direction:row}.textarea-label-placement-start.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-end.sc-ion-textarea-ios-h .textarea-control.sc-ion-textarea-ios{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.textarea-label-placement-end.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-ios-h .label-text.sc-ion-textarea-ios{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.textarea-label-placement-stacked.sc-ion-textarea-ios-h,.textarea-label-placement-floating.sc-ion-textarea-ios-h{--padding-top:20px;--padding-bottom:6px}.textarea-label-placement-stacked.sc-ion-textarea-ios-h .textarea-control.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h .textarea-control.sc-ion-textarea-ios{padding-top:0;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform-origin:left top;transform-origin:left top;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;max-width:100%;z-index:2}[dir=rtl].sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl].textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .textarea-label-placement-stacked.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl].sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .sc-ion-textarea-ios-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl].textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios,[dir=rtl] .textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.textarea-label-placement-stacked.sc-ion-textarea-ios-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform-origin:right top;transform-origin:right top}}.textarea-label-placement-stacked.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios,.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios,.textarea-label-placement-stacked[auto-grow].sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios::after,.textarea-label-placement-floating[auto-grow].sc-ion-textarea-ios-h .native-wrapper.sc-ion-textarea-ios::after{-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:8px;margin-bottom:0px}.textarea-label-placement-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios{opacity:0}.has-focus.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios,.has-value.textarea-label-placement-floating.sc-ion-textarea-ios-h textarea.sc-ion-textarea-ios{opacity:1}.label-floating.sc-ion-textarea-ios-h .label-text-wrapper.sc-ion-textarea-ios{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.textarea-start.sc-ion-textarea-ios,.textarea-end.sc-ion-textarea-ios{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:start;align-self:start}.sc-ion-textarea-ios-s>[slot=start],.sc-ion-textarea-ios-s>[slot=end]{margin-top:var(--padding-top)}.sc-ion-textarea-ios-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-textarea-ios-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.sc-ion-textarea-ios-h{--border-width:0.55px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--padding-top:10px;--padding-end:0px;--padding-bottom:8px;--padding-start:0px;--highlight-height:0px;font-size:inherit}.textarea-label-placement-floating.sc-ion-textarea-ios-h,.textarea-label-placement-stacked.sc-ion-textarea-ios-h{min-height:56px}.textarea-disabled.sc-ion-textarea-ios-h{opacity:0.3}.sc-ion-textarea-ios-s>ion-button[slot=start],.sc-ion-textarea-ios-s>ion-button[slot=end]{margin-top:2px}.sc-ion-textarea-ios-h.textarea-label-placement-floating.sc-ion-textarea-ios-s>ion-button[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-floating .sc-ion-textarea-ios-s>ion-button[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-floating.sc-ion-textarea-ios-s>ion-button[slot=end],.sc-ion-textarea-ios-h.textarea-label-placement-floating .sc-ion-textarea-ios-s>ion-button[slot=end],.sc-ion-textarea-ios-h.textarea-label-placement-stacked.sc-ion-textarea-ios-s>ion-button[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-stacked .sc-ion-textarea-ios-s>ion-button[slot=start],.sc-ion-textarea-ios-h.textarea-label-placement-stacked.sc-ion-textarea-ios-s>ion-button[slot=end],.sc-ion-textarea-ios-h.textarea-label-placement-stacked .sc-ion-textarea-ios-s>ion-button[slot=end]{margin-top:10px}.sc-ion-textarea-ios-s>ion-button[slot=start].button-has-icon-only,.sc-ion-textarea-ios-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;aspect-ratio:1}`;
|
|
42364
42460
|
|
|
42365
|
-
const textareaMdCss = () => `.sc-ion-textarea-md-h{--background:initial;--color:initial;--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0;--padding-end:0;--padding-bottom:8px;--padding-start:0;--border-radius:0;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}.textarea-label-placement-floating.sc-ion-textarea-md-h,.textarea-label-placement-stacked.sc-ion-textarea-md-h{--padding-top:0px;min-height:56px}[cols].sc-ion-textarea-md-h:not([auto-grow]){width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.ion-color.sc-ion-textarea-md-h{--highlight-color-focused:var(--ion-color-base);background:initial}ion-item.sc-ion-textarea-md-h,ion-item .sc-ion-textarea-md-h{-ms-flex-item-align:baseline;align-self:baseline}ion-item[slot=start].sc-ion-textarea-md-h,ion-item [slot=start].sc-ion-textarea-md-h,ion-item[slot=end].sc-ion-textarea-md-h,ion-item [slot=end].sc-ion-textarea-md-h{width:auto}.native-textarea.sc-ion-textarea-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;white-space:pre-wrap;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.native-textarea.sc-ion-textarea-md::-webkit-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::-moz-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md:-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.cloned-input.sc-ion-textarea-md{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-textarea-md:disabled{opacity:1}[auto-grow].sc-ion-textarea-md-h .cloned-input.sc-ion-textarea-md{height:100%}[auto-grow].sc-ion-textarea-md-h .native-textarea.sc-ion-textarea-md{overflow:hidden}.textarea-wrapper.sc-ion-textarea-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:0px;padding-bottom:0px;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:flex-start;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.native-wrapper.sc-ion-textarea-md{position:relative;width:100%;height:100%}.has-focus.sc-ion-textarea-md-h textarea.sc-ion-textarea-md{caret-color:var(--highlight-color)}.native-wrapper.sc-ion-textarea-md textarea.sc-ion-textarea-md{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom)}.native-wrapper.sc-ion-textarea-md{display:grid;min-width:inherit;max-width:inherit;min-height:inherit;max-height:inherit;grid-auto-rows:100%}.native-wrapper.sc-ion-textarea-md::after{white-space:pre-wrap;content:attr(data-replicated-value) " ";visibility:hidden}.native-wrapper.sc-ion-textarea-md::after{padding-left:0;padding-right:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;border-radius:var(--border-radius);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.textarea-wrapper-inner.sc-ion-textarea-md{display:-ms-flexbox;display:flex;width:100%;min-height:inherit}.ion-touched.ion-invalid.sc-ion-textarea-md-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-textarea-md-h{--highlight-color:var(--highlight-color-valid)}.textarea-bottom.sc-ion-textarea-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-textarea-md-h,.ion-touched.ion-invalid.sc-ion-textarea-md-h{--border-color:var(--highlight-color)}.textarea-bottom.sc-ion-textarea-md .error-text.sc-ion-textarea-md{display:none;color:var(--highlight-color-invalid)}.textarea-bottom.sc-ion-textarea-md .helper-text.sc-ion-textarea-md{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md .error-text.sc-ion-textarea-md{display:block}.ion-touched.ion-invalid.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md .helper-text.sc-ion-textarea-md{display:none}.textarea-bottom.sc-ion-textarea-md .counter.sc-ion-textarea-md{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.label-text-wrapper.sc-ion-textarea-md{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.label-text.sc-ion-textarea-md,.sc-ion-textarea-md-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-textarea-md,.textarea-outline-notch-hidden.sc-ion-textarea-md{display:none}.textarea-wrapper.sc-ion-textarea-md textarea.sc-ion-textarea-md{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.textarea-label-placement-start.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{-ms-flex-direction:row;flex-direction:row}.textarea-label-placement-start.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-end.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.textarea-label-placement-end.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-md-h .label-text.sc-ion-textarea-md{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.textarea-label-placement-stacked.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:left top;transform-origin:left top;-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;max-width:100%;z-index:2}[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.textarea-label-placement-stacked.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}}.textarea-label-placement-stacked.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-label-placement-stacked[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after,.textarea-label-placement-floating[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after{-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:8px;margin-bottom:0px}.sc-ion-textarea-md-h.textarea-label-placement-stacked.sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-label-placement-stacked .sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-label-placement-stacked.sc-ion-textarea-md-s>[slot=end],.sc-ion-textarea-md-h.textarea-label-placement-stacked .sc-ion-textarea-md-s>[slot=end],.sc-ion-textarea-md-h.textarea-label-placement-floating.sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-label-placement-floating .sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-label-placement-floating.sc-ion-textarea-md-s>[slot=end],.sc-ion-textarea-md-h.textarea-label-placement-floating .sc-ion-textarea-md-s>[slot=end]{margin-top:8px}.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md{opacity:0}.has-focus.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.has-value.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md{opacity:1}.label-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.start-slot-wrapper.sc-ion-textarea-md,.end-slot-wrapper.sc-ion-textarea-md{padding-left:0;padding-right:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:start;align-self:start}.sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-s>[slot=end]{margin-top:0}.sc-ion-textarea-md-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-textarea-md-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.textarea-fill-solid.sc-ion-textarea-md-h{--background:var(--ion-color-step-50, var(--ion-background-color-step-50, #f2f2f2));--border-color:var(--ion-color-step-500, var(--ion-background-color-step-500, gray));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}.textarea-fill-solid.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{border-bottom:var(--border-width) var(--border-style) var(--border-color)}.has-focus.textarea-fill-solid.ion-valid.sc-ion-textarea-md-h,.textarea-fill-solid.ion-touched.ion-invalid.sc-ion-textarea-md-h{--border-color:var(--highlight-color)}.textarea-fill-solid.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md{border-top:none}@media (any-hover: hover){.textarea-fill-solid.sc-ion-textarea-md-h:hover{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.textarea-fill-solid.has-focus.sc-ion-textarea-md-h{--background:var(--ion-color-step-150, var(--ion-background-color-step-150, #d9d9d9));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}.textarea-fill-solid.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0px;border-end-start-radius:0px}.label-floating.textarea-fill-solid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{max-width:calc(100% / 0.75)}.textarea-fill-outline.sc-ion-textarea-md-h{--border-color:var(--ion-color-step-300, var(--ion-background-color-step-300, #b3b3b3));--border-radius:4px;--padding-start:16px;--padding-end:16px;min-height:56px}.textarea-fill-outline.textarea-shape-round.sc-ion-textarea-md-h{--border-radius:28px;--padding-start:32px;--padding-end:32px}.has-focus.textarea-fill-outline.ion-valid.sc-ion-textarea-md-h,.textarea-fill-outline.ion-touched.ion-invalid.sc-ion-textarea-md-h{--border-color:var(--highlight-color)}@media (any-hover: hover){.textarea-fill-outline.sc-ion-textarea-md-h:hover{--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.textarea-fill-outline.has-focus.sc-ion-textarea-md-h{--border-width:var(--highlight-height);--border-color:var(--highlight-color)}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md{border-top:none}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{border-bottom:none}.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:left top;transform-origin:left top;position:absolute;max-width:calc(100% - var(--padding-start) - var(--padding-end))}[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}}.textarea-fill-outline.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{position:relative}.label-floating.textarea-fill-outline.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform:translateY(-32%) scale(0.75);transform:translateY(-32%) scale(0.75);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;max-width:calc( (100% - var(--padding-start) - var(--padding-end) - 8px) / 0.75 )}.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-stacked[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after,.textarea-fill-outline.textarea-label-placement-floating[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after{-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:12px;margin-bottom:0px}.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-stacked .sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-s>[slot=end],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-stacked .sc-ion-textarea-md-s>[slot=end],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-floating .sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-s>[slot=end],.sc-ion-textarea-md-h.textarea-fill-outline.textarea-label-placement-floating .sc-ion-textarea-md-s>[slot=end]{margin-top:12px}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-container.sc-ion-textarea-md{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;width:100%;height:100%}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-start.sc-ion-textarea-md,.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-end.sc-ion-textarea-md{pointer-events:none}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-start.sc-ion-textarea-md,.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-notch.sc-ion-textarea-md,.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-end.sc-ion-textarea-md{border-top:var(--border-width) var(--border-style) var(--border-color);border-bottom:var(--border-width) var(--border-style) var(--border-color)}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-notch.sc-ion-textarea-md{max-width:calc(100% - var(--padding-start) - var(--padding-end))}.textarea-fill-outline.sc-ion-textarea-md-h .notch-spacer.sc-ion-textarea-md{-webkit-padding-end:8px;padding-inline-end:8px;font-size:calc(1em * 0.75);opacity:0;pointer-events:none;-webkit-box-sizing:content-box;box-sizing:content-box}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-start.sc-ion-textarea-md{border-start-start-radius:var(--border-radius);border-start-end-radius:0px;border-end-end-radius:0px;border-end-start-radius:var(--border-radius);-webkit-border-start:var(--border-width) var(--border-style) var(--border-color);border-inline-start:var(--border-width) var(--border-style) var(--border-color);width:calc(var(--padding-start) - 4px)}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-end.sc-ion-textarea-md{-webkit-border-end:var(--border-width) var(--border-style) var(--border-color);border-inline-end:var(--border-width) var(--border-style) var(--border-color);border-start-start-radius:0px;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);border-end-start-radius:0px;-ms-flex-positive:1;flex-grow:1}.label-floating.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-notch.sc-ion-textarea-md{border-top:none}.sc-ion-textarea-md-h{--border-width:1px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.13)))));--padding-top:18px;--padding-end:0px;--padding-bottom:8px;--padding-start:0px;--highlight-height:2px;font-size:inherit}.textarea-bottom.sc-ion-textarea-md .counter.sc-ion-textarea-md{letter-spacing:0.0333333333em}.textarea-label-placement-floating.has-focus.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-stacked.has-focus.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{color:var(--highlight-color)}.has-focus.textarea-label-placement-floating.ion-valid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.ion-touched.ion-invalid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.has-focus.textarea-label-placement-stacked.ion-valid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-stacked.ion-touched.ion-invalid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{color:var(--highlight-color)}.textarea-disabled.sc-ion-textarea-md-h{opacity:0.38}.textarea-highlight.sc-ion-textarea-md{bottom:-1px;position:absolute;width:100%;height:var(--highlight-height);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform 200ms;transition:-webkit-transform 200ms;transition:transform 200ms;transition:transform 200ms, -webkit-transform 200ms;background:var(--highlight-color)}.textarea-highlight.sc-ion-textarea-md{inset-inline-start:0}.has-focus.sc-ion-textarea-md-h .textarea-highlight.sc-ion-textarea-md{-webkit-transform:scale(1);transform:scale(1)}.in-item.sc-ion-textarea-md-h .textarea-highlight.sc-ion-textarea-md{bottom:0}.in-item.sc-ion-textarea-md-h .textarea-highlight.sc-ion-textarea-md{inset-inline-start:0}.textarea-shape-round.sc-ion-textarea-md-h{--border-radius:16px}.sc-ion-textarea-md-s>ion-button[slot=start].button-has-icon-only,.sc-ion-textarea-md-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:8px;--padding-end:8px;--padding-top:8px;--padding-bottom:8px;aspect-ratio:1;min-height:40px}`;
|
|
42461
|
+
const textareaMdCss = () => `.sc-ion-textarea-md-h{--background:initial;--color:initial;--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:var(--ion-placeholder-opacity, 0.6);--padding-top:0;--padding-end:0;--padding-bottom:8px;--padding-start:0;--border-radius:0;--border-style:solid;--highlight-color-focused:var(--ion-color-primary, #0054e9);--highlight-color-valid:var(--ion-color-success, #2dd55b);--highlight-color-invalid:var(--ion-color-danger, #c5000f);--highlight-color:var(--highlight-color-focused);display:block;position:relative;width:100%;min-height:44px;color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}[cols].sc-ion-textarea-md-h:not([auto-grow]){width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.ion-color.sc-ion-textarea-md-h{--highlight-color-focused:var(--ion-color-base);background:initial}ion-item.sc-ion-textarea-md-h,ion-item .sc-ion-textarea-md-h{-ms-flex-item-align:baseline;align-self:baseline}ion-item[slot=start].sc-ion-textarea-md-h,ion-item [slot=start].sc-ion-textarea-md-h,ion-item[slot=end].sc-ion-textarea-md-h,ion-item [slot=end].sc-ion-textarea-md-h{width:auto}.native-textarea.sc-ion-textarea-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;display:block;position:relative;-ms-flex:1;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;white-space:pre-wrap;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.native-textarea.sc-ion-textarea-md::-webkit-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::-moz-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md:-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::-ms-input-placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md::placeholder{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-textarea.sc-ion-textarea-md{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.cloned-input.sc-ion-textarea-md{position:absolute;top:0;bottom:0;height:auto;max-height:none;pointer-events:none}.cloned-input.sc-ion-textarea-md:disabled{opacity:1}[auto-grow].sc-ion-textarea-md-h .cloned-input.sc-ion-textarea-md{height:100%}[auto-grow].sc-ion-textarea-md-h .native-textarea.sc-ion-textarea-md{overflow:hidden}.textarea-wrapper.sc-ion-textarea-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:0;padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:flex-start;height:inherit;min-height:inherit;-webkit-transition:background-color 15ms linear;transition:background-color 15ms linear;background:var(--background);line-height:normal}.textarea-control.sc-ion-textarea-md{padding-left:0;padding-right:0;padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:start;align-items:start;-ms-flex-item-align:stretch;align-self:stretch;width:100%;min-width:0}.native-wrapper.sc-ion-textarea-md{position:relative;width:100%;height:100%}.textarea-label-placement-start.sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md,.textarea-label-placement-end.sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md,.textarea-label-placement-fixed.sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md{-ms-flex:1 1 0px;flex:1 1 0}.has-focus.sc-ion-textarea-md-h textarea.sc-ion-textarea-md{caret-color:var(--highlight-color)}.native-wrapper.sc-ion-textarea-md{display:grid;min-width:inherit;max-width:inherit;min-height:inherit;max-height:inherit;grid-auto-rows:100%}.native-wrapper.sc-ion-textarea-md::after{white-space:pre-wrap;content:attr(data-replicated-value) " ";visibility:hidden}.native-wrapper.sc-ion-textarea-md::after{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;border-radius:var(--border-radius);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;grid-area:1/1/2/2;word-break:break-word}.ion-touched.ion-invalid.sc-ion-textarea-md-h{--highlight-color:var(--highlight-color-invalid)}.ion-valid.sc-ion-textarea-md-h{--highlight-color:var(--highlight-color-valid)}.textarea-bottom.sc-ion-textarea-md{-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:5px;padding-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;border-top:var(--border-width) var(--border-style) var(--border-color);font-size:0.75rem;white-space:normal}.has-focus.ion-valid.sc-ion-textarea-md-h,.ion-touched.ion-invalid.sc-ion-textarea-md-h{--border-color:var(--highlight-color)}.textarea-bottom.sc-ion-textarea-md .error-text.sc-ion-textarea-md{display:none;color:var(--highlight-color-invalid)}.textarea-bottom.sc-ion-textarea-md .helper-text.sc-ion-textarea-md{display:block;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d))}.ion-touched.ion-invalid.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md .error-text.sc-ion-textarea-md{display:block}.ion-touched.ion-invalid.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md .helper-text.sc-ion-textarea-md{display:none}.textarea-bottom.sc-ion-textarea-md .counter.sc-ion-textarea-md{-webkit-margin-start:auto;margin-inline-start:auto;color:var(--ion-color-step-700, var(--ion-text-color-step-300, #4d4d4d));white-space:nowrap;-webkit-padding-start:16px;padding-inline-start:16px}.label-text-wrapper.sc-ion-textarea-md{min-width:0;max-width:200px;-webkit-transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:color 150ms cubic-bezier(0.4, 0, 0.2, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none}.skip-label-transition.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transition:none;transition:none}.label-text.sc-ion-textarea-md,.sc-ion-textarea-md-s>[slot=label]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden.sc-ion-textarea-md,.textarea-outline-notch-hidden.sc-ion-textarea-md{display:none}.textarea-wrapper.sc-ion-textarea-md textarea.sc-ion-textarea-md{-webkit-transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 150ms cubic-bezier(0.4, 0, 0.2, 1)}.textarea-label-placement-start.sc-ion-textarea-md-h .textarea-control.sc-ion-textarea-md{-ms-flex-direction:row;flex-direction:row}.textarea-label-placement-start.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-end.sc-ion-textarea-md-h .textarea-control.sc-ion-textarea-md{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.textarea-label-placement-end.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}.textarea-label-placement-fixed.sc-ion-textarea-md-h .label-text.sc-ion-textarea-md{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}.textarea-label-placement-stacked.sc-ion-textarea-md-h,.textarea-label-placement-floating.sc-ion-textarea-md-h{--padding-top:20px;--padding-bottom:6px}.textarea-label-placement-stacked.sc-ion-textarea-md-h .textarea-control.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h .textarea-control.sc-ion-textarea-md{padding-top:0;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start}.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:left top;transform-origin:left top;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;max-width:100%;z-index:2}[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.textarea-label-placement-stacked.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}}.textarea-label-placement-stacked.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-label-placement-stacked[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after,.textarea-label-placement-floating[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after{-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:8px;margin-bottom:0px}.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform:translateY(100%) scale(1);transform:translateY(100%) scale(1)}.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md{opacity:0}.has-focus.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.has-value.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md{opacity:1}.label-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform:translateY(50%) scale(0.75);transform:translateY(50%) scale(0.75);max-width:calc(100% / 0.75)}.textarea-start.sc-ion-textarea-md,.textarea-end.sc-ion-textarea-md{display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:start;align-self:start}.sc-ion-textarea-md-s>[slot=start],.sc-ion-textarea-md-s>[slot=end]{margin-top:var(--padding-top)}.sc-ion-textarea-md-s>[slot=start]:last-of-type{-webkit-margin-end:16px;margin-inline-end:16px;-webkit-margin-start:0;margin-inline-start:0}.sc-ion-textarea-md-s>[slot=end]:first-of-type{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}.textarea-fill-solid.sc-ion-textarea-md-h{--background:var(--ion-color-step-50, var(--ion-background-color-step-50, #f2f2f2));--border-color:var(--ion-color-step-500, var(--ion-background-color-step-500, gray));--border-radius:4px;--padding-start:16px;--padding-end:16px}.textarea-fill-solid.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{border-bottom:var(--border-width) var(--border-style) var(--border-color)}.has-focus.textarea-fill-solid.ion-valid.sc-ion-textarea-md-h,.textarea-fill-solid.ion-touched.ion-invalid.sc-ion-textarea-md-h{--border-color:var(--highlight-color)}.textarea-fill-solid.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md{border-top:none}@media (any-hover: hover){.textarea-fill-solid.sc-ion-textarea-md-h:hover{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.textarea-fill-solid.has-focus.sc-ion-textarea-md-h{--background:var(--ion-color-step-150, var(--ion-background-color-step-150, #d9d9d9));--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}.textarea-fill-solid.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{border-start-start-radius:var(--border-radius);border-start-end-radius:var(--border-radius);border-end-end-radius:0px;border-end-start-radius:0px}.label-floating.textarea-fill-solid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{max-width:calc(100% / 0.75)}.textarea-fill-outline.sc-ion-textarea-md-h{--border-color:var(--ion-color-step-300, var(--ion-background-color-step-300, #b3b3b3));--border-radius:4px;--padding-start:16px;--padding-end:16px;--internal-start-container-adjustment:0px}.textarea-fill-outline.textarea-shape-round.sc-ion-textarea-md-h{--border-radius:28px;--padding-start:32px;--padding-end:32px}.has-focus.textarea-fill-outline.ion-valid.sc-ion-textarea-md-h,.textarea-fill-outline.ion-touched.ion-invalid.sc-ion-textarea-md-h{--border-color:var(--highlight-color)}@media (any-hover: hover){.textarea-fill-outline.sc-ion-textarea-md-h:hover{--border-color:var(--ion-color-step-750, var(--ion-background-color-step-750, #404040))}}.textarea-fill-outline.has-focus.sc-ion-textarea-md-h{--border-width:var(--highlight-height);--border-color:var(--highlight-color)}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-bottom.sc-ion-textarea-md{border-top:none}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-wrapper.sc-ion-textarea-md{border-bottom:none}.textarea-fill-outline.sc-ion-textarea-md-h:not(.label-floating) .textarea-control.sc-ion-textarea-md{position:relative}.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:left top;transform-origin:left top;position:absolute;max-width:100%}[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .sc-ion-textarea-md-h -no-combinator.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl].textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,[dir=rtl] .textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h:dir(rtl) .label-text-wrapper.sc-ion-textarea-md{-webkit-transform-origin:right top;transform-origin:right top}}.textarea-fill-outline.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{position:relative}.label-floating.textarea-fill-outline.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{-webkit-transform:translate(var(--internal-start-container-adjustment, 0px), -32%) scale(0.75);transform:translate(var(--internal-start-container-adjustment, 0px), -32%) scale(0.75);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;max-width:calc( (100% - var(--padding-start) - var(--padding-end) - 8px) / 0.75 )}.textarea-fill-outline.textarea-label-placement-stacked.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-floating.sc-ion-textarea-md-h textarea.sc-ion-textarea-md,.textarea-fill-outline.textarea-label-placement-stacked[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after,.textarea-fill-outline.textarea-label-placement-floating[auto-grow].sc-ion-textarea-md-h .native-wrapper.sc-ion-textarea-md::after{-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:19px;margin-bottom:0px}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-container.sc-ion-textarea-md{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;width:100%;height:100%}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-start.sc-ion-textarea-md,.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-end.sc-ion-textarea-md{pointer-events:none}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-start.sc-ion-textarea-md,.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-notch.sc-ion-textarea-md,.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-end.sc-ion-textarea-md{border-top:var(--border-width) var(--border-style) var(--border-color);border-bottom:var(--border-width) var(--border-style) var(--border-color)}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-notch.sc-ion-textarea-md{max-width:calc(100% - var(--padding-start) - var(--padding-end))}.textarea-fill-outline.sc-ion-textarea-md-h .notch-spacer.sc-ion-textarea-md{-webkit-padding-end:8px;padding-inline-end:8px;font-size:calc(1em * 0.75);opacity:0;pointer-events:none;-webkit-box-sizing:content-box;box-sizing:content-box}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-start.sc-ion-textarea-md{border-start-start-radius:var(--border-radius);border-start-end-radius:0px;border-end-end-radius:0px;border-end-start-radius:var(--border-radius);-webkit-border-start:var(--border-width) var(--border-style) var(--border-color);border-inline-start:var(--border-width) var(--border-style) var(--border-color);width:calc(var(--padding-start) - 4px)}.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-end.sc-ion-textarea-md{-webkit-border-end:var(--border-width) var(--border-style) var(--border-color);border-inline-end:var(--border-width) var(--border-style) var(--border-color);border-start-start-radius:0px;border-start-end-radius:var(--border-radius);border-end-end-radius:var(--border-radius);border-end-start-radius:0px;-ms-flex-positive:1;flex-grow:1}.label-floating.textarea-fill-outline.sc-ion-textarea-md-h .textarea-outline-notch.sc-ion-textarea-md{border-top:none}.sc-ion-textarea-md-h{--border-width:1px;--border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.13)))));--padding-top:18px;--padding-end:0px;--padding-bottom:8px;--padding-start:0px;--highlight-height:2px;min-height:72px;font-size:inherit}.textarea-bottom.sc-ion-textarea-md .counter.sc-ion-textarea-md{letter-spacing:0.0333333333em}.textarea-label-placement-floating.has-focus.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-stacked.has-focus.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{color:var(--highlight-color)}.has-focus.textarea-label-placement-floating.ion-valid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-floating.ion-touched.ion-invalid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.has-focus.textarea-label-placement-stacked.ion-valid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md,.textarea-label-placement-stacked.ion-touched.ion-invalid.sc-ion-textarea-md-h .label-text-wrapper.sc-ion-textarea-md{color:var(--highlight-color)}.textarea-disabled.sc-ion-textarea-md-h{opacity:0.38}.textarea-highlight.sc-ion-textarea-md{bottom:-1px;position:absolute;width:100%;height:var(--highlight-height);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform 200ms;transition:-webkit-transform 200ms;transition:transform 200ms;transition:transform 200ms, -webkit-transform 200ms;background:var(--highlight-color)}.textarea-highlight.sc-ion-textarea-md{inset-inline-start:0}.has-focus.sc-ion-textarea-md-h .textarea-highlight.sc-ion-textarea-md{-webkit-transform:scale(1);transform:scale(1)}.in-item.sc-ion-textarea-md-h .textarea-highlight.sc-ion-textarea-md{bottom:0}.in-item.sc-ion-textarea-md-h .textarea-highlight.sc-ion-textarea-md{inset-inline-start:0}.textarea-shape-round.sc-ion-textarea-md-h{--border-radius:16px}.sc-ion-textarea-md-s>ion-button[slot=start],.sc-ion-textarea-md-s>ion-button[slot=end]{margin-top:7px}.sc-ion-textarea-md-s>ion-button[slot=start].button-has-icon-only,.sc-ion-textarea-md-s>ion-button[slot=end].button-has-icon-only{--border-radius:50%;--padding-start:8px;--padding-end:8px;--padding-top:8px;--padding-bottom:8px;aspect-ratio:1;min-height:40px}`;
|
|
42366
42462
|
|
|
42367
42463
|
/**
|
|
42368
42464
|
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
|
@@ -42393,9 +42489,11 @@ class Textarea {
|
|
|
42393
42489
|
textareaWrapper;
|
|
42394
42490
|
inheritedAttributes = {};
|
|
42395
42491
|
originalIonInput;
|
|
42396
|
-
notchSpacerEl;
|
|
42397
42492
|
slotMutationController;
|
|
42398
42493
|
notchController;
|
|
42494
|
+
notchSpacerEl;
|
|
42495
|
+
startContainerController;
|
|
42496
|
+
startContainerEl;
|
|
42399
42497
|
/**
|
|
42400
42498
|
* The value of the textarea when the textarea is focused.
|
|
42401
42499
|
*/
|
|
@@ -42622,8 +42720,14 @@ class Textarea {
|
|
|
42622
42720
|
}
|
|
42623
42721
|
connectedCallback() {
|
|
42624
42722
|
const { el } = this;
|
|
42625
|
-
this.slotMutationController = createSlotMutationController(el, ['label', 'start', 'end'], () =>
|
|
42723
|
+
this.slotMutationController = createSlotMutationController(el, ['label', 'start', 'end'], () => {
|
|
42724
|
+
this.startContainerController?.calculateStartContainerWidth();
|
|
42725
|
+
});
|
|
42626
42726
|
this.notchController = createNotchController(el, () => this.notchSpacerEl, () => this.labelSlot);
|
|
42727
|
+
this.startContainerController = createStartContainerController(el, () => this.startContainerEl, () => {
|
|
42728
|
+
return Build.isBrowser;
|
|
42729
|
+
});
|
|
42730
|
+
this.startContainerController.calculateStartContainerWidth();
|
|
42627
42731
|
// Always set initial state
|
|
42628
42732
|
this.isInvalid = checkInvalidState(this.el);
|
|
42629
42733
|
this.debounceChanged();
|
|
@@ -42637,6 +42741,10 @@ class Textarea {
|
|
|
42637
42741
|
this.notchController.destroy();
|
|
42638
42742
|
this.notchController = undefined;
|
|
42639
42743
|
}
|
|
42744
|
+
if (this.startContainerController) {
|
|
42745
|
+
this.startContainerController.destroy();
|
|
42746
|
+
this.startContainerController = undefined;
|
|
42747
|
+
}
|
|
42640
42748
|
// Clean up validation observer to prevent memory leaks
|
|
42641
42749
|
if (this.validationObserver) {
|
|
42642
42750
|
this.validationObserver.disconnect();
|
|
@@ -42655,6 +42763,7 @@ class Textarea {
|
|
|
42655
42763
|
}
|
|
42656
42764
|
componentDidRender() {
|
|
42657
42765
|
this.notchController?.calculateNotchWidth();
|
|
42766
|
+
this.startContainerController?.calculateStartContainerWidth();
|
|
42658
42767
|
}
|
|
42659
42768
|
/**
|
|
42660
42769
|
* Sets focus on the native `textarea` in `ion-textarea`. Use this method instead of the global
|
|
@@ -42817,43 +42926,29 @@ class Textarea {
|
|
|
42817
42926
|
return this.label !== undefined || this.labelSlot !== null;
|
|
42818
42927
|
}
|
|
42819
42928
|
/**
|
|
42820
|
-
* Stops propagation
|
|
42821
|
-
*
|
|
42929
|
+
* Stops propagation for clicks on the textarea's own content (label text,
|
|
42930
|
+
* textarea field) to prevent double-click events. Allows clicks on slotted
|
|
42931
|
+
* content to propagate so event delegation works for parent handlers.
|
|
42932
|
+
*
|
|
42933
|
+
* Only slots belonging directly to this textarea should be considered.
|
|
42934
|
+
* The textarea itself may have a slot attribute when placed in an item
|
|
42935
|
+
* or toolbar, which does not make its content slotted content.
|
|
42822
42936
|
*/
|
|
42823
42937
|
onLabelClick = (ev) => {
|
|
42824
|
-
|
|
42825
|
-
|
|
42826
|
-
if (
|
|
42938
|
+
const target = ev.target;
|
|
42939
|
+
const slotted = target.closest('[slot="start"], [slot="end"]');
|
|
42940
|
+
if (slotted === null || slotted === this.el || !this.el.contains(slotted)) {
|
|
42827
42941
|
ev.stopPropagation();
|
|
42828
42942
|
}
|
|
42829
42943
|
};
|
|
42830
42944
|
/**
|
|
42831
|
-
* Renders the border
|
|
42945
|
+
* Renders the outline border with a notch for the label.
|
|
42832
42946
|
*/
|
|
42833
|
-
|
|
42834
|
-
|
|
42835
|
-
|
|
42836
|
-
|
|
42837
|
-
|
|
42838
|
-
* The outline fill has a special outline
|
|
42839
|
-
* that appears around the textarea and the label.
|
|
42840
|
-
* Certain stacked and floating label placements cause the
|
|
42841
|
-
* label to translate up and create a "cut out"
|
|
42842
|
-
* inside of that border by using the notch-spacer element.
|
|
42843
|
-
*/
|
|
42844
|
-
return [
|
|
42845
|
-
hAsync("div", { class: "textarea-outline-container" }, hAsync("div", { class: "textarea-outline-start" }), hAsync("div", { class: {
|
|
42846
|
-
'textarea-outline-notch': true,
|
|
42847
|
-
'textarea-outline-notch-hidden': !this.hasLabel,
|
|
42848
|
-
} }, hAsync("div", { class: "notch-spacer", "aria-hidden": "true", ref: (el) => (this.notchSpacerEl = el) }, this.label)), hAsync("div", { class: "textarea-outline-end" })),
|
|
42849
|
-
this.renderLabel(),
|
|
42850
|
-
];
|
|
42851
|
-
}
|
|
42852
|
-
/**
|
|
42853
|
-
* If not using the outline style,
|
|
42854
|
-
* we can render just the label.
|
|
42855
|
-
*/
|
|
42856
|
-
return this.renderLabel();
|
|
42947
|
+
renderOutlineContainer() {
|
|
42948
|
+
return (hAsync("div", { class: "textarea-outline-container" }, hAsync("div", { class: "textarea-outline-start" }), hAsync("div", { class: {
|
|
42949
|
+
'textarea-outline-notch': true,
|
|
42950
|
+
'textarea-outline-notch-hidden': !this.hasLabel,
|
|
42951
|
+
} }, hAsync("div", { class: "notch-spacer", "aria-hidden": "true", ref: (el) => (this.notchSpacerEl = el) }, this.label)), hAsync("div", { class: "textarea-outline-end" })));
|
|
42857
42952
|
}
|
|
42858
42953
|
/**
|
|
42859
42954
|
* Renders the helper text or error text values
|
|
@@ -42901,32 +42996,20 @@ class Textarea {
|
|
|
42901
42996
|
return (hAsync("div", { class: "textarea-bottom" }, this.renderHintText(), this.renderCounter()));
|
|
42902
42997
|
}
|
|
42903
42998
|
render() {
|
|
42904
|
-
const { inputId, disabled, fill, shape, labelPlacement,
|
|
42999
|
+
const { inputId, disabled, fill, shape, labelPlacement, hasFocus } = this;
|
|
42905
43000
|
const mode = getIonMode$1(this);
|
|
42906
43001
|
const value = this.getValue();
|
|
42907
43002
|
const inItem = hostContext('ion-item', this.el);
|
|
42908
43003
|
const shouldRenderHighlight = mode === 'md' && fill !== 'outline' && !inItem;
|
|
42909
43004
|
const hasValue = this.hasValue();
|
|
42910
|
-
const
|
|
43005
|
+
const hasOutlineFill = mode === 'md' && fill === 'outline';
|
|
42911
43006
|
/**
|
|
42912
43007
|
* If the label is stacked, it should always sit above the textarea.
|
|
42913
43008
|
* For floating labels, the label should move above the textarea if
|
|
42914
|
-
* the textarea has a value
|
|
42915
|
-
* the start or end slot.
|
|
42916
|
-
*
|
|
42917
|
-
* If there is content in the start slot, the label would overlap
|
|
42918
|
-
* it if not forced to float. This is also applied to the end slot
|
|
42919
|
-
* because with the default or solid fills, the textarea is not
|
|
42920
|
-
* vertically centered in the container, but the label is. This
|
|
42921
|
-
* causes the slots and label to appear vertically offset from each
|
|
42922
|
-
* other when the label isn't floating above the input. This doesn't
|
|
42923
|
-
* apply to the outline fill, but this was not accounted for to keep
|
|
42924
|
-
* things consistent.
|
|
42925
|
-
*
|
|
42926
|
-
* TODO(FW-5592): Remove hasStartEndSlots condition
|
|
43009
|
+
* the textarea has a value or is focused.
|
|
42927
43010
|
*/
|
|
42928
|
-
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus
|
|
42929
|
-
return (hAsync(Host, { key: '
|
|
43011
|
+
const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus));
|
|
43012
|
+
return (hAsync(Host, { key: '78da9c96e6a29f19b237f268dd8bfd044afe27b6', class: createColorClasses$1(this.color, {
|
|
42930
43013
|
[mode]: true,
|
|
42931
43014
|
'has-value': hasValue,
|
|
42932
43015
|
'has-focus': hasFocus,
|
|
@@ -42935,7 +43018,7 @@ class Textarea {
|
|
|
42935
43018
|
[`textarea-shape-${shape}`]: shape !== undefined,
|
|
42936
43019
|
[`textarea-label-placement-${labelPlacement}`]: true,
|
|
42937
43020
|
'textarea-disabled': disabled,
|
|
42938
|
-
}) }, hAsync("label", { key: '
|
|
43021
|
+
}) }, hAsync("label", { key: 'c5ea3f26e01e66b857d3a1c88dbafbf2dbb81fdb', class: "textarea-wrapper", htmlFor: inputId, onClick: this.onLabelClick }, hasOutlineFill && this.renderOutlineContainer(), hAsync("div", { key: '5a9d0efc8c13d9bd4ec4ceadf1bdb84205c47b3d', class: "textarea-start", ref: (el) => (this.startContainerEl = el) }, hAsync("slot", { key: 'da08262e33f3a5b454847297338a74f07c5b60c9', name: "start" })), hAsync("div", { key: '6461dc7381929eb83679ec07563b7bdf8bfc3f9f', class: "textarea-control" }, this.renderLabel(), hAsync("div", { key: '8f7902a9e6040384d25d0e2061c04f6b49acf187', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, hAsync("textarea", { key: '2149d8b2c23a164c536327c98d7a632e1e85428a', 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))), hAsync("div", { key: '84f5f42add89875c3f0cce734b512a9e7be81e03', class: "textarea-end" }, hAsync("slot", { key: 'ea654d78013a00b8af33deb89d42c2b7f6c9cb99', name: "end" })), shouldRenderHighlight && hAsync("div", { key: 'b72195d2606816b3b71e65214d78cef1740f4804', class: "textarea-highlight" })), this.renderBottomContent()));
|
|
42939
43022
|
}
|
|
42940
43023
|
static get watchers() { return {
|
|
42941
43024
|
"debounce": [{
|
|
@@ -43003,7 +43086,7 @@ class Thumbnail {
|
|
|
43003
43086
|
registerInstance(this, hostRef);
|
|
43004
43087
|
}
|
|
43005
43088
|
render() {
|
|
43006
|
-
return (hAsync(Host, { key: '
|
|
43089
|
+
return (hAsync(Host, { key: 'ff9d2a4886b1c90a316c761f1160111f0e997f5d', class: getIonMode$1(this) }, hAsync("slot", { key: '9a0f0d69e3713831e88c8770a60b28ff1a03abb6' })));
|
|
43007
43090
|
}
|
|
43008
43091
|
static get style() { return thumbnailCss(); }
|
|
43009
43092
|
static get cmpMeta() { return {
|
|
@@ -43977,14 +44060,14 @@ class Toast {
|
|
|
43977
44060
|
if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
|
|
43978
44061
|
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);
|
|
43979
44062
|
}
|
|
43980
|
-
return (hAsync(Host, { key: '
|
|
44063
|
+
return (hAsync(Host, { key: '15d2ff8b689e40bb5cae3e304448dadf91b11b88', tabindex: "-1", ...this.htmlAttributes, style: {
|
|
43981
44064
|
zIndex: `${60000 + this.overlayIndex}`,
|
|
43982
44065
|
}, class: createColorClasses$1(this.color, {
|
|
43983
44066
|
[mode]: true,
|
|
43984
44067
|
...getClassMap(this.cssClass),
|
|
43985
44068
|
'overlay-hidden': true,
|
|
43986
44069
|
'toast-translucent': this.translucent,
|
|
43987
|
-
}), onIonToastWillDismiss: this.dispatchCancelHandler }, hAsync("div", { key: '
|
|
44070
|
+
}), onIonToastWillDismiss: this.dispatchCancelHandler }, hAsync("div", { key: 'd26cc17a59e3d81810e22ee422398f2cc4c7a05c', class: wrapperClass, part: "wrapper" }, hAsync("div", { key: 'f15e1a97f13defcbf96612df4c7ba45999e6244d', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (hAsync("ion-icon", { key: '639cacec828f969673071e54dc68284050e9f2fd', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), hAsync("div", { key: 'a07e68cf68e4c507e4515de1a4b43dd8fb3541d3', class: "toast-content", part: "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')))));
|
|
43988
44071
|
}
|
|
43989
44072
|
static get watchers() { return {
|
|
43990
44073
|
"swipeGesture": [{
|
|
@@ -44369,7 +44452,7 @@ class Toggle {
|
|
|
44369
44452
|
// The attributes are matched too because the class needs the item to render.
|
|
44370
44453
|
const inClickableItem = hostContext('ion-item.ion-activatable, ion-item[button], ion-item[href]', el);
|
|
44371
44454
|
renderHiddenInput(true, el, name, checked ? value : '', disabled);
|
|
44372
|
-
return (hAsync(Host, { key: '
|
|
44455
|
+
return (hAsync(Host, { key: '148d15040257b05b3769da5a2439d051e357cbba', role: "switch", "aria-checked": `${checked}`, "aria-describedby": this.hintTextId, "aria-invalid": this.isInvalid ? 'true' : undefined, onClick: this.onClick, "aria-labelledby": hasLabel ? 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, class: createColorClasses$1(color, {
|
|
44373
44456
|
[mode]: true,
|
|
44374
44457
|
'in-item': inItem,
|
|
44375
44458
|
// `ion-focusable` has to stay on because it is what makes the item focusable.
|
|
@@ -44383,10 +44466,10 @@ class Toggle {
|
|
|
44383
44466
|
[`toggle-alignment-${alignment}`]: alignment !== undefined,
|
|
44384
44467
|
[`toggle-label-placement-${labelPlacement}`]: true,
|
|
44385
44468
|
[`toggle-${rtl}`]: true,
|
|
44386
|
-
}) }, hAsync("label", { key: '
|
|
44469
|
+
}) }, hAsync("label", { key: '0dbc40adc87e2ab4bdcd9a9fef43393484174c18', class: "toggle-wrapper", htmlFor: inputId }, hAsync("input", { key: '92dee565687fc9a883f97091ead1bbb51df43779', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, required: required, ...inheritedAttributes }), hAsync("div", { key: 'f057bc57714b26e84226ee931e09212b86dba69f', class: {
|
|
44387
44470
|
'label-text-wrapper': true,
|
|
44388
44471
|
'label-text-wrapper-hidden': !hasLabel,
|
|
44389
|
-
}, part: "label", id: inputLabelId, onClick: this.onDivLabelClick }, hAsync("slot", { key: '
|
|
44472
|
+
}, part: "label", id: inputLabelId, onClick: this.onDivLabelClick }, hAsync("slot", { key: '345efb5ce20f8124d1e74877b4943edf82fe2f8e' }), this.renderHintText()), hAsync("div", { key: 'fc1a7fb6b65064307fbe0a50178559a52d6aedb7', class: "native-wrapper" }, this.renderToggleControl()))));
|
|
44390
44473
|
}
|
|
44391
44474
|
static get watchers() { return {
|
|
44392
44475
|
"disabled": [{
|
|
@@ -44504,13 +44587,13 @@ class Toolbar {
|
|
|
44504
44587
|
this.childrenStyles.forEach((value) => {
|
|
44505
44588
|
Object.assign(childStyles, value);
|
|
44506
44589
|
});
|
|
44507
|
-
return (hAsync(Host, { key: '
|
|
44590
|
+
return (hAsync(Host, { key: 'c16803dc4eae9972ef19bf43aa74b94feb4fd4c1', class: {
|
|
44508
44591
|
...childStyles,
|
|
44509
44592
|
...createColorClasses$1(this.color, {
|
|
44510
44593
|
[mode]: true,
|
|
44511
44594
|
'in-toolbar': hostContext('ion-toolbar', this.el),
|
|
44512
44595
|
}),
|
|
44513
|
-
} }, hAsync("div", { key: '
|
|
44596
|
+
} }, hAsync("div", { key: '20e3f85844c94b8399c245d2df125e6ab678d681', class: "toolbar-background", part: "background" }), hAsync("div", { key: '12f09e324e8d9130b9d30c493106b500233fb016', class: "toolbar-container", part: "container" }, hAsync("slot", { key: '6da0fe99ee0c4d7c969712e2908a4e7e6be5ed2c', name: "start" }), hAsync("slot", { key: '177c346d6dcabb7857d810cda7d25c6dde32e6e2', name: "secondary" }), hAsync("div", { key: '8c921b415940c71bf4c1a2c5c6887f36ad1afd16', class: "toolbar-content", part: "content" }, hAsync("slot", { key: '1f2976b80d967bd51e86ed1357b363271d655df2' })), hAsync("slot", { key: '0f7618044a7e8b0d9b715a8e208070f7ef2ee4c8', name: "primary" }), hAsync("slot", { key: '125c393197e0660a3c2638dd4628c41ef7e05f19', name: "end" }))));
|
|
44514
44597
|
}
|
|
44515
44598
|
static get style() { return {
|
|
44516
44599
|
ios: toolbarIosCss(),
|
|
@@ -44571,11 +44654,11 @@ class ToolbarTitle {
|
|
|
44571
44654
|
render() {
|
|
44572
44655
|
const mode = getIonMode$1(this);
|
|
44573
44656
|
const size = this.getSize();
|
|
44574
|
-
return (hAsync(Host, { key: '
|
|
44657
|
+
return (hAsync(Host, { key: 'c5f0b913ff0a22d9bf02da48a313a613c2ac8fe7', class: createColorClasses$1(this.color, {
|
|
44575
44658
|
[mode]: true,
|
|
44576
44659
|
[`title-${size}`]: true,
|
|
44577
44660
|
'title-rtl': document.dir === 'rtl',
|
|
44578
|
-
}) }, hAsync("div", { key: '
|
|
44661
|
+
}) }, hAsync("div", { key: '5253b9e39fb764bfe1e57370719139f8a83e9904', class: "toolbar-title" }, hAsync("slot", { key: 'e38b1eccb0175c36f8cab211aee7ce4d61fc9035' }))));
|
|
44579
44662
|
}
|
|
44580
44663
|
static get watchers() { return {
|
|
44581
44664
|
"size": [{
|