@ionic/core

@ionic/core

Version 5.7.0
Published 1 day ago
14.6 MB
3 dependencies
MIT license

Install

npm i @ionic/core

yarn add @ionic/core

pnpm add @ionic/core

Overview

Base components for Ionic

Index

Variables

variable actionSheetController

const actionSheetController: {
    create(options: ActionSheetOptions): Promise<HTMLIonActionSheetElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonActionSheetElement | undefined>;
};

variable alertController

const alertController: {
    create(options: AlertOptions): Promise<HTMLIonAlertElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonAlertElement | undefined>;
};

variable config

const config: Config;

variable IonicSwiper

const IonicSwiper: { name: string; on: { afterInit(swiper: any): void } };

variable isPlatform

const isPlatform: IsPlatformSignature;

variable LIFECYCLE_DID_ENTER

const LIFECYCLE_DID_ENTER: string;

variable LIFECYCLE_DID_LEAVE

const LIFECYCLE_DID_LEAVE: string;

variable LIFECYCLE_WILL_ENTER

const LIFECYCLE_WILL_ENTER: string;

variable LIFECYCLE_WILL_LEAVE

const LIFECYCLE_WILL_LEAVE: string;

variable LIFECYCLE_WILL_UNLOAD

const LIFECYCLE_WILL_UNLOAD: string;

variable loadingController

const loadingController: {
    create(options: LoadingOptions): Promise<HTMLIonLoadingElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonLoadingElement | undefined>;
};

variable menuController

const menuController: {
    registerAnimation: (name: string, animation: AnimationBuilder) => void;
    get: (
        menu?: string | null | undefined
    ) => Promise<HTMLIonMenuElement | undefined>;
    getMenus: () => Promise<HTMLIonMenuElement[]>;
    getOpen: () => Promise<HTMLIonMenuElement | undefined>;
    isEnabled: (menu?: string | null | undefined) => Promise<boolean>;
    swipeGesture: (
        shouldEnable: boolean,
        menu?: string | null | undefined
    ) => Promise<HTMLIonMenuElement | undefined>;
    isAnimating: () => Promise<boolean>;
    isOpen: (menu?: string | null | undefined) => Promise<boolean>;
    enable: (
        shouldEnable: boolean,
        menu?: string | null | undefined
    ) => Promise<HTMLIonMenuElement | undefined>;
    toggle: (menu?: string | null | undefined) => Promise<boolean>;
    close: (menu?: string | null | undefined) => Promise<boolean>;
    open: (menu?: string | null | undefined) => Promise<boolean>;
    _getOpenSync: () => HTMLIonMenuElement | undefined;
    _createAnimation: (type: string, menuCmp: MenuI) => any;
    _register: (menu: MenuI) => void;
    _unregister: (menu: MenuI) => void;
    _setOpen: (
        menu: MenuI,
        shouldOpen: boolean,
        animated: boolean
    ) => Promise<boolean>;
    _setActiveMenu: (menu: MenuI) => void;
};

variable modalController

const modalController: {
    create(
        options: ModalOptions<import('../interface').ComponentRef>
    ): Promise<HTMLIonModalElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonModalElement | undefined>;
};

variable pickerController

const pickerController: {
    create(options: PickerOptions): Promise<HTMLIonPickerElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonPickerElement | undefined>;
};

variable popoverController

const popoverController: {
    create(
        options: PopoverOptions<import('../interface').ComponentRef>
    ): Promise<HTMLIonPopoverElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonPopoverElement | undefined>;
};

variable toastController

const toastController: {
    create(options: ToastOptions): Promise<HTMLIonToastElement>;
    dismiss(
        data?: any,
        role?: string | undefined,
        id?: string | undefined
    ): Promise<boolean>;
    getTop(): Promise<HTMLIonToastElement | undefined>;
};

Functions

function componentOnReady

componentOnReady: (el: any, callback: any) => void;

Waits for a component to be ready for both custom element and non-custom element builds. If non-custom element build, el.componentOnReady will be used. For custom element builds, we wait a frame so that the inner contents of the component have a chance to render.
Use this utility rather than calling el.componentOnReady yourself.

function configFromSession

configFromSession: (win: Window) => any;

function configFromURL

configFromURL: (win: Window) => any;

function createAnimation

createAnimation: (animationId?: string | undefined) => Animation;

function createGesture

createGesture: (config: GestureConfig) => Gesture;

function getMode

getMode: () => Mode;

function getPlatforms

getPlatforms: (
    win?: any
) => (
    | 'ios'
    | 'ipad'
    | 'iphone'
    | 'android'
    | 'phablet'
    | 'tablet'
    | 'cordova'
    | 'capacitor'
    | 'electron'
    | 'pwa'
    | 'mobile'
    | 'mobileweb'
    | 'desktop'
    | 'hybrid'
)[];

function getTimeGivenProgression

getTimeGivenProgression: (
    p0: number[],
    p1: number[],
    p2: number[],
    p3: number[],
    progression: number
) => number[];

EXPERIMENTAL Given a cubic-bezier curve, get the x value (time) given the y value (progression). Ex: cubic-bezier(0.32, 0.72, 0, 1); P0: (0, 0) P1: (0.32, 0.72) P2: (0, 1) P3: (1, 1)
If you give a cubic bezier curve that never reaches the provided progression, this function will return an empty array.

function initialize

initialize: (userConfig?: IonicConfig) => void;

function iosTransitionAnimation

iosTransitionAnimation: (
    navEl: HTMLElement,
    opts: TransitionOptions
) => Animation;

function mdTransitionAnimation

mdTransitionAnimation: (_: HTMLElement, opts: TransitionOptions) => Animation;

function saveConfig

saveConfig: (win: Window, c: any) => void;

function setupConfig

setupConfig: (config: IonicConfig) => any;

Classes

class Config

class Config {}

method get

get: (key: keyof IonicConfig, fallback?: any) => any;

method getBoolean

getBoolean: (key: keyof IonicConfig, fallback?: boolean) => boolean;

method getNumber

getNumber: (key: keyof IonicConfig, fallback?: number) => number;

method reset

reset: (configObj: IonicConfig) => void;

method set

set: (key: keyof IonicConfig, value: any) => void;

class IonicSafeString

class IonicSafeString {}

constructor

constructor(value: string);

property value

value: string;

class ViewController

class ViewController {}

constructor

constructor(component: any, params: ComponentProps<null>);

property animationBuilder

animationBuilder?: AnimationBuilder;

property component

component: any;

property delegate

delegate?: FrameworkDelegate;

property element

element?: HTMLElement;

property nav

nav?: any;

property params

params: ComponentProps<null>;

property state

state: number;

method init

init: (container: HTMLElement) => Promise<void>;

Interfaces

interface ActionSheetButton

interface ActionSheetButton {}

property cssClass

cssClass?: string | string[];

property handler

handler?: () => boolean | void | Promise<boolean | void>;

property icon

icon?: string;

property role

role?: 'cancel' | 'destructive' | 'selected' | string;

property text

text?: string;

interface ActionSheetOptions

interface ActionSheetOptions {}

property animated

animated?: boolean;

property backdropDismiss

backdropDismiss?: boolean;

property buttons

buttons: (ActionSheetButton | string)[];

property cssClass

cssClass?: string | string[];

property enterAnimation

enterAnimation?: AnimationBuilder;

header?: string;

property id

id?: string;

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property mode

mode?: Mode;

property subHeader

subHeader?: string;

property translucent

translucent?: boolean;

interface AlertButton

interface AlertButton {}

property cssClass

cssClass?: string | string[];

property handler

handler?: (
    value: any
) =>
    | boolean
    | void
    | {
          [key: string]: any;
      };

property role

role?: 'cancel' | 'destructive' | string;

property text

text: string;

interface AlertInput

interface AlertInput {}

property attributes

attributes?: AlertInputAttributes | AlertTextareaAttributes;

property checked

checked?: boolean;

property cssClass

cssClass?: string | string[];

property disabled

disabled?: boolean;

property handler

handler?: (input: AlertInput) => void;

property id

id?: string;

property label

label?: string;

property max

max?: string | number;

property min

min?: string | number;

property name

name?: string;

property placeholder

placeholder?: string;

property tabindex

tabindex?: number;

property type

type?: TextFieldTypes | 'checkbox' | 'radio' | 'textarea';

property value

value?: any;

interface AlertInputAttributes

interface AlertInputAttributes
    extends JSXBase.InputHTMLAttributes<HTMLInputElement> {}

interface AlertOptions

interface AlertOptions {}

property animated

animated?: boolean;

property backdropDismiss

backdropDismiss?: boolean;

property buttons

buttons?: (AlertButton | string)[];

property cssClass

cssClass?: string | string[];

property enterAnimation

enterAnimation?: AnimationBuilder;

header?: string;

property id

id?: string;

property inputs

inputs?: AlertInput[];

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property message

message?: string | IonicSafeString;

property mode

mode?: Mode;

property subHeader

subHeader?: string;

property translucent

translucent?: boolean;

interface AlertTextareaAttributes

interface AlertTextareaAttributes
    extends JSXBase.TextareaHTMLAttributes<HTMLTextAreaElement> {}

interface Animation

interface Animation {}

property childAnimations

childAnimations: Animation[];

property elements

elements: HTMLElement[];

property id

id: string | undefined;

property parentAnimation

parentAnimation: Animation | undefined;

method addAnimation

addAnimation: (animationToAdd: Animation | Animation[]) => Animation;

Group one or more animations together to be controlled by a parent animation.

method addElement

addElement: (el: Element | Element[] | Node | Node[] | NodeList) => Animation;

Add one or more elements to the animation

method afterAddClass

afterAddClass: (className: string | string[]) => Animation;

Add CSS class to the animation's elements after the animation ends.

method afterAddRead

afterAddRead: (readFn: () => void) => Animation;

Add a function that performs a DOM read to be run after the animation end

method afterAddWrite

afterAddWrite: (writeFn: () => void) => Animation;

Add a function that performs a DOM write to be run after the animation end

method afterClearStyles

afterClearStyles: (propertyNames: string[]) => Animation;

Clear CSS inline styles from the animation's elements after the animation ends.

method afterRemoveClass

afterRemoveClass: (className: string | string[]) => Animation;

Remove CSS class from the animation's elements after the animation ends.

method afterStyles

afterStyles: (styles: { [property: string]: any }) => Animation;

Set CSS inline styles to the animation's elements after the animation ends.

method beforeAddClass

beforeAddClass: (className: string | string[]) => Animation;

Add a class to the animation's elements before the animation starts

method beforeAddRead

beforeAddRead: (readFn: () => void) => Animation;

Add a function that performs a DOM read to be run before the animation starts

method beforeAddWrite

beforeAddWrite: (writeFn: () => void) => Animation;

Add a function that performs a DOM write to be run before the animation starts

method beforeClearStyles

beforeClearStyles: (propertyNames: string[]) => Animation;

Clear CSS inline styles from the animation's elements before the animation begins.

method beforeRemoveClass

beforeRemoveClass: (className: string | string[]) => Animation;

Remove a class from the animation's elements before the animation starts

method beforeStyles

beforeStyles: (styles: { [property: string]: any }) => Animation;

Set CSS inline styles to the animation's elements before the animation begins.

method delay

delay: (delay: number | undefined) => Animation;

Sets when an animation starts (in milliseconds).

method destroy

destroy: (clearStyleSheets?: boolean) => void;

Destroy the animation and all child animations.

method direction

direction: (direction: AnimationDirection | undefined) => Animation;

Sets whether the animation should play forwards, backwards, or alternating back and forth.

method duration

duration: (duration: number | undefined) => Animation;

Sets the length of time the animation takes to complete one cycle.

method easing

easing: (easing: string | undefined) => Animation;

Sets how the animation progresses through the duration of each cycle.

method fill

fill: (fill: AnimationFill | undefined) => Animation;

Sets how the animation applies styles to its elements before and after the animation's execution.

method from

from: (property: string, value: any) => Animation;

method fromTo

fromTo: (property: string, fromValue: any, toValue: any) => Animation;

method getDelay

getDelay: () => number;

Gets the animation's delay in milliseconds.

method getDirection

getDirection: () => AnimationDirection;

Returns the animation's direction.

method getDuration

getDuration: () => number;

Gets the animation's duration in milliseconds.

method getEasing

getEasing: () => string;

Returns the animation's easing.

method getFill

getFill: () => AnimationFill;

Returns the animation's fill mode.

method getIterations

getIterations: () => number;

Gets the number of iterations the animation will run.

method getKeyframes

getKeyframes: () => AnimationKeyFrames;

Get an array of keyframes for the animation.

method getWebAnimations

getWebAnimations: () => any[];

Returns the raw Web Animations object for all elements in an Animation. This will return an empty array on browsers that do not support the Web Animations API.

method iterations

iterations: (iterations: number) => Animation;

Sets the number of times the animation cycle should be played before stopping.

method keyframes

keyframes: (keyframes: AnimationKeyFrames) => Animation;

Set the keyframes for the animation.

method onFinish

onFinish: (
    callback: AnimationLifecycle,
    opts?: AnimationCallbackOptions
) => Animation;

Add a callback to be run upon the animation ending

method pause

pause: () => void;

Pauses the animation

method play

play: (opts?: AnimationPlayOptions) => Promise<void>;

Play the animation
If the sync options is true, the animation will play synchronously. This is the equivalent of running the animation with a duration of 0ms.

method progressEnd

progressEnd: (
    playTo: 0 | 1 | undefined,
    step: number,
    dur?: number
) => Animation;

method progressStart

progressStart: (forceLinearEasing?: boolean, step?: number) => Animation;

method progressStep

progressStep: (step: number) => Animation;

method stop

stop: () => void;

Stop the animation and reset all elements to their initial state

method to

to: (property: string, value: any) => Animation;

interface AnimationCallbackOptions

interface AnimationCallbackOptions {}

property oneTimeCallback

oneTimeCallback: boolean;

interface BackButtonEventDetail

interface BackButtonEventDetail {}

method register

register: (
    priority: number,
    handler: (processNextHandler: () => void) => Promise<any> | void
) => void;

interface Cell

interface Cell {}

property height

height: number;

property i

i: number;

property index

index: number;

property reads

reads: number;

property type

type: CellType;

property value

value: any;

property visible

visible: boolean;

interface CheckboxChangeEventDetail

interface CheckboxChangeEventDetail<T = any> {}

property checked

checked: boolean;

property value

value: T;

interface DatetimeChangeEventDetail

interface DatetimeChangeEventDetail {}

property value

value: string | undefined | null;

interface FrameworkDelegate

interface FrameworkDelegate {}

method attachViewToDom

attachViewToDom: (
    container: any,
    component: any,
    propsOrDataObj?: any,
    cssClasses?: string[]
) => Promise<HTMLElement>;

method removeViewFromDom

removeViewFromDom: (container: any, component: any) => Promise<void>;

interface Gesture

interface Gesture {}

method destroy

destroy: () => void;

method enable

enable: (enable?: boolean) => void;

interface GestureConfig

interface GestureConfig {}

property blurOnStart

blurOnStart?: boolean;

property canStart

canStart?: GestureCallback;

property direction

direction?: 'x' | 'y';

property disableScroll

disableScroll?: boolean;

property el

el: Node;

property gestureName

gestureName: string;

property gesturePriority

gesturePriority?: number;

property maxAngle

maxAngle?: number;

property notCaptured

notCaptured?: GestureCallback;

property onEnd

onEnd?: GestureCallback;

property onMove

onMove?: GestureCallback;

property onStart

onStart?: GestureCallback;

property onWillStart

onWillStart?: (_: GestureDetail) => Promise<void>;

property passive

passive?: boolean;

property threshold

threshold?: number;

interface GestureDetail

interface GestureDetail {}

property currentTime

currentTime: number;

property currentX

currentX: number;

property currentY

currentY: number;

property data

data?: any;

property deltaX

deltaX: number;

property deltaY

deltaY: number;

property event

event: UIEvent;

property startTime

startTime: number;

property startX

startX: number;

property startY

startY: number;

property type

type: string;

property velocityX

velocityX: number;

property velocityY

velocityY: number;

interface HTMLIonOverlayElement

interface HTMLIonOverlayElement extends HTMLStencilElement {}

property backdropDismiss

backdropDismiss?: boolean;

property lastFocus

lastFocus?: HTMLElement;

property overlayIndex

overlayIndex: number;

method dismiss

dismiss: (data?: any, role?: string) => Promise<boolean>;

interface HTMLStencilElement

interface HTMLStencilElement extends HTMLElement {}

method componentOnReady

componentOnReady: () => Promise<this>;

interface InputChangeEventDetail

interface InputChangeEventDetail {}

property value

value: string | undefined | null;

interface IonicConfig

interface IonicConfig {}

property actionSheetEnter

actionSheetEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-action-sheet, overriding the default "animation".

property actionSheetLeave

actionSheetLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-action-sheet, overriding the default "animation".

property alertEnter

alertEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-alert, overriding the default "animation".

property alertLeave

alertLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-alert, overriding the default "animation".

property animated

animated?: boolean;

When it's set to false, disables all animation and transition across the app. Can be useful to make ionic smoother in slow devices, when animations can't run smoothly.

property backButtonDefaultHref

backButtonDefaultHref?: string;

Overrides the default defaultHref in all <ion-back-button> components.

property backButtonIcon

backButtonIcon?: string;

Overrides the default icon in all <ion-back-button> components.

property backButtonText

backButtonText?: string;

Overrides the default text in all <ion-back-button> components.

property experimentalTransitionShadow

experimentalTransitionShadow?: boolean;

EXPERIMENTAL: Adds a page shadow to transitioning pages on iOS. Disabled by default.

property hardwareBackButton

hardwareBackButton?: boolean;

Wherever ionic will respond to hardware go back buttons in an Android device. Defaults to true when ionic runs in a mobile device.

property hideCaretOnScroll

hideCaretOnScroll?: boolean;

property infiniteLoadingSpinner

infiniteLoadingSpinner?: SpinnerTypes | null;

Overrides the default spinner type in all <ion-infinite-scroll-content> components.

property inputBlurring

inputBlurring?: boolean;

property inputShims

inputShims?: boolean;

property keyboardHeight

keyboardHeight?: number;

property loadingEnter

loadingEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-loading, overriding the default "animation".

property loadingLeave

loadingLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-loading, overriding the default "animation".

property loadingSpinner

loadingSpinner?: SpinnerTypes | null;

Overrides the default spinner for all ion-loading overlays, ie. the ones created with ion-loading-controller.

property menuIcon

menuIcon?: string;

Overrides the default icon in all <ion-menu-button> components.

property menuType

menuType?: string;

Overrides the default menu type for all <ion-menu> components. By default the menu type is chosen based in the app's mode.

property modalEnter

modalEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-modal, overriding the default "animation".

property modalLeave

modalLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-modal, overriding the default "animation".

property mode

mode?: Mode;

The mode determines which platform styles to use for the whole application.

property navAnimation

navAnimation?: AnimationBuilder;

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.

property persistConfig

persistConfig?: boolean;

property pickerEnter

pickerEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-picker, overriding the default "animation".

property pickerLeave

pickerLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-picker, overriding the default "animation".

property popoverEnter

popoverEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-popover, overriding the default "animation".

property popoverLeave

popoverLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-popover, overriding the default "animation".

property refreshingIcon

refreshingIcon?: string;

Overrides the default icon in all <ion-refresh-content> components.

property refreshingSpinner

refreshingSpinner?: SpinnerTypes | null;

Overrides the default spinner type in all <ion-refresh-content> components.

property rippleEffect

rippleEffect?: boolean;

When it's set to false, it disables all material-design ripple-effects across the app. Defaults to true.

property sanitizerEnabled

sanitizerEnabled?: boolean;

If true, Ionic will enable a basic DOM sanitizer on component properties that accept custom HTML.

property scrollAssist

scrollAssist?: boolean;

property scrollPadding

scrollPadding?: boolean;

property spinner

spinner?: SpinnerTypes;

Overrides the default spinner in all <ion-spinner> components. By default the spinner type is chosen based in the mode (ios or md).

property statusTap

statusTap?: boolean;

Whenever clicking the top status bar should cause the scroll to top in an application. Defaults to true when ionic runs in a mobile device.

property swipeBackEnabled

swipeBackEnabled?: boolean;

Global switch that disables or enables "swipe-to-go-back" gesture across all ion-nav in your application.

property tabButtonLayout

tabButtonLayout?: TabButtonLayout;

Overrides the default "layout" of all ion-bar-button across the whole application.

property toastEnter

toastEnter?: AnimationBuilder;

Provides a custom enter animation for all ion-toast, overriding the default "animation".

property toastLeave

toastLeave?: AnimationBuilder;

Provides a custom leave animation for all ion-toast, overriding the default "animation".

interface ItemReorderEventDetail

interface ItemReorderEventDetail {}

property complete

complete: (data?: boolean | any[]) => any;

property from

from: number;

property to

to: number;

interface KeyboardEventDetail

interface KeyboardEventDetail {}

property keyboardHeight

keyboardHeight: number;

interface LoadingOptions

interface LoadingOptions {}

property animated

animated?: boolean;

property backdropDismiss

backdropDismiss?: boolean;

property cssClass

cssClass?: string | string[];

property duration

duration?: number;

property enterAnimation

enterAnimation?: AnimationBuilder;

property id

id?: string;

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property message

message?: string | IonicSafeString;

property mode

mode?: Mode;

property showBackdrop

showBackdrop?: boolean;

property spinner

spinner?: SpinnerTypes | null;

property translucent

translucent?: boolean;

interface MenuChangeEventDetail

interface MenuChangeEventDetail {}

property disabled

disabled: boolean;

property open

open: boolean;

interface MenuControllerI

interface MenuControllerI {}

method getMenus

getMenus: () => Promise<HTMLIonMenuElement[]>;

method getOpenSync

getOpenSync: () => HTMLIonMenuElement | undefined;

interface MenuI

interface MenuI {}

property backdropEl

backdropEl?: HTMLElement;

property contentEl

contentEl?: HTMLElement;

property disabled

disabled: boolean;

property el

el: HTMLIonMenuElement;

property isAnimating

isAnimating: boolean;

property isEndSide

isEndSide: boolean;

property menuCtrl

menuCtrl?: MenuControllerI;

property menuId

menuId?: string;

property menuInnerEl

menuInnerEl?: HTMLElement;

property side

side: Side;

property width

width: number;

method close

close: (animated?: boolean) => Promise<boolean>;

method isActive

isActive: () => Promise<boolean>;

method open

open: (animated?: boolean) => Promise<boolean>;

method setOpen

setOpen: (shouldOpen: boolean, animated?: boolean) => Promise<boolean>;

method toggle

toggle: (animated?: boolean) => Promise<boolean>;

interface ModalOptions

interface ModalOptions<T extends ComponentRef = ComponentRef> {}

property animated

animated?: boolean;

property backdropDismiss

backdropDismiss?: boolean;

property component

component: T;

property componentProps

componentProps?: ComponentProps<T>;

property cssClass

cssClass?: string | string[];

property delegate

delegate?: FrameworkDelegate;

property enterAnimation

enterAnimation?: AnimationBuilder;

property id

id?: string;

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property mode

mode?: Mode;

property presentingElement

presentingElement?: HTMLElement;

property showBackdrop

showBackdrop?: boolean;

property swipeToClose

swipeToClose?: boolean;

interface NavComponentWithProps

interface NavComponentWithProps<T = any> {}

property component

component: NavComponent;

property componentProps

componentProps?: ComponentProps<T> | null;

interface NavOptions

interface NavOptions extends RouterOutletOptions {}

property delegate

delegate?: FrameworkDelegate;

property progressAnimation

progressAnimation?: boolean;

property updateURL

updateURL?: boolean;

property viewIsReady

viewIsReady?: (enteringEl: HTMLElement) => Promise<any>;

interface NavOutlet

interface NavOutlet {}

method getRouteId

getRouteId: () => Promise<RouteID | undefined>;

method setRouteId

setRouteId: (
    id: string,
    params: ComponentProps | undefined,
    direction: RouterDirection,
    animation?: AnimationBuilder
) => Promise<RouteWrite>;

interface NavResult

interface NavResult {}

property direction

direction?: NavDirection;

property enteringView

enteringView?: ViewController;

property hasCompleted

hasCompleted: boolean;

property leavingView

leavingView?: ViewController;

property requiresTransition

requiresTransition: boolean;

interface OverlayController

interface OverlayController {}

method create

create: (opts?: any) => Promise<HTMLElement>;

method dismiss

dismiss: (data?: any, role?: string, id?: string) => Promise<boolean>;

method getTop

getTop: () => Promise<HTMLIonOverlayElement | undefined>;

interface OverlayEventDetail

interface OverlayEventDetail<T = any> {}

property data

data?: T;

property role

role?: string;

interface OverlayInterface

interface OverlayInterface {}

property animated

animated: boolean;

property didDismiss

didDismiss: EventEmitter<OverlayEventDetail>;

property didPresent

didPresent: EventEmitter<void>;

property el

el: HTMLElement;

property enterAnimation

enterAnimation?: AnimationBuilder;

property keyboardClose

keyboardClose: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property overlayIndex

overlayIndex: number;

property presented

presented: boolean;

property willDismiss

willDismiss: EventEmitter<OverlayEventDetail>;

property willPresent

willPresent: EventEmitter<void>;

method dismiss

dismiss: (data?: any, role?: string) => Promise<boolean>;

method present

present: () => Promise<void>;

interface ParsedRoute

interface ParsedRoute {}

property queryString

queryString?: string;

property segments

segments: string[];

interface PickerButton

interface PickerButton {}

property cssClass

cssClass?: string | string[];

property handler

handler?: (value: any) => boolean | void;

property role

role?: string;

property text

text?: string;

interface PickerColumn

interface PickerColumn {}

property align

align?: string;

property columnWidth

columnWidth?: string;

property cssClass

cssClass?: string | string[];

property name

name: string;

property options

options: PickerColumnOption[];

property optionsWidth

optionsWidth?: string;

property prefix

prefix?: string;

property prefixWidth

prefixWidth?: string;

property prevSelected

prevSelected?: number;

property refresh

refresh?: () => void;

property selectedIndex

selectedIndex?: number;

property suffix

suffix?: string;

property suffixWidth

suffixWidth?: string;

interface PickerColumnOption

interface PickerColumnOption {}

property disabled

disabled?: boolean;

property duration

duration?: number;

property selected

selected?: boolean;

property text

text?: string;

property transform

transform?: string;

property value

value?: any;

interface PickerOptions

interface PickerOptions {}

property animated

animated?: boolean;

property backdropDismiss

backdropDismiss?: boolean;

property buttons

buttons?: PickerButton[];

property columns

columns: PickerColumn[];

property cssClass

cssClass?: string | string[];

property enterAnimation

enterAnimation?: AnimationBuilder;

property id

id?: string;

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property mode

mode?: Mode;

property showBackdrop

showBackdrop?: boolean;

interface PopoverOptions

interface PopoverOptions<T extends ComponentRef = ComponentRef> {}

property animated

animated?: boolean;

property backdropDismiss

backdropDismiss?: boolean;

property component

component: T;

property componentProps

componentProps?: ComponentProps<T>;

property cssClass

cssClass?: string | string[];

property delegate

delegate?: FrameworkDelegate;

property enterAnimation

enterAnimation?: AnimationBuilder;

property event

event?: Event;

property id

id?: string;

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property mode

mode?: Mode;

property showBackdrop

showBackdrop?: boolean;

property translucent

translucent?: boolean;

interface RadioChangeEventDetail

interface RadioChangeEventDetail<T = any> {}

property checked

checked: boolean;

property value

value: T;

interface RadioGroupChangeEventDetail

interface RadioGroupChangeEventDetail<T = any> {}

property value

value: T;

interface RangeChangeEventDetail

interface RangeChangeEventDetail {}

property value

value: RangeValue;

interface RefresherEventDetail

interface RefresherEventDetail {}

method complete

complete: () => void;

interface RouteEntry

interface RouteEntry {}

property beforeEnter

beforeEnter?: NavigationHookCallback;

property beforeLeave

beforeLeave?: NavigationHookCallback;

property id

id: string;

property params

params:
    | {
          [key: string]: any;
      }
    | undefined;

property path

path: string[];

interface RouteID

interface RouteID {}

property element

element: HTMLElement | undefined;

property id

id: string;

property params

params?: {
    [key: string]: any;
};

interface RouteNode

interface RouteNode extends RouteEntry {}

property children

children: RouteTree;

interface RouteRedirect

interface RouteRedirect {}

property from

from: string[];

property to

to?: ParsedRoute;

interface RouterEventDetail

interface RouterEventDetail {}

property from

from: string | null;

property redirectedFrom

redirectedFrom: string | null;

property to

to: string;

interface RouterOutletOptions

interface RouterOutletOptions {}

property animated

animated?: boolean;

property animationBuilder

animationBuilder?: AnimationBuilder;

property deepWait

deepWait?: boolean;

property direction

direction?: NavDirection;

property duration

duration?: number;

property easing

easing?: string;

property keyboardClose

keyboardClose?: boolean;

property mode

mode?: Mode;

property progressAnimation

progressAnimation?: boolean;

property showGoBack

showGoBack?: boolean;

property skipIfBusy

skipIfBusy?: boolean;

interface RouteWrite

interface RouteWrite {}

property changed

changed: boolean;

property element

element: HTMLElement | undefined;

property markVisible

markVisible?: () => void | Promise<void>;

interface ScrollBaseDetail

interface ScrollBaseDetail {}

property isScrolling

isScrolling: boolean;

interface ScrollDetail

interface ScrollDetail extends GestureDetail, ScrollBaseDetail {}

property scrollLeft

scrollLeft: number;

property scrollTop

scrollTop: number;

interface SearchbarChangeEventDetail

interface SearchbarChangeEventDetail {}

property value

value: string | undefined;

interface SegmentChangeEventDetail

interface SegmentChangeEventDetail {}

property value

value: string | undefined;

interface SelectChangeEventDetail

interface SelectChangeEventDetail<T = any> {}

property value

value: T;

interface SelectPopoverOption

interface SelectPopoverOption {}

property checked

checked: boolean;

property cssClass

cssClass?: string | string[];

property disabled

disabled: boolean;

property handler

handler?: () => void;

property text

text: string;

property value

value: string;

interface SpinnerConfig

interface SpinnerConfig {}

property circles

circles?: number;

property dur

dur: number;

property elmDuration

elmDuration?: boolean;

property fn

fn: (dur: number, index: number, total: number) => SpinnerData;

property lines

lines?: number;

interface SpinnerConfigs

interface SpinnerConfigs {}

index signature

[spinnerName: string]: SpinnerConfig;

interface SpinnerData

interface SpinnerData {}

property cx

cx?: number;

property cy

cy?: number;

property r

r?: number;

property style

style: any;

property transform

transform?: string;

property viewBox

viewBox?: string;

property y1

y1?: number;

property y2

y2?: number;

interface StyleEventDetail

interface StyleEventDetail {}

index signature

[styleName: string]: boolean;

interface SwipeGestureHandler

interface SwipeGestureHandler {}

method canStart

canStart: () => boolean;

method onEnd

onEnd: (shouldComplete: boolean) => void;

method onStart

onStart: () => void;

interface TabBarChangedEventDetail

interface TabBarChangedEventDetail {}

property tab

tab?: string;

interface TabButtonClickEventDetail

interface TabButtonClickEventDetail {}

property href

href?: string;

property selected

selected: boolean;

property tab

tab: string;

interface TextareaChangeEventDetail

interface TextareaChangeEventDetail {}

property value

value: string | undefined | null;

interface ToastButton

interface ToastButton {}

property cssClass

cssClass?: string | string[];

property handler

handler?: () => boolean | void | Promise<boolean | void>;

property icon

icon?: string;

property role

role?: 'cancel' | string;

property side

side?: 'start' | 'end';

property text

text?: string;

interface ToastOptions

interface ToastOptions {}

property animated

animated?: boolean;

property buttons

buttons?: (ToastButton | string)[];

property color

color?: Color;

property cssClass

cssClass?: string | string[];

property duration

duration?: number;

property enterAnimation

enterAnimation?: AnimationBuilder;

header?: string;

property id

id?: string;

property keyboardClose

keyboardClose?: boolean;

property leaveAnimation

leaveAnimation?: AnimationBuilder;

property message

message?: string | IonicSafeString;

property mode

mode?: Mode;

property position

position?: 'top' | 'bottom' | 'middle';

property translucent

translucent?: boolean;

interface ToggleChangeEventDetail

interface ToggleChangeEventDetail {}

property checked

checked: boolean;

property value

value: any;

interface TransitionInstruction

interface TransitionInstruction {}

property done

done?: TransitionDoneFn;

property enteringRequiresTransition

enteringRequiresTransition?: boolean;

property insertStart

insertStart?: number;

property insertViews

insertViews?: any[];

property leavingRequiresTransition

leavingRequiresTransition?: boolean;

property opts

opts: NavOptions | undefined | null;

property reject

reject?: (rejectReason: string) => void;

property removeCount

removeCount?: number;

property removeStart

removeStart?: number;

property removeView

removeView?: ViewController;

property resolve

resolve?: (hasCompleted: boolean) => void;

interface VirtualNode

interface VirtualNode {}

property cell

cell: Cell;

property change

change: NodeChange;

property d

d: boolean;

property top

top: number;

property visible

visible: boolean;

Type Aliases

type AnimationBuilder

type AnimationBuilder = (baseEl: any, opts?: any) => Animation;

type AnimationDirection

type AnimationDirection = 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';

type AnimationFill

type AnimationFill = 'auto' | 'none' | 'forwards' | 'backwards' | 'both';

type AnimationKeyFrames

type AnimationKeyFrames =
    | [AnimationKeyFrameEdge, AnimationKeyFrameEdge]
    | AnimationKeyFrame[];

type AnimationLifecycle

type AnimationLifecycle = (currentStep: 0 | 1, animation: Animation) => void;

type AutocompleteTypes

type AutocompleteTypes =
    | 'on'
    | 'off'
    | 'name'
    | 'honorific-prefix'
    | 'given-name'
    | 'additional-name'
    | 'family-name'
    | 'honorific-suffix'
    | 'nickname'
    | 'email'
    | 'username'
    | 'new-password'
    | 'current-password'
    | 'one-time-code'
    | 'organization-title'
    | 'organization'
    | 'street-address'
    | 'address-line1'
    | 'address-line2'
    | 'address-line3'
    | 'address-level4'
    | 'address-level3'
    | 'address-level2'
    | 'address-level1'
    | 'country'
    | 'country-name'
    | 'postal-code'
    | 'cc-name'
    | 'cc-given-name'
    | 'cc-additional-name'
    | 'cc-family-name'
    | 'cc-family-name'
    | 'cc-number'
    | 'cc-exp'
    | 'cc-exp-month'
    | 'cc-exp-year'
    | 'cc-csc'
    | 'cc-type'
    | 'transaction-currency'
    | 'transaction-amount'
    | 'language'
    | 'bday'
    | 'bday-day'
    | 'bday-month'
    | 'bday-year'
    | 'sex'
    | 'tel'
    | 'tel-country-code'
    | 'tel-national'
    | 'tel-area-code'
    | 'tel-local'
    | 'tel-extension'
    | 'impp'
    | 'url'
    | 'photo';

type BackButtonEvent

type BackButtonEvent = CustomEvent<BackButtonEventDetail>;

type CellType

type CellType = 'item' | 'header' | 'footer';

type Color

type Color = PredefinedColors | string;

type ComponentProps

type ComponentProps<T = null> = { [key: string]: any };

type ComponentRef

type ComponentRef = Function | HTMLElement | string | null;

type ComponentTags

type ComponentTags = string;

type CssClassMap

type CssClassMap = { [className: string]: boolean };

type DatetimeOptions

type DatetimeOptions = Partial<PickerOptions>;

type DomRenderFn

type DomRenderFn = (dom: VirtualNode[]) => void;

type FooterHeightFn

type FooterHeightFn = (item: any, index: number) => number;

type HeaderFn

type HeaderFn = (
    item: any,
    index: number,
    items: any[]
) => string | null | undefined;

type HeaderHeightFn

type HeaderHeightFn = (item: any, index: number) => number;

type ItemHeightFn

type ItemHeightFn = (item: any, index: number) => number;

type ItemRenderFn

type ItemRenderFn = (
    el: HTMLElement | null,
    cell: Cell,
    domIndex: number
) => HTMLElement;

type KnobName

type KnobName = 'A' | 'B' | undefined;

type Mode

type Mode = 'ios' | 'md';

type NavComponent

type NavComponent = ComponentRef | ViewController;

type NavDirection

type NavDirection = 'back' | 'forward';

type NavOutletElement

type NavOutletElement = NavOutlet & HTMLStencilElement;

type NodeChange

type NodeChange = number;

type OverlaySelect

type OverlaySelect =
    | HTMLIonActionSheetElement
    | HTMLIonAlertElement
    | HTMLIonPopoverElement;

type Page

type Page = new (...args: any[]) => any;

type Platforms

type Platforms = keyof typeof PLATFORMS_MAP;

type PredefinedColors

type PredefinedColors =
    | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'success'
    | 'warning'
    | 'danger'
    | 'light'
    | 'medium'
    | 'dark';

type RangeValue

type RangeValue =
    | number
    | {
          lower: number;
          upper: number;
      };

type RouteChain

type RouteChain = RouteEntry[];

type RouterDirection

type RouterDirection = 'forward' | 'back' | 'root';

type RouteTree

type RouteTree = RouteNode[];

type ScrollCallback

type ScrollCallback = (detail?: ScrollDetail) => boolean | void;

type SegmentButtonLayout

type SegmentButtonLayout =
    | 'icon-top'
    | 'icon-start'
    | 'icon-end'
    | 'icon-bottom'
    | 'icon-hide'
    | 'label-hide';

type SelectCompareFn

type SelectCompareFn = (currentValue: any, compareValue: any) => boolean;

type SelectInterface

type SelectInterface = 'action-sheet' | 'popover' | 'alert';

type Side

type Side = 'start' | 'end';

type SpinnerTypes

type SpinnerTypes = keyof typeof spinners;

type TabButtonLayout

type TabButtonLayout =
    | 'icon-top'
    | 'icon-start'
    | 'icon-end'
    | 'icon-bottom'
    | 'icon-hide'
    | 'label-hide';

type TextFieldTypes

type TextFieldTypes =
    | 'date'
    | 'email'
    | 'number'
    | 'password'
    | 'search'
    | 'tel'
    | 'text'</

@ionic/core

Install

Overview

Index

Variables

Functions

Classes

Interfaces

Type Aliases

Namespaces

Variables

variable actionSheetController

variable alertController

variable config

variable IonicSwiper

variable isPlatform

variable LIFECYCLE_DID_ENTER

variable LIFECYCLE_DID_LEAVE

variable LIFECYCLE_WILL_ENTER

variable LIFECYCLE_WILL_LEAVE

variable LIFECYCLE_WILL_UNLOAD

variable loadingController

variable menuController

variable modalController

variable pickerController

variable popoverController

variable toastController

Functions

function componentOnReady

function configFromSession

function configFromURL

function createAnimation

function createGesture

function getMode

function getPlatforms

function getTimeGivenProgression

function initialize

function iosTransitionAnimation

function mdTransitionAnimation

function saveConfig

function setupConfig

Classes

class Config

method get

method getBoolean

method getNumber

method reset

method set

class IonicSafeString

constructor

property value

class ViewController

constructor

property animationBuilder

property component

property delegate

property element

property nav

property params

property state

method init

Interfaces

interface ActionSheetButton

property cssClass

property handler

property icon

property role

property text

interface ActionSheetOptions

property animated

property backdropDismiss

property buttons

property cssClass

property enterAnimation

property header

property id

property keyboardClose

property leaveAnimation

property mode

property subHeader