diff --git a/angular/src/directives/proxies-list.txt b/angular/src/directives/proxies-list.txt index 2684baf62c..1d11508393 100644 --- a/angular/src/directives/proxies-list.txt +++ b/angular/src/directives/proxies-list.txt @@ -62,7 +62,6 @@ export const DIRECTIVES = [ d.IonSegmentButton, d.IonSelect, d.IonSelectOption, - d.IonSelectPopover, d.IonSkeletonText, d.IonSlide, d.IonSlides, diff --git a/angular/src/directives/proxies.ts b/angular/src/directives/proxies.ts index a01d68c36e..14be2a5d64 100644 --- a/angular/src/directives/proxies.ts +++ b/angular/src/directives/proxies.ts @@ -171,12 +171,11 @@ export class IonCheckbox { ionChange!: EventEmitter; ionFocus!: EventEmitter; ionBlur!: EventEmitter; - ionStyle!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur', 'ionStyle']); + proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur']); } } proxyInputs(IonCheckbox, ['color', 'mode', 'name', 'checked', 'disabled', 'value']); @@ -226,12 +225,11 @@ export class IonDatetime { ionChange!: EventEmitter; ionFocus!: EventEmitter; ionBlur!: EventEmitter; - ionStyle!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionCancel', 'ionChange', 'ionFocus', 'ionBlur', 'ionStyle']); + proxyOutputs(this, this.el, ['ionCancel', 'ionChange', 'ionFocus', 'ionBlur']); } } proxyMethods(IonDatetime, ['open']); @@ -363,14 +361,11 @@ export class IonInput { ionChange!: EventEmitter; ionBlur!: EventEmitter; ionFocus!: EventEmitter; - ionInputDidLoad!: EventEmitter; - ionInputDidUnload!: EventEmitter; - ionStyle!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionInput', 'ionChange', 'ionBlur', 'ionFocus', 'ionInputDidLoad', 'ionInputDidUnload', 'ionStyle']); + proxyOutputs(this, this.el, ['ionInput', 'ionChange', 'ionBlur', 'ionFocus']); } } proxyMethods(IonInput, ['setFocus']); @@ -430,7 +425,6 @@ export class IonItemOptions { proxyOutputs(this, this.el, ['ionSwipe']); } } -proxyMethods(IonItemOptions, ['fireSwipeEvent']); proxyInputs(IonItemOptions, ['side']); export declare interface IonItemSliding extends StencilComponents<'IonItemSliding'> {} @@ -450,12 +444,10 @@ proxyInputs(IonItemSliding, ['disabled']); export declare interface IonLabel extends StencilComponents<'IonLabel'> {} @Component({ selector: 'ion-label', changeDetection: 0, template: '', inputs: ['color', 'mode', 'position'] }) export class IonLabel { - ionStyle!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionStyle']); } } proxyInputs(IonLabel, ['color', 'mode', 'position']); @@ -490,12 +482,11 @@ export class IonMenu { ionWillClose!: EventEmitter; ionDidOpen!: EventEmitter; ionDidClose!: EventEmitter; - ionMenuChange!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionWillOpen', 'ionWillClose', 'ionDidOpen', 'ionDidClose', 'ionMenuChange']); + proxyOutputs(this, this.el, ['ionWillOpen', 'ionWillClose', 'ionDidOpen', 'ionDidClose']); } } proxyMethods(IonMenu, ['isOpen', 'isActive', 'open', 'close', 'toggle', 'setOpen']); @@ -524,7 +515,7 @@ export class IonMenuToggle { proxyInputs(IonMenuToggle, ['menu', 'autoHide']); export declare interface IonNav extends StencilComponents<'IonNav'> {} -@Component({ selector: 'ion-nav', changeDetection: 0, template: '', inputs: ['delegate', 'swipeGesture', 'animated', 'animation', 'rootParams', 'root'] }) +@Component({ selector: 'ion-nav', changeDetection: 0, template: '', inputs: ['swipeGesture', 'animated', 'animation', 'rootParams', 'root'] }) export class IonNav { ionNavWillLoad!: EventEmitter; ionNavWillChange!: EventEmitter; @@ -536,8 +527,8 @@ export class IonNav { proxyOutputs(this, this.el, ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange']); } } -proxyMethods(IonNav, ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'setRouteId', 'getRouteId', 'getActive', 'getByIndex', 'canGoBack', 'getPrevious']); -proxyInputs(IonNav, ['delegate', 'swipeGesture', 'animated', 'animation', 'rootParams', 'root']); +proxyMethods(IonNav, ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'getActive', 'getByIndex', 'canGoBack', 'getPrevious']); +proxyInputs(IonNav, ['swipeGesture', 'animated', 'animation', 'rootParams', 'root']); export declare interface IonNavPop extends StencilComponents<'IonNavPop'> {} @Component({ selector: 'ion-nav-pop', changeDetection: 0, template: '' }) @@ -596,18 +587,14 @@ proxyInputs(IonProgressBar, ['mode', 'type', 'reversed', 'value', 'buffer', 'col export declare interface IonRadio extends StencilComponents<'IonRadio'> {} @Component({ selector: 'ion-radio', changeDetection: 0, template: '', inputs: ['color', 'mode', 'name', 'disabled', 'checked', 'value'] }) export class IonRadio { - ionRadioDidLoad!: EventEmitter; - ionRadioDidUnload!: EventEmitter; - ionStyle!: EventEmitter; ionSelect!: EventEmitter; - ionDeselect!: EventEmitter; ionFocus!: EventEmitter; ionBlur!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionRadioDidLoad', 'ionRadioDidUnload', 'ionStyle', 'ionSelect', 'ionDeselect', 'ionFocus', 'ionBlur']); + proxyOutputs(this, this.el, ['ionSelect', 'ionFocus', 'ionBlur']); } } proxyInputs(IonRadio, ['color', 'mode', 'name', 'disabled', 'checked', 'value']); @@ -629,14 +616,13 @@ export declare interface IonRange extends StencilComponents<'IonRange'> {} @Component({ selector: 'ion-range', changeDetection: 0, template: '', inputs: ['color', 'mode', 'debounce', 'name', 'dualKnobs', 'min', 'max', 'pin', 'snaps', 'step', 'disabled', 'value'] }) export class IonRange { ionChange!: EventEmitter; - ionStyle!: EventEmitter; ionFocus!: EventEmitter; ionBlur!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionChange', 'ionStyle', 'ionFocus', 'ionBlur']); + proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur']); } } proxyInputs(IonRange, ['color', 'mode', 'debounce', 'name', 'dualKnobs', 'min', 'max', 'pin', 'snaps', 'step', 'disabled', 'value']); @@ -767,12 +753,11 @@ export class IonSelect { ionCancel!: EventEmitter; ionFocus!: EventEmitter; ionBlur!: EventEmitter; - ionStyle!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionChange', 'ionCancel', 'ionFocus', 'ionBlur', 'ionStyle']); + proxyOutputs(this, this.el, ['ionChange', 'ionCancel', 'ionFocus', 'ionBlur']); } } proxyMethods(IonSelect, ['open']); @@ -781,28 +766,14 @@ proxyInputs(IonSelect, ['mode', 'disabled', 'cancelText', 'okText', 'placeholder export declare interface IonSelectOption extends StencilComponents<'IonSelectOption'> {} @Component({ selector: 'ion-select-option', changeDetection: 0, template: '', inputs: ['disabled', 'selected', 'value'] }) export class IonSelectOption { - ionSelectOptionDidLoad!: EventEmitter; - ionSelectOptionDidUnload!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionSelectOptionDidLoad', 'ionSelectOptionDidUnload']); } } proxyInputs(IonSelectOption, ['disabled', 'selected', 'value']); -export declare interface IonSelectPopover extends StencilComponents<'IonSelectPopover'> {} -@Component({ selector: 'ion-select-popover', changeDetection: 0, template: '', inputs: ['header', 'subHeader', 'message', 'options'] }) -export class IonSelectPopover { - el: HTMLElement - constructor(c: ChangeDetectorRef, r: ElementRef) { - c.detach(); - this.el = r.nativeElement; - } -} -proxyInputs(IonSelectPopover, ['header', 'subHeader', 'message', 'options']); - export declare interface IonSkeletonText extends StencilComponents<'IonSkeletonText'> {} @Component({ selector: 'ion-skeleton-text', changeDetection: 0, template: '', inputs: ['width'] }) export class IonSkeletonText { @@ -817,12 +788,10 @@ proxyInputs(IonSkeletonText, ['width']); export declare interface IonSlide extends StencilComponents<'IonSlide'> {} @Component({ selector: 'ion-slide', changeDetection: 0, template: '' }) export class IonSlide { - ionSlideChanged!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionSlideChanged']); } } @@ -883,12 +852,10 @@ proxyInputs(IonSplitPane, ['contentId', 'disabled', 'when']); export declare interface IonTabBar extends StencilComponents<'IonTabBar'> {} @Component({ selector: 'ion-tab-bar', changeDetection: 0, template: '', inputs: ['mode', 'color', 'selectedTab', 'translucent'] }) export class IonTabBar { - ionTabBarChanged!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionTabBarChanged']); } } proxyInputs(IonTabBar, ['mode', 'color', 'selectedTab', 'translucent']); @@ -896,12 +863,10 @@ proxyInputs(IonTabBar, ['mode', 'color', 'selectedTab', 'translucent']); export declare interface IonTabButton extends StencilComponents<'IonTabButton'> {} @Component({ selector: 'ion-tab-button', changeDetection: 0, template: '', inputs: ['selected', 'mode', 'layout', 'href', 'tab', 'disabled'] }) export class IonTabButton { - ionTabButtonClick!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionTabButtonClick']); } } proxyInputs(IonTabButton, ['selected', 'mode', 'layout', 'href', 'tab', 'disabled']); @@ -922,14 +887,13 @@ export declare interface IonTextarea extends StencilComponents<'IonTextarea'> {} export class IonTextarea { ionChange!: EventEmitter; ionInput!: EventEmitter; - ionStyle!: EventEmitter; ionBlur!: EventEmitter; ionFocus!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionChange', 'ionInput', 'ionStyle', 'ionBlur', 'ionFocus']); + proxyOutputs(this, this.el, ['ionChange', 'ionInput', 'ionBlur', 'ionFocus']); } } proxyMethods(IonTextarea, ['setFocus']); @@ -962,12 +926,11 @@ export class IonToggle { ionChange!: EventEmitter; ionFocus!: EventEmitter; ionBlur!: EventEmitter; - ionStyle!: EventEmitter; el: HTMLElement constructor(c: ChangeDetectorRef, r: ElementRef) { c.detach(); this.el = r.nativeElement; - proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur', 'ionStyle']); + proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur']); } } proxyInputs(IonToggle, ['mode', 'color', 'name', 'checked', 'disabled', 'value']); diff --git a/angular/src/ionic-module.ts b/angular/src/ionic-module.ts index 2431b34cb3..8adb135eb1 100644 --- a/angular/src/ionic-module.ts +++ b/angular/src/ionic-module.ts @@ -70,7 +70,6 @@ const DECLARATIONS = [ d.IonSegmentButton, d.IonSelect, d.IonSelectOption, - d.IonSelectPopover, d.IonSkeletonText, d.IonSlide, d.IonSlides, diff --git a/core/api.txt b/core/api.txt index 2ee8d45eb7..fccb88c3df 100644 --- a/core/api.txt +++ b/core/api.txt @@ -7,7 +7,7 @@ ion-action-sheet-controller,method,getTop,getTop() => Promise Promise) | undefined,undefined,false,false ion-action-sheet,prop,header,string | undefined,undefined,false,false @@ -620,7 +620,7 @@ ion-modal-controller,method,getTop,getTop() => Promise Promise) | undefined,undefined,false,false @@ -686,8 +686,6 @@ ion-note,prop,color,string | undefined,undefined,false,false ion-note,prop,mode,"ios" | "md",undefined,false,false ion-note,css-prop,--color -ion-picker-column - ion-picker-controller ion-picker-controller,method,create,create(opts: PickerOptions) => Promise ion-picker-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise @@ -735,7 +733,7 @@ ion-popover-controller,method,getTop,getTop() => Promise Promise) | undefined,undefined,false,false @@ -849,12 +847,12 @@ ion-ripple-effect,prop,type,"bounded" | "unbounded",'bounded',false,false ion-ripple-effect,method,addRipple,addRipple(pageX: number, pageY: number) => Promise<() => void> ion-route-redirect -ion-route-redirect,prop,from,string,undefined,false,false -ion-route-redirect,prop,to,null | string | undefined,undefined,false,false +ion-route-redirect,prop,from,string,undefined,true,false +ion-route-redirect,prop,to,null | string | undefined,undefined,true,false ion-route-redirect,event,ionRouteRedirectChanged,void,true ion-route -ion-route,prop,component,string,undefined,false,false +ion-route,prop,component,string,undefined,true,false ion-route,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false ion-route,prop,url,string,'',false,false ion-route,event,ionRouteDataChanged,any,true @@ -952,12 +950,6 @@ ion-select-option,prop,disabled,boolean,false,false,false ion-select-option,prop,selected,boolean,false,false,false ion-select-option,prop,value,any,undefined,false,false -ion-select-popover -ion-select-popover,prop,header,string | undefined,undefined,false,false -ion-select-popover,prop,message,string | undefined,undefined,false,false -ion-select-popover,prop,options,SelectPopoverOption[],[],false,false -ion-select-popover,prop,subHeader,string | undefined,undefined,false,false - ion-select ion-select,prop,cancelText,string,'Cancel',false,false ion-select,prop,disabled,boolean,false,false,false @@ -1067,7 +1059,7 @@ ion-tab-button,css-prop,--ripple-color ion-tab ion-tab,prop,component,Function | HTMLElement | null | string | undefined,undefined,false,false -ion-tab,prop,tab,string,undefined,false,false +ion-tab,prop,tab,string,undefined,true,false ion-tab,method,setActive,setActive() => Promise ion-tabs diff --git a/core/package.json b/core/package.json index 3170cb402b..5fe5fa351f 100644 --- a/core/package.json +++ b/core/package.json @@ -30,7 +30,7 @@ "ionicons": "4.5.1" }, "devDependencies": { - "@stencil/core": "0.16.2-1", + "@stencil/core": "0.16.2-2", "@stencil/sass": "0.1.1", "@stencil/utils": "latest", "@types/jest": "^23.3.1", diff --git a/core/src/components.d.ts b/core/src/components.d.ts index 53f2d3879a..b031a13eb8 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -213,7 +213,6 @@ export namespace Components { * Emitted before the alert has presented. */ 'onIonActionSheetWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * Subtitle for the action sheet. */ @@ -372,7 +371,6 @@ export namespace Components { * Emitted before the alert has presented. */ 'onIonAlertWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * The subtitle in the heading of the alert. Displayed under the title. */ @@ -794,10 +792,6 @@ export namespace Components { */ 'onIonFocus'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * The value of the toggle does not mean if it's checked or not, use the `checked` property for that. The value of a toggle is analogous to the value of a ``, it's only used when the toggle participates in a native `
`. */ 'value'?: string; @@ -1286,10 +1280,6 @@ export namespace Components { */ 'onIonFocus'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * The format of the date and time picker columns the user selects. A datetime input can have one or many datetime parts, each getting their own column which allow individual selection of that particular datetime part. For example, year and month columns are two individually selectable columns which help choose an exact date from the datetime picker. Each column follows the string parse format. Defaults to use `displayFormat`. */ 'pickerFormat'?: string; @@ -1808,18 +1798,6 @@ export namespace Components { */ 'onIonInput'?: (event: CustomEvent) => void; /** - * Emitted when the input has been created. - */ - 'onIonInputDidLoad'?: (event: CustomEvent) => void; - /** - * Emitted when the input has been removed. - */ - 'onIonInputDidUnload'?: (event: CustomEvent) => void; - /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * A regular expression that the value is checked against. The pattern must match the entire value, not just some subset. Use the title attribute to describe the pattern to help the user. This attribute applies when the value of the type attribute is `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored. */ 'pattern'?: string; @@ -2094,10 +2072,6 @@ export namespace Components { */ 'mode'?: Mode; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * The position determines where and how the label behaves inside an item. */ 'position'?: 'fixed' | 'stacked' | 'floating'; @@ -2293,7 +2267,6 @@ export namespace Components { * Emitted before the loading has presented. */ 'onIonLoadingWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * If `true`, a backdrop will be displayed behind the loading indicator. */ @@ -2499,10 +2472,6 @@ export namespace Components { */ 'onIonDidOpen'?: (event: CustomEvent) => void; /** - * Emitted when the menu state is changed. - */ - 'onIonMenuChange'?: (event: CustomEvent) => void; - /** * Emitted when the menu is about to be closed. */ 'onIonWillClose'?: (event: CustomEvent) => void; @@ -2621,7 +2590,6 @@ export namespace Components { * Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. */ 'cssClass'?: string | string[]; - 'delegate'?: FrameworkDelegate; /** * Animation to use when the modal is presented. */ @@ -2654,7 +2622,6 @@ export namespace Components { * Emitted before the modal has presented. */ 'onIonModalWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * If `true`, a backdrop will be displayed behind the modal. */ @@ -2792,7 +2759,6 @@ export namespace Components { * By default `ion-nav` animates transition between pages based in the mode (ios or material design). However, this property allows to create custom transition using `AnimateBuilder` functions. */ 'animation'?: AnimationBuilder; - 'delegate'?: FrameworkDelegate; /** * Event fired when the nav has changed components */ @@ -2841,9 +2807,15 @@ export namespace Components { } interface IonPickerColumn { + /** + * Picker column data + */ 'col': PickerColumn; } interface IonPickerColumnAttributes extends StencilHTMLAttributes { + /** + * Picker column data + */ 'col': PickerColumn; } @@ -2987,7 +2959,6 @@ export namespace Components { * Emitted before the picker has presented. */ 'onIonPickerWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * If `true`, a backdrop will be displayed behind the picker. */ @@ -3099,7 +3070,6 @@ export namespace Components { * Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. */ 'cssClass'?: string | string[]; - 'delegate'?: FrameworkDelegate; /** * Animation to use when the popover is presented. */ @@ -3136,7 +3106,6 @@ export namespace Components { * Emitted before the popover has presented. */ 'onIonPopoverWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * If `true`, a backdrop will be displayed behind the popover. */ @@ -3285,30 +3254,14 @@ export namespace Components { */ 'onIonBlur'?: (event: CustomEvent) => void; /** - * Emitted when checked radio button is selected. - */ - 'onIonDeselect'?: (event: CustomEvent) => void; - /** * Emitted when the radio button has focus. */ 'onIonFocus'?: (event: CustomEvent) => void; /** - * Emitted when the radio loads. - */ - 'onIonRadioDidLoad'?: (event: CustomEvent) => void; - /** - * Emitted when the radio unloads. - */ - 'onIonRadioDidUnload'?: (event: CustomEvent) => void; - /** * Emitted when the radio button is selected. */ 'onIonSelect'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * the value of the radio. */ 'value'?: any | null; @@ -3410,10 +3363,6 @@ export namespace Components { */ 'onIonFocus'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * If `true`, a pin with integer value is shown when the knob is pressed. */ 'pin'?: boolean; @@ -3661,12 +3610,6 @@ export namespace Components { * By default `ion-nav` animates transition between pages based in the mode (ios or material design). However, this property allows to create custom transition using `AnimateBuilder` functions. */ 'animation'?: AnimationBuilder; - 'delegate'?: FrameworkDelegate; - 'mode'?: Mode; - 'onIonNavDidChange'?: (event: CustomEvent) => void; - 'onIonNavWillChange'?: (event: CustomEvent) => void; - 'onIonNavWillLoad'?: (event: CustomEvent) => void; - 'swipeHandler'?: SwipeGestureHandler; } interface IonRouter { @@ -3986,14 +3929,6 @@ export namespace Components { */ 'disabled'?: boolean; /** - * Emitted when the select option loads. - */ - 'onIonSelectOptionDidLoad'?: (event: CustomEvent) => void; - /** - * Emitted when the select option unloads. - */ - 'onIonSelectOptionDidUnload'?: (event: CustomEvent) => void; - /** * If `true`, the element is selected. */ 'selected'?: boolean; @@ -4140,10 +4075,6 @@ export namespace Components { */ 'onIonFocus'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * The text to display when the select is empty. */ 'placeholder'?: string | null; @@ -4171,9 +4102,7 @@ export namespace Components { } interface IonSlide {} - interface IonSlideAttributes extends StencilHTMLAttributes { - 'onIonSlideChanged'?: (event: CustomEvent) => void; - } + interface IonSlideAttributes extends StencilHTMLAttributes {} interface IonSlides { /** @@ -4433,7 +4362,6 @@ export namespace Components { * The mode determines which platform styles to use. */ 'mode'?: Mode; - 'onIonTabBarChanged'?: (event: CustomEvent) => void; /** * The selected tab component */ @@ -4488,10 +4416,6 @@ export namespace Components { */ 'mode'?: Mode; /** - * Emitted when the tab bar is clicked - */ - 'onIonTabButtonClick'?: (event: CustomEvent) => void; - /** * The selected tab component */ 'selected'?: boolean; @@ -4518,12 +4442,10 @@ export namespace Components { 'tab': string; } interface IonTabAttributes extends StencilHTMLAttributes { - 'active'?: boolean; /** * The component to display inside of the tab. */ 'component'?: ComponentRef; - 'delegate'?: FrameworkDelegate; /** * A tab id must be provided for each `ion-tab`. It's used internally to reference the selected tab or by the router to switch between them. */ @@ -4564,7 +4486,6 @@ export namespace Components { * Emitted when the navigation will load a component. */ 'onIonNavWillLoad'?: (event: CustomEvent) => void; - 'useRouter'?: boolean; } interface IonText { @@ -4728,10 +4649,6 @@ export namespace Components { */ 'onIonInput'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * Instructional text that shows before the input has a value. */ 'placeholder'?: string | null; @@ -4921,7 +4838,6 @@ export namespace Components { * Emitted before the toast has presented. */ 'onIonToastWillPresent'?: (event: CustomEvent) => void; - 'overlayIndex': number; /** * The position of the toast on the screen. */ @@ -4996,10 +4912,6 @@ export namespace Components { */ 'onIonFocus'?: (event: CustomEvent) => void; /** - * Emitted when the styles change. - */ - 'onIonStyle'?: (event: CustomEvent) => void; - /** * The value of the toggle does not mean if it's checked or not, use the `checked` property for that. The value of a toggle is analogous to the value of a ``, it's only used when the toggle participates in a native ``. */ 'value'?: string | null; @@ -5098,7 +5010,6 @@ export namespace Components { * It is important to provide this if virtual item height will be significantly larger than the default The approximate height of each virtual item template's cell. This dimension is used to help determine how many cells should be created when initialized, and to help calculate the height of the scrollable area. This height value can only use `px` units. Note that the actual rendered size of each cell comes from the app's CSS, whereas this approximation is used to help calculate initial dimensions before the item has been rendered. */ 'approxItemHeight'?: number; - 'domRender'?: DomRenderFn; /** * Section footers and the data used within its given template can be dynamically created by passing a function to `footerFn`. The logic within the footer function can decide if the footer template should be used, and what data to give to the footer template. The function must return `null` if a footer cell shouldn't be created. */ diff --git a/core/src/components/action-sheet/readme.md b/core/src/components/action-sheet/readme.md index e5e5f9aa0e..948ce96159 100644 --- a/core/src/components/action-sheet/readme.md +++ b/core/src/components/action-sheet/readme.md @@ -126,19 +126,19 @@ async function presentActionSheet() { ## Properties -| Property | Attribute | Description | Type | Default | -| ----------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------- | -| `animated` | `animated` | If `true`, the action sheet will animate. | `boolean` | `true` | -| `backdropDismiss` | `backdrop-dismiss` | If `true`, the action sheet will be dismissed when the backdrop is clicked. | `boolean` | `true` | -| `buttons` | -- | An array of buttons for the action sheet. | `(string \| ActionSheetButton)[]` | `undefined` | -| `cssClass` | `css-class` | Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. | `string \| string[] \| undefined` | `undefined` | -| `enterAnimation` | -- | Animation to use when the action sheet is presented. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | -| `header` | `header` | Title for the action sheet. | `string \| undefined` | `undefined` | -| `keyboardClose` | `keyboard-close` | If `true`, the keyboard will be automatically dismissed when the overlay is presented. | `boolean` | `true` | -| `leaveAnimation` | -- | Animation to use when the action sheet is dismissed. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | -| `mode` | `mode` | The mode determines which platform styles to use. | `"ios" \| "md"` | `undefined` | -| `subHeader` | `sub-header` | Subtitle for the action sheet. | `string \| undefined` | `undefined` | -| `translucent` | `translucent` | If `true`, the action sheet will be translucent. | `boolean` | `false` | +| Property | Attribute | Description | Type | Default | +| ---------------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------- | +| `animated` | `animated` | If `true`, the action sheet will animate. | `boolean` | `true` | +| `backdropDismiss` | `backdrop-dismiss` | If `true`, the action sheet will be dismissed when the backdrop is clicked. | `boolean` | `true` | +| `buttons` _(required)_ | -- | An array of buttons for the action sheet. | `(string \| ActionSheetButton)[]` | `undefined` | +| `cssClass` | `css-class` | Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. | `string \| string[] \| undefined` | `undefined` | +| `enterAnimation` | -- | Animation to use when the action sheet is presented. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | +| `header` | `header` | Title for the action sheet. | `string \| undefined` | `undefined` | +| `keyboardClose` | `keyboard-close` | If `true`, the keyboard will be automatically dismissed when the overlay is presented. | `boolean` | `true` | +| `leaveAnimation` | -- | Animation to use when the action sheet is dismissed. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | +| `mode` | `mode` | The mode determines which platform styles to use. | `"ios" \| "md"` | `undefined` | +| `subHeader` | `sub-header` | Subtitle for the action sheet. | `string \| undefined` | `undefined` | +| `translucent` | `translucent` | If `true`, the action sheet will be translucent. | `boolean` | `false` | ## Events diff --git a/core/src/components/modal/readme.md b/core/src/components/modal/readme.md index df43b57e8d..1b4187b986 100644 --- a/core/src/components/modal/readme.md +++ b/core/src/components/modal/readme.md @@ -143,18 +143,18 @@ async function presentModal() { ## Properties -| Property | Attribute | Description | Type | Default | -| ----------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------- | -| `animated` | `animated` | If `true`, the modal will animate. | `boolean` | `true` | -| `backdropDismiss` | `backdrop-dismiss` | If `true`, the modal will be dismissed when the backdrop is clicked. | `boolean` | `true` | -| `component` | `component` | The component to display inside of the modal. | `Function \| HTMLElement \| null \| string` | `undefined` | -| `componentProps` | -- | The data to pass to the modal component. | `undefined \| { [key: string]: any; }` | `undefined` | -| `cssClass` | `css-class` | Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. | `string \| string[] \| undefined` | `undefined` | -| `enterAnimation` | -- | Animation to use when the modal is presented. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | -| `keyboardClose` | `keyboard-close` | If `true`, the keyboard will be automatically dismissed when the overlay is presented. | `boolean` | `true` | -| `leaveAnimation` | -- | Animation to use when the modal is dismissed. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | -| `mode` | `mode` | The mode determines which platform styles to use. | `"ios" \| "md"` | `undefined` | -| `showBackdrop` | `show-backdrop` | If `true`, a backdrop will be displayed behind the modal. | `boolean` | `true` | +| Property | Attribute | Description | Type | Default | +| ------------------------ | ------------------ | ---------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------- | +| `animated` | `animated` | If `true`, the modal will animate. | `boolean` | `true` | +| `backdropDismiss` | `backdrop-dismiss` | If `true`, the modal will be dismissed when the backdrop is clicked. | `boolean` | `true` | +| `component` _(required)_ | `component` | The component to display inside of the modal. | `Function \| HTMLElement \| null \| string` | `undefined` | +| `componentProps` | -- | The data to pass to the modal component. | `undefined \| { [key: string]: any; }` | `undefined` | +| `cssClass` | `css-class` | Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. | `string \| string[] \| undefined` | `undefined` | +| `enterAnimation` | -- | Animation to use when the modal is presented. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | +| `keyboardClose` | `keyboard-close` | If `true`, the keyboard will be automatically dismissed when the overlay is presented. | `boolean` | `true` | +| `leaveAnimation` | -- | Animation to use when the modal is dismissed. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | +| `mode` | `mode` | The mode determines which platform styles to use. | `"ios" \| "md"` | `undefined` | +| `showBackdrop` | `show-backdrop` | If `true`, a backdrop will be displayed behind the modal. | `boolean` | `true` | ## Events diff --git a/core/src/components/picker-column/picker-column.tsx b/core/src/components/picker-column/picker-column.tsx index 0542d45c75..7039133f02 100644 --- a/core/src/components/picker-column/picker-column.tsx +++ b/core/src/components/picker-column/picker-column.tsx @@ -4,6 +4,9 @@ import { Gesture, GestureDetail, Mode, PickerColumn } from '../../interface'; import { hapticSelectionChanged } from '../../utils/haptic'; import { clamp } from '../../utils/helpers'; +/** + * @internal + */ @Component({ tag: 'ion-picker-column', styleUrls: { @@ -33,7 +36,7 @@ export class PickerColumnCmp implements ComponentInterface { @Prop({ context: 'queue' }) queue!: QueueApi; - /** @internal */ + /** Picker column data */ @Prop() col!: PickerColumn; componentWillLoad() { diff --git a/core/src/components/picker-column/readme.md b/core/src/components/picker-column/readme.md index 26a41798f7..f82f725aad 100644 --- a/core/src/components/picker-column/readme.md +++ b/core/src/components/picker-column/readme.md @@ -5,6 +5,13 @@ +## Properties + +| Property | Attribute | Description | Type | Default | +| ------------------ | --------- | ------------------ | -------------- | ----------- | +| `col` _(required)_ | -- | Picker column data | `PickerColumn` | `undefined` | + + ---------------------------------------------- *Built with [StencilJS](https://stenciljs.com/)* diff --git a/core/src/components/picker-controller/picker-controller.tsx b/core/src/components/picker-controller/picker-controller.tsx index 4d6548cb6b..0acc56ccf7 100644 --- a/core/src/components/picker-controller/picker-controller.tsx +++ b/core/src/components/picker-controller/picker-controller.tsx @@ -3,7 +3,6 @@ import { Component, ComponentInterface, Method, Prop } from '@stencil/core'; import { OverlayController, PickerOptions } from '../../interface'; import { createOverlay, dismissOverlay, getOverlay } from '../../utils/overlays'; -/** @internal */ @Component({ tag: 'ion-picker-controller' }) diff --git a/core/src/components/popover/readme.md b/core/src/components/popover/readme.md index 5f5becc3a1..2ef57e46fd 100644 --- a/core/src/components/popover/readme.md +++ b/core/src/components/popover/readme.md @@ -63,20 +63,20 @@ async function presentPopover(ev) { ## Properties -| Property | Attribute | Description | Type | Default | -| ----------------- | ------------------ | ---------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------- | -| `animated` | `animated` | If `true`, the popover will animate. | `boolean` | `true` | -| `backdropDismiss` | `backdrop-dismiss` | If `true`, the popover will be dismissed when the backdrop is clicked. | `boolean` | `true` | -| `component` | `component` | The component to display inside of the popover. | `Function \| HTMLElement \| null \| string` | `undefined` | -| `componentProps` | -- | The data to pass to the popover component. | `undefined \| { [key: string]: any; }` | `undefined` | -| `cssClass` | `css-class` | Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. | `string \| string[] \| undefined` | `undefined` | -| `enterAnimation` | -- | Animation to use when the popover is presented. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | -| `event` | `event` | The event to pass to the popover animation. | `any` | `undefined` | -| `keyboardClose` | `keyboard-close` | If `true`, the keyboard will be automatically dismissed when the overlay is presented. | `boolean` | `true` | -| `leaveAnimation` | -- | Animation to use when the popover is dismissed. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | -| `mode` | `mode` | The mode determines which platform styles to use. | `"ios" \| "md"` | `undefined` | -| `showBackdrop` | `show-backdrop` | If `true`, a backdrop will be displayed behind the popover. | `boolean` | `true` | -| `translucent` | `translucent` | If `true`, the popover will be translucent. | `boolean` | `false` | +| Property | Attribute | Description | Type | Default | +| ------------------------ | ------------------ | ---------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- | ----------- | +| `animated` | `animated` | If `true`, the popover will animate. | `boolean` | `true` | +| `backdropDismiss` | `backdrop-dismiss` | If `true`, the popover will be dismissed when the backdrop is clicked. | `boolean` | `true` | +| `component` _(required)_ | `component` | The component to display inside of the popover. | `Function \| HTMLElement \| null \| string` | `undefined` | +| `componentProps` | -- | The data to pass to the popover component. | `undefined \| { [key: string]: any; }` | `undefined` | +| `cssClass` | `css-class` | Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces. | `string \| string[] \| undefined` | `undefined` | +| `enterAnimation` | -- | Animation to use when the popover is presented. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | +| `event` | `event` | The event to pass to the popover animation. | `any` | `undefined` | +| `keyboardClose` | `keyboard-close` | If `true`, the keyboard will be automatically dismissed when the overlay is presented. | `boolean` | `true` | +| `leaveAnimation` | -- | Animation to use when the popover is dismissed. | `((Animation: Animation, baseEl: any, opts?: any) => Promise) \| undefined` | `undefined` | +| `mode` | `mode` | The mode determines which platform styles to use. | `"ios" \| "md"` | `undefined` | +| `showBackdrop` | `show-backdrop` | If `true`, a backdrop will be displayed behind the popover. | `boolean` | `true` | +| `translucent` | `translucent` | If `true`, the popover will be translucent. | `boolean` | `false` | ## Events diff --git a/core/src/components/route-redirect/readme.md b/core/src/components/route-redirect/readme.md index ddd3c4dda5..f915c7481c 100644 --- a/core/src/components/route-redirect/readme.md +++ b/core/src/components/route-redirect/readme.md @@ -71,10 +71,10 @@ Another approach is to modify the value of `to`, since given `to` the value of ` ## Properties -| Property | Attribute | Description | Type | Default | -| -------- | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------- | ----------- | -| `from` | `from` | A redirect route, redirects "from" a URL "to" another URL. This property is that "from" URL. It needs to be an exact match of the navigated URL in order to apply. The path specified in this value is always an absolute path, even if the initial `/` slash is not specified. | `string` | `undefined` | -| `to` | `to` | A redirect route, redirects "from" a URL "to" another URL. This property is that "to" URL. When the defined `ion-route-redirect` rule matches, the router will redirect to the path specified in this property. The value of this property is always an absolute path inside the scope of routes defined in `ion-router` it can't be used with another router or to perform a redirection to a different domain. Note that this is a virtual redirect, it will not cause a real browser refresh, again, it's a redirect inside the context of ion-router. When this property is not specified or his value is `undefined` the whole redirect route is noop, even if the "from" value matches. | `null \| string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ------------------- | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------- | ----------- | +| `from` _(required)_ | `from` | A redirect route, redirects "from" a URL "to" another URL. This property is that "from" URL. It needs to be an exact match of the navigated URL in order to apply. The path specified in this value is always an absolute path, even if the initial `/` slash is not specified. | `string` | `undefined` | +| `to` _(required)_ | `to` | A redirect route, redirects "from" a URL "to" another URL. This property is that "to" URL. When the defined `ion-route-redirect` rule matches, the router will redirect to the path specified in this property. The value of this property is always an absolute path inside the scope of routes defined in `ion-router` it can't be used with another router or to perform a redirection to a different domain. Note that this is a virtual redirect, it will not cause a real browser refresh, again, it's a redirect inside the context of ion-router. When this property is not specified or his value is `undefined` the whole redirect route is noop, even if the "from" value matches. | `null \| string \| undefined` | `undefined` | ## Events diff --git a/core/src/components/route/readme.md b/core/src/components/route/readme.md index e5e3b9fc4f..0176bd0b21 100644 --- a/core/src/components/route/readme.md +++ b/core/src/components/route/readme.md @@ -9,11 +9,11 @@ Router is a component that can take a component, and render it when the Browser ## Properties -| Property | Attribute | Description | Type | Default | -| ---------------- | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------- | ----------- | -| `component` | `component` | Name of the component to load/select in the navigation outlet (`ion-tabs`, `ion-nav`) when the route matches. The value of this property is not always the tagname of the component to load, in `ion-tabs` it actually refers to the name of the `ion-tab` to select. | `string` | `undefined` | -| `componentProps` | -- | A key value `{ 'red': true, 'blue': 'white'}` containing props that should be passed to the defined component when rendered. | `undefined \| { [key: string]: any; }` | `undefined` | -| `url` | `url` | Relative path that needs to match in order for this route to apply. Accepts paths similar to expressjs so that you can define parameters in the url /foo/:bar where bar would be available in incoming props. | `string` | `''` | +| Property | Attribute | Description | Type | Default | +| ------------------------ | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------- | ----------- | +| `component` _(required)_ | `component` | Name of the component to load/select in the navigation outlet (`ion-tabs`, `ion-nav`) when the route matches. The value of this property is not always the tagname of the component to load, in `ion-tabs` it actually refers to the name of the `ion-tab` to select. | `string` | `undefined` | +| `componentProps` | -- | A key value `{ 'red': true, 'blue': 'white'}` containing props that should be passed to the defined component when rendered. | `undefined \| { [key: string]: any; }` | `undefined` | +| `url` | `url` | Relative path that needs to match in order for this route to apply. Accepts paths similar to expressjs so that you can define parameters in the url /foo/:bar where bar would be available in incoming props. | `string` | `''` | ## Events diff --git a/core/src/components/select-popover/select-popover.tsx b/core/src/components/select-popover/select-popover.tsx index 60bd712504..f167fe425c 100644 --- a/core/src/components/select-popover/select-popover.tsx +++ b/core/src/components/select-popover/select-popover.tsx @@ -2,6 +2,9 @@ import { Component, ComponentInterface, Listen, Prop } from '@stencil/core'; import { Mode, SelectPopoverOption } from '../../interface'; +/** + * @internal + */ @Component({ tag: 'ion-select-popover', styleUrl: 'select-popover.scss', diff --git a/core/src/components/tab/readme.md b/core/src/components/tab/readme.md index 17155f18e2..2116148286 100644 --- a/core/src/components/tab/readme.md +++ b/core/src/components/tab/readme.md @@ -10,10 +10,10 @@ See the [tabs documentation](../tabs/) for more details on configuring tabs. ## Properties -| Property | Attribute | Description | Type | Default | -| ----------- | ----------- | ----------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------- | ----------- | -| `component` | `component` | The component to display inside of the tab. | `Function \| HTMLElement \| null \| string \| undefined` | `undefined` | -| `tab` | `tab` | A tab id must be provided for each `ion-tab`. It's used internally to reference the selected tab or by the router to switch between them. | `string` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ------------------ | ----------- | ----------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------- | ----------- | +| `component` | `component` | The component to display inside of the tab. | `Function \| HTMLElement \| null \| string \| undefined` | `undefined` | +| `tab` _(required)_ | `tab` | A tab id must be provided for each `ion-tab`. It's used internally to reference the selected tab or by the router to switch between them. | `string` | `undefined` | ## Methods