@ionic/core 8.8.4-dev.11777064748.1e6da1cd → 8.8.4-dev.11777067325.14ed5f47

package/dist/collection/components/select/select.ionic.css

@@ -717,6 +717,8 @@ button {
 ::slotted(ion-icon) {
   width: var(--token-scale-400, 16px);
   height: var(--token-scale-400, 16px);
+  font-size: var(--token-scale-400, 16px);
+  line-height: 1;
 }
 
 .select-icon {

package/dist/collection/components/select/select.js

@@ -5,6 +5,7 @@ import caretDownRegular from "@phosphor-icons/core/assets/regular/caret-down.svg
 import { Build, Host, h, forceUpdate } from "@stencil/core";
 import { compareOptions, createNotchController, isOptionSelected, checkInvalidState } from "../../utils/forms/index";
 import { focusVisibleElement, renderHiddenInput, inheritAttributes } from "../../utils/helpers";
+import { renderIcon } from "../../utils/icon";
 import { printIonWarning } from "../../utils/logging/index";
 import { actionSheetController, alertController, popoverController, modalController } from "../../utils/overlays";
 import { isRTL } from "../../utils/rtl/index";
@@ -753,12 +754,12 @@ export class Select {
      * next to the select text.
      */
     renderSelectIcon() {
+        const theme = getIonTheme(this);
         const { isExpanded, selectExpandedIcon, selectCollapsedIcon } = this;
-        let icon = selectCollapsedIcon;
-        if (isExpanded) {
-            icon = selectExpandedIcon;
-        }
-        return h("ion-icon", { class: "select-icon", part: "icon", "aria-hidden": "true", icon: icon });
+        const icon = isExpanded ? selectExpandedIcon : selectCollapsedIcon;
+        // Use the font glyph for the default ionic icon; null forces SVG for custom icons.
+        const ionicIconClass = icon === caretDownRegular ? 'ph-caret-down' : null;
+        return renderIcon(theme, ionicIconClass, icon, { class: { 'select-icon': true }, part: 'icon' });
     }
     get ariaLabel() {
         var _a;
@@ -917,7 +918,7 @@ export class Select {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
-        return (h(Host, { key: 'd8f7abd11c8f6e5ebea306f69ed5ae5a115efa97', onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: 'adff24eefb2530bedad439d4fc487e8bc14ea6e9', onClick: this.onClick, class: createColorClasses(this.color, {
                 [theme]: true,
                 'in-item': inItem,
                 'in-item-color': hostContext('ion-item.ion-color', el),
@@ -936,7 +937,7 @@ export class Select {
                 [`select-shape-${shape}`]: shape !== undefined,
                 [`select-label-placement-${labelPlacement}`]: true,
                 [`select-size-${size}`]: size !== undefined,
-            }) }, h("label", { key: '443499f6c4501df171d4f16756f2e55e57512c0c', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick, part: "wrapper" }, this.renderLabelContainer(), h("div", { key: '66e6cf63163b68b1ca85979e5c49a349632dfc54', class: "select-wrapper-inner", part: "inner" }, 
+            }) }, h("label", { key: 'ae2d8ab47f377909857ccd082e0f4aaa5504fa8b', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick, part: "wrapper" }, this.renderLabelContainer(), h("div", { key: 'd908a934f21c145f178c3e39eb7ec076caec752a', class: "select-wrapper-inner", part: "inner" }, 
         /**
          * For the ionic theme, we render the outline container here
          * instead of higher up, so it can be positioned relative to
@@ -946,7 +947,7 @@ export class Select {
          * <label> element, ensuring that clicking the label text
          * focuses the select.
          */
-        theme === 'ionic' && fill === 'outline' && h("div", { key: 'a9f7d6bde570f4e2261617cdc2529cd835297865', class: "select-outline" }), h("slot", { key: 'f5516f6749c85dc3ed8f9ee04e748f1aad0d815c', name: "start" }), h("div", { key: '86fa4152f415a5ab72ed1a95899212fc1914b81c', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: '3333af6835b20a97450372ca78a4aa77adf39d1c', name: "end" }), shouldRenderInnerIcon && this.renderSelectIcon()), shouldRenderOuterIcon && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: 'e0e782845ed0c35c139dbddcc3f9880aec12cf58', class: "select-highlight" })), this.renderBottomContent()));
+        theme === 'ionic' && fill === 'outline' && h("div", { key: '039d4719fd7e9f63574f3f98680a4df1d2bb4991', class: "select-outline" }), h("slot", { key: 'd227aea2b1c9d8318b8ccabeb8aef3fab72fd108', name: "start" }), h("div", { key: '5dbb3fd5b5e1ba443fe7589fead79a1e4cb35042', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), h("slot", { key: 'abfe8949dfe755e5477b2578f1c97159568c3502', name: "end" }), shouldRenderInnerIcon && this.renderSelectIcon()), shouldRenderOuterIcon && this.renderSelectIcon(), shouldRenderHighlight && h("div", { key: '55dce3ef686cc1e6d9b049978e0a62dbead1a087', class: "select-highlight" })), this.renderBottomContent()));
     }
     static get is() { return "ion-select"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggle/toggle.ionic.css

@@ -464,6 +464,8 @@ input {
 .toggle-inner .toggle-switch-icon {
   width: var(--token-scale-400, 16px);
   height: var(--token-scale-400, 16px);
+  font-size: var(--token-scale-400, 16px);
+  line-height: 1;
 }
 
 /**

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-04-24T21:08:18",
+  "timestamp": "2026-04-24T21:51:12",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.43.0",
@@ -38973,8 +38973,7 @@
         "ion-action-sheet",
         "ion-alert",
         "ion-select-modal",
-        "ion-modal",
-        "ion-icon"
+        "ion-modal"
       ],
       "dependencyGraph": {
         "ion-select": [
@@ -38983,8 +38982,7 @@
           "ion-action-sheet",
           "ion-alert",
           "ion-select-modal",
-          "ion-modal",
-          "ion-icon"
+          "ion-modal"
         ],
         "ion-select-popover": [
           "ion-item",