@ionic/core 8.8.16-dev.11784841344.1aa1a41c → 8.8.16-nightly.20260724

package/dist/types/global/ionic-global.d.ts

@@ -1,30 +1,4 @@
-import type { IonicConfig, Mode, Theme } from '../interface';
-/**
- * Validates if a mode is accepted for a theme configuration.
- * @param mode The mode to validate.
- * @param theme The theme the mode is being used with.
- * @returns `true` if the mode is valid for the theme, `false` if invalid.
- */
-export declare const isModeValidForTheme: (mode: Mode, theme: Theme) => boolean;
-/**
- * Returns the mode value of the element reference or the closest
- * parent with a valid mode.
- * @param ref The element reference to look up the mode for.
- * @param theme Optionally can provide the theme to avoid an additional look-up.
- * @returns The mode value for the element reference.
- */
-export declare const getIonMode: (ref?: any, theme?: Theme) => Mode;
-/**
- * Returns the theme value of the element reference or the closest
- * parent with a valid theme.
- *
- * @param ref The element reference to look up the theme for.
- * @returns The theme value for the element reference, defaults to
- * the default theme if it cannot be determined.
- */
-export declare const getIonTheme: (ref?: any) => Theme;
-export declare const rIC: (callback: () => void) => number;
-export declare const cIC: (id: number) => void;
-export declare const needInputShims: () => boolean;
+import type { IonicConfig, Mode } from '../interface';
+export declare const getIonMode: (ref?: any) => Mode;
 export declare const initialize: (userConfig?: IonicConfig) => void;
 export default initialize;

package/dist/types/interface.d.ts

@@ -140,9 +140,6 @@ export type PredefinedColors =
 export type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 
 export type Color = LiteralUnion<PredefinedColors, string>;
-
-export type Theme = 'ios' | 'md' | 'ionic';
-
 export type Mode = 'ios' | 'md';
 export type ComponentTags = string;
 // eslint-disable-next-line

package/dist/types/utils/config.d.ts

@@ -1,6 +1,6 @@
 import type { SpinnerTypes } from '../components/spinner/spinner-configs';
 import type { TabButtonLayout } from '../components/tab-bar/tab-bar-interface';
-import type { AnimationBuilder, Mode, Theme } from '../interface';
+import type { AnimationBuilder, Mode } from '../interface';
 import type { LogLevel } from './logging';
 import type { PlatformConfig } from './platform';
 export interface IonicConfig {
@@ -15,24 +15,9 @@ export interface IonicConfig {
      */
     rippleEffect?: boolean;
     /**
-     * The mode determines the platform behaviors to use for the entire application,
-     * such as rubber-band scrolling on iOS or Android page transitions.
-     *
-     * Possible values are: `"ios"` or `"md"`.
-     *
-     * Without a specified theme, the mode will be used to determine which platform
-     * styles to use throughout the application. This is legacy behavior to prevent
-     * breaking changes, but we recommend the use of a specific theme to opt in to
-     * the new styles.
+     * The mode determines which platform styles to use for the whole application.
      */
     mode?: Mode;
-    /**
-     * The theme determines the visual appearance of components.
-     * - `"ios"` - iOS components aligning to the Cupertino guidelines
-     * - `"md"` - Material Design components aligning to Material Design 2 guidelines
-     * - `"ionic"` - **EXPERIMENTAL** Ionic's upcoming new design system
-     */
-    theme?: Theme;
     /**
      * Wherever ionic will respond to hardware go back buttons in an Android device.
      * Defaults to `true` when ionic runs in a mobile device.
@@ -103,95 +88,6 @@ export interface IonicConfig {
      * Overrides the default `duration` for all `ion-toast` components.
      */
     toastDuration?: number;
-    /**
-     * The selector that will be used to query the root of the Ionic application.
-     * This element is used for things like injecting overlay elements into the DOM and managing focus.
-     *
-     * @default 'ion-app'
-     */
-    appRootSelector?: string;
-    /**
-     * Overrides the toggle icon for all `ion-accordion` components.
-     */
-    accordionToggleIcon?: string;
-    /**
-     * Overrides the separator icon for all `ion-breadcrumb` components,
-     * only when mode is set to `ios`.
-     */
-    breadcrumbSeparatorIcon?: string;
-    /**
-     * Overrides the collapsed icon for all `ion-breadcrumb` components.
-     */
-    breadcrumbCollapsedIcon?: string;
-    /**
-     * Overrides the next icon for all `ion-datetime` components.
-     */
-    datetimeNextIcon?: string;
-    /**
-     * Overrides the previous icon for all `ion-datetime` components.
-     */
-    datetimePreviousIcon?: string;
-    /**
-     * Overrides the expanded icon for all `ion-datetime` components.
-     */
-    datetimeExpandedIcon?: string;
-    /**
-     * Overrides the collapsed icon for all `ion-datetime` components.
-     */
-    datetimeCollapsedIcon?: string;
-    /**
-     * Overrides the close icon for all `ion-fab-button` components.
-     */
-    fabButtonCloseIcon?: string;
-    /**
-     * Overrides the clear icon for all `ion-input` components.
-     */
-    inputClearIcon?: string;
-    /**
-     * Overrides the show icon for all `ion-input-password` components.
-     */
-    inputPasswordShowIcon?: string;
-    /**
-     * Overrides the hide icon for all `ion-input-password` components.
-     */
-    inputPasswordHideIcon?: string;
-    /**
-     * Overrides the detail icon for all `ion-item` components.
-     */
-    itemDetailIcon?: string;
-    /**
-     * Overrides the handle icon for all `ion-reorder` components.
-     */
-    reorderHandleIcon?: string;
-    /**
-     * Overrides the cancel icon for all `ion-searchbar` components,
-     * only when mode is set to `md`.
-     */
-    searchbarCancelIcon?: string;
-    /**
-     * Overrides the clear icon for all `ion-searchbar` components.
-     */
-    searchbarClearIcon?: string;
-    /**
-     * Overrides the search icon for all `ion-searchbar` components.
-     */
-    searchbarSearchIcon?: string;
-    /**
-     * Overrides the expand icon for all `ion-select` components.
-     */
-    selectExpandedIcon?: string;
-    /**
-     * Overrides the collapsed icon for all `ion-select` components.
-     */
-    selectCollapsedIcon?: string;
-    /**
-     * Overrides the checked icon for all `ion-toggle` components.
-     */
-    toggleCheckedIcon?: string;
-    /**
-     * Overrides the unchecked icon for all `ion-toggle` components.
-     */
-    toggleUncheckedIcon?: string;
     /**
      * Overrides the default "animation" of all `ion-nav` and `ion-router-outlet` across the whole application.
      * This prop allows to replace the default transition and provide a custom one that applies to all navigation outlets.

package/dist/types/utils/focus-trap.d.ts

@@ -10,7 +10,7 @@
  * Note: We need this distinction because `disabled="false"` is
  * valid usage for the disabled property on ion-button.
  */
-export declare const focusableQueryString = "[tabindex]:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), input:not([type=hidden]):not([tabindex^=\"-\"]):not([hidden]):not([disabled]), textarea:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), button:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), select:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), ion-checkbox:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), ion-radio:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), ion-textarea:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), .ion-focusable:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), .ion-focusable[disabled=\"false\"]:not([tabindex^=\"-\"]):not([hidden])";
+export declare const focusableQueryString = "[tabindex]:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), input:not([type=hidden]):not([tabindex^=\"-\"]):not([hidden]):not([disabled]), textarea:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), button:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), select:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), ion-checkbox:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), ion-radio:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), .ion-focusable:not([tabindex^=\"-\"]):not([hidden]):not([disabled]), .ion-focusable[disabled=\"false\"]:not([tabindex^=\"-\"]):not([hidden])";
 /**
  * Focuses the first descendant in a context
  * that can receive focus. If none exists,

package/dist/types/utils/focus-visible.d.ts

@@ -2,17 +2,4 @@ export interface FocusVisibleUtility {
     destroy: () => void;
     setFocus: (elements: Element[]) => void;
 }
-export declare const getOrInitFocusVisibleUtility: () => FocusVisibleUtility;
-/**
- * Used to set focus on an element that uses `ion-focusable`.
- * Do not use this if focusing the element as a result of a keyboard
- * event as the focus utility should handle this for us. This method
- * should be used when we want to programmatically focus an element as
- * a result of another user action. (Ex: We focus the first element
- * inside of a popover when the user presents it, but the popover is not always
- * presented as a result of keyboard action.)
- *
- * @param elements - The elements to set focus on.
- */
-export declare const focusElements: (elements: Element[]) => void;
 export declare const startFocusVisible: (rootEl?: HTMLElement) => FocusVisibleUtility;

package/dist/types/utils/forms/validity.d.ts

@@ -7,11 +7,4 @@ type FormElement = HTMLIonInputElement | HTMLIonTextareaElement | HTMLIonSelectE
  * @returns `true` if the element is invalid, `false` otherwise.
  */
 export declare const checkInvalidState: (el: FormElement) => boolean;
-export declare const getValidityFlags: (validity: ValidityState) => ValidityStateFlags;
-/**
- * Reports the validity state of a native form element to ElementInternals.
- * This delegates to the native element's built-in validation, which automatically
- * handles required, minlength, maxlength, and other constraints.
- */
-export declare const reportValidityToElementInternals: (nativeElement: HTMLInputElement | HTMLTextAreaElement | null | undefined, internals: ElementInternals) => void;
 export {};

package/dist/types/utils/helpers.d.ts

@@ -60,29 +60,7 @@ export declare const getElementRoot: (el: HTMLElement, fallback?: HTMLElement) =
  */
 export declare const raf: (h: FrameRequestCallback) => number;
 export declare const hasShadowDom: (el: HTMLElement) => boolean;
-/**
- * Focuses a given element while ensuring proper focus management
- * within the Ionic framework. If the element is marked as `ion-focusable`,
- * this function will delegate focus handling to `ion-app` or manually
- * apply focus when a custom app root is used.
- *
- * This function helps maintain accessibility and expected focus behavior
- * in both standard and custom root environments.
- *
- * @param el - The element to focus.
- */
 export declare const focusVisibleElement: (el: HTMLElement) => void;
-/**
- * Clears the keyboard focus ring (`ion-focused`) that the focus-visible
- * utility may have applied to elements during a programmatic focus.
- *
- * Use this after moving DOM focus to an element for assistive technologies
- * (e.g. when an overlay opens) where the option should be focused so screen
- * readers announce it, but the focus ring should not be shown until the user
- * navigates with the keyboard (Tab/Arrow). The focus-visible utility will add
- * `ion-focused` again on the next keyboard-driven focus change.
- */
-export declare const suppressFocusVisible: () => void;
 /**
  * This method is used to add a hidden input to a host element that contains
  * a Shadow DOM. It does not add the input inside of the Shadow root which

package/dist/types/utils/overlays-interface.d.ts

@@ -1,39 +1,9 @@
 import type { EventEmitter } from '../stencil-public-runtime';
-import type { AnimationBuilder, HTMLStencilElement, Mode, Theme } from '../interface';
+import type { AnimationBuilder, HTMLStencilElement } from '../interface';
 export interface OverlayEventDetail<T = any> {
     data?: T;
     role?: string;
 }
-/**
- * The shared configuration options for all overlays.
- */
-export interface OverlayOptions {
-    /**
-     * To change the default appearance of the overlay, use the `theme` option.
-     * Mode is used to change the platform behavior of the component.
-     */
-    mode?: Mode;
-    /**
-     * The theme determines the visual appearance of components.
-     */
-    theme?: Theme;
-    /**
-     * If `true`, the overlay will be animated when it is presented and dismissed.
-     */
-    animated?: boolean;
-    /**
-     * The `id` of the overlay.
-     */
-    id?: string;
-    /**
-     * The custom enter animation to use for the overlay.
-     */
-    enterAnimation?: AnimationBuilder;
-    /**
-     * The custom leave animation to use for the overlay.
-     */
-    leaveAnimation?: AnimationBuilder;
-}
 export interface OverlayInterface {
     el: HTMLIonOverlayElement;
     animated: boolean;

package/dist/types/utils/overlays.d.ts

@@ -86,7 +86,7 @@ export declare const getPresentedOverlay: (doc: Document, overlayTag?: string, i
  * for main content.
  */
 export declare const setRootAriaHidden: (hidden?: boolean) => void;
-export declare const present: <OverlayPresentOptions>(overlay: OverlayInterface, name: keyof IonicConfig, iosEnterAnimation: AnimationBuilder, mdEnterAnimation: AnimationBuilder, ionicEnterAnimation?: AnimationBuilder, opts?: OverlayPresentOptions) => Promise<void>;
+export declare const present: <OverlayPresentOptions>(overlay: OverlayInterface, name: keyof IonicConfig, iosEnterAnimation: AnimationBuilder, mdEnterAnimation: AnimationBuilder, opts?: OverlayPresentOptions) => Promise<void>;
 export declare const dismiss: <OverlayDismissOptions>(overlay: OverlayInterface, data: any | undefined, role: string | undefined, name: keyof IonicConfig, iosLeaveAnimation: AnimationBuilder, mdLeaveAnimation: AnimationBuilder, opts?: OverlayDismissOptions) => Promise<boolean>;
 export declare const eventMethod: <T>(element: HTMLElement, eventName: string) => Promise<T>;
 export declare const onceEvent: (element: HTMLElement, eventName: string, callback: (ev: Event) => void) => void;

package/dist/types/utils/sanitization/index.d.ts

@@ -1,64 +1,8 @@
 /**
- * Sanitize an untrusted HTML string.
- *
- * Parses the string into a detached DOM, removes blocked tags, strips
- * attributes outside the narrow `domStringAllowedAttributes` list (refer
- * `sanitizeElement`), and scrubs script-scheme URLs. Returns the sanitized
- * HTML string.
- *
- * Use this when you have an HTML string from an unknown source and need to
- * render it via `innerHTML`. Use `sanitizeDOMTree` instead when you already
- * have a DOM tree and want to sanitize it in place without a string round
- * trip. The two apply the same dangerous-vector scrubbing but different
- * attribute allowlists: this path stays narrow so existing consumers
- * (toast, loading, alert message, etc.) are unaffected, while
- * `sanitizeDOMTree` uses the wider rich-content allowlist.
- *
- * @param untrustedString - The HTML string to sanitize. Pass an
- * `IonicSafeString` to bypass sanitization, or `undefined` to short-circuit.
- * @returns The sanitized HTML string, or `undefined` if the input was
- * `undefined`. Returns `''` if sanitization fails or the input contains
- * an inline `onload=` handler.
+ * Does a simple sanitization of all elements
+ * in an untrusted string
  */
 export declare const sanitizeDOMString: (untrustedString: IonicSafeString | string | undefined) => string | undefined;
-/**
- * Sanitize an entire trusted DOM tree in place.
- *
- * Removes blocked tags (`script`, `iframe`, etc.) from the subtree and
- * then sanitizes attributes on every remaining element using the wider
- * `richContentAllowedAttributes` allowlist (refer `sanitizeElement`).
- * Component presentational attributes (`size`, `color`, `shape`, inline
- * SVG, `aria-*`, `data-*`) are preserved; `style`, event handlers (`on*`),
- * form/navigation-hijack attributes, script-scheme URLs, and non-image
- * `data:` URLs are stripped.
- *
- * Use this when you have a DOM tree the developer controls (e.g.
- * cloned slot content from a component) and you need to render it
- * elsewhere safely.
- *
- * @param root - The root element whose subtree will be sanitized in
- * place. No-op when the sanitizer is disabled via `Ionic.config`.
- */
-export declare const sanitizeDOMTree: (root: HTMLElement) => void;
-/**
- * Mirror known custom-element DOM properties onto attributes so they
- * survive `cloneNode`. Call this on a DOM subtree before cloning it for
- * rendering elsewhere (e.g. cloning slotted option content into an
- * overlay).
- *
- * Only sets the attribute when the property holds a non-empty string
- * and the attribute isn't already present, so existing attributes
- * take precedence.
- *
- * @param root - The root element whose subtree (and itself) will be
- * inspected.
- */
-export declare const reflectPropertiesToAttributes: (root: Element) => void;
-/**
- * Tags removed entirely (with their subtree) before attribute sanitization.
- * Exported so tests can assert the set without hardcoding it.
- */
-export declare const blockedTags: string[];
 export declare class IonicSafeString {
     value: string;
     constructor(value: string);

package/dist/types/utils/test/playwright/drag-element.d.ts

@@ -7,25 +7,12 @@
  */
 import type { ElementHandle, Locator } from '@playwright/test';
 import type { E2EPage } from './';
-/**
- * Drags an element by the given number of pixels on the X and Y axes.
- *
- * @param el The element to drag.
- * @param page The E2E Page object.
- * @param dragByX The number of pixels to drag on the X axis. Negative values drag left, positive values drag right.
- * @param dragByY The number of pixels to drag on the Y axis. Negative values drag up, positive values drag down.
- * @param startXCoord The X coordinate to start the drag from. Defaults to the center of the element.
- * @param startYCoord The Y coordinate to start the drag from. Defaults to the center of the element.
- * @param releaseDrag Whether to release the drag at the end of the gesture. Defaults to `true`.
- * @param steps The number of steps to divide the drag into. More steps reduce velocity; fewer steps increase it. Use this to control whether velocity-based thresholds (e.g. full-swipe) are triggered, particularly in Safari where gesture velocity is calculated relative to animation frames. Defaults to `10`.
- */
-export declare const dragElementBy: (el: Locator | ElementHandle<SVGElement | HTMLElement>, page: E2EPage, dragByX?: number, dragByY?: number, startXCoord?: number, startYCoord?: number, releaseDrag?: boolean, steps?: number) => Promise<void>;
+export declare const dragElementBy: (el: Locator | ElementHandle<SVGElement | HTMLElement>, page: E2EPage, dragByX?: number, dragByY?: number, startXCoord?: number, startYCoord?: number, releaseDrag?: boolean) => Promise<void>;
 /**
  * Drags an element by the given amount of pixels on the Y axis.
- *
  * @param el The element to drag.
  * @param page The E2E Page object.
- * @param dragByY The number of pixels to drag on the Y axis.
- * @param startYCoord The Y coordinate to start the drag from. Defaults to the center of the element.
+ * @param dragByY The amount of pixels to drag the element by.
+ * @param startYCoord The Y coordinate to start the drag gesture at. Defaults to the center of the element.
  */
 export declare const dragElementByYAxis: (el: Locator | ElementHandle<SVGElement | HTMLElement>, page: E2EPage, dragByY: number, startYCoord?: number) => Promise<void>;

package/dist/types/utils/test/playwright/generator.d.ts

@@ -1,6 +1,5 @@
-export type Mode = 'ios' | 'md' | 'ionic-ios' | 'ionic-md';
+export type Mode = 'ios' | 'md';
 export type Direction = 'ltr' | 'rtl';
-export type Theme = 'ios' | 'md' | 'ionic';
 /**
  * The theme to use for the playwright test.
  *
@@ -13,10 +12,9 @@ export type Palette = 'light' | 'dark' | 'high-contrast' | 'high-contrast-dark';
 export type TitleFn = (title: string) => string;
 export type ScreenshotFn = (fileName: string) => string;
 export interface TestConfig {
+    mode: Mode;
     direction: Direction;
     palette: Palette;
-    mode: Mode;
-    theme: Theme;
 }
 interface TestUtilities {
     title: TitleFn;
@@ -24,35 +22,8 @@ interface TestUtilities {
     config: TestConfig;
 }
 interface TestConfigOption {
-    /**
-     * The available options to test against.
-     * - "ios": Test against iOS theme on iOS mode.
-     * - "md": Test against Material Design theme on Material Design mode.
-     * - "ionic-ios": Test against Ionic theme on iOS mode.
-     * - "ionic-md": Test against Ionic theme on Material Design mode.
-     *
-     * If unspecified, tests will run against "ios" and "md".
-     */
     modes?: Mode[];
-    /**
-     * The text direction to test against.
-     *
-     * - "ltr": Test against left-to-right direction.
-     * - "rtl": Test against right-to-left direction.
-     *
-     * If unspecified, tests will run against both directions.
-     */
     directions?: Direction[];
-    /**
-     * The color palette to test against.
-     *
-     * - "light": Test against light palette.
-     * - "dark": Test against dark palette.
-     * - "high-contrast": Test against high contrast light palette.
-     * - "high-contrast-dark": Test against high contrast dark palette.
-     *
-     * If unspecified, tests will run against light theme.
-     */
     palettes?: Palette[];
 }
 /**

package/dist/types/utils/theme.d.ts

@@ -1,14 +1,5 @@
 import type { RouterDirection } from '../components/router/utils/interface';
 import type { AnimationBuilder, Color, CssClassMap } from '../interface';
-/**
- * Checks if an element has a parent matching the specified selector.
- * This handles an element in both light DOM and shadow DOM contexts.
- * @param selector The parent selector to check for (e.g., 'ion-datetime'
- * or 'ion-toolbar[color]').
- * @param el The element to check.
- * @returns `true` if the element has a parent matching the specified selector,
- * `false` otherwise.
- */
 export declare const hostContext: (selector: string, el: HTMLElement) => boolean;
 /**
  * Create the mode and color classes for the component based on the classes passed in