chore(): update stencil (#16921)

* chore(): update stencil

* fix angular
This commit is contained in:
Manu MA
2018-12-31 17:35:33 +01:00
committed by GitHub
parent 09726b0d35
commit cda2573fdd
16 changed files with 93 additions and 217 deletions

View File

@ -62,7 +62,6 @@ export const DIRECTIVES = [
d.IonSegmentButton,
d.IonSelect,
d.IonSelectOption,
d.IonSelectPopover,
d.IonSkeletonText,
d.IonSlide,
d.IonSlides,

View File

@ -171,12 +171,11 @@ export class IonCheckbox {
ionChange!: EventEmitter<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
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<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
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<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionInputDidLoad!: EventEmitter<CustomEvent>;
ionInputDidUnload!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', inputs: ['color', 'mode', 'position'] })
export class IonLabel {
ionStyle!: EventEmitter<CustomEvent>;
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<CustomEvent>;
ionDidOpen!: EventEmitter<CustomEvent>;
ionDidClose!: EventEmitter<CustomEvent>;
ionMenuChange!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', inputs: ['delegate', 'swipeGesture', 'animated', 'animation', 'rootParams', 'root'] })
@Component({ selector: 'ion-nav', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['swipeGesture', 'animated', 'animation', 'rootParams', 'root'] })
export class IonNav {
ionNavWillLoad!: EventEmitter<CustomEvent>;
ionNavWillChange!: EventEmitter<CustomEvent>;
@ -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: '<ng-content></ng-content>' })
@ -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: '<ng-content></ng-content>', inputs: ['color', 'mode', 'name', 'disabled', 'checked', 'value'] })
export class IonRadio {
ionRadioDidLoad!: EventEmitter<CustomEvent>;
ionRadioDidUnload!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
ionSelect!: EventEmitter<CustomEvent>;
ionDeselect!: EventEmitter<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', inputs: ['color', 'mode', 'debounce', 'name', 'dualKnobs', 'min', 'max', 'pin', 'snaps', 'step', 'disabled', 'value'] })
export class IonRange {
ionChange!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
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<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', inputs: ['disabled', 'selected', 'value'] })
export class IonSelectOption {
ionSelectOptionDidLoad!: EventEmitter<CustomEvent>;
ionSelectOptionDidUnload!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', 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: '<ng-content></ng-content>', 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: '<ng-content></ng-content>' })
export class IonSlide {
ionSlideChanged!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', inputs: ['mode', 'color', 'selectedTab', 'translucent'] })
export class IonTabBar {
ionTabBarChanged!: EventEmitter<CustomEvent>;
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: '<ng-content></ng-content>', inputs: ['selected', 'mode', 'layout', 'href', 'tab', 'disabled'] })
export class IonTabButton {
ionTabButtonClick!: EventEmitter<CustomEvent>;
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<CustomEvent>;
ionInput!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
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<CustomEvent>;
ionFocus!: EventEmitter<CustomEvent>;
ionBlur!: EventEmitter<CustomEvent>;
ionStyle!: EventEmitter<CustomEvent>;
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']);

View File

@ -70,7 +70,6 @@ const DECLARATIONS = [
d.IonSegmentButton,
d.IonSelect,
d.IonSelectOption,
d.IonSelectPopover,
d.IonSkeletonText,
d.IonSlide,
d.IonSlides,

View File

@ -7,7 +7,7 @@ ion-action-sheet-controller,method,getTop,getTop() => Promise<HTMLIonActionSheet
ion-action-sheet
ion-action-sheet,prop,animated,boolean,true,false,false
ion-action-sheet,prop,backdropDismiss,boolean,true,false,false
ion-action-sheet,prop,buttons,(string | ActionSheetButton)[],undefined,false,false
ion-action-sheet,prop,buttons,(string | ActionSheetButton)[],undefined,true,false
ion-action-sheet,prop,cssClass,string | string[] | undefined,undefined,false,false
ion-action-sheet,prop,enterAnimation,((Animation: Animation, baseEl: any, opts?: any) => Promise<Animation>) | 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<HTMLIonModalElement | und
ion-modal
ion-modal,prop,animated,boolean,true,false,false
ion-modal,prop,backdropDismiss,boolean,true,false,false
ion-modal,prop,component,Function | HTMLElement | null | string,undefined,false,false
ion-modal,prop,component,Function | HTMLElement | null | string,undefined,true,false
ion-modal,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
ion-modal,prop,cssClass,string | string[] | undefined,undefined,false,false
ion-modal,prop,enterAnimation,((Animation: Animation, baseEl: any, opts?: any) => Promise<Animation>) | 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<HTMLIonPickerElement>
ion-picker-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
@ -735,7 +733,7 @@ ion-popover-controller,method,getTop,getTop() => Promise<HTMLIonPopoverElement |
ion-popover
ion-popover,prop,animated,boolean,true,false,false
ion-popover,prop,backdropDismiss,boolean,true,false,false
ion-popover,prop,component,Function | HTMLElement | null | string,undefined,false,false
ion-popover,prop,component,Function | HTMLElement | null | string,undefined,true,false
ion-popover,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
ion-popover,prop,cssClass,string | string[] | undefined,undefined,false,false
ion-popover,prop,enterAnimation,((Animation: Animation, baseEl: any, opts?: any) => Promise<Animation>) | 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<void>
ion-tabs

View File

@ -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",

View File

@ -213,7 +213,6 @@ export namespace Components {
* Emitted before the alert has presented.
*/
'onIonActionSheetWillPresent'?: (event: CustomEvent<void>) => 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>) => 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>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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 `<input type="checkbox">`, it's only used when the toggle participates in a native `<form>`.
*/
'value'?: string;
@ -1286,10 +1280,6 @@ export namespace Components {
*/
'onIonFocus'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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<KeyboardEvent>) => void;
/**
* Emitted when the input has been created.
*/
'onIonInputDidLoad'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the input has been removed.
*/
'onIonInputDidUnload'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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<StyleEventDetail>) => 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>) => 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>) => void;
/**
* Emitted when the menu state is changed.
*/
'onIonMenuChange'?: (event: CustomEvent<MenuChangeEventDetail>) => void;
/**
* Emitted when the menu is about to be closed.
*/
'onIonWillClose'?: (event: CustomEvent<void>) => 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>) => 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>) => 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>) => void;
'overlayIndex': number;
/**
* If `true`, a backdrop will be displayed behind the popover.
*/
@ -3285,30 +3254,14 @@ export namespace Components {
*/
'onIonBlur'?: (event: CustomEvent<void>) => void;
/**
* Emitted when checked radio button is selected.
*/
'onIonDeselect'?: (event: CustomEvent<RadioChangeEventDetail>) => void;
/**
* Emitted when the radio button has focus.
*/
'onIonFocus'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the radio loads.
*/
'onIonRadioDidLoad'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the radio unloads.
*/
'onIonRadioDidUnload'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the radio button is selected.
*/
'onIonSelect'?: (event: CustomEvent<RadioChangeEventDetail>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => void;
/**
* the value of the radio.
*/
'value'?: any | null;
@ -3410,10 +3363,6 @@ export namespace Components {
*/
'onIonFocus'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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>) => void;
'onIonNavWillChange'?: (event: CustomEvent<void>) => void;
'onIonNavWillLoad'?: (event: CustomEvent<void>) => void;
'swipeHandler'?: SwipeGestureHandler;
}
interface IonRouter {
@ -3986,14 +3929,6 @@ export namespace Components {
*/
'disabled'?: boolean;
/**
* Emitted when the select option loads.
*/
'onIonSelectOptionDidLoad'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the select option unloads.
*/
'onIonSelectOptionDidUnload'?: (event: CustomEvent<void>) => void;
/**
* If `true`, the element is selected.
*/
'selected'?: boolean;
@ -4140,10 +4075,6 @@ export namespace Components {
*/
'onIonFocus'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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>) => 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<TabBarChangedEventDetail>) => void;
/**
* The selected tab component
*/
@ -4488,10 +4416,6 @@ export namespace Components {
*/
'mode'?: Mode;
/**
* Emitted when the tab bar is clicked
*/
'onIonTabButtonClick'?: (event: CustomEvent<TabButtonClickEventDetail>) => 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>) => void;
'useRouter'?: boolean;
}
interface IonText {
@ -4728,10 +4649,6 @@ export namespace Components {
*/
'onIonInput'?: (event: CustomEvent<KeyboardEvent>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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>) => void;
'overlayIndex': number;
/**
* The position of the toast on the screen.
*/
@ -4996,10 +4912,6 @@ export namespace Components {
*/
'onIonFocus'?: (event: CustomEvent<void>) => void;
/**
* Emitted when the styles change.
*/
'onIonStyle'?: (event: CustomEvent<StyleEventDetail>) => 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 `<input type="checkbox">`, it's only used when the toggle participates in a native `<form>`.
*/
'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.
*/

View File

@ -127,10 +127,10 @@ 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` |
| `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<Animation>) \| undefined` | `undefined` |
| `header` | `header` | Title for the action sheet. | `string \| undefined` | `undefined` |

View File

@ -144,10 +144,10 @@ 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` |
| `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<Animation>) \| undefined` | `undefined` |

View File

@ -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() {

View File

@ -5,6 +5,13 @@
<!-- Auto Generated Below -->
## Properties
| Property | Attribute | Description | Type | Default |
| ------------------ | --------- | ------------------ | -------------- | ----------- |
| `col` _(required)_ | -- | Picker column data | `PickerColumn` | `undefined` |
----------------------------------------------
*Built with [StencilJS](https://stenciljs.com/)*

View File

@ -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'
})

View File

@ -64,10 +64,10 @@ 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` |
| `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<Animation>) \| undefined` | `undefined` |

View File

@ -72,9 +72,9 @@ 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` |
| ------------------- | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------- | ----------- |
| `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

View File

@ -10,8 +10,8 @@ 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` |
| ------------------------ | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------- | ----------- |
| `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` | `''` |

View File

@ -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',

View File

@ -11,9 +11,9 @@ 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` |
| `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