@ionic/core 8.8.14-dev.11783706459.1d5a7aae → 8.8.14-dev.11783969828.1f28d893

package/dist/types/components.d.ts

@@ -25,6 +25,7 @@ import { NavComponent, NavComponentWithProps, NavOptions, RouterOutletOptions, S
 import { ViewController } from "./components/nav/view-controller";
 import { PickerChangeEventDetail } from "./components/picker/picker-interfaces";
 import { PickerColumnChangeEventDetail, PickerColumnValue } from "./components/picker-column/picker-column-interfaces";
+import { PickerButton, PickerColumn } from "./components/picker-legacy/picker-interface";
 import { PopoverSize, PositionAlign, PositionReference, PositionSide, TriggerAction } from "./components/popover/popover-interface";
 import { RadioGroupChangeEventDetail, RadioGroupCompareFn } from "./components/radio-group/radio-group-interface";
 import { PinFormatter, RangeChangeEventDetail, RangeKnobMoveEndEventDetail, RangeKnobMoveStartEventDetail, RangeValue } from "./components/range/range-interface";
@@ -62,6 +63,7 @@ export { NavComponent, NavComponentWithProps, NavOptions, RouterOutletOptions, S
 export { ViewController } from "./components/nav/view-controller";
 export { PickerChangeEventDetail } from "./components/picker/picker-interfaces";
 export { PickerColumnChangeEventDetail, PickerColumnValue } from "./components/picker-column/picker-column-interfaces";
+export { PickerButton, PickerColumn } from "./components/picker-legacy/picker-interface";
 export { PopoverSize, PositionAlign, PositionReference, PositionSide, TriggerAction } from "./components/popover/popover-interface";
 export { RadioGroupChangeEventDetail, RadioGroupCompareFn } from "./components/radio-group/radio-group-interface";
 export { PinFormatter, RangeChangeEventDetail, RangeKnobMoveEndEventDetail, RangeKnobMoveStartEventDetail, RangeValue } from "./components/range/range-interface";
@@ -928,6 +930,7 @@ export namespace Components {
         "clearText": string;
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -1079,6 +1082,7 @@ export namespace Components {
     interface IonDatetimeButton {
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -1295,9 +1299,9 @@ export namespace Components {
         "autocomplete": AutocompleteTypes;
         /**
           * Whether auto correction should be enabled when the user is entering/editing the text value.
-          * @default false
+          * @default 'off'
          */
-        "autocorrect": boolean;
+        "autocorrect": 'on' | 'off';
         /**
           * Sets the [`autofocus` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus) on the native input element.  This may not be sufficient for the element to be focused on page load. See [managing focus](/docs/developing/managing-focus) for more information.
           * @default false
@@ -2005,8 +2009,8 @@ export namespace Components {
          */
         "handle"?: boolean;
         /**
-          * The interaction behavior for the sheet modal when the handle is pressed.  Handle behavior is unavailable when the `handle` property is set to `false` or when the `breakpoints` property is not set (using a fullscreen or card modal).  Set to `"cycle"` to make the handle focusable and let the sheet modal cycle between available breakpoints when pressed. This keeps the sheet operable with assistive technology.  Set to `"none"` to make the handle purely decorative when pressed and removed from the tab order.  Defaults to `"cycle"`.
-          * @default 'cycle'
+          * The interaction behavior for the sheet modal when the handle is pressed.  Defaults to `"none"`, which  means the modal will not change size or position when the handle is pressed. Set to `"cycle"` to let the modal cycle between available breakpoints when pressed.  Handle behavior is unavailable when the `handle` property is set to `false` or when the `breakpoints` property is not set (using a fullscreen or card modal).
+          * @default 'none'
          */
         "handleBehavior"?: ModalHandleBehavior;
         /**
@@ -2242,6 +2246,7 @@ export namespace Components {
     interface IonPickerColumn {
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -2275,6 +2280,7 @@ export namespace Components {
     interface IonPickerColumnOption {
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -2287,6 +2293,107 @@ export namespace Components {
          */
         "value"?: any | null;
     }
+    interface IonPickerLegacy {
+        /**
+          * If `true`, the picker will animate.
+          * @default true
+         */
+        "animated": boolean;
+        /**
+          * If `true`, the picker will be dismissed when the backdrop is clicked.
+          * @default true
+         */
+        "backdropDismiss": boolean;
+        /**
+          * Array of buttons to be displayed at the top of the picker.
+          * @default []
+         */
+        "buttons": PickerButton[];
+        /**
+          * Array of columns to be displayed in the picker.
+          * @default []
+         */
+        "columns": PickerColumn[];
+        /**
+          * Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces.
+         */
+        "cssClass"?: string | string[];
+        "delegate"?: FrameworkDelegate;
+        /**
+          * Dismiss the picker overlay after it has been presented.
+          * @param data Any data to emit in the dismiss events.
+          * @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+         */
+        "dismiss": (data?: any, role?: string) => Promise<boolean>;
+        /**
+          * Number of milliseconds to wait before dismissing the picker.
+          * @default 0
+         */
+        "duration": number;
+        /**
+          * Animation to use when the picker is presented.
+         */
+        "enterAnimation"?: AnimationBuilder;
+        /**
+          * Get the column that matches the specified name.
+          * @param name The name of the column.
+         */
+        "getColumn": (name: string) => Promise<PickerColumn | undefined>;
+        /**
+          * @default false
+         */
+        "hasController": boolean;
+        /**
+          * Additional attributes to pass to the picker.
+         */
+        "htmlAttributes"?: { [key: string]: any };
+        /**
+          * If `true`, the picker will open. If `false`, the picker will close. Use this if you need finer grained control over presentation, otherwise just use the pickerController or the `trigger` property. Note: `isOpen` will not automatically be set back to `false` when the picker dismisses. You will need to do that in your code.
+          * @default false
+         */
+        "isOpen": boolean;
+        /**
+          * If `true`, the keyboard will be automatically dismissed when the overlay is presented.
+          * @default true
+         */
+        "keyboardClose": boolean;
+        /**
+          * Animation to use when the picker is dismissed.
+         */
+        "leaveAnimation"?: AnimationBuilder;
+        /**
+          * The mode determines which platform styles to use.
+         */
+        "mode"?: "ios" | "md";
+        /**
+          * Returns a promise that resolves when the picker did dismiss.
+         */
+        "onDidDismiss": <T = any>() => Promise<OverlayEventDetail<T>>;
+        /**
+          * Returns a promise that resolves when the picker will dismiss.
+         */
+        "onWillDismiss": <T = any>() => Promise<OverlayEventDetail<T>>;
+        "overlayIndex": number;
+        /**
+          * Present the picker overlay after it has been created.
+         */
+        "present": () => Promise<void>;
+        /**
+          * If `true`, a backdrop will be displayed behind the picker.
+          * @default true
+         */
+        "showBackdrop": boolean;
+        /**
+          * An ID corresponding to the trigger element that causes the picker to open when clicked.
+         */
+        "trigger": string | undefined;
+    }
+    interface IonPickerLegacyColumn {
+        /**
+          * Picker column data
+         */
+        "col": PickerColumn;
+    }
     interface IonPopover {
         /**
           * Describes how to align the popover content with the `reference` point. Defaults to `"center"` for `ios` mode, and `"start"` for `md` mode.
@@ -2812,10 +2919,6 @@ export namespace Components {
          */
         "mode": "ios" | "md";
         "setRouteId": (id: string, params: ComponentProps | undefined, direction: RouterDirection, animation?: AnimationBuilder) => Promise<RouteWrite>;
-        /**
-          * If `true`, the router-outlet should allow navigation via swipe-to-go-back gesture. Defaults to `true` for `"ios"` mode and `false` for `"md"` mode.
-         */
-        "swipeGesture"?: boolean;
         "swipeHandler"?: SwipeGestureHandler;
     }
     interface IonRow {
@@ -2838,9 +2941,9 @@ export namespace Components {
         "autocomplete": AutocompleteTypes;
         /**
           * Set the input's autocorrect property.
-          * @default false
+          * @default 'off'
          */
-        "autocorrect": boolean;
+        "autocorrect": 'on' | 'off';
         /**
           * Set the cancel button icon. Only applies to `md` mode. Defaults to `arrow-back-sharp`.
           * @default config.get('backButtonIcon', arrowBackSharp) as string
@@ -3143,26 +3246,10 @@ export namespace Components {
     }
     interface IonSelectOption {
         /**
-          * Text that is placed underneath the option text to provide additional details about the option.
-         */
-        "description"?: string;
-        /**
-          * If `true`, the user cannot interact with the select option.
+          * If `true`, the user cannot interact with the select option. This property does not apply when `interface="action-sheet"` as `ion-action-sheet` does not allow for disabled buttons.
           * @default false
          */
         "disabled": boolean;
-        /**
-          * How to pack the label and the option's selection control within a line. `"start"`: The label and radio will appear on the left in LTR and on the right in RTL. `"end"`: The label and radio will appear on the right in LTR and on the left in RTL. `"space-between"`: The label and radio will appear on opposite ends of the line with space between the two elements.  Applies to the `alert`, `popover`, and `modal` interfaces, but has no visible effect on radio options in `popover` or `modal` on `md` (the radio control is hidden there).  When unset, the interface picks a default based on mode and control type.
-         */
-        "justify"?: 'start' | 'end' | 'space-between';
-        /**
-          * Where the label is placed relative to the option's selection control (radio circle or checkbox box) when the option is rendered in an `alert`, `popover`, or `modal` interface. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL.  Applies to the `alert`, `popover`, and `modal` interfaces, but has no visible effect on radio options in `popover` or `modal` on `md` (the radio control is hidden there).  When unset, the interface picks a default based on mode and control type.
-         */
-        "labelPlacement"?: 'start' | 'end';
-        /**
-          * The mode determines the platform behaviors of the component.
-         */
-        "mode"?: "ios" | "md";
         /**
           * The text value of the option.
          */
@@ -3775,6 +3862,14 @@ export interface IonPickerColumnCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIonPickerColumnElement;
 }
+export interface IonPickerLegacyCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIonPickerLegacyElement;
+}
+export interface IonPickerLegacyColumnCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIonPickerLegacyColumnElement;
+}
 export interface IonPopoverCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIonPopoverElement;
@@ -4532,6 +4627,47 @@ declare global {
         prototype: HTMLIonPickerColumnOptionElement;
         new (): HTMLIonPickerColumnOptionElement;
     };
+    interface HTMLIonPickerLegacyElementEventMap {
+        "ionPickerDidPresent": void;
+        "ionPickerWillPresent": void;
+        "ionPickerWillDismiss": OverlayEventDetail;
+        "ionPickerDidDismiss": OverlayEventDetail;
+        "didPresent": void;
+        "willPresent": void;
+        "willDismiss": OverlayEventDetail;
+        "didDismiss": OverlayEventDetail;
+    }
+    interface HTMLIonPickerLegacyElement extends Components.IonPickerLegacy, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIonPickerLegacyElementEventMap>(type: K, listener: (this: HTMLIonPickerLegacyElement, ev: IonPickerLegacyCustomEvent<HTMLIonPickerLegacyElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIonPickerLegacyElementEventMap>(type: K, listener: (this: HTMLIonPickerLegacyElement, ev: IonPickerLegacyCustomEvent<HTMLIonPickerLegacyElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIonPickerLegacyElement: {
+        prototype: HTMLIonPickerLegacyElement;
+        new (): HTMLIonPickerLegacyElement;
+    };
+    interface HTMLIonPickerLegacyColumnElementEventMap {
+        "ionPickerColChange": PickerColumn;
+    }
+    interface HTMLIonPickerLegacyColumnElement extends Components.IonPickerLegacyColumn, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIonPickerLegacyColumnElementEventMap>(type: K, listener: (this: HTMLIonPickerLegacyColumnElement, ev: IonPickerLegacyColumnCustomEvent<HTMLIonPickerLegacyColumnElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIonPickerLegacyColumnElementEventMap>(type: K, listener: (this: HTMLIonPickerLegacyColumnElement, ev: IonPickerLegacyColumnCustomEvent<HTMLIonPickerLegacyColumnElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIonPickerLegacyColumnElement: {
+        prototype: HTMLIonPickerLegacyColumnElement;
+        new (): HTMLIonPickerLegacyColumnElement;
+    };
     interface HTMLIonPopoverElementEventMap {
         "ionPopoverDidPresent": void;
         "ionPopoverWillPresent": void;
@@ -5129,6 +5265,8 @@ declare global {
         "ion-picker": HTMLIonPickerElement;
         "ion-picker-column": HTMLIonPickerColumnElement;
         "ion-picker-column-option": HTMLIonPickerColumnOptionElement;
+        "ion-picker-legacy": HTMLIonPickerLegacyElement;
+        "ion-picker-legacy-column": HTMLIonPickerLegacyColumnElement;
         "ion-popover": HTMLIonPopoverElement;
         "ion-progress-bar": HTMLIonProgressBarElement;
         "ion-radio": HTMLIonRadioElement;
@@ -6031,6 +6169,7 @@ declare namespace LocalJSX {
         "clearText"?: string;
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -6184,6 +6323,7 @@ declare namespace LocalJSX {
     interface IonDatetimeButton {
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -6412,9 +6552,9 @@ declare namespace LocalJSX {
         "autocomplete"?: AutocompleteTypes;
         /**
           * Whether auto correction should be enabled when the user is entering/editing the text value.
-          * @default false
+          * @default 'off'
          */
-        "autocorrect"?: boolean;
+        "autocorrect"?: 'on' | 'off';
         /**
           * Sets the [`autofocus` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus) on the native input element.  This may not be sufficient for the element to be focused on page load. See [managing focus](/docs/developing/managing-focus) for more information.
           * @default false
@@ -7093,8 +7233,8 @@ declare namespace LocalJSX {
          */
         "handle"?: boolean;
         /**
-          * The interaction behavior for the sheet modal when the handle is pressed.  Handle behavior is unavailable when the `handle` property is set to `false` or when the `breakpoints` property is not set (using a fullscreen or card modal).  Set to `"cycle"` to make the handle focusable and let the sheet modal cycle between available breakpoints when pressed. This keeps the sheet operable with assistive technology.  Set to `"none"` to make the handle purely decorative when pressed and removed from the tab order.  Defaults to `"cycle"`.
-          * @default 'cycle'
+          * The interaction behavior for the sheet modal when the handle is pressed.  Defaults to `"none"`, which  means the modal will not change size or position when the handle is pressed. Set to `"cycle"` to let the modal cycle between available breakpoints when pressed.  Handle behavior is unavailable when the `handle` property is set to `false` or when the `breakpoints` property is not set (using a fullscreen or card modal).
+          * @default 'none'
          */
         "handleBehavior"?: ModalHandleBehavior;
         /**
@@ -7259,6 +7399,7 @@ declare namespace LocalJSX {
     interface IonPickerColumn {
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -7282,6 +7423,7 @@ declare namespace LocalJSX {
     interface IonPickerColumnOption {
         /**
           * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
+          * @default 'primary'
          */
         "color"?: Color;
         /**
@@ -7294,6 +7436,110 @@ declare namespace LocalJSX {
          */
         "value"?: any | null;
     }
+    interface IonPickerLegacy {
+        /**
+          * If `true`, the picker will animate.
+          * @default true
+         */
+        "animated"?: boolean;
+        /**
+          * If `true`, the picker will be dismissed when the backdrop is clicked.
+          * @default true
+         */
+        "backdropDismiss"?: boolean;
+        /**
+          * Array of buttons to be displayed at the top of the picker.
+          * @default []
+         */
+        "buttons"?: PickerButton[];
+        /**
+          * Array of columns to be displayed in the picker.
+          * @default []
+         */
+        "columns"?: PickerColumn[];
+        /**
+          * Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces.
+         */
+        "cssClass"?: string | string[];
+        /**
+          * Number of milliseconds to wait before dismissing the picker.
+          * @default 0
+         */
+        "duration"?: number;
+        /**
+          * Animation to use when the picker is presented.
+         */
+        "enterAnimation"?: AnimationBuilder;
+        /**
+          * Additional attributes to pass to the picker.
+         */
+        "htmlAttributes"?: { [key: string]: any };
+        /**
+          * If `true`, the picker will open. If `false`, the picker will close. Use this if you need finer grained control over presentation, otherwise just use the pickerController or the `trigger` property. Note: `isOpen` will not automatically be set back to `false` when the picker dismisses. You will need to do that in your code.
+          * @default false
+         */
+        "isOpen"?: boolean;
+        /**
+          * If `true`, the keyboard will be automatically dismissed when the overlay is presented.
+          * @default true
+         */
+        "keyboardClose"?: boolean;
+        /**
+          * Animation to use when the picker is dismissed.
+         */
+        "leaveAnimation"?: AnimationBuilder;
+        /**
+          * The mode determines which platform styles to use.
+         */
+        "mode"?: "ios" | "md";
+        /**
+          * Emitted after the picker has dismissed. Shorthand for ionPickerDidDismiss.
+         */
+        "onDidDismiss"?: (event: IonPickerLegacyCustomEvent<OverlayEventDetail>) => void;
+        /**
+          * Emitted after the picker has presented. Shorthand for ionPickerWillDismiss.
+         */
+        "onDidPresent"?: (event: IonPickerLegacyCustomEvent<void>) => void;
+        /**
+          * Emitted after the picker has dismissed.
+         */
+        "onIonPickerDidDismiss"?: (event: IonPickerLegacyCustomEvent<OverlayEventDetail>) => void;
+        /**
+          * Emitted after the picker has presented.
+         */
+        "onIonPickerDidPresent"?: (event: IonPickerLegacyCustomEvent<void>) => void;
+        /**
+          * Emitted before the picker has dismissed.
+         */
+        "onIonPickerWillDismiss"?: (event: IonPickerLegacyCustomEvent<OverlayEventDetail>) => void;
+        /**
+          * Emitted before the picker has presented.
+         */
+        "onIonPickerWillPresent"?: (event: IonPickerLegacyCustomEvent<void>) => void;
+        /**
+          * Emitted before the picker has dismissed. Shorthand for ionPickerWillDismiss.
+         */
+        "onWillDismiss"?: (event: IonPickerLegacyCustomEvent<OverlayEventDetail>) => void;
+        /**
+          * Emitted before the picker has presented. Shorthand for ionPickerWillPresent.
+         */
+        "onWillPresent"?: (event: IonPickerLegacyCustomEvent<void>) => void;
+        /**
+          * If `true`, a backdrop will be displayed behind the picker.
+          * @default true
+         */
+        "showBackdrop"?: boolean;
+        /**
+          * An ID corresponding to the trigger element that causes the picker to open when clicked.
+         */
+        "trigger"?: string | undefined;
+    }
+    interface IonPickerLegacyColumn {
+        /**
+          * Picker column data
+         */
+        "col": PickerColumn;
+    }
     interface IonPopover {
         /**
           * Describes how to align the popover content with the `reference` point. Defaults to `"center"` for `ios` mode, and `"start"` for `md` mode.
@@ -7858,10 +8104,6 @@ declare namespace LocalJSX {
           * @default getIonMode(this)
          */
         "mode"?: "ios" | "md";
-        /**
-          * If `true`, the router-outlet should allow navigation via swipe-to-go-back gesture. Defaults to `true` for `"ios"` mode and `false` for `"md"` mode.
-         */
-        "swipeGesture"?: boolean;
     }
     interface IonRow {
     }
@@ -7883,9 +8125,9 @@ declare namespace LocalJSX {
         "autocomplete"?: AutocompleteTypes;
         /**
           * Set the input's autocorrect property.
-          * @default false
+          * @default 'off'
          */
-        "autocorrect"?: boolean;
+        "autocorrect"?: 'on' | 'off';
         /**
           * Set the cancel button icon. Only applies to `md` mode. Defaults to `arrow-back-sharp`.
           * @default config.get('backButtonIcon', arrowBackSharp) as string
@@ -8221,26 +8463,10 @@ declare namespace LocalJSX {
     }
     interface IonSelectOption {
         /**
-          * Text that is placed underneath the option text to provide additional details about the option.
-         */
-        "description"?: string;
-        /**
-          * If `true`, the user cannot interact with the select option.
+          * If `true`, the user cannot interact with the select option. This property does not apply when `interface="action-sheet"` as `ion-action-sheet` does not allow for disabled buttons.
           * @default false
          */
         "disabled"?: boolean;
-        /**
-          * How to pack the label and the option's selection control within a line. `"start"`: The label and radio will appear on the left in LTR and on the right in RTL. `"end"`: The label and radio will appear on the right in LTR and on the left in RTL. `"space-between"`: The label and radio will appear on opposite ends of the line with space between the two elements.  Applies to the `alert`, `popover`, and `modal` interfaces, but has no visible effect on radio options in `popover` or `modal` on `md` (the radio control is hidden there).  When unset, the interface picks a default based on mode and control type.
-         */
-        "justify"?: 'start' | 'end' | 'space-between';
-        /**
-          * Where the label is placed relative to the option's selection control (radio circle or checkbox box) when the option is rendered in an `alert`, `popover`, or `modal` interface. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL.  Applies to the `alert`, `popover`, and `modal` interfaces, but has no visible effect on radio options in `popover` or `modal` on `md` (the radio control is hidden there).  When unset, the interface picks a default based on mode and control type.
-         */
-        "labelPlacement"?: 'start' | 'end';
-        /**
-          * The mode determines the platform behaviors of the component.
-         */
-        "mode"?: "ios" | "md";
         /**
           * The text value of the option.
          */
@@ -9020,7 +9246,7 @@ declare namespace LocalJSX {
         "color": Color;
         "autocapitalize": string;
         "autocomplete": AutocompleteTypes;
-        "autocorrect": boolean;
+        "autocorrect": 'on' | 'off';
         "autofocus": boolean;
         "clearInput": boolean;
         "clearInputIcon": string;
@@ -9188,6 +9414,16 @@ declare namespace LocalJSX {
         "value": string;
         "color": Color;
     }
+    interface IonPickerLegacyAttributes {
+        "keyboardClose": boolean;
+        "cssClass": string | string[];
+        "duration": number;
+        "showBackdrop": boolean;
+        "backdropDismiss": boolean;
+        "animated": boolean;
+        "isOpen": boolean;
+        "trigger": string | undefined;
+    }
     interface IonPopoverAttributes {
         "component": ComponentRef;
         "keyboardClose": boolean;
@@ -9291,14 +9527,13 @@ declare namespace LocalJSX {
     interface IonRouterOutletAttributes {
         "mode": "ios" | "md";
         "animated": boolean;
-        "swipeGesture": boolean;
     }
     interface IonSearchbarAttributes {
         "color": Color;
         "animated": boolean;
         "autocapitalize": string;
         "autocomplete": AutocompleteTypes;
-        "autocorrect": boolean;
+        "autocorrect": 'on' | 'off';
         "cancelButtonIcon": string;
         "cancelButtonText": string;
         "clearIcon": string;
@@ -9368,9 +9603,6 @@ declare namespace LocalJSX {
     interface IonSelectOptionAttributes {
         "disabled": boolean;
         "value": string;
-        "description": string;
-        "labelPlacement": 'start' | 'end';
-        "justify": 'start' | 'end' | 'space-between';
     }
     interface IonSelectPopoverAttributes {
         "header": string;
@@ -9542,6 +9774,8 @@ declare namespace LocalJSX {
         "ion-picker": IonPicker;
         "ion-picker-column": Omit<IonPickerColumn, keyof IonPickerColumnAttributes> & { [K in keyof IonPickerColumn & keyof IonPickerColumnAttributes]?: IonPickerColumn[K] } & { [K in keyof IonPickerColumn & keyof IonPickerColumnAttributes as `attr:${K}`]?: IonPickerColumnAttributes[K] } & { [K in keyof IonPickerColumn & keyof IonPickerColumnAttributes as `prop:${K}`]?: IonPickerColumn[K] };
         "ion-picker-column-option": Omit<IonPickerColumnOption, keyof IonPickerColumnOptionAttributes> & { [K in keyof IonPickerColumnOption & keyof IonPickerColumnOptionAttributes]?: IonPickerColumnOption[K] } & { [K in keyof IonPickerColumnOption & keyof IonPickerColumnOptionAttributes as `attr:${K}`]?: IonPickerColumnOptionAttributes[K] } & { [K in keyof IonPickerColumnOption & keyof IonPickerColumnOptionAttributes as `prop:${K}`]?: IonPickerColumnOption[K] };
+        "ion-picker-legacy": Omit<IonPickerLegacy, keyof IonPickerLegacyAttributes> & { [K in keyof IonPickerLegacy & keyof IonPickerLegacyAttributes]?: IonPickerLegacy[K] } & { [K in keyof IonPickerLegacy & keyof IonPickerLegacyAttributes as `attr:${K}`]?: IonPickerLegacyAttributes[K] } & { [K in keyof IonPickerLegacy & keyof IonPickerLegacyAttributes as `prop:${K}`]?: IonPickerLegacy[K] };
+        "ion-picker-legacy-column": IonPickerLegacyColumn;
         "ion-popover": Omit<IonPopover, keyof IonPopoverAttributes> & { [K in keyof IonPopover & keyof IonPopoverAttributes]?: IonPopover[K] } & { [K in keyof IonPopover & keyof IonPopoverAttributes as `attr:${K}`]?: IonPopoverAttributes[K] } & { [K in keyof IonPopover & keyof IonPopoverAttributes as `prop:${K}`]?: IonPopover[K] };
         "ion-progress-bar": Omit<IonProgressBar, keyof IonProgressBarAttributes> & { [K in keyof IonProgressBar & keyof IonProgressBarAttributes]?: IonProgressBar[K] } & { [K in keyof IonProgressBar & keyof IonProgressBarAttributes as `attr:${K}`]?: IonProgressBarAttributes[K] } & { [K in keyof IonProgressBar & keyof IonProgressBarAttributes as `prop:${K}`]?: IonProgressBar[K] };
         "ion-radio": Omit<IonRadio, keyof IonRadioAttributes> & { [K in keyof IonRadio & keyof IonRadioAttributes]?: IonRadio[K] } & { [K in keyof IonRadio & keyof IonRadioAttributes as `attr:${K}`]?: IonRadioAttributes[K] } & { [K in keyof IonRadio & keyof IonRadioAttributes as `prop:${K}`]?: IonRadio[K] };
@@ -9643,6 +9877,8 @@ declare module "@stencil/core" {
             "ion-picker": LocalJSX.IntrinsicElements["ion-picker"] & JSXBase.HTMLAttributes<HTMLIonPickerElement>;
             "ion-picker-column": LocalJSX.IntrinsicElements["ion-picker-column"] & JSXBase.HTMLAttributes<HTMLIonPickerColumnElement>;
             "ion-picker-column-option": LocalJSX.IntrinsicElements["ion-picker-column-option"] & JSXBase.HTMLAttributes<HTMLIonPickerColumnOptionElement>;
+            "ion-picker-legacy": LocalJSX.IntrinsicElements["ion-picker-legacy"] & JSXBase.HTMLAttributes<HTMLIonPickerLegacyElement>;
+            "ion-picker-legacy-column": LocalJSX.IntrinsicElements["ion-picker-legacy-column"] & JSXBase.HTMLAttributes<HTMLIonPickerLegacyColumnElement>;
             "ion-popover": LocalJSX.IntrinsicElements["ion-popover"] & JSXBase.HTMLAttributes<HTMLIonPopoverElement>;
             "ion-progress-bar": LocalJSX.IntrinsicElements["ion-progress-bar"] & JSXBase.HTMLAttributes<HTMLIonProgressBarElement>;
             "ion-radio": LocalJSX.IntrinsicElements["ion-radio"] & JSXBase.HTMLAttributes<HTMLIonRadioElement>;

package/dist/types/index.d.ts

@@ -14,5 +14,5 @@ export { IonicConfig, getMode, setupConfig } from './utils/config';
 export { openURL } from './utils/theme';
 export { LIFECYCLE_WILL_ENTER, LIFECYCLE_DID_ENTER, LIFECYCLE_WILL_LEAVE, LIFECYCLE_DID_LEAVE, LIFECYCLE_WILL_UNLOAD, } from './components/nav/constants';
 export { menuController } from './utils/menu-controller';
-export { alertController, actionSheetController, modalController, loadingController, popoverController, toastController, } from './utils/overlays';
+export { alertController, actionSheetController, modalController, loadingController, pickerController, popoverController, toastController, } from './utils/overlays';
 export { IonicSlides } from './components/slides/IonicSlides';

package/dist/types/interface.d.ts

@@ -19,6 +19,7 @@ export { LoadingOptions } from './components/loading/loading-interface';
 export { MenuCustomEvent, MenuI, MenuControllerI } from './components/menu/menu-interface';
 export { ModalOptions, ModalCustomEvent, ModalDragEventDetail } from './components/modal/modal-interface';
 export { NavDirection, NavCustomEvent } from './components/nav/nav-interface';
+export { PickerOptions, PickerColumnOption } from './components/picker-legacy/picker-interface';
 export { PopoverOptions } from './components/popover/popover-interface';
 export { RadioGroupCustomEvent } from './components/radio-group/radio-group-interface';
 export { RangeCustomEvent, PinFormatter } from './components/range/range-interface';

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

@@ -117,6 +117,10 @@ export interface IonicConfig {
      * Provides a custom enter animation for all `ion-toast`, overriding the default "animation".
      */
     toastEnter?: AnimationBuilder;
+    /**
+     * Provides a custom enter animation for all `ion-picker-legacy`, overriding the default "animation".
+     */
+    pickerEnter?: AnimationBuilder;
     /**
      * Provides a custom leave animation for all `ion-action-sheet`, overriding the default "animation".
      */
@@ -141,6 +145,10 @@ export interface IonicConfig {
      * Provides a custom leave animation for all `ion-toast`, overriding the default "animation".
      */
     toastLeave?: AnimationBuilder;
+    /**
+     * Provides a custom leave animation for all `ion-picker-legacy`, overriding the default "animation".
+     */
+    pickerLeave?: AnimationBuilder;
     /**
      * If `true`, Ionic will enable a basic DOM sanitizer on component properties that accept custom HTML.
      */