@ionic/core 8.2.3-dev.11719565135.1ab35bb2 → 8.2.3-dev.11721064272.19e3ddfd

package/components/checkbox.js

@@ -6,7 +6,7 @@ import { i as inheritAriaAttributes, e as renderHiddenInput } from './helpers.js
 import { c as createColorClasses, h as hostContext } from './theme.js';
 import { d as getIonTheme } from './ionic-global.js';
 
-const checkboxIonicCss = ":host{--border-width:var(--ionic-border-size-025, 1px);--border-style:var(--ionic-border-style-solid, solid);--border-color:var(--ionic-color-neutral-800, #626262);--checkmark-width:3;--focus-ring-color:var(--ionic-state-focus-1, #9ec4fd);--focus-ring-width:var(--ionic-border-size-050, 2px);--focus-ring-offset:var(--ionic-space-050, 2px);--size:var(--ionic-scale-600, 24px);--checkbox-background-checked:var(--ionic-color-primary-base, #105cef);--border-color-checked:var(--ionic-color-primary-base, #105cef);--checkmark-color:var(--ionic-color-base-white, #ffffff);--transition:none;display:inline-block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host::after{right:0;left:0;top:50%;position:absolute;height:100%;min-height:var(--ionic-scale-1200, 48px);-webkit-transform:translateY(-50%);transform:translateY(-50%);content:\"\";cursor:pointer;z-index:1}:host .native-wrapper{position:relative}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0;width:100%;height:100%}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.checkbox-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;height:inherit;cursor:inherit}.label-text-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host(.in-item) .label-text-wrapper{margin-top:var(--ionic-space-250, 10px);margin-bottom:var(--ionic-space-250, 10px)}:host(.in-item.checkbox-label-placement-stacked) .label-text-wrapper{margin-top:var(--ionic-space-250, 10px);margin-bottom:var(--ionic-space-400, 16px)}:host(.in-item.checkbox-label-placement-stacked) .native-wrapper{margin-bottom:var(--ionic-space-250, 10px)}.label-text-wrapper-hidden{display:none}input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;opacity:0;overflow:hidden;clip:rect(0 0 0 0);-webkit-appearance:none;-moz-appearance:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.checkbox-icon{border-radius:var(--border-radius);position:relative;width:var(--size);height:var(--size);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--checkbox-background);-webkit-box-sizing:border-box;box-sizing:border-box}.checkbox-icon path{fill:var(--checkmark-color);opacity:0}:host(.checkbox-justify-space-between) .checkbox-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.checkbox-justify-start) .checkbox-wrapper{-ms-flex-pack:start;justify-content:start}:host(.checkbox-justify-end) .checkbox-wrapper{-ms-flex-pack:end;justify-content:end}:host(.checkbox-alignment-start) .checkbox-wrapper{-ms-flex-align:start;align-items:start}:host(.checkbox-alignment-center) .checkbox-wrapper{-ms-flex-align:center;align-items:center}:host(.checkbox-label-placement-start) .checkbox-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.checkbox-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--ionic-space-400, 16px);margin-inline-end:var(--ionic-space-400, 16px)}:host(.checkbox-label-placement-end) .checkbox-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.checkbox-label-placement-end) .label-text-wrapper{-webkit-margin-start:var(--ionic-space-400, 16px);margin-inline-start:var(--ionic-space-400, 16px);-webkit-margin-end:0;margin-inline-end:0}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--ionic-space-400, 16px);margin-inline-end:var(--ionic-space-400, 16px)}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.checkbox-label-placement-stacked) .checkbox-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.checkbox-label-placement-stacked) .label-text-wrapper{-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:var(--ionic-space-400, 16px);max-width:133.3333333333%}:host(.checkbox-size-small){--size:var(--ionic-scale-400, 16px)}:host(.checkbox-checked) .checkbox-icon,:host(.checkbox-indeterminate) .checkbox-icon{border-color:var(--border-color-checked);background:var(--checkbox-background-checked)}:host(.checkbox-checked) .checkbox-icon path,:host(.checkbox-indeterminate) .checkbox-icon path{opacity:1}:host(.ion-invalid){--focus-ring-color:var(--ionic-state-focus-2, #ffafaf)}:host(.ion-invalid) .checkbox-icon{border-color:var(--ionic-color-danger-800, #bf2222)}:host(.checkbox-disabled){pointer-events:none}:host(.checkbox-disabled) .native-wrapper:after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--ionic-state-disabled, rgba(255, 255, 255, 0.6));content:\"\";pointer-events:none}:host(.checkbox-disabled) .checkbox-icon{border-color:var(--ionic-color-neutral-800, #626262);background-color:var(--ionic-state-disabled, rgba(255, 255, 255, 0.6))}:host(.checkbox-disabled.checkbox-checked) .checkbox-icon{border-width:var(--ionic-border-size-0, 0px);background-color:var(--ionic-color-primary-base, #105cef)}@media (any-hover: hover){:host(:hover) .checkbox-icon{background-color:var(--ionic-color-neutral-100, #f1f1f1)}:host(:hover.checkbox-checked) .checkbox-icon,:host(:hover.checkbox-indeterminate) .checkbox-icon{background-color:var(--ionic-color-primary-800, #0f54da)}}:host(.ion-focused:not(.checkbox-disabled)) .checkbox-icon{outline:var(--focus-ring-width) var(--ionic-border-style-solid, solid) var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}:host(.ion-activated) .checkbox-icon{background-color:var(--ionic-color-neutral-200, #e7e7e7)}:host(.ion-activated.checkbox-checked) .checkbox-icon,:host(.ion-activated.checkbox-indeterminate) .checkbox-icon{background-color:var(--ionic-color-primary-900, #0d4bc3)}:host(.checkbox-shape-soft){--border-radius:var(--ionic-border-radius-100, 4px)}:host(.checkbox-size-small.checkbox-shape-soft){--border-radius:var(--ionic-border-radius-050, 2px)}:host(.checkbox-shape-rectangular){--border-radius:var(--ionic-border-radius-0, 0px)}.checkbox-wrapper{min-height:var(--ionic-scale-1200, 48px)}";
+const checkboxIonicCss = ":host{--border-width:var(--ionic-border-size-025, 1px);--border-style:var(--ionic-border-style-solid, solid);--border-color:var(--ionic-color-neutral-800, #626262);--checkmark-width:var(--ionic-scale-400, 16px);--checkmark-height:var(--checkmark-width);--focus-ring-color:var(--ionic-state-focus-1, #9ec4fd);--focus-ring-width:var(--ionic-border-size-050, 2px);--focus-ring-offset:var(--ionic-space-050, 2px);--size:var(--ionic-scale-600, 24px);--checkbox-background-checked:var(--ionic-color-primary-base, #105cef);--border-color-checked:var(--ionic-color-primary-base, #105cef);--checkmark-color:var(--ionic-color-base-white, #ffffff);--transition:none;display:inline-block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host::after{right:0;left:0;top:50%;position:absolute;height:100%;min-height:var(--ionic-scale-1200, 48px);-webkit-transform:translateY(-50%);transform:translateY(-50%);content:\"\";cursor:pointer;z-index:1}:host .native-wrapper{position:relative}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0;width:100%;height:100%}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.checkbox-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;height:inherit;cursor:inherit}.label-text-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host(.in-item) .label-text-wrapper{margin-top:var(--ionic-space-250, 10px);margin-bottom:var(--ionic-space-250, 10px)}:host(.in-item.checkbox-label-placement-stacked) .label-text-wrapper{margin-top:var(--ionic-space-250, 10px);margin-bottom:var(--ionic-space-400, 16px)}:host(.in-item.checkbox-label-placement-stacked) .native-wrapper{margin-bottom:var(--ionic-space-250, 10px)}.label-text-wrapper-hidden{display:none}input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;opacity:0;overflow:hidden;clip:rect(0 0 0 0);-webkit-appearance:none;-moz-appearance:none}.native-wrapper{border-radius:var(--border-radius);display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:var(--size);height:var(--size);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--checkbox-background);-webkit-box-sizing:border-box;box-sizing:border-box}.checkbox-icon{position:relative;width:var(--checkmark-width);height:var(--checkmark-height)}.checkbox-icon path{fill:var(--checkmark-color);opacity:0}:host(.checkbox-justify-space-between) .checkbox-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.checkbox-justify-start) .checkbox-wrapper{-ms-flex-pack:start;justify-content:start}:host(.checkbox-justify-end) .checkbox-wrapper{-ms-flex-pack:end;justify-content:end}:host(.checkbox-alignment-start) .checkbox-wrapper{-ms-flex-align:start;align-items:start}:host(.checkbox-alignment-center) .checkbox-wrapper{-ms-flex-align:center;align-items:center}:host(.checkbox-label-placement-start) .checkbox-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.checkbox-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--ionic-space-400, 16px);margin-inline-end:var(--ionic-space-400, 16px)}:host(.checkbox-label-placement-end) .checkbox-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.checkbox-label-placement-end) .label-text-wrapper{-webkit-margin-start:var(--ionic-space-400, 16px);margin-inline-start:var(--ionic-space-400, 16px);-webkit-margin-end:0;margin-inline-end:0}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--ionic-space-400, 16px);margin-inline-end:var(--ionic-space-400, 16px)}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.checkbox-label-placement-stacked) .checkbox-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.checkbox-label-placement-stacked) .label-text-wrapper{-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:var(--ionic-space-400, 16px);max-width:133.3333333333%}:host(.checkbox-size-small){--size:var(--ionic-scale-400, 16px)}:host(.checkbox-checked) .native-wrapper,:host(.checkbox-indeterminate) .native-wrapper{border-color:var(--border-color-checked);background:var(--checkbox-background-checked)}:host(.checkbox-checked) .checkbox-icon path,:host(.checkbox-indeterminate) .checkbox-icon path{opacity:1}:host(.ion-invalid){--focus-ring-color:var(--ionic-state-focus-2, #ffafaf)}:host(.ion-invalid) .native-wrapper{border-color:var(--ionic-color-danger-800, #bf2222)}:host(.checkbox-disabled){pointer-events:none}:host(.checkbox-disabled) .native-wrapper:after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--ionic-state-disabled, rgba(255, 255, 255, 0.6));content:\"\";pointer-events:none;right:unset;left:unset;top:unset;bottom:unset;width:inherit;height:inherit}:host(.checkbox-disabled) .native-wrapper{border-color:var(--ionic-color-neutral-800, #626262);background-color:var(--ionic-state-disabled, rgba(255, 255, 255, 0.6))}:host(.checkbox-disabled.checkbox-checked) .native-wrapper{border-width:var(--ionic-border-size-0, 0px);background-color:var(--ionic-color-primary-base, #105cef)}@media (any-hover: hover){:host(:hover) .native-wrapper{background-color:var(--ionic-color-neutral-100, #f1f1f1)}:host(:hover.checkbox-checked) .native-wrapper,:host(:hover.checkbox-indeterminate) .native-wrapper{background-color:var(--ionic-color-primary-800, #0f54da)}}:host(.ion-focused:not(.checkbox-disabled)) .native-wrapper{outline:var(--focus-ring-width) var(--ionic-border-style-solid, solid) var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}:host(.ion-activated) .native-wrapper{background-color:var(--ionic-color-neutral-200, #e7e7e7)}:host(.ion-activated.checkbox-checked) .native-wrapper,:host(.ion-activated.checkbox-indeterminate) .native-wrapper{background-color:var(--ionic-color-primary-900, #0d4bc3)}:host(.checkbox-shape-soft){--border-radius:var(--ionic-border-radius-100, 4px)}:host(.checkbox-size-small.checkbox-shape-soft){--border-radius:var(--ionic-border-radius-050, 2px)}:host(.checkbox-shape-rectangular){--border-radius:var(--ionic-border-radius-0, 0px)}.checkbox-wrapper{min-height:var(--ionic-scale-1200, 48px)}";
 const IonCheckboxIonicStyle0 = checkboxIonicCss;
 
 const checkboxIosCss = ":host{--checkbox-background-checked:var(--ion-color-primary, #0054e9);--border-color-checked:var(--ion-color-primary, #0054e9);--checkmark-color:var(--ion-color-primary-contrast, #fff);--transition:none;display:inline-block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0;width:100%;height:100%}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}:host(.ion-color){--checkbox-background-checked:var(--ion-color-base);--border-color-checked:var(--ion-color-base);--checkmark-color:var(--ion-color-contrast)}.checkbox-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;height:inherit;cursor:inherit}.label-text-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host(.in-item) .label-text-wrapper{margin-top:10px;margin-bottom:10px}:host(.in-item.checkbox-label-placement-stacked) .label-text-wrapper{margin-top:10px;margin-bottom:16px}:host(.in-item.checkbox-label-placement-stacked) .native-wrapper{margin-bottom:10px}.label-text-wrapper-hidden{display:none}input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;opacity:0;overflow:hidden;clip:rect(0 0 0 0);-webkit-appearance:none;-moz-appearance:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.checkbox-icon{border-radius:var(--border-radius);position:relative;width:var(--size);height:var(--size);-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--checkbox-background);-webkit-box-sizing:border-box;box-sizing:border-box}.checkbox-icon path{fill:none;stroke:var(--checkmark-color);stroke-width:var(--checkmark-width);opacity:0}:host(.checkbox-justify-space-between) .checkbox-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.checkbox-justify-start) .checkbox-wrapper{-ms-flex-pack:start;justify-content:start}:host(.checkbox-justify-end) .checkbox-wrapper{-ms-flex-pack:end;justify-content:end}:host(.checkbox-alignment-start) .checkbox-wrapper{-ms-flex-align:start;align-items:start}:host(.checkbox-alignment-center) .checkbox-wrapper{-ms-flex-align:center;align-items:center}:host(.checkbox-label-placement-start) .checkbox-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.checkbox-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.checkbox-label-placement-end) .checkbox-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.checkbox-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.checkbox-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.checkbox-label-placement-stacked) .checkbox-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.checkbox-label-placement-stacked) .label-text-wrapper{-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:16px;max-width:calc(100% / 0.75)}:host(.checkbox-label-placement-stacked.checkbox-alignment-start) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host-context([dir=rtl]):host(.checkbox-label-placement-stacked.checkbox-alignment-start) .label-text-wrapper,:host-context([dir=rtl]).checkbox-label-placement-stacked.checkbox-alignment-start .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){:host(.checkbox-label-placement-stacked.checkbox-alignment-start:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}}:host(.checkbox-label-placement-stacked.checkbox-alignment-center) .label-text-wrapper{-webkit-transform-origin:center top;transform-origin:center top}:host-context([dir=rtl]):host(.checkbox-label-placement-stacked.checkbox-alignment-center) .label-text-wrapper,:host-context([dir=rtl]).checkbox-label-placement-stacked.checkbox-alignment-center .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}@supports selector(:dir(rtl)){:host(.checkbox-label-placement-stacked.checkbox-alignment-center:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}}:host(.checkbox-checked) .checkbox-icon,:host(.checkbox-indeterminate) .checkbox-icon{border-color:var(--border-color-checked);background:var(--checkbox-background-checked)}:host(.checkbox-checked) .checkbox-icon path,:host(.checkbox-indeterminate) .checkbox-icon path{opacity:1}:host(.checkbox-disabled){pointer-events:none}:host{--border-radius:50%;--border-width:0.125rem;--border-style:solid;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.23);--checkbox-background:var(--ion-item-background, var(--ion-background-color, #fff));--size:min(1.375rem, 55.836px);--checkmark-width:1.5px}:host(.checkbox-disabled){opacity:0.3}";

package/components/ion-header.js

@@ -325,7 +325,7 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
         const collapse = this.collapse || 'none';
         // banner role must be at top level, so remove role if inside a menu
         const roleType = hostContext('ion-menu', this.el) ? 'none' : 'banner';
-        return (h(Host, Object.assign({ key: '56f15a97266c8aab248e3d412a2ba3299b9fa42b', role: roleType, class: {
+        return (h(Host, Object.assign({ key: 'adbbe07d77bad24706b0bd759f8170494a81a289', role: roleType, class: {
                 [theme]: true,
                 // Used internally for styling
                 [`header-${theme}`]: true,
@@ -333,7 +333,7 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
                 [`header-collapse-${collapse}`]: true,
                 [`header-translucent-${theme}`]: this.translucent,
                 ['header-divider']: divider,
-            } }, inheritedAttributes), theme === 'ios' && translucent && h("div", { key: '667405e5122f700bbba919df94825ebbcdae0553', class: "header-background" }), h("slot", { key: 'bce48cab07702193e6c8de70800d6f009cee436c' })));
+            } }, inheritedAttributes), theme === 'ios' && translucent && h("div", { key: '658e2bd6083b7025fe25f3a7ef7e068b5de85d26', class: "header-background" }), h("slot", { key: 'd15ec6f1c6dcf4a316461dc917aceb50e54bd2c3' })));
     }
     get el() { return this; }
     static get style() { return {
@@ -343,7 +343,7 @@ const Header = /*@__PURE__*/ proxyCustomElement(class Header extends HTMLElement
     }; }
 }, [36, "ion-header", {
         "collapse": [1],
-        "divider": [516],
+        "divider": [4],
         "translucent": [4]
     }]);
 function defineCustomElement$1() {

package/components/ion-segment-content.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface IonSegmentContent extends Components.IonSegmentContent, HTMLElement {}
+export const IonSegmentContent: {
+    prototype: IonSegmentContent;
+    new (): IonSegmentContent;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/ion-segment-content.js

@@ -0,0 +1,38 @@
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const segmentContentCss = ":host{scroll-snap-align:center;-ms-flex-negative:0;flex-shrink:0;width:100%}";
+const IonSegmentContentStyle0 = segmentContentCss;
+
+const SegmentContent = /*@__PURE__*/ proxyCustomElement(class SegmentContent extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    render() {
+        return (h(Host, { key: '0b3b79ccf751ca783b40e061e096ae985fab878d' }, h("slot", { key: '857f85e248e9ebe402d5b29503a76e1aad574ae7' })));
+    }
+    get el() { return this; }
+    static get style() { return IonSegmentContentStyle0; }
+}, [1, "ion-segment-content"]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-segment-content"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-segment-content":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SegmentContent);
+            }
+            break;
+    } });
+}
+
+const IonSegmentContent = SegmentContent;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonSegmentContent, defineCustomElement };

package/components/ion-segment-view.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface IonSegmentView extends Components.IonSegmentView, HTMLElement {}
+export const IonSegmentView: {
+    prototype: IonSegmentView;
+    new (): IonSegmentView;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/ion-segment-view.js

@@ -0,0 +1,86 @@
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { a as addEventListener } from './helpers.js';
+
+const segmentViewCss = ":host{display:-ms-flexbox;display:flex;grid-column:1/-1;overflow-x:scroll;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none}:host::-webkit-scrollbar{display:none}";
+const IonSegmentViewStyle0 = segmentViewCss;
+
+const SegmentView = /*@__PURE__*/ proxyCustomElement(class SegmentView extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.segmentEl = null;
+        this.updateSection = () => {
+            const { segmentEl } = this;
+            if (segmentEl) {
+                const value = segmentEl.value;
+                const index = this.getSegmentButtonIndexWithValue(value);
+                this.setSection(index);
+            }
+        };
+        this.setSection = (index) => {
+            const sectionWidth = this.el.offsetWidth;
+            this.el.scrollTo({
+                top: 0,
+                left: index * sectionWidth,
+                behavior: 'smooth',
+            });
+        };
+    }
+    segmentViewScroll(ev) {
+        const { segmentEl } = this;
+        const atSnappingPoint = ev.target.scrollLeft % ev.target.offsetWidth === 0;
+        if (atSnappingPoint) {
+            const index = Math.round(ev.target.scrollLeft / ev.target.offsetWidth);
+            const segmentButton = this.getSegmentButtonAtIndex(index);
+            if (segmentEl) {
+                segmentEl.value = segmentButton.value;
+            }
+        }
+    }
+    connectedCallback() {
+        const segmentEl = (this.segmentEl = document.querySelector(`ion-segment[view=${this.el.id}]`));
+        if (segmentEl) {
+            addEventListener(segmentEl, 'ionChange', this.updateSection);
+        }
+    }
+    getSegmentButtons() {
+        const { segmentEl } = this;
+        if (!segmentEl) {
+            return [];
+        }
+        return Array.from(segmentEl.querySelectorAll('ion-segment-button'));
+    }
+    getSegmentButtonAtIndex(index) {
+        return this.getSegmentButtons()[index];
+    }
+    getSegmentButtonIndexWithValue(value) {
+        return this.getSegmentButtons().findIndex((b) => b.value === value);
+    }
+    render() {
+        return (h(Host, { key: '3a5d905041b663c7e533c5361472fdaad65d0e46' }, h("slot", { key: 'd4a6c6942afa53c22c7edf03275a0fb4ad7cbeb1' })));
+    }
+    get el() { return this; }
+    static get style() { return IonSegmentViewStyle0; }
+}, [1, "ion-segment-view", undefined, [[1, "scroll", "segmentViewScroll"]]]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-segment-view"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-segment-view":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SegmentView);
+            }
+            break;
+    } });
+}
+
+const IonSegmentView = SegmentView;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonSegmentView, defineCustomElement };

package/components/ion-segment.js

@@ -94,7 +94,15 @@ const Segment = /*@__PURE__*/ proxyCustomElement(class Segment extends HTMLEleme
     swipeGestureChanged() {
         this.gestureChanged();
     }
-    valueChanged(value) {
+    valueChanged(value, oldValue) {
+        if (oldValue !== undefined && value !== undefined) {
+            const buttons = this.getButtons();
+            const previous = buttons.find((button) => button.value === oldValue);
+            const current = buttons.find((button) => button.value === value);
+            if (previous && current) {
+                this.checkButton(previous, current);
+            }
+        }
         /**
          * `ionSelect` is emitted every time the value changes (internal or external changes).
          * Used by `ion-segment-button` to determine if the button should be checked.
@@ -432,14 +440,14 @@ const Segment = /*@__PURE__*/ proxyCustomElement(class Segment extends HTMLEleme
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: '8ebad474914841f288bad5076063c04eb8697c1f', role: "tablist", onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: 'fa333a638e291c771155cc8205a89022799b2f35', role: "tablist", onClick: this.onClick, class: createColorClasses(this.color, {
                 [theme]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'segment-activated': this.activated,
                 'segment-disabled': this.disabled,
                 'segment-scrollable': this.scrollable,
-            }) }, h("slot", { key: '7c80d6ab541998f3edf0ae12254c6412103000a0', onSlotchange: this.onSlottedItemsChange })));
+            }) }, h("slot", { key: '245eb99eee33b71a7cc4f33fedfd52ede284a21c', onSlotchange: this.onSlottedItemsChange })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-select-option.js

@@ -18,7 +18,7 @@ const SelectOption = /*@__PURE__*/ proxyCustomElement(class SelectOption extends
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: '1a977b2d7953ecbddf216c5b68d47104dda07bce', class: {
+        return (h(Host, { key: '9c119de67b396ed5a1cd5efa40034a1b10313f1b', class: {
                 [theme]: true,
             }, role: "option", id: this.inputId }));
     }

package/components/ion-select.js

@@ -652,7 +652,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
-        return (h(Host, { key: '50a843952ba75a266cb2690e3bac68c7bbb8ba95', onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: '63114b245835e18e63ab6b791713e1c34c2a91d3', onClick: this.onClick, class: createColorClasses(this.color, {
                 [theme]: true,
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', el),
@@ -668,7 +668,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
                 [`select-justify-${justify}`]: justifyEnabled,
                 [`select-shape-${shape}`]: shape !== undefined,
                 [`select-label-placement-${labelPlacement}`]: true,
-            }) }, h("label", { key: '617e8b1ee3636c35e8262748028c5c9b53349ab8', class: "select-wrapper", id: "select-label" }, this.renderLabelContainer(), h("div", { key: '0b5a7126bcb30203986c5a0ed9f2f41f25501ace', class: "select-wrapper-inner" }, h("slot", { key: '0e35013e26f58f04f7eb9228cb270991e5b755ae', name: "start" }), h("div", { key: 'cf131b61e7907f63a1ce32dd931a9753ae290807', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: '0adb8f7cdd610dfe67e1a363180e99322f5a6343', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'd9d2954141a517296483c22eac4b143c4096e1c5', class: "select-highlight" }))));
+            }) }, h("label", { key: 'dd7f90e38fd21cb0ce2cb26c588ff1318a3b4e03', class: "select-wrapper", id: "select-label" }, this.renderLabelContainer(), h("div", { key: '946a1f025be4a63e1b7f9243d1e089e204f7e2c4', class: "select-wrapper-inner" }, h("slot", { key: '4ab1ffe6511e37ec148768edd41ba26ca59dc0a2', name: "start" }), h("div", { key: 'bc949b66207c31b4f412e1a0480c779bdb20ab99', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: '3ce8d8bdf08ba900ae12f4ed51bcc693e9eb5f7c', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'ad3f883b723354327602b93208913dcfae218e2f', class: "select-highlight" }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-skeleton-text.js

@@ -32,11 +32,11 @@ const SkeletonText = /*@__PURE__*/ proxyCustomElement(class SkeletonText extends
         const animated = this.animated && config.getBoolean('animated', true);
         const inMedia = hostContext('ion-avatar', this.el) || hostContext('ion-thumbnail', this.el);
         const theme = getIonTheme(this);
-        return (h(Host, { key: '20170a23455836848210459749d9ba6a6eaaff53', class: {
+        return (h(Host, { key: 'f788545e591fdd0d1b3b61ad5e97b02d2d7e46f4', class: {
                 [theme]: true,
                 'skeleton-text-animated': animated,
                 'in-media': inMedia,
-            } }, h("span", { key: '96a9a18da286285abb647e7b69a4832cbe59b3b8' }, "\u00A0")));
+            } }, h("span", { key: '4f62ad7f8851d4111c60e7f7b28edcbb7067125c' }, "\u00A0")));
     }
     get el() { return this; }
     static get style() { return IonSkeletonTextStyle0; }

package/components/ion-split-pane.js

@@ -132,12 +132,12 @@ const SplitPane = /*@__PURE__*/ proxyCustomElement(class SplitPane extends HTMLE
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: 'f2090ca1bf3210b4ba6e20adafbc6f5839704cdd', class: {
+        return (h(Host, { key: 'a52854c638f501f9464c3d1d4c30bee020fd781e', class: {
                 [theme]: true,
                 // Used internally for styling
                 [`split-pane-${theme}`]: true,
                 'split-pane-visible': this.visible,
-            } }, h("slot", { key: '3ecadb0aa95e4b7799b34122afe25d028bba8710' })));
+            } }, h("slot", { key: 'b2164b195c5811dda3d855c47f1bb59975172329' })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-tab-bar.js

@@ -63,11 +63,11 @@ const TabBar = /*@__PURE__*/ proxyCustomElement(class TabBar extends HTMLElement
         const { color, translucent, keyboardVisible } = this;
         const theme = getIonTheme(this);
         const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
-        return (h(Host, { key: 'a17e0599a93095bd47d519336fda9ceeda3029d1', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
+        return (h(Host, { key: 'cf965ce80081170fd2200e7368c69cd6ccdada5d', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
                 [theme]: true,
                 'tab-bar-translucent': translucent,
                 'tab-bar-hidden': shouldHide,
-            }) }, h("slot", { key: '7c1f1abe56e8a0f3f24d3479dd6c839aaf90c7be' })));
+            }) }, h("slot", { key: '94538a393f7cf1000f4c476a4afdc73b7d593f32' })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-tab-button.js

@@ -79,7 +79,7 @@ const TabButton = /*@__PURE__*/ proxyCustomElement(class TabButton extends HTMLE
             rel,
             target,
         };
-        return (h(Host, { key: '9d7ead0ffeaea5d99e3aa357bff6c5ac64fa1f26', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (h(Host, { key: 'c5d5a400c9e489dca8f69a474e9d2f7321181352', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
                 [theme]: true,
                 'tab-selected': selected,
                 'tab-disabled': disabled,
@@ -91,7 +91,7 @@ const TabButton = /*@__PURE__*/ proxyCustomElement(class TabButton extends HTMLE
                 'ion-activatable': true,
                 'ion-selectable': true,
                 'ion-focusable': true,
-            } }, h("a", Object.assign({ key: 'fa0e9730e8b396d83df43a97b41067bbc6b195c2' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), h("span", { key: '70b80731de0115a7720de8f0e1f16bac4eb326c3', class: "button-inner" }, h("slot", { key: '3abf65a17ef45a00ae54909b3301f68117a04575' })), theme === 'md' && h("ion-ripple-effect", { key: 'becf3d93675dc8943dc16fc27d204b5c1ad00817', type: "unbounded" }))));
+            } }, h("a", Object.assign({ key: '7c8ebc51f564778ebd07615b06466e9250539682' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), h("span", { key: '0ec2cb0c616c612af1a97338b5b774196c7498e5', class: "button-inner" }, h("slot", { key: '84ba9e4c88466da0ae7c71de19f9896c9e4e93ef' })), theme === 'md' && h("ion-ripple-effect", { key: '647c96627b7f8339d72c36ca01320677b8b7839c', type: "unbounded" }))));
     }
     get el() { return this; }
     static get style() { return {

package/components/ion-tab.js

@@ -55,10 +55,10 @@ const Tab = /*@__PURE__*/ proxyCustomElement(class Tab extends HTMLElement {
     }
     render() {
         const { tab, active, component } = this;
-        return (h(Host, { key: '91a0d6e7f70446804044b06eaf22e6fe0eb14510', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (h(Host, { key: '121affd326db55663c47d9c917e64e863f909028', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'ion-page': component === undefined,
                 'tab-hidden': !active,
-            } }, h("slot", { key: '6bb7036c2a8a149212b5afdc0a34c6131efd1aee' })));
+            } }, h("slot", { key: '8c80289c7e745a8a07692565519b9b13eb56ff19' })));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-tabs.js

@@ -140,7 +140,7 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
     render() {
-        return (h(Host, { key: 'b38aa13e0115484aa4201c438956ba598671c7f7', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '47c5aead7a4caf5a496a020e2c4bcac2f5b4082a', name: "top" }), h("div", { key: '839c4cf7b8adbf3263b6e8b94963fe41ba7b1b35', class: "tabs-inner" }, h("slot", { key: '74d33c76bb578a3eddc6a2bfc833018b912b2947' })), h("slot", { key: '45919fcd3ba83ab5d3a928ec83ca14039dde68e2', name: "bottom" })));
+        return (h(Host, { key: 'ba731d1538baa664111266c5f9bc3311fe02f9b7', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '51f8ca87cd096a8e638a0b15d4fbab5aa730f5fa', name: "top" }), h("div", { key: 'e608434927bb5aac108027a4ce9389a0d930e1c2', class: "tabs-inner" }, h("slot", { key: '2922d0e28afc21fda97f2b29a8b5222d9782a6b4' })), h("slot", { key: 'f42306887fc30a816c961fea6cb609375eb56875', name: "bottom" })));
     }
     get el() { return this; }
     static get style() { return IonTabsStyle0; }

package/components/ion-text.js

@@ -17,9 +17,9 @@ const Text = /*@__PURE__*/ proxyCustomElement(class Text extends HTMLElement {
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: '1d7afeee75e183280309a1300a919eb6b554226c', class: createColorClasses(this.color, {
+        return (h(Host, { key: 'e1398a44433bb39074bd1c03a157968fde144dbd', class: createColorClasses(this.color, {
                 [theme]: true,
-            }) }, h("slot", { key: '5083935a5010701514fb18576912eabb738bb862' })));
+            }) }, h("slot", { key: '1c26cfb6121b165c9129fad3e98ae8a373949721' })));
     }
     static get style() { return IonTextStyle0; }
 }, [1, "ion-text", {

package/components/ion-textarea.js

@@ -367,7 +367,7 @@ const Textarea = /*@__PURE__*/ proxyCustomElement(class Textarea extends HTMLEle
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (h(Host, { key: '911726b3af25343ca7ba3084a00f6f70d10c11ed', class: createColorClasses(this.color, {
+        return (h(Host, { key: '35aa08db103e5deb78d957cab4b927f6b75cfa0d', class: createColorClasses(this.color, {
                 [theme]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -376,7 +376,7 @@ const Textarea = /*@__PURE__*/ proxyCustomElement(class Textarea extends HTMLEle
                 [`textarea-shape-${shape}`]: shape !== undefined,
                 [`textarea-label-placement-${labelPlacement}`]: true,
                 'textarea-disabled': disabled,
-            }) }, h("label", { key: '6f5f1633788b266b919c4bf9da1598fe3e33d9c0', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: 'bc04ce5f1174737a931c45f8851ba5a2b96e3f88', class: "textarea-wrapper-inner" }, h("div", { key: 'fa8552e1782232e56d7ff0ad69cd77f5bdff1dd8', class: "start-slot-wrapper" }, h("slot", { key: '96f59a916db5d3d386f5d87bfe5490b55bc39573', name: "start" })), h("div", { key: '7b0bab61d53d051bc0bfd8b7da99e9d8bc28d7d0', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: '162f9bafda1156f8b370e108a2acc76540b69f9a', 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 }, this.inheritedAttributes), value)), h("div", { key: '00f6074ba777a9c4410267a41ac3303c30be4b43', class: "end-slot-wrapper" }, h("slot", { key: '633af4fbfbbada66b4755ead8f1fe8ec412530b7', name: "end" }))), shouldRenderHighlight && h("div", { key: '04e74015f00c89279f23a13cc8f67944f8c9d336', class: "textarea-highlight" })), this.renderBottomContent()));
+            }) }, h("label", { key: '088fd6d57899f9b1595712c7a63642e9877f5e00', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: '3f1ab81e9c4a7a286f985fa7f6f30dca5f26833b', class: "textarea-wrapper-inner" }, h("div", { key: '4afa68f18bb62b32138a91d903c75672d9a8a9ba', class: "start-slot-wrapper" }, h("slot", { key: '635fa7a5c9754654a3d7f012d33fc12cbe9fd0cf', name: "start" })), h("div", { key: '0895b08cb759a157783a38f423c04967ec8c0ce1', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: 'ec1ebe99508fbce9897c870d5e74239a32dfba91', 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 }, this.inheritedAttributes), value)), h("div", { key: '411186d7c420c386233296edcbc9afd1d3de03a7', class: "end-slot-wrapper" }, h("slot", { key: 'b37cd68f0dc3f310cd78107d6f61933ba0e27d83', name: "end" }))), shouldRenderHighlight && h("div", { key: '43c7ae2f1e797701d9dbfd905d40320bb0f40e89', class: "textarea-highlight" })), this.renderBottomContent()));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-thumbnail.js

@@ -15,9 +15,9 @@ const Thumbnail = /*@__PURE__*/ proxyCustomElement(class Thumbnail extends HTMLE
     }
     render() {
         const theme = getIonTheme(this);
-        return (h(Host, { key: '8911848dc9edd536023c8a68e51752b751e3f0ab', class: {
+        return (h(Host, { key: '43ea61d750f53e8f3623df191eb3795a59599e40', class: {
                 [theme]: true,
-            } }, h("slot", { key: 'aaa7d7010d4050eebaed490b3ef7e641b076607c' })));
+            } }, h("slot", { key: 'feaecfa188c84b219d61ff99296b34c7ab26ec66' })));
     }
     static get style() { return IonThumbnailStyle0; }
 }, [1, "ion-thumbnail"]);

package/components/ion-title.js

@@ -41,11 +41,11 @@ const ToolbarTitle = /*@__PURE__*/ proxyCustomElement(class ToolbarTitle extends
     render() {
         const theme = getIonTheme(this);
         const size = this.getSize();
-        return (h(Host, { key: '67f00e2664322d0a5df32e093c7e227fc6f16c98', class: createColorClasses(this.color, {
+        return (h(Host, { key: '2312208012fcc0021511e9f83a797f0efecc95d7', class: createColorClasses(this.color, {
                 [theme]: true,
                 [`title-${size}`]: true,
                 'title-rtl': document.dir === 'rtl',
-            }) }, h("div", { key: 'cfc8295c9c599a9a61ea794b30169fdd574708f1', class: "toolbar-title" }, h("slot", { key: '2065458af3ed39d230c935332e7ff9c9d2d20e78' }))));
+            }) }, h("div", { key: '0d5cb6cb7065aa70a299061ebd1d7be04f0c5d22', class: "toolbar-title" }, h("slot", { key: '9f95add2dda42160f45137f7ebd8df0f3c3f1a69' }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-toast.js

@@ -831,9 +831,9 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends HTMLElement {
         if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
             printIonWarning('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);
         }
-        return (h(Host, Object.assign({ key: 'cb84d6f739571bc4193840fb790caa5bb5d86570', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'c479651c07a43bc57908af9c40ebd096cf37b055', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [theme]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '2d9d8ce5d886779f406410197df2a6244032c012', class: wrapperClass }, h("div", { key: '3a64cc8e864daf97f13c94416a544a80738273ba', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'c1461d577adabfb1244be84d5bc433c256a86a38', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '5a4cfe8b8fe74fa550468183b3f43294827b800f', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
+            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [theme]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: 'd4939b5d4f3ffee11ad3167387fbcf5d65107ddc', class: wrapperClass }, h("div", { key: 'bea0d04b6c936b61d0a8df70eb147f2792b7dadd', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'ea29fdcf23d8b915bb3c294bff094743e3e06e82', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: 'c0092793067bbc2cd5b7e538ccdc82aacd424fe1', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-toggle.js

@@ -215,7 +215,7 @@ const Toggle = /*@__PURE__*/ proxyCustomElement(class Toggle extends HTMLElement
         const value = this.getValue();
         const rtl = isRTL(el) ? 'rtl' : 'ltr';
         renderHiddenInput(true, el, name, checked ? value : '', disabled);
-        return (h(Host, { key: '06f5bc54f99b5f27f0d67a6934aea6bb671ec440', onClick: this.onClick, class: createColorClasses(color, {
+        return (h(Host, { key: 'aa9dc67384dc4be027ac562730e899f4315fdcfc', onClick: this.onClick, class: createColorClasses(color, {
                 [theme]: true,
                 'in-item': hostContext('ion-item', el),
                 'toggle-activated': activated,
@@ -225,10 +225,10 @@ const Toggle = /*@__PURE__*/ proxyCustomElement(class Toggle extends HTMLElement
                 [`toggle-alignment-${alignment}`]: true,
                 [`toggle-label-placement-${labelPlacement}`]: true,
                 [`toggle-${rtl}`]: true,
-            }) }, h("label", { key: '7831cd36159ce5fc9d854ebecb597ae3c659a1c1', class: "toggle-wrapper" }, h("input", Object.assign({ key: '11ea2c3830239223c8b570216ca84109155d7776', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, this.inheritedAttributes)), h("div", { key: '5ae16c5503913089ca9ec268cf4db8a7745460b6', class: {
+            }) }, h("label", { key: 'f154b73f5def7cc59a9d5f355eece52c57e5b493', class: "toggle-wrapper" }, h("input", Object.assign({ key: 'a1c4864c94a8f28a0d2e018ae35275125674cfa6', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, this.inheritedAttributes)), h("div", { key: '074b23eb8020c8318aeb8747c5bcef7e0ee235bb', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !this.hasLabel,
-            }, part: "label" }, h("slot", { key: '8787021fe340347d6ae44c22959f387f03b871e0' })), h("div", { key: '7ac6cf4bfeb41fc0e8ff9fa2e55571234ab07d03', class: "native-wrapper" }, this.renderToggleControl()))));
+            }, part: "label" }, h("slot", { key: '94d49b13cf0a4fa6fd0177931217446661691bc0' })), h("div", { key: 'c4468059e95a4f6342c60ccaaf3956e45a9b13cc', class: "native-wrapper" }, this.renderToggleControl()))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/ion-toolbar.js

@@ -5,7 +5,7 @@ import { proxyCustomElement, HTMLElement, forceUpdate, h, Host } from '@stencil/
 import { c as createColorClasses, h as hostContext } from './theme.js';
 import { d as getIonTheme } from './ionic-global.js';
 
-const toolbarIonicCss = ":host{--border-width:0;--border-style:solid;--opacity:1;--opacity-scale:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;width:100%;padding-right:var(--ion-safe-area-right);padding-left:var(--ion-safe-area-left);color:var(--color);contain:content;-webkit-box-sizing:border-box;box-sizing:border-box}.toolbar-container{-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);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:var(--min-height);contain:content;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}.toolbar-background{right:0;left:0;top:0;bottom:0;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;opacity:calc(var(--opacity) * var(--opacity-scale));pointer-events:none}::slotted(ion-progress-bar){right:0;left:0;bottom:0;position:absolute}:host{--background:var(--ionic-color-base-white, #ffffff);--color:var(--ionic-color-neutral-1200, #242424);--border-color:currentColor;--padding-top:var(--ionic-space-200, 8px);--padding-bottom:var(--ionic-space-200, 8px);--padding-start:var(--ionic-space-200, 8px);--padding-end:var(--ionic-space-200, 8px);--min-height:var(--ionic-scale-1400, 56px)}.toolbar-container{gap:var(--ionic-space-400, 16px)}.toolbar-content{-ms-flex:2;flex:2;-ms-flex-order:3;order:3;min-width:0}:host(.toolbar-divider){border-bottom:var(--ionic-border-size-025, 1px) var(--ionic-border-style-solid, solid) var(--ionic-color-neutral-300, #cfcfcf)}:host(.toolbar-searchbar) ::slotted(ion-searchbar){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}::slotted(ion-title){-webkit-padding-start:var(--padding-top);padding-inline-start:var(--padding-top);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}:host(.toolbar-title-default) ::slotted(ion-title){text-align:center}:host(.toolbar-title-large) ::slotted(ion-title){-webkit-padding-start:var(--ionic-space-400, 16px);padding-inline-start:var(--ionic-space-400, 16px);-webkit-padding-end:var(--ionic-space-400, 16px);padding-inline-end:var(--ionic-space-400, 16px)}::slotted([slot=secondary]){-ms-flex-order:2;order:2}::slotted([slot=primary]){-ms-flex-order:4;order:4;text-align:end}::slotted([slot=start]){-ms-flex-order:1;order:1}::slotted([slot=start]),::slotted([slot=end]){display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;gap:var(--ionic-space-200, 8px)}::slotted([slot=end]){-ms-flex-pack:end;justify-content:end;-ms-flex-order:5;order:5;font-size:var(--ionic-font-size-600, 1.5rem)}";
+const toolbarIonicCss = ":host{--border-width:0;--border-style:solid;--opacity:1;--opacity-scale:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;width:100%;padding-right:var(--ion-safe-area-right);padding-left:var(--ion-safe-area-left);color:var(--color);contain:content;-webkit-box-sizing:border-box;box-sizing:border-box}.toolbar-container{-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);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:var(--min-height);contain:content;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}.toolbar-background{right:0;left:0;top:0;bottom:0;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;opacity:calc(var(--opacity) * var(--opacity-scale));pointer-events:none}::slotted(ion-progress-bar){right:0;left:0;bottom:0;position:absolute}:host{--background:var(--ionic-color-base-white, #ffffff);--color:var(--ionic-color-neutral-1200, #242424);--border-color:currentColor;--padding-top:var(--ionic-space-200, 8px);--padding-bottom:var(--ionic-space-200, 8px);--padding-start:var(--ionic-space-200, 8px);--padding-end:var(--ionic-space-200, 8px);--min-height:var(--ionic-scale-1400, 56px)}.toolbar-container{gap:var(--ionic-space-400, 16px)}.toolbar-content{-ms-flex:2;flex:2;-ms-flex-order:3;order:3;min-width:0}:host(.toolbar-searchbar) ::slotted(ion-searchbar){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}::slotted(ion-title){-webkit-padding-start:var(--padding-top);padding-inline-start:var(--padding-top);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}:host(.toolbar-title-default) ::slotted(ion-title){text-align:center}:host(.toolbar-title-large) ::slotted(ion-title){-webkit-padding-start:var(--ionic-space-400, 16px);padding-inline-start:var(--ionic-space-400, 16px);-webkit-padding-end:var(--ionic-space-400, 16px);padding-inline-end:var(--ionic-space-400, 16px)}::slotted([slot=secondary]){-ms-flex-order:2;order:2}::slotted([slot=primary]){-ms-flex-order:4;order:4;text-align:end}::slotted([slot=start]){-ms-flex-order:1;order:1}::slotted([slot=start]),::slotted([slot=end]){display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;gap:var(--ionic-space-200, 8px)}::slotted([slot=end]){-ms-flex-pack:end;justify-content:end;-ms-flex-order:5;order:5;font-size:var(--ionic-font-size-600, 1.5rem)}";
 const IonToolbarIonicStyle0 = toolbarIonicCss;
 
 const toolbarIosCss = ":host{--border-width:0;--border-style:solid;--opacity:1;--opacity-scale:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;width:100%;padding-right:var(--ion-safe-area-right);padding-left:var(--ion-safe-area-left);color:var(--color);contain:content;-webkit-box-sizing:border-box;box-sizing:border-box}.toolbar-container{-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);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:var(--min-height);contain:content;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box}.toolbar-background{right:0;left:0;top:0;bottom:0;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);contain:strict;opacity:calc(var(--opacity) * var(--opacity-scale));pointer-events:none}::slotted(ion-progress-bar){right:0;left:0;bottom:0;position:absolute}:host{font-family:var(--ion-font-family, inherit);z-index:10}:host(.ion-color){color:var(--ion-color-contrast)}:host(.ion-color) .toolbar-background{background:var(--ion-color-base)}.toolbar-container{z-index:10}.toolbar-background{z-index:-1}:host{--background:var(--ion-toolbar-background, var(--ion-color-step-50, var(--ion-background-color-step-50, #f7f7f7)));--color:var(--ion-toolbar-color, var(--ion-text-color, #000));--border-color:var(--ion-toolbar-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.2)))));--padding-top:3px;--padding-bottom:3px;--padding-start:4px;--padding-end:4px;--min-height:44px}.toolbar-content{-ms-flex:1;flex:1;-ms-flex-order:4;order:4;min-width:0}:host(.toolbar-segment) .toolbar-content{display:-ms-inline-flexbox;display:inline-flex}:host(.toolbar-searchbar) .toolbar-container{padding-top:0;padding-bottom:0}:host(.toolbar-searchbar) ::slotted(*){-ms-flex-item-align:start;align-self:start}:host(.toolbar-searchbar) ::slotted(ion-chip){margin-top:3px}::slotted(ion-buttons){min-height:38px}::slotted([slot=start]){-ms-flex-order:2;order:2}::slotted([slot=secondary]){-ms-flex-order:3;order:3}::slotted([slot=primary]){-ms-flex-order:5;order:5;text-align:end}::slotted([slot=end]){-ms-flex-order:6;order:6;text-align:end}:host(.toolbar-title-large) .toolbar-container{-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:start;align-items:flex-start}:host(.toolbar-title-large) .toolbar-content ion-title{-ms-flex:1;flex:1;-ms-flex-order:8;order:8;min-width:100%}";
@@ -21,7 +21,6 @@ const Toolbar = /*@__PURE__*/ proxyCustomElement(class Toolbar extends HTMLEleme
         this.__attachShadow();
         this.childrenStyles = new Map();
         this.color = undefined;
-        this.divider = false;
     }
     componentWillLoad() {
         const buttons = Array.from(this.el.querySelectorAll('ion-buttons'));
@@ -63,16 +62,14 @@ const Toolbar = /*@__PURE__*/ proxyCustomElement(class Toolbar extends HTMLEleme
     }
     render() {
         const theme = getIonTheme(this);
-        const { divider } = this;
         const childStyles = {};
         this.childrenStyles.forEach((value) => {
             Object.assign(childStyles, value);
         });
-        return (h(Host, { key: 'f5da1b790268b25ce0130be750640968aec611f5', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
+        return (h(Host, { key: '301c7915c8331f4b00cf929068083102ec85a75d', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
                 [theme]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
-                'toolbar-divider': divider,
-            })) }, h("div", { key: 'd33c7e825763af744d07d4ec7a7856b902912e9c', class: "toolbar-background" }), h("div", { key: '3e85e2bd3861212a7cb709afbe851971518db74b', class: "toolbar-container" }, h("slot", { key: '5b9373e89733c10ed5e9097136afce2c262a2174', name: "start" }), h("slot", { key: '46356ccb4fab24b6239142530d96ed48d4a993e8', name: "secondary" }), h("div", { key: 'b5ac75f16fbd71cf1e89a28e1fd17aa27e01c8c4', class: "toolbar-content" }, h("slot", { key: '02999472244f9f6f36f0a5a693364c5a5cc654a3' })), h("slot", { key: '45f86f4559f304275574ab035acb29c26fec89c4', name: "primary" }), h("slot", { key: '4d9f4e808409e398be44cccade074702640d07b6', name: "end" }))));
+            })) }, h("div", { key: 'fa60782795f4c50a2bf6fe85799439ee4469c51f', class: "toolbar-background" }), h("div", { key: 'd22e03c135a3360b796c9149018888a176d05a7e', class: "toolbar-container" }, h("slot", { key: 'e97e52fd2426ef4fdddcad9202a5331c4d1ef6b7', name: "start" }), h("slot", { key: '1f82aa2d95a17ab478d13ade7ae52da227de2bfc', name: "secondary" }), h("div", { key: 'e7698f82a464a9c863bd3a602d396a14d987bad0', class: "toolbar-content" }, h("slot", { key: '215f4fcd1cae042da6e2d5ef9832d9857db1b7c6' })), h("slot", { key: '962027f724f2a3ba009dcb218f71bbc97fb6927a', name: "primary" }), h("slot", { key: '5d7d1a5132501a436a82e267d660ec7feea96012', name: "end" }))));
     }
     get el() { return this; }
     static get style() { return {
@@ -81,8 +78,7 @@ const Toolbar = /*@__PURE__*/ proxyCustomElement(class Toolbar extends HTMLEleme
         md: IonToolbarMdStyle0
     }; }
 }, [33, "ion-toolbar", {
-        "color": [513],
-        "divider": [516]
+        "color": [513]
     }, [[0, "ionStyle", "childrenStyle"]]]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/components/select-popover.js

@@ -121,9 +121,9 @@ const SelectPopover = /*@__PURE__*/ proxyCustomElement(class SelectPopover exten
         const { header, message, options, subHeader } = this;
         const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
         const theme = getIonTheme(this);
-        return (h(Host, { key: '6ac9472c819c6631cd64ad8810256dd03fde120b', class: {
+        return (h(Host, { key: '499511498ca8be82086bb06e2b27ce33bffc1ddb', class: {
                 [theme]: true,
-            } }, h("ion-list", { key: 'b485896c38c080bc42f92e962440cd3b8308e728' }, header !== undefined && h("ion-list-header", { key: '6a1df70265a4b9feec9521d5f946994345456925' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: 'c4ecbcaa2c56c1cb900e039cbfe36c2fae03f2ac' }, h("ion-label", { key: 'e310d3445c6abfffb4ff00a1aec97dd09c94e1d3', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: '9a6ffdfd9df8aea92290caf317d855b262ac8998' }, subHeader), message !== undefined && h("p", { key: 'b5ca3c716d69e6a2c013df3fa3436b92953c4296' }, message)))), this.renderOptions(options))));
+            } }, h("ion-list", { key: '278f6bc1feeede9f02728971f322aa63f806321e' }, header !== undefined && h("ion-list-header", { key: 'ae4b4d8d73b7d353ac11e26dab35d001b7bfd2bf' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: '79e6641ab2dbbd08811ddcf8f346b0f18e3f0454' }, h("ion-label", { key: '53788eacd7384c4f24c727cd9312da3a57ccc67b', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: '0f028877e1fb89b66c22f5963bc57257d34f653d' }, subHeader), message !== undefined && h("p", { key: 'ff3b24d1bddacf963d9e1c287e65b71c97bb95b9' }, message)))), this.renderOptions(options))));
     }
     get el() { return this; }
     static get style() { return {

package/components/spinner.js

@@ -185,7 +185,7 @@ const Spinner = /*@__PURE__*/ proxyCustomElement(class Spinner extends HTMLEleme
                 svgs.push(buildLine(spinner, duration, i, spinner.lines));
             }
         }
-        return (h(Host, { key: '577bf2a998c801edc32a1d515fc930c471567e71', class: createColorClasses(self.color, {
+        return (h(Host, { key: '5cb7fe35a97d06ec56f83facd294847b51cbc7af', class: createColorClasses(self.color, {
                 [theme]: true,
                 [`spinner-${spinnerName}`]: true,
                 'spinner-paused': self.paused || config.getBoolean('_testing'),