@ionic/core 9.0.11-dev.11793890855.1bf6a6e5 → 9.0.11-dev.11793906456.1ea7a0a7

package/dist/types/components/textarea/textarea.d.ts

@@ -2,25 +2,11 @@ import type { ComponentInterface, EventEmitter } from '../../stencil-public-runt
 import type { Color } from '../../interface';
 import type { TextareaChangeEventDetail, TextareaInputEventDetail } from './textarea-interface';
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  *
  * @slot label - The label text to associate with the textarea. Use the `labelPlacement` property to control where the label is placed relative to the textarea. Use this if you need to render a label with custom HTML. (EXPERIMENTAL)
  * @slot start - Content to display at the leading edge of the textarea. (EXPERIMENTAL)
  * @slot end - Content to display at the trailing edge of the textarea. (EXPERIMENTAL)
- *
- * @part wrapper - The clickable label element that wraps the entire form field (label text, slots, and native textarea).
- * @part container - The inner wrapper element that directly contains the native textarea element.
- * @part label - The label text describing the textarea.
- * @part native - The native textarea element.
- * @part supporting-text - Supporting text displayed beneath the textarea label.
- * @part helper-text - Supporting text displayed beneath the textarea label when the textarea is valid.
- * @part error-text - Supporting text displayed beneath the textarea label when the textarea is invalid and touched.
- * @part counter - The character counter displayed when the counter property is set.
- * @part bottom - The container element for helper text, error text, and counter.
- * @part start - The wrapper element for the content in the start slot.
- * @part control - The wrapper element containing the label and the native textarea. The `"ionic"` theme flattens this wrapper, so it cannot be given a box of its own there.
- * @part end - The wrapper element for the content in the end slot.
  */
 export declare class Textarea implements ComponentInterface {
     private nativeInput?;
@@ -41,15 +27,14 @@ export declare class Textarea implements ComponentInterface {
     private notchController?;
     private notchSpacerEl;
     private startEndContainerController?;
-    private clickController?;
     private startContainerEl;
     private endContainerEl;
+    private clickController?;
     /**
      * The value of the textarea when the textarea is focused.
      */
     private focusedValue?;
     el: HTMLIonTextareaElement;
-    internals: ElementInternals;
     /**
      * The `hasFocus` state ensures the focus class is
      * added regardless of how the element is focused.
@@ -94,13 +79,9 @@ export declare class Textarea implements ComponentInterface {
      * If `true`, the user cannot interact with the textarea.
      */
     disabled: boolean;
-    /**
-     * Update element internals when disabled prop changes
-     */
-    protected disabledChanged(): void;
     /**
      * The fill for the item. If `"solid"` the item will have a background. If
-     * `"outline"` the item will be transparent with a border. Only available when the theme is `"md"`.
+     * `"outline"` the item will be transparent with a border. Only available in `md` mode.
      */
     fill?: 'outline' | 'solid';
     /**
@@ -203,27 +184,13 @@ export declare class Textarea implements ComponentInterface {
      */
     labelPlacement: 'start' | 'end' | 'floating' | 'stacked' | 'fixed';
     /**
-     * Set to `"soft"` for a textarea with slightly rounded corners,
-     * `"round"` for a textarea with fully rounded corners, or `"rectangular"`
-     * for a textarea without rounded corners.
-     *
-     * Defaults to `"round"` for the `ionic` theme, undefined for all other themes.
+     * The shape of the textarea. If "round" it will have an increased border radius.
      */
-    shape?: 'soft' | 'round' | 'rectangular';
-    /**
-     * The size of the textarea. If "large" it will increase the height of the textarea, while
-     * "small" and "medium" provide progressively smaller heights. The default size is "medium".
-     * This property only applies to the `"ionic"` theme.
-     */
-    size?: 'small' | 'medium' | 'large';
+    shape?: 'round';
     /**
      * Update the native input element when the value changes
      */
     protected valueChanged(): void;
-    /**
-     * Update native input and element internals when required prop changes
-     */
-    protected requiredChanged(): void;
     /**
      * dir is a globally enumerated attribute.
      * As a result, creating these as properties
@@ -257,6 +224,11 @@ export declare class Textarea implements ComponentInterface {
      * Emitted when the input has focus.
      */
     ionFocus: EventEmitter<FocusEvent>;
+    /**
+     * This prevents the native input from emitting the click event.
+     * Instead, the click event from the ion-textarea is emitted.
+     */
+    onClickCapture(ev: Event): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     componentWillLoad(): void;
@@ -291,23 +263,6 @@ export declare class Textarea implements ComponentInterface {
     private checkClearOnEdit;
     private hasValue;
     private getValue;
-    /**
-     * Called when the form state is restored.
-     * Restores the component's value.
-     */
-    formStateRestoreCallback(value: string): void;
-    /**
-     * Called when the form is reset.
-     * Resets the component's value.
-     */
-    formResetCallback(): void;
-    /**
-     * Updates the form value and reports validity state to the browser via
-     * ElementInternals. This should be called when the component loads, when
-     * the required prop changes, when the disabled prop changes, and when the value
-     * changes to ensure the form value stays in sync and validation state is updated.
-     */
-    private updateElementInternals;
     private onInput;
     private onChange;
     private onFocus;
@@ -326,33 +281,20 @@ export declare class Textarea implements ComponentInterface {
      * the `labelText` getter instead.
      */
     private get hasLabel();
-    private getFill;
-    private getShape;
     /**
-     * Drops the duplicate click the label forwards to the textarea after a click
-     * on slotted content.
-     */
-    onClickCapture(ev: Event): void;
-    private onLabelMouseDown;
-    /**
-     * Stops clicks on the label text and wrapper padding, since the click the
-     * label forwards to the textarea already represents them.
+     * Stops propagation for clicks on the textarea's own content (label text,
+     * textarea field) to prevent double-click events. Allows clicks on slotted
+     * content to propagate so event delegation works for parent handlers.
+     *
+     * Only slots belonging directly to this textarea should be considered.
+     * The textarea itself may have a slot attribute when placed in an item
+     * or toolbar, which does not make its content slotted content.
      */
     private onLabelClick;
     /**
      * Renders the outline border with a notch for the label.
      */
     private renderOutlineContainer;
-    private renderNativeTextarea;
-    private renderStartContainer;
-    private renderEndContainer;
-    /**
-     * Every theme renders the same label and control structure, aside from the md
-     * outline container below. The label is nested alongside the textarea so the
-     * ios and md floating label can escape the control and clear the start and
-     * end slots. The ionic theme lifts it outside the field with grid instead.
-     */
-    private renderField;
     /**
      * Renders the helper text or error text values
      */

package/dist/types/components/thumbnail/thumbnail.d.ts

@@ -1,8 +1,4 @@
 import type { ComponentInterface } from '../../stencil-public-runtime';
-/**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
- */
 export declare class Thumbnail implements ComponentInterface {
     render(): any;
 }

package/dist/types/components/title/title.d.ts

@@ -1,9 +1,5 @@
 import type { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import type { Color, StyleEventDetail } from '../../interface';
-/**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
- */
 export declare class ToolbarTitle implements ComponentInterface {
     el: HTMLElement;
     /**

package/dist/types/components/toast/animations/utils.d.ts

@@ -1,4 +1,4 @@
-import type { Mode } from '../../../interface';
+import type { Mode } from "../../../interface";
 import type { ToastAnimationPosition, ToastPosition } from '../toast-interface';
 /**
  * Calculate the CSS top and bottom position of the toast, to be used
@@ -14,7 +14,7 @@ import type { ToastAnimationPosition, ToastPosition } from '../toast-interface';
  * @param position The value of the toast's position prop.
  * @param positionAnchor The element the toast should be anchored to,
  * if applicable.
- * @param mode The toast component's platform (md or ios).
+ * @param mode The toast component's mode (md, ios, etc).
  * @param toast A reference to the toast element itself.
  */
 export declare function getAnimationPosition(position: ToastPosition, positionAnchor: HTMLElement | undefined, mode: Mode, toast: HTMLElement): ToastAnimationPosition;

package/dist/types/components/toast/toast-interface.d.ts

@@ -1,7 +1,6 @@
-import type { OverlayOptions } from "../../utils/overlays-interface";
-import type { Color, LiteralUnion } from '../../interface';
+import type { AnimationBuilder, Color, LiteralUnion, Mode } from '../../interface';
 import type { IonicSafeString } from '../../utils/sanitization';
-export interface ToastOptions extends OverlayOptions {
+export interface ToastOptions {
     header?: string;
     message?: string | IonicSafeString;
     cssClass?: string | string[];
@@ -11,13 +10,18 @@ export interface ToastOptions extends OverlayOptions {
     positionAnchor?: HTMLElement | string;
     swipeGesture?: ToastSwipeGestureDirection;
     translucent?: boolean;
+    animated?: boolean;
     icon?: string;
     htmlAttributes?: {
         [key: string]: any;
     };
     layout?: ToastLayout;
     color?: Color;
+    mode?: Mode;
     keyboardClose?: boolean;
+    id?: string;
+    enterAnimation?: AnimationBuilder;
+    leaveAnimation?: AnimationBuilder;
 }
 export type ToastLayout = 'baseline' | 'stacked';
 export interface ToastButton {

package/dist/types/components/toast/toast.d.ts

@@ -4,8 +4,7 @@ import type { OverlayEventDetail } from '../../utils/overlays-interface';
 import type { IonicSafeString } from '../../utils/sanitization';
 import type { ToastButton, ToastPosition, ToastLayout, ToastSwipeGestureDirection } from './toast-interface';
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  *
  * @part wrapper - The outer wrapper for the toast overlay.
  * @part container - Groups the icon, content, and buttons.
@@ -73,13 +72,6 @@ export declare class Toast implements ComponentInterface, OverlayInterface {
      * Header to be shown in the toast.
      */
     header?: string;
-    /**
-     * Set to `"bold"` for a toast with vibrant, bold colors or to `"subtle"` for
-     * a toast with muted, subtle colors.
-     *
-     * Only applies to the `ionic` theme.
-     */
-    hue?: 'bold' | 'subtle';
     /**
      * Defines how the message and buttons are laid out in the toast.
      * 'baseline': The message and the buttons will appear on the same line.
@@ -112,21 +104,13 @@ export declare class Toast implements ComponentInterface, OverlayInterface {
      * With `position="middle"`, the value of `positionAnchor` is ignored.
      */
     positionAnchor?: HTMLElement | string;
-    /**
-     * Set to `"soft"` for a toast with slightly rounded corners,
-     * `"round"` for a toast with fully rounded corners, or `"rectangular"`
-     * for a toast without rounded corners.
-     *
-     * Defaults to `"round"` for the `ionic` theme, undefined for all other themes.
-     */
-    shape?: 'soft' | 'round' | 'rectangular';
     /**
      * An array of buttons for the toast.
      */
     buttons?: (ToastButton | string)[];
     /**
      * If `true`, the toast will be translucent.
-     * Only applies when the theme is `"ios"` and the device supports
+     * Only applies when the mode is `"ios"` and the device supports
      * [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
      */
     translucent: boolean;
@@ -236,7 +220,6 @@ export declare class Toast implements ComponentInterface, OverlayInterface {
      */
     onWillDismiss<T = any>(): Promise<OverlayEventDetail<T>>;
     private getButtons;
-    private getShape;
     /**
      * Returns the element specified by the positionAnchor prop,
      * or undefined if prop's value is an ID string and the element

package/dist/types/components/toggle/toggle.d.ts

@@ -2,8 +2,7 @@ import type { ComponentInterface, EventEmitter } from '../../stencil-public-runt
 import type { Color } from '../../interface';
 import type { ToggleChangeEventDetail } from './toggle-interface';
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  *
  * @slot - The label text to associate with the toggle. Use the "labelPlacement" property to control where the label is placed relative to the toggle.
  *
@@ -139,22 +138,6 @@ export declare class Toggle implements ComponentInterface {
     private onFocus;
     private onBlur;
     private getSwitchLabelIcon;
-    /**
-     * Get the default icon to use for the checked icon based on the theme.
-     */
-    get toggleDefaultCheckedIcon(): string;
-    /**
-     * Get the icon to use for the checked icon.
-     * Use the icon set in the config.
-     * If no icon is set in the config, use the default icon.
-     */
-    get toggleCheckedIcon(): string;
-    /**
-     * Get the icon to use for the unchecked icon.
-     * Use the icon set in the config.
-     * If no icon is set in the config, use the default icon.
-     */
-    get toggleUncheckedIcon(): string;
     private renderOnOffSwitchLabels;
     private renderToggleControl;
     private get hasLabel();

package/dist/types/components/toolbar/toolbar.d.ts

@@ -1,13 +1,12 @@
 import type { ComponentInterface } from '../../stencil-public-runtime';
 import type { Color, StyleEventDetail } from '../../interface';
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  *
  * @slot - Content is placed between the named slots if provided without a slot.
  * @slot start - Content is placed to the left of the toolbar text in LTR, and to the right in RTL.
- * @slot secondary - Content is placed to the left of the toolbar text in the `"ios"` theme, and directly to the right in the `"md"` theme.
- * @slot primary - Content is placed to the right of the toolbar text in the `"ios"` theme, and to the far right in the `"md"` theme.
+ * @slot secondary - Content is placed to the left of the toolbar text in `ios` mode, and directly to the right in `md` mode.
+ * @slot primary - Content is placed to the right of the toolbar text in `ios` mode, and to the far right in `md` mode.
  * @slot end - Content is placed to the right of the toolbar text in LTR, and to the left in RTL.
  *
  * @part background - The background of the toolbar, covering the entire area behind the toolbar content.
@@ -16,9 +15,6 @@ import type { Color, StyleEventDetail } from '../../interface';
  */
 export declare class Toolbar implements ComponentInterface {
     private childrenStyles;
-    private readonly slotClasses;
-    private readonly showClasses;
-    private readonly slotSizeVars;
     el: HTMLIonToolbarElement;
     /**
      * The color to use from your application's color palette.
@@ -26,43 +22,7 @@ export declare class Toolbar implements ComponentInterface {
      * For more information on colors, see [theming](/docs/theming/basics).
      */
     color?: Color;
-    /**
-     * Where to place the title relative to the other toolbar content.
-     * `"start"`: The title will appear to the left of the toolbar content in LTR and to the right in RTL.
-     * `"center"`: The title will appear in the center of the toolbar.
-     * `"end"`: The title will appear to the right of the toolbar content in LTR and to the left in RTL.
-     *
-     * Only applies in the `ionic` theme.
-     */
-    titlePlacement?: 'start' | 'center' | 'end';
     componentWillLoad(): void;
-    componentDidLoad(): void;
-    titlePlacementChanged(): void;
-    /**
-     * Gets the title placement.
-     * Returns the title placement if it is set, otherwise returns `"center"`
-     * for `ionic` and `ios`, and `"start"` for `md`.
-     */
-    private getTitlePlacement;
-    /**
-     * Updates the CSS custom properties for slot widths
-     * This ensures that slots shown by their met conditions
-     * have a minimum width matching their required slot
-     */
-    private updateSlotWidths;
-    /**
-     * Measure the widths of the slots and update the CSS custom properties
-     * for the minimum width of each pair of slots based on the largest width in each pair.
-     * Returns whether we successfully measured all of the slots we expect to have content.
-     * If not, the content probably hasn't rendered yet and we need to try again.
-     */
-    private measureAndUpdateSlots;
-    /**
-     * Removes all slot visibility classes and slot width CSS variables.
-     */
-    private removeSlotClasses;
-    private updateSlotClasses;
-    private hasSlotContent;
     childrenStyle(ev: CustomEvent<StyleEventDetail>): void;
     render(): any;
 }