@ionic/core 8.5.5-nightly.20250416 → 8.5.5

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

@@ -126,7 +126,7 @@
   pointer-events: none;
 }
 
-:host(.ion-focused) button {
+:host(.has-focus) button {
   border: 2px solid #5e9ed6;
 }
 
@@ -329,7 +329,9 @@ button {
  * highlight when the select is blurred.
  */
 :host(.has-focus.ion-valid),
-:host(.ion-touched.ion-invalid) {
+:host(.select-expanded.ion-valid),
+:host(.ion-touched.ion-invalid),
+:host(.select-expanded.ion-touched.ion-invalid) {
   --border-color: var(--highlight-color);
 }
 
@@ -596,7 +598,7 @@ button {
  * :host(.label-floating.select-label-placement-floating) .native-wrapper .select-placeholder
  */
 :host(.select-expanded.select-label-placement-floating) .native-wrapper .select-placeholder,
-:host(.ion-focused.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;
 }
@@ -820,6 +822,7 @@ button {
  * If the select has a validity state, the
  * border should reflect that as a 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);
@@ -848,9 +851,9 @@ button {
  * much darker on focus.
  */
 :host(.select-fill-solid.select-expanded),
-:host(.select-fill-solid.ion-focused) {
+:host(.select-fill-solid.has-focus) {
   --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));
+  --border-color: var(--highlight-color);
 }
 
 :host(.select-fill-solid) .select-wrapper {
@@ -872,6 +875,18 @@ button {
   max-width: calc(100% / 0.75);
 }
 
+/**
+ * When the select has a solid fill and
+ * in an item, then the icon should
+ * take on the highlight color.
+ */
+: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);
+}
+
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -965,7 +980,7 @@ button {
  * the select is focused.
  */
 :host(.select-fill-outline.select-expanded),
-:host(.select-fill-outline.ion-focused) {
+:host(.select-fill-outline.has-focus) {
   --border-width: var(--highlight-height);
   --border-color: var(--highlight-color);
 }
@@ -1167,27 +1182,33 @@ button {
   border-top: none;
 }
 
+/**
+ * When the select has an outline fill and
+ * in an item, then the icon should
+ * take on the highlight color.
+ */
+: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;
 }
 
-.select-icon {
-  width: 0.8125rem;
-  transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
-  color: var(--ion-color-step-500, var(--ion-text-color-step-500, gray));
-}
-
 /**
  * When the select is focused the label should
  * take on the highlight color. This should
  * only apply to floating or stacked labels.
  */
 :host(.select-label-placement-floating.select-expanded) .label-text-wrapper,
-:host(.select-label-placement-floating.ion-focused) .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.ion-focused) .label-text-wrapper {
+:host(.select-label-placement-stacked.has-focus) .label-text-wrapper {
   color: var(--highlight-color);
 }
 
@@ -1212,7 +1233,7 @@ button {
 }
 
 :host(.select-expanded) .select-highlight,
-:host(.ion-focused) .select-highlight {
+:host(.has-focus) .select-highlight {
   transform: scale(1);
 }
 
@@ -1228,6 +1249,12 @@ button {
   inset-inline-start: 0;
 }
 
+.select-icon {
+  width: 0.8125rem;
+  transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
+  color: var(--ion-color-step-500, var(--ion-text-color-step-500, gray));
+}
+
 /**
  * This rotates the chevron icon
  * when the select is activated.
@@ -1237,6 +1264,18 @@ button {
   transform: rotate(180deg);
 }
 
+/**
+ * When the select has no fill and
+ * in an item, then the icon should
+ * be the same color as the text color.
+ */
+: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));
+}
+
 /**
  * When the select is focused the icon should
  * take on the highlight color.
@@ -1246,7 +1285,7 @@ button {
 :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(.ion-focused) .select-wrapper .select-icon {
+:host(.has-focus) .select-wrapper .select-icon {
   color: var(--highlight-color);
 }
 

package/dist/collection/components/split-pane/split-pane.js

@@ -2,6 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { Build, Host, h } from "@stencil/core";
+import { printIonWarning } from "../../utils/logging/index";
 import { getIonMode } from "../../global/ionic-global";
 // TODO(FW-2832): types
 const SPLIT_PANE_MAIN = 'split-pane-main';
@@ -103,7 +104,7 @@ export class SplitPane {
             const isMain = contentId !== undefined && child.id === contentId;
             if (isMain) {
                 if (foundMain) {
-                    console.warn('split pane cannot have more than one main node');
+                    printIonWarning('[ion-split-pane] - Cannot have more than one main node.');
                     return;
                 }
                 else {
@@ -113,17 +114,17 @@ export class SplitPane {
             }
         }
         if (!foundMain) {
-            console.warn('split pane does not have a specified main node');
+            printIonWarning('[ion-split-pane] - Does not have a specified main node.');
         }
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '76be70d7fbebc52646a5851f47accc1006615b85', class: {
+        return (h(Host, { key: '098801b5a318e2fc6913fb0d9079b1552927b99b', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`split-pane-${mode}`]: true,
                 'split-pane-visible': this.visible,
-            } }, h("slot", { key: '9a859530f4fb18aff43255bc3940feb9aca625d7' })));
+            } }, h("slot", { key: '8cbc6a942ecba54fc3c62027d46917db067b65c8' })));
     }
     static get is() { return "ion-split-pane"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tab/tab.js

@@ -3,6 +3,7 @@
  */
 import { Build, Host, h } from "@stencil/core";
 import { attachComponent } from "../../utils/framework-delegate";
+import { printIonError } from "../../utils/logging/index";
 export class Tab {
     constructor() {
         this.loaded = false;
@@ -14,7 +15,7 @@ export class Tab {
     async componentWillLoad() {
         if (Build.isDev) {
             if (this.component !== undefined && this.el.childElementCount > 0) {
-                console.error('You can not use a lazy-loaded component in a tab and inlined content at the same time.' +
+                printIonError('[ion-tab] - You can not use a lazy-loaded component in a tab and inlined content at the same time.' +
                     `- Remove the component attribute in: <ion-tab component="${this.component}">` +
                     ` or` +
                     `- Remove the embedded content inside the ion-tab: <ion-tab></ion-tab>`);
@@ -41,17 +42,17 @@ export class Tab {
                 return attachComponent(this.delegate, this.el, this.component, ['ion-page']);
             }
             catch (e) {
-                console.error(e);
+                printIonError('[ion-tab] - Exception in prepareLazyLoaded:', e);
             }
         }
         return Promise.resolve(undefined);
     }
     render() {
         const { tab, active, component } = this;
-        return (h(Host, { key: '2107ece2f1ebdf748bac8adb78a9ad67e7fc9057', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (h(Host, { key: 'c36c113e74e12b58459df9e3b546ad4856187e90', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'ion-page': component === undefined,
                 'tab-hidden': !active,
-            } }, h("slot", { key: 'b4a1bc1aa79f6b82b8f77b544bcb74e65229b541' })));
+            } }, h("slot", { key: '0d7821dac70ba7a12edfb3331988f3df1566cc1a' })));
     }
     static get is() { return "ion-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/tabs.js

@@ -2,6 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { Host, h } from "@stencil/core";
+import { printIonError } from "../../utils/logging/index";
 /**
  * @slot - Content is placed between the named slots if provided without a slot.
  * @slot top - Content is placed at the top of the screen.
@@ -145,7 +146,7 @@ export class Tabs {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
     render() {
-        return (h(Host, { key: 'd357c4607cfc89fb88404fe12ea7ef5b397fe6bf', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '18661896589a4ab3c74164f448b928abec9b4db0', name: "top" }), h("div", { key: '3bf30ea2540a196e868a78a861824b4b5d933afd', class: "tabs-inner" }, h("slot", { key: '7cfc154d4d6c1642188ab6508a6be72c8234585e' })), h("slot", { key: '8057679c959195cbdfae156b8ae0cbfd978c5037', name: "bottom" })));
+        return (h(Host, { key: '20b97196d78c1b3f3faf31618a8a2347e087f06b', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: 'b0823fbae6e47743cfd12c376b365ad7e32cec7c', name: "top" }), h("div", { key: 'eaffd7e4d69ab9489a387e3bbb36e3bab72203a0', class: "tabs-inner" }, h("slot", { key: '20bb66a2937e3ec473aa59c4075ce581b5411677' })), h("slot", { key: '1529dd361f050f52074f51c73b3982ba827dc3a5', name: "bottom" })));
     }
     static get is() { return "ion-tabs"; }
     static get encapsulation() { return "shadow"; }
@@ -376,7 +377,7 @@ export class Tabs {
 const getTab = (tabs, tab) => {
     const tabEl = typeof tab === 'string' ? tabs.find((t) => t.tab === tab) : tab;
     if (!tabEl) {
-        console.error(`tab with id: "${tabEl}" does not exist`);
+        printIonError(`[ion-tabs] - Tab with id: "${tabEl}" does not exist`);
     }
     return tabEl;
 };

package/dist/collection/components/textarea/textarea.js

@@ -385,7 +385,7 @@ export class Textarea {
          * TODO(FW-5592): Remove hasStartEndSlots condition
          */
         const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
-        return (h(Host, { key: '3bf42ea1fa739f334427c70f91a89b8b0e0f21ec', class: createColorClasses(this.color, {
+        return (h(Host, { key: '016dd354c8a4cd62646d4a85dbcfa2eacb870d69', class: createColorClasses(this.color, {
                 [mode]: true,
                 'has-value': hasValue,
                 'has-focus': hasFocus,
@@ -394,7 +394,7 @@ export class Textarea {
                 [`textarea-shape-${shape}`]: shape !== undefined,
                 [`textarea-label-placement-${labelPlacement}`]: true,
                 'textarea-disabled': disabled,
-            }) }, h("label", { key: 'f7acceeb74849d13a6af8d39b66ea2701384c955', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: '05e9f2ebad1742a9e66d243d18c22ddd4c83ee04', class: "textarea-wrapper-inner" }, h("div", { key: '70a9935351c38413ced05f5e4dc0055b9b001ee9', class: "start-slot-wrapper" }, h("slot", { key: '11206eaa31d112c01f2218bf2ff46375ad819d1f', name: "start" })), h("div", { key: 'bfd215dbb5f4d60f5fb62d37226fdc6ce61ec107', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: '2fa5cdf4c6614dd8cd4b7d2a19811a79c96ac50d', 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.getHintTextID() === this.errorTextId }, this.inheritedAttributes), value)), h("div", { key: '8a67ad8e3b5650680f770cefc562d190f6760718', class: "end-slot-wrapper" }, h("slot", { key: '03bb6bc5f2808c1f474a6c3168169d17f7569fda', name: "end" }))), shouldRenderHighlight && h("div", { key: 'cd564bd01a1ca3f914218e34a78d296ad0838e4a', class: "textarea-highlight" })), this.renderBottomContent()));
+            }) }, h("label", { key: '7e98f3fc05f678e8567d9977aa7e622ddb90d394', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: '7af77dad961ca9f80bbc6be8cd834989542ae27d', class: "textarea-wrapper-inner" }, h("div", { key: 'e311cda4bb52e93ce7775f40b62a0a62a847794b', class: "start-slot-wrapper" }, h("slot", { key: '81248b4cedce3876c1da9da03d36e3bee8442738', name: "start" })), h("div", { key: 'f68ba6e2bb3df4971ecbebbcb316f31ee10f9e75', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: '2e896ef782d08b56454a1656301b8ce54564c8b3', 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.getHintTextID() === this.errorTextId }, this.inheritedAttributes), value)), h("div", { key: '7eff97dabd340641a666a388fc590caa88128046', class: "end-slot-wrapper" }, h("slot", { key: 'e8f7e6bd5a33afae6add6d920954cca7a3c0612b', name: "end" }))), shouldRenderHighlight && h("div", { key: '4c825874e6ed910e3aa36b16fa1d2927b7f006b1', class: "textarea-highlight" })), this.renderBottomContent()));
     }
     static get is() { return "ion-textarea"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toast/animations/utils.js

@@ -75,7 +75,7 @@ export function getAnimationPosition(position, positionAnchor, mode, toast) {
  */
 function warnIfAnchorIsHidden(positionAnchor, toast) {
     if (positionAnchor.offsetParent === null) {
-        printIonWarning('The positionAnchor element for ion-toast was found in the DOM, but appears to be hidden. This may lead to unexpected positioning of the toast.', toast);
+        printIonWarning('[ion-toast] - The positionAnchor element for ion-toast was found in the DOM, but appears to be hidden. This may lead to unexpected positioning of the toast.', toast);
     }
 }
 /**

package/dist/collection/components/toast/toast.js

@@ -5,7 +5,7 @@ import { h, Host } from "@stencil/core";
 import { ENABLE_HTML_CONTENT_DEFAULT } from "../../utils/config";
 import { raf } from "../../utils/helpers";
 import { createLockController } from "../../utils/lock-controller";
-import { printIonWarning } from "../../utils/logging/index";
+import { printIonError, printIonWarning } from "../../utils/logging/index";
 import { GESTURE, createDelegateController, createTriggerController, dismiss, eventMethod, isCancel, prepareOverlay, present, safeCall, setOverlayId, } from "../../utils/overlays";
 import { sanitizeDOMString } from "../../utils/sanitization/index";
 import { createColorClasses, getClassMap } from "../../utils/theme";
@@ -291,7 +291,7 @@ export class Toast {
             return;
         }
         if (position === 'middle' && positionAnchor !== undefined) {
-            printIonWarning('The positionAnchor property is ignored when using position="middle".', this.el);
+            printIonWarning('[ion-toast] - The positionAnchor property is ignored when using position="middle".', this.el);
             return undefined;
         }
         if (typeof positionAnchor === 'string') {
@@ -303,7 +303,7 @@ export class Toast {
              */
             const foundEl = document.getElementById(positionAnchor);
             if (foundEl === null) {
-                printIonWarning(`An anchor element with an ID of "${positionAnchor}" was not found in the DOM.`, el);
+                printIonWarning(`[ion-toast] - An anchor element with an ID of "${positionAnchor}" was not found in the DOM.`, el);
                 return undefined;
             }
             return foundEl;
@@ -311,7 +311,7 @@ export class Toast {
         if (positionAnchor instanceof HTMLElement) {
             return positionAnchor;
         }
-        printIonWarning('Invalid positionAnchor value:', positionAnchor, el);
+        printIonWarning('[ion-toast] - Invalid positionAnchor value:', positionAnchor, el);
         return undefined;
     }
     async buttonClick(button) {
@@ -337,7 +337,7 @@ export class Toast {
                 }
             }
             catch (e) {
-                console.error(e);
+                printIonError('[ion-toast] - Exception in callButtonHandler:', e);
             }
         }
         return true;
@@ -389,11 +389,11 @@ export class Toast {
          *  used with one type of button.
          */
         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);
+            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);
         }
-        return (h(Host, Object.assign({ key: '34036afc0701173d51c9c11ea4a2e1d65685ba41', tabindex: "-1" }, this.htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'a2216d860255c99337464370dcb12f6125871a50', tabindex: "-1" }, this.htmlAttributes, { style: {
                 zIndex: `${60000 + this.overlayIndex}`,
-            }, class: createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: 'd927e43957f47888ce4e64f1e99c935d55757af7', class: wrapperClass }, h("div", { key: 'ca43bc42478181acdf8cdea6601a85fa95d12216', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'fdd6fb8f6e947ed002bd2e63fdc8ec7e764f4a7d', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '37c16c81ee3e4304379dfbcabdffe73db73e4653', 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({ [mode]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: 'd5adf8bc4c6c52431600033a76c4795689f9b412', class: wrapperClass }, h("div", { key: 'ab694497ae37ceba123217eb48800129b9bebb84', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: '224854fa3989ce0eb69416cb5b0cc55fc9f131ea', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: 'c8e11fb5bdac202987f5c8613a0ebbd42bda946e', 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')))));
     }
     static get is() { return "ion-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/global/ionic-global.js

@@ -2,6 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { getMode, setMode } from "@stencil/core";
+import { printIonWarning } from "../utils/logging/index";
 import { isPlatform, setupPlatforms } from "../utils/platform";
 import { config, configFromSession, configFromURL, saveConfig } from "./config";
 // TODO(FW-2832): types
@@ -46,7 +47,7 @@ export const initialize = (userConfig = {}) => {
                     return elmMode;
                 }
                 else if (isIonicElement(elm)) {
-                    console.warn('Invalid ionic mode: "' + elmMode + '", expected: "ios" or "md"');
+                    printIonWarning('Invalid ionic mode: "' + elmMode + '", expected: "ios" or "md"');
                 }
             }
             elm = elm.parentElement;

package/dist/collection/index.js

@@ -10,6 +10,7 @@ export { getTimeGivenProgression } from './utils/animation/cubic-bezier';
 export { createGesture } from './utils/gesture';
 export { initialize } from './global/ionic-global';
 export { componentOnReady } from './utils/helpers';
+export { LogLevel } from './utils/logging';
 export { isPlatform, getPlatforms } from './utils/platform';
 export { IonicSafeString } from './utils/sanitization';
 export { getMode, setupConfig } from './utils/config';

package/dist/collection/utils/animation/animation.js

@@ -1,6 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
+import { printIonError } from "../logging/index";
 import { win } from "../browser";
 import { addClassToArray, setStyleProperty } from "./animation-utils";
 export const createAnimation = (animationId) => {
@@ -345,7 +346,7 @@ export const createAnimation = (animationId) => {
                 }
             }
             else {
-                console.error('Invalid addElement value');
+                printIonError('createAnimation - Invalid addElement value.');
             }
         }
         return ani;

package/dist/collection/utils/hardware-back-button.js

@@ -2,6 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { win } from "./browser/index";
+import { printIonError } from "./logging/index";
 import { config } from "../global/config";
 /**
  * CloseWatcher is a newer API that lets
@@ -57,7 +58,7 @@ export const startHardwareBackButton = () => {
                 }
             }
             catch (e) {
-                console.error(e);
+                printIonError('[ion-app] - Exception in startHardwareBackButton:', e);
             }
         };
         const processHandlers = () => {

package/dist/collection/utils/helpers.js

@@ -1,6 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
+import { printIonError } from "./logging/index";
 export const transitionEndAsync = (el, expectedDuration = 0) => {
     return new Promise((resolve) => {
         transitionEnd(el, expectedDuration, resolve);
@@ -251,7 +252,7 @@ export const clamp = (min, n, max) => {
 export const assert = (actual, reason) => {
     if (!actual) {
         const message = 'ASSERT: ' + reason;
-        console.error(message);
+        printIonError(message);
         debugger; // eslint-disable-line
         throw new Error(message);
     }

package/dist/collection/utils/logging/index.js

@@ -2,6 +2,12 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { config } from "../../global/config";
+export var LogLevel;
+(function (LogLevel) {
+    LogLevel["OFF"] = "OFF";
+    LogLevel["ERROR"] = "ERROR";
+    LogLevel["WARN"] = "WARN";
+})(LogLevel || (LogLevel = {}));
 /**
  * Logs a warning to the console with an Ionic prefix
  * to indicate the library that is warning the developer.
@@ -9,8 +15,8 @@ import { config } from "../../global/config";
  * @param message - The string message to be logged to the console.
  */
 export const printIonWarning = (message, ...params) => {
-    const logLevel = config.get('logLevel', "WARN" /* LogLevel.WARN */);
-    if (["WARN" /* LogLevel.WARN */].includes(logLevel)) {
+    const logLevel = config.get('logLevel', LogLevel.WARN);
+    if ([LogLevel.WARN].includes(logLevel)) {
         return console.warn(`[Ionic Warning]: ${message}`, ...params);
     }
 };
@@ -22,8 +28,8 @@ export const printIonWarning = (message, ...params) => {
  * @param params - Additional arguments to supply to the console.error.
  */
 export const printIonError = (message, ...params) => {
-    const logLevel = config.get('logLevel', "ERROR" /* LogLevel.ERROR */);
-    if (["ERROR" /* LogLevel.ERROR */, "WARN" /* LogLevel.WARN */].includes(logLevel)) {
+    const logLevel = config.get('logLevel', LogLevel.ERROR);
+    if ([LogLevel.ERROR, LogLevel.WARN].includes(logLevel)) {
         return console.error(`[Ionic Error]: ${message}`, ...params);
     }
 };

package/dist/collection/utils/overlays.js

@@ -4,13 +4,13 @@
 import { doc } from "./browser/index";
 import { focusFirstDescendant, focusLastDescendant, focusableQueryString } from "./focus-trap";
 import { shouldUseCloseWatcher } from "./hardware-back-button";
+import { printIonError, printIonWarning } from "./logging/index";
 import { config } from "../global/config";
 import { getIonMode } from "../global/ionic-global";
 import { CoreDelegate } from "./framework-delegate";
 import { BACKDROP_NO_SCROLL } from "./gesture/gesture-controller";
 import { OVERLAY_BACK_BUTTON_PRIORITY } from "./hardware-back-button";
 import { addEventListener, componentOnReady, focusVisibleElement, getElementRoot, removeEventListener, } from "./helpers";
-import { printIonWarning } from "./logging";
 import { isPlatform } from "./platform";
 let lastOverlayIndex = 0;
 let lastId = 0;
@@ -544,7 +544,7 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
     }
     const presentedOverlays = doc !== undefined ? getPresentedOverlays(doc) : [];
     /**
-     * For accessibility, toasts lack focus traps and don’t receive
+     * For accessibility, toasts lack focus traps and don't receive
      * `aria-hidden` on the root element when presented.
      *
      * All other overlays use focus traps to keep keyboard focus
@@ -607,7 +607,7 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
         }
     }
     catch (err) {
-        console.error(err);
+        printIonError(`[${overlay.el.tagName.toLowerCase()}] - `, err);
     }
     overlay.el.remove();
     revealOverlaysToScreenReaders();
@@ -787,7 +787,7 @@ export const createTriggerController = () => {
         removeClickListener();
         const triggerEl = trigger !== undefined ? document.getElementById(trigger) : null;
         if (!triggerEl) {
-            printIonWarning(`A trigger element with the ID "${trigger}" was not found in the DOM. The trigger element must be in the DOM when the "trigger" property is set on an overlay component.`, el);
+            printIonWarning(`[${el.tagName.toLowerCase()}] - A trigger element with the ID "${trigger}" was not found in the DOM. The trigger element must be in the DOM when the "trigger" property is set on an overlay component.`, el);
             return;
         }
         const configureTriggerInteraction = (targetEl, overlayEl) => {

package/dist/collection/utils/sanitization/index.js

@@ -1,6 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
+import { printIonError } from "../logging/index";
 /**
  * Does a simple sanitization of all elements
  * in an untrusted string
@@ -75,7 +76,7 @@ export const sanitizeDOMString = (untrustedString) => {
         return getInnerDiv !== null ? getInnerDiv.innerHTML : fragmentDiv.innerHTML;
     }
     catch (err) {
-        console.error(err);
+        printIonError('sanitizeDOMString', err);
         return '';
     }
 };

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-04-16T06:09:44",
+  "timestamp": "2025-04-16T17:34:19",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.20.0",

package/dist/esm/{animation-eab5a4ca.js → animation-8b25e105.js}

@@ -1,6 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
+import { d as printIonError } from './index-cfd9c1f2.js';
 import { w as win } from './index-a5d50daf.js';
 
 let animationPrefix;
@@ -365,7 +366,7 @@ const createAnimation = (animationId) => {
                 }
             }
             else {
-                console.error('Invalid addElement value');
+                printIonError('createAnimation - Invalid addElement value.');
             }
         }
         return ani;

package/dist/esm/{app-globals-7b6cbf1a.js → app-globals-dbdbb3df.js}

@@ -1,7 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { i as initialize } from './ionic-global-ca86cf32.js';
+import { i as initialize } from './ionic-global-b26f573e.js';
 
 const globalScripts = initialize;
 

package/dist/esm/{config-49c88215.js → config-9898ed97.js}

@@ -1,6 +1,8 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
+import { d as printIonError } from './index-cfd9c1f2.js';
+
 /**
  * Does a simple sanitization of all elements
  * in an untrusted string
@@ -75,7 +77,7 @@ const sanitizeDOMString = (untrustedString) => {
         return getInnerDiv !== null ? getInnerDiv.innerHTML : fragmentDiv.innerHTML;
     }
     catch (err) {
-        console.error(err);
+        printIonError('sanitizeDOMString', err);
         return '';
     }
 };

package/dist/esm/{data-174ad5e0.js → data-0d7ea6eb.js}

@@ -1,7 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { p as printIonWarning } from './index-738d7504.js';
+import { p as printIonWarning } from './index-cfd9c1f2.js';
 
 /**
  * Returns true if the selected day is equal to the reference day
@@ -35,7 +35,7 @@ const warnIfValueOutOfBounds = (value, min, max) => {
     const valueArray = Array.isArray(value) ? value : [value];
     for (const val of valueArray) {
         if ((min !== undefined && isBefore(val, min)) || (max !== undefined && isAfter(val, max))) {
-            printIonWarning('The value provided to ion-datetime is out of bounds.\n\n' +
+            printIonWarning('[ion-datetime] - The value provided to ion-datetime is out of bounds.\n\n' +
                 `Min: ${JSON.stringify(min)}\n` +
                 `Max: ${JSON.stringify(max)}\n` +
                 `Value: ${JSON.stringify(value)}`);
@@ -252,7 +252,7 @@ function parseDate(val) {
     }
     if (parse === null) {
         // wasn't able to parse the ISO datetime
-        printIonWarning(`Unable to parse date string: ${val}. Please provide a valid ISO 8601 datetime string.`);
+        printIonWarning(`[ion-datetime] - Unable to parse date string: ${val}. Please provide a valid ISO 8601 datetime string.`);
         return undefined;
     }
     // ensure all the parse values exist with at least 0

package/dist/esm/{framework-delegate-2eea1763.js → framework-delegate-56b467ad.js}

@@ -1,7 +1,7 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { c as componentOnReady } from './helpers-78efeec3.js';
+import { c as componentOnReady } from './helpers-d94bc8ad.js';
 
 // TODO(FW-2832): types
 const attachComponent = async (delegate, container, component, cssClasses, componentProps, inline) => {