fix(): update to Stencil One 🎉🎊
This commit is contained in:
Manu MA
GitHub
parent
7f1829eb21
commit
b40f7d36d5
|
|
@ -15,6 +15,7 @@ log.txt
|
|||
coverage/
|
||||
collection/
|
||||
dist/
|
||||
dist-transpiled/
|
||||
node_modules/
|
||||
tmp/
|
||||
temp/
|
||||
|
|
@ -49,10 +50,16 @@ demos/src/**/*.ngfactory.ts
|
|||
demos/src/**/*.d.ts
|
||||
demos/src/**/*.metadata.json
|
||||
demos/src/**/*.css.shim.ts
|
||||
prerender.html
|
||||
prerender-domino.html
|
||||
prerender-hydrated.html
|
||||
prerender-static.html
|
||||
|
||||
# stencil
|
||||
angular/css/
|
||||
core/css/
|
||||
core/hydrated/
|
||||
core/loader/
|
||||
core/www/
|
||||
.stencil/
|
||||
angular/build/
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ const fs = require('fs-extra');
|
|||
|
||||
const common = require('./common');
|
||||
|
||||
const DIST_NPM_TAG = 'dev';
|
||||
const DIST_TAG = 'dev';
|
||||
|
||||
async function main() {
|
||||
|
|
@ -37,7 +38,7 @@ async function main() {
|
|||
packages.forEach(package => {
|
||||
common.prepareDevPackage(tasks, package, devVersion);
|
||||
});
|
||||
common.publishPackages(tasks, packages, devVersion, DIST_TAG);
|
||||
common.publishPackages(tasks, packages, devVersion, DIST_NPM_TAG);
|
||||
|
||||
const listr = new Listr(tasks);
|
||||
await listr.run();
|
||||
|
|
|
|||
|
|
@ -7,10 +7,6 @@ export default {
|
|||
format: 'es'
|
||||
},
|
||||
external: (id) => {
|
||||
// inline @ionic/core deps
|
||||
if (id === '@ionic/core') {
|
||||
return false;
|
||||
}
|
||||
// anything else is external
|
||||
// Windows: C:\xxxxxx\xxx
|
||||
const colonPosition = 1;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { defineCustomElements } from '@ionic/core/loader';
|
||||
import { applyPolyfills, defineCustomElements } from '@ionic/core/loader';
|
||||
|
||||
import { Config } from './providers/config';
|
||||
import { IonicWindow } from './types/interfaces';
|
||||
|
|
@ -10,26 +10,27 @@ export function appInitialize(config: Config, doc: Document) {
|
|||
const Ionic = win.Ionic = win.Ionic || {};
|
||||
|
||||
Ionic.config = config;
|
||||
Ionic.asyncQueue = false;
|
||||
|
||||
Ionic.ael = (elm, eventName, cb, opts) => {
|
||||
if (elm.__zone_symbol__addEventListener && skipZone(eventName)) {
|
||||
elm.__zone_symbol__addEventListener(eventName, cb, opts);
|
||||
} else {
|
||||
elm.addEventListener(eventName, cb, opts);
|
||||
}
|
||||
};
|
||||
|
||||
Ionic.rel = (elm, eventName, cb, opts) => {
|
||||
if (elm.__zone_symbol__removeEventListener && skipZone(eventName)) {
|
||||
elm.__zone_symbol__removeEventListener(eventName, cb, opts);
|
||||
} else {
|
||||
elm.removeEventListener(eventName, cb, opts);
|
||||
}
|
||||
};
|
||||
|
||||
return defineCustomElements(win, {
|
||||
exclude: ['ion-tabs', 'ion-tab']
|
||||
return applyPolyfills().then(() => {
|
||||
return defineCustomElements(win, {
|
||||
exclude: ['ion-tabs', 'ion-tab'],
|
||||
syncQueue: true,
|
||||
raf: h => (win.__zone_symbol__requestAnimationFrame) ? win.__zone_symbol__requestAnimationFrame(h) : requestAnimationFrame(h),
|
||||
ael(elm, eventName, cb, opts) {
|
||||
if ((elm as any).__zone_symbol__addEventListener && skipZone(eventName)) {
|
||||
(elm as any).__zone_symbol__addEventListener(eventName, cb, opts);
|
||||
} else {
|
||||
elm.addEventListener(eventName, cb, opts);
|
||||
}
|
||||
},
|
||||
rel(elm, eventName, cb, opts) {
|
||||
if ((elm as any).__zone_symbol__removeEventListener && skipZone(eventName)) {
|
||||
(elm as any).__zone_symbol__removeEventListener(eventName, cb, opts);
|
||||
} else {
|
||||
elm.removeEventListener(eventName, cb, opts);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
|
|||
if ((this.nativeEl as any).componentOnReady) {
|
||||
this.nativeEl.componentOnReady().then(() => {
|
||||
if (this._swipeGesture === undefined) {
|
||||
this.swipeGesture = this.config.getBoolean('swipeBackEnabled', this.nativeEl.mode === 'ios');
|
||||
this.swipeGesture = this.config.getBoolean('swipeBackEnabled', (this.nativeEl as any).mode === 'ios');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
/* tslint:disable */
|
||||
/* auto-generated angular directive proxies */
|
||||
import { Component, ElementRef, ChangeDetectorRef, EventEmitter } from '@angular/core';
|
||||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter } from '@angular/core';
|
||||
import { proxyInputs, proxyMethods, proxyOutputs } from './proxies-utils';
|
||||
|
||||
type StencilComponents<T extends keyof StencilElementInterfaces> = StencilElementInterfaces[T];
|
||||
import { Components } from '@ionic/core'
|
||||
|
||||
export declare interface IonApp extends StencilComponents<'IonApp'> {}
|
||||
@Component({ selector: 'ion-app', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonApp extends Components.IonApp {}
|
||||
@Component({ selector: 'ion-app', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonApp {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -15,8 +15,8 @@ export class IonApp {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonAvatar extends StencilComponents<'IonAvatar'> {}
|
||||
@Component({ selector: 'ion-avatar', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonAvatar extends Components.IonAvatar {}
|
||||
@Component({ selector: 'ion-avatar', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonAvatar {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -25,8 +25,8 @@ export class IonAvatar {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonBackButton extends StencilComponents<'IonBackButton'> {}
|
||||
@Component({ selector: 'ion-back-button', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'defaultHref', 'disabled', 'icon', 'text', 'type'] })
|
||||
export declare interface IonBackButton extends Components.IonBackButton {}
|
||||
@Component({ selector: 'ion-back-button', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'defaultHref', 'disabled', 'icon', 'mode', 'text', 'type'] })
|
||||
export class IonBackButton {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -34,10 +34,10 @@ export class IonBackButton {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonBackButton, ['color', 'mode', 'defaultHref', 'disabled', 'icon', 'text', 'type']);
|
||||
proxyInputs(IonBackButton, ['color', 'defaultHref', 'disabled', 'icon', 'mode', 'text', 'type']);
|
||||
|
||||
export declare interface IonBackdrop extends StencilComponents<'IonBackdrop'> {}
|
||||
@Component({ selector: 'ion-backdrop', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['visible', 'tappable', 'stopPropagation'] })
|
||||
export declare interface IonBackdrop extends Components.IonBackdrop {}
|
||||
@Component({ selector: 'ion-backdrop', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['stopPropagation', 'tappable', 'visible'] })
|
||||
export class IonBackdrop {
|
||||
ionBackdropTap!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -47,10 +47,10 @@ export class IonBackdrop {
|
|||
proxyOutputs(this, this.el, ['ionBackdropTap']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonBackdrop, ['visible', 'tappable', 'stopPropagation']);
|
||||
proxyInputs(IonBackdrop, ['stopPropagation', 'tappable', 'visible']);
|
||||
|
||||
export declare interface IonBadge extends StencilComponents<'IonBadge'> {}
|
||||
@Component({ selector: 'ion-badge', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export declare interface IonBadge extends Components.IonBadge {}
|
||||
@Component({ selector: 'ion-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonBadge {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -60,8 +60,8 @@ export class IonBadge {
|
|||
}
|
||||
proxyInputs(IonBadge, ['color', 'mode']);
|
||||
|
||||
export declare interface IonButton extends StencilComponents<'IonButton'> {}
|
||||
@Component({ selector: 'ion-button', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'buttonType', 'disabled', 'expand', 'fill', 'routerDirection', 'download', 'href', 'rel', 'shape', 'size', 'strong', 'target', 'type'] })
|
||||
export declare interface IonButton extends Components.IonButton {}
|
||||
@Component({ selector: 'ion-button', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['buttonType', 'color', 'disabled', 'download', 'expand', 'fill', 'href', 'mode', 'rel', 'routerDirection', 'shape', 'size', 'strong', 'target', 'type'] })
|
||||
export class IonButton {
|
||||
ionFocus!: EventEmitter<CustomEvent>;
|
||||
ionBlur!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -72,10 +72,10 @@ export class IonButton {
|
|||
proxyOutputs(this, this.el, ['ionFocus', 'ionBlur']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonButton, ['color', 'mode', 'buttonType', 'disabled', 'expand', 'fill', 'routerDirection', 'download', 'href', 'rel', 'shape', 'size', 'strong', 'target', 'type']);
|
||||
proxyInputs(IonButton, ['buttonType', 'color', 'disabled', 'download', 'expand', 'fill', 'href', 'mode', 'rel', 'routerDirection', 'shape', 'size', 'strong', 'target', 'type']);
|
||||
|
||||
export declare interface IonButtons extends StencilComponents<'IonButtons'> {}
|
||||
@Component({ selector: 'ion-buttons', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonButtons extends Components.IonButtons {}
|
||||
@Component({ selector: 'ion-buttons', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonButtons {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -84,8 +84,8 @@ export class IonButtons {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonCard extends StencilComponents<'IonCard'> {}
|
||||
@Component({ selector: 'ion-card', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'button', 'type', 'disabled', 'download', 'href', 'rel', 'routerDirection', 'target'] })
|
||||
export declare interface IonCard extends Components.IonCard {}
|
||||
@Component({ selector: 'ion-card', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['button', 'color', 'disabled', 'download', 'href', 'mode', 'rel', 'routerDirection', 'target', 'type'] })
|
||||
export class IonCard {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -93,10 +93,10 @@ export class IonCard {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonCard, ['color', 'mode', 'button', 'type', 'disabled', 'download', 'href', 'rel', 'routerDirection', 'target']);
|
||||
proxyInputs(IonCard, ['button', 'color', 'disabled', 'download', 'href', 'mode', 'rel', 'routerDirection', 'target', 'type']);
|
||||
|
||||
export declare interface IonCardContent extends StencilComponents<'IonCardContent'> {}
|
||||
@Component({ selector: 'ion-card-content', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode'] })
|
||||
export declare interface IonCardContent extends Components.IonCardContent {}
|
||||
@Component({ selector: 'ion-card-content', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['mode'] })
|
||||
export class IonCardContent {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -106,8 +106,8 @@ export class IonCardContent {
|
|||
}
|
||||
proxyInputs(IonCardContent, ['mode']);
|
||||
|
||||
export declare interface IonCardHeader extends StencilComponents<'IonCardHeader'> {}
|
||||
@Component({ selector: 'ion-card-header', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'translucent'] })
|
||||
export declare interface IonCardHeader extends Components.IonCardHeader {}
|
||||
@Component({ selector: 'ion-card-header', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'translucent'] })
|
||||
export class IonCardHeader {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -117,8 +117,8 @@ export class IonCardHeader {
|
|||
}
|
||||
proxyInputs(IonCardHeader, ['color', 'mode', 'translucent']);
|
||||
|
||||
export declare interface IonCardSubtitle extends StencilComponents<'IonCardSubtitle'> {}
|
||||
@Component({ selector: 'ion-card-subtitle', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export declare interface IonCardSubtitle extends Components.IonCardSubtitle {}
|
||||
@Component({ selector: 'ion-card-subtitle', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonCardSubtitle {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -128,8 +128,8 @@ export class IonCardSubtitle {
|
|||
}
|
||||
proxyInputs(IonCardSubtitle, ['color', 'mode']);
|
||||
|
||||
export declare interface IonCardTitle extends StencilComponents<'IonCardTitle'> {}
|
||||
@Component({ selector: 'ion-card-title', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export declare interface IonCardTitle extends Components.IonCardTitle {}
|
||||
@Component({ selector: 'ion-card-title', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonCardTitle {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -139,8 +139,8 @@ export class IonCardTitle {
|
|||
}
|
||||
proxyInputs(IonCardTitle, ['color', 'mode']);
|
||||
|
||||
export declare interface IonCheckbox extends StencilComponents<'IonCheckbox'> {}
|
||||
@Component({ selector: 'ion-checkbox', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'name', 'checked', 'indeterminate', 'disabled', 'value'] })
|
||||
export declare interface IonCheckbox extends Components.IonCheckbox {}
|
||||
@Component({ selector: 'ion-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['checked', 'color', 'disabled', 'indeterminate', 'mode', 'name', 'value'] })
|
||||
export class IonCheckbox {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
ionFocus!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -152,10 +152,10 @@ export class IonCheckbox {
|
|||
proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonCheckbox, ['color', 'mode', 'name', 'checked', 'indeterminate', 'disabled', 'value']);
|
||||
proxyInputs(IonCheckbox, ['checked', 'color', 'disabled', 'indeterminate', 'mode', 'name', 'value']);
|
||||
|
||||
export declare interface IonChip extends StencilComponents<'IonChip'> {}
|
||||
@Component({ selector: 'ion-chip', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'outline'] })
|
||||
export declare interface IonChip extends Components.IonChip {}
|
||||
@Component({ selector: 'ion-chip', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'outline'] })
|
||||
export class IonChip {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -165,8 +165,8 @@ export class IonChip {
|
|||
}
|
||||
proxyInputs(IonChip, ['color', 'mode', 'outline']);
|
||||
|
||||
export declare interface IonCol extends StencilComponents<'IonCol'> {}
|
||||
@Component({ selector: 'ion-col', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['offset', 'offsetXs', 'offsetSm', 'offsetMd', 'offsetLg', 'offsetXl', 'pull', 'pullXs', 'pullSm', 'pullMd', 'pullLg', 'pullXl', 'push', 'pushXs', 'pushSm', 'pushMd', 'pushLg', 'pushXl', 'size', 'sizeXs', 'sizeSm', 'sizeMd', 'sizeLg', 'sizeXl'] })
|
||||
export declare interface IonCol extends Components.IonCol {}
|
||||
@Component({ selector: 'ion-col', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['offset', 'offsetLg', 'offsetMd', 'offsetSm', 'offsetXl', 'offsetXs', 'pull', 'pullLg', 'pullMd', 'pullSm', 'pullXl', 'pullXs', 'push', 'pushLg', 'pushMd', 'pushSm', 'pushXl', 'pushXs', 'size', 'sizeLg', 'sizeMd', 'sizeSm', 'sizeXl', 'sizeXs'] })
|
||||
export class IonCol {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -174,10 +174,10 @@ export class IonCol {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonCol, ['offset', 'offsetXs', 'offsetSm', 'offsetMd', 'offsetLg', 'offsetXl', 'pull', 'pullXs', 'pullSm', 'pullMd', 'pullLg', 'pullXl', 'push', 'pushXs', 'pushSm', 'pushMd', 'pushLg', 'pushXl', 'size', 'sizeXs', 'sizeSm', 'sizeMd', 'sizeLg', 'sizeXl']);
|
||||
proxyInputs(IonCol, ['offset', 'offsetLg', 'offsetMd', 'offsetSm', 'offsetXl', 'offsetXs', 'pull', 'pullLg', 'pullMd', 'pullSm', 'pullXl', 'pullXs', 'push', 'pushLg', 'pushMd', 'pushSm', 'pushXl', 'pushXs', 'size', 'sizeLg', 'sizeMd', 'sizeSm', 'sizeXl', 'sizeXs']);
|
||||
|
||||
export declare interface IonContent extends StencilComponents<'IonContent'> {}
|
||||
@Component({ selector: 'ion-content', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'fullscreen', 'forceOverscroll', 'scrollX', 'scrollY', 'scrollEvents'] })
|
||||
export declare interface IonContent extends Components.IonContent {}
|
||||
@Component({ selector: 'ion-content', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'forceOverscroll', 'fullscreen', 'scrollEvents', 'scrollX', 'scrollY'] })
|
||||
export class IonContent {
|
||||
ionScrollStart!: EventEmitter<CustomEvent>;
|
||||
ionScroll!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -190,10 +190,10 @@ export class IonContent {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonContent, ['getScrollElement', 'scrollToTop', 'scrollToBottom', 'scrollByPoint', 'scrollToPoint']);
|
||||
proxyInputs(IonContent, ['color', 'fullscreen', 'forceOverscroll', 'scrollX', 'scrollY', 'scrollEvents']);
|
||||
proxyInputs(IonContent, ['color', 'forceOverscroll', 'fullscreen', 'scrollEvents', 'scrollX', 'scrollY']);
|
||||
|
||||
export declare interface IonDatetime extends StencilComponents<'IonDatetime'> {}
|
||||
@Component({ selector: 'ion-datetime', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'name', 'disabled', 'readonly', 'min', 'max', 'displayFormat', 'pickerFormat', 'cancelText', 'doneText', 'yearValues', 'monthValues', 'dayValues', 'hourValues', 'minuteValues', 'monthNames', 'monthShortNames', 'dayNames', 'dayShortNames', 'pickerOptions', 'placeholder', 'value'] })
|
||||
export declare interface IonDatetime extends Components.IonDatetime {}
|
||||
@Component({ selector: 'ion-datetime', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['cancelText', 'dayNames', 'dayShortNames', 'dayValues', 'disabled', 'displayFormat', 'doneText', 'hourValues', 'max', 'min', 'minuteValues', 'mode', 'monthNames', 'monthShortNames', 'monthValues', 'name', 'pickerFormat', 'pickerOptions', 'placeholder', 'readonly', 'value', 'yearValues'] })
|
||||
export class IonDatetime {
|
||||
ionCancel!: EventEmitter<CustomEvent>;
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -207,10 +207,10 @@ export class IonDatetime {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonDatetime, ['open']);
|
||||
proxyInputs(IonDatetime, ['mode', 'name', 'disabled', 'readonly', 'min', 'max', 'displayFormat', 'pickerFormat', 'cancelText', 'doneText', 'yearValues', 'monthValues', 'dayValues', 'hourValues', 'minuteValues', 'monthNames', 'monthShortNames', 'dayNames', 'dayShortNames', 'pickerOptions', 'placeholder', 'value']);
|
||||
proxyInputs(IonDatetime, ['cancelText', 'dayNames', 'dayShortNames', 'dayValues', 'disabled', 'displayFormat', 'doneText', 'hourValues', 'max', 'min', 'minuteValues', 'mode', 'monthNames', 'monthShortNames', 'monthValues', 'name', 'pickerFormat', 'pickerOptions', 'placeholder', 'readonly', 'value', 'yearValues']);
|
||||
|
||||
export declare interface IonFab extends StencilComponents<'IonFab'> {}
|
||||
@Component({ selector: 'ion-fab', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['horizontal', 'vertical', 'edge', 'activated'] })
|
||||
export declare interface IonFab extends Components.IonFab {}
|
||||
@Component({ selector: 'ion-fab', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['activated', 'edge', 'horizontal', 'vertical'] })
|
||||
export class IonFab {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -219,10 +219,10 @@ export class IonFab {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonFab, ['close']);
|
||||
proxyInputs(IonFab, ['horizontal', 'vertical', 'edge', 'activated']);
|
||||
proxyInputs(IonFab, ['activated', 'edge', 'horizontal', 'vertical']);
|
||||
|
||||
export declare interface IonFabButton extends StencilComponents<'IonFabButton'> {}
|
||||
@Component({ selector: 'ion-fab-button', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'color', 'activated', 'disabled', 'download', 'href', 'rel', 'routerDirection', 'target', 'show', 'translucent', 'type', 'size'] })
|
||||
export declare interface IonFabButton extends Components.IonFabButton {}
|
||||
@Component({ selector: 'ion-fab-button', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['activated', 'color', 'disabled', 'download', 'href', 'mode', 'rel', 'routerDirection', 'show', 'size', 'target', 'translucent', 'type'] })
|
||||
export class IonFabButton {
|
||||
ionFocus!: EventEmitter<CustomEvent>;
|
||||
ionBlur!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -233,10 +233,10 @@ export class IonFabButton {
|
|||
proxyOutputs(this, this.el, ['ionFocus', 'ionBlur']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonFabButton, ['mode', 'color', 'activated', 'disabled', 'download', 'href', 'rel', 'routerDirection', 'target', 'show', 'translucent', 'type', 'size']);
|
||||
proxyInputs(IonFabButton, ['activated', 'color', 'disabled', 'download', 'href', 'mode', 'rel', 'routerDirection', 'show', 'size', 'target', 'translucent', 'type']);
|
||||
|
||||
export declare interface IonFabList extends StencilComponents<'IonFabList'> {}
|
||||
@Component({ selector: 'ion-fab-list', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['activated', 'side'] })
|
||||
export declare interface IonFabList extends Components.IonFabList {}
|
||||
@Component({ selector: 'ion-fab-list', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['activated', 'side'] })
|
||||
export class IonFabList {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -246,8 +246,8 @@ export class IonFabList {
|
|||
}
|
||||
proxyInputs(IonFabList, ['activated', 'side']);
|
||||
|
||||
export declare interface IonFooter extends StencilComponents<'IonFooter'> {}
|
||||
@Component({ selector: 'ion-footer', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'translucent'] })
|
||||
export declare interface IonFooter extends Components.IonFooter {}
|
||||
@Component({ selector: 'ion-footer', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['mode', 'translucent'] })
|
||||
export class IonFooter {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -257,8 +257,8 @@ export class IonFooter {
|
|||
}
|
||||
proxyInputs(IonFooter, ['mode', 'translucent']);
|
||||
|
||||
export declare interface IonGrid extends StencilComponents<'IonGrid'> {}
|
||||
@Component({ selector: 'ion-grid', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['fixed'] })
|
||||
export declare interface IonGrid extends Components.IonGrid {}
|
||||
@Component({ selector: 'ion-grid', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['fixed'] })
|
||||
export class IonGrid {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -268,8 +268,8 @@ export class IonGrid {
|
|||
}
|
||||
proxyInputs(IonGrid, ['fixed']);
|
||||
|
||||
export declare interface IonHeader extends StencilComponents<'IonHeader'> {}
|
||||
@Component({ selector: 'ion-header', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'translucent'] })
|
||||
export declare interface IonHeader extends Components.IonHeader {}
|
||||
@Component({ selector: 'ion-header', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['mode', 'translucent'] })
|
||||
export class IonHeader {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -279,8 +279,8 @@ export class IonHeader {
|
|||
}
|
||||
proxyInputs(IonHeader, ['mode', 'translucent']);
|
||||
|
||||
export declare interface IonIcon extends StencilComponents<'IonIcon'> {}
|
||||
@Component({ selector: 'ion-icon', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['ariaLabel', 'color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'size', 'src'] })
|
||||
export declare interface IonIcon extends Components.IonIcon {}
|
||||
@Component({ selector: 'ion-icon', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['ariaLabel', 'color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'size', 'src'] })
|
||||
export class IonIcon {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -290,8 +290,8 @@ export class IonIcon {
|
|||
}
|
||||
proxyInputs(IonIcon, ['ariaLabel', 'color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'size', 'src']);
|
||||
|
||||
export declare interface IonImg extends StencilComponents<'IonImg'> {}
|
||||
@Component({ selector: 'ion-img', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['alt', 'src'] })
|
||||
export declare interface IonImg extends Components.IonImg {}
|
||||
@Component({ selector: 'ion-img', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['alt', 'src'] })
|
||||
export class IonImg {
|
||||
ionImgWillLoad!: EventEmitter<CustomEvent>;
|
||||
ionImgDidLoad!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -305,8 +305,8 @@ export class IonImg {
|
|||
}
|
||||
proxyInputs(IonImg, ['alt', 'src']);
|
||||
|
||||
export declare interface IonInfiniteScroll extends StencilComponents<'IonInfiniteScroll'> {}
|
||||
@Component({ selector: 'ion-infinite-scroll', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['threshold', 'disabled', 'position'] })
|
||||
export declare interface IonInfiniteScroll extends Components.IonInfiniteScroll {}
|
||||
@Component({ selector: 'ion-infinite-scroll', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['disabled', 'position', 'threshold'] })
|
||||
export class IonInfiniteScroll {
|
||||
ionInfinite!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -317,10 +317,10 @@ export class IonInfiniteScroll {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonInfiniteScroll, ['complete']);
|
||||
proxyInputs(IonInfiniteScroll, ['threshold', 'disabled', 'position']);
|
||||
proxyInputs(IonInfiniteScroll, ['disabled', 'position', 'threshold']);
|
||||
|
||||
export declare interface IonInfiniteScrollContent extends StencilComponents<'IonInfiniteScrollContent'> {}
|
||||
@Component({ selector: 'ion-infinite-scroll-content', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['loadingSpinner', 'loadingText'] })
|
||||
export declare interface IonInfiniteScrollContent extends Components.IonInfiniteScrollContent {}
|
||||
@Component({ selector: 'ion-infinite-scroll-content', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['loadingSpinner', 'loadingText'] })
|
||||
export class IonInfiniteScrollContent {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -330,8 +330,8 @@ export class IonInfiniteScrollContent {
|
|||
}
|
||||
proxyInputs(IonInfiniteScrollContent, ['loadingSpinner', 'loadingText']);
|
||||
|
||||
export declare interface IonInput extends StencilComponents<'IonInput'> {}
|
||||
@Component({ selector: 'ion-input', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'debounce', 'disabled', 'inputmode', 'max', 'maxlength', 'min', 'minlength', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'spellcheck', 'step', 'size', 'type', 'value'] })
|
||||
export declare interface IonInput extends Components.IonInput {}
|
||||
@Component({ selector: 'ion-input', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'color', 'debounce', 'disabled', 'inputmode', 'max', 'maxlength', 'min', 'minlength', 'mode', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'size', 'spellcheck', 'step', 'type', 'value'] })
|
||||
export class IonInput {
|
||||
ionInput!: EventEmitter<CustomEvent>;
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -345,10 +345,10 @@ export class IonInput {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonInput, ['setFocus', 'getInputElement']);
|
||||
proxyInputs(IonInput, ['color', 'mode', 'accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'debounce', 'disabled', 'inputmode', 'max', 'maxlength', 'min', 'minlength', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'spellcheck', 'step', 'size', 'type', 'value']);
|
||||
proxyInputs(IonInput, ['accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'color', 'debounce', 'disabled', 'inputmode', 'max', 'maxlength', 'min', 'minlength', 'mode', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'size', 'spellcheck', 'step', 'type', 'value']);
|
||||
|
||||
export declare interface IonItem extends StencilComponents<'IonItem'> {}
|
||||
@Component({ selector: 'ion-item', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'button', 'detail', 'detailIcon', 'disabled', 'download', 'href', 'rel', 'lines', 'routerDirection', 'target', 'type'] })
|
||||
export declare interface IonItem extends Components.IonItem {}
|
||||
@Component({ selector: 'ion-item', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['button', 'color', 'detail', 'detailIcon', 'disabled', 'download', 'href', 'lines', 'mode', 'rel', 'routerDirection', 'target', 'type'] })
|
||||
export class IonItem {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -356,10 +356,10 @@ export class IonItem {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonItem, ['color', 'mode', 'button', 'detail', 'detailIcon', 'disabled', 'download', 'href', 'rel', 'lines', 'routerDirection', 'target', 'type']);
|
||||
proxyInputs(IonItem, ['button', 'color', 'detail', 'detailIcon', 'disabled', 'download', 'href', 'lines', 'mode', 'rel', 'routerDirection', 'target', 'type']);
|
||||
|
||||
export declare interface IonItemDivider extends StencilComponents<'IonItemDivider'> {}
|
||||
@Component({ selector: 'ion-item-divider', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'sticky'] })
|
||||
export declare interface IonItemDivider extends Components.IonItemDivider {}
|
||||
@Component({ selector: 'ion-item-divider', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'sticky'] })
|
||||
export class IonItemDivider {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -369,8 +369,8 @@ export class IonItemDivider {
|
|||
}
|
||||
proxyInputs(IonItemDivider, ['color', 'mode', 'sticky']);
|
||||
|
||||
export declare interface IonItemGroup extends StencilComponents<'IonItemGroup'> {}
|
||||
@Component({ selector: 'ion-item-group', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonItemGroup extends Components.IonItemGroup {}
|
||||
@Component({ selector: 'ion-item-group', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonItemGroup {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -379,8 +379,8 @@ export class IonItemGroup {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonItemOption extends StencilComponents<'IonItemOption'> {}
|
||||
@Component({ selector: 'ion-item-option', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'disabled', 'download', 'expandable', 'href', 'rel', 'target', 'type'] })
|
||||
export declare interface IonItemOption extends Components.IonItemOption {}
|
||||
@Component({ selector: 'ion-item-option', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'disabled', 'download', 'expandable', 'href', 'mode', 'rel', 'target', 'type'] })
|
||||
export class IonItemOption {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -388,10 +388,10 @@ export class IonItemOption {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonItemOption, ['color', 'mode', 'disabled', 'download', 'expandable', 'href', 'rel', 'target', 'type']);
|
||||
proxyInputs(IonItemOption, ['color', 'disabled', 'download', 'expandable', 'href', 'mode', 'rel', 'target', 'type']);
|
||||
|
||||
export declare interface IonItemOptions extends StencilComponents<'IonItemOptions'> {}
|
||||
@Component({ selector: 'ion-item-options', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['side'] })
|
||||
export declare interface IonItemOptions extends Components.IonItemOptions {}
|
||||
@Component({ selector: 'ion-item-options', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['side'] })
|
||||
export class IonItemOptions {
|
||||
ionSwipe!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -403,8 +403,8 @@ export class IonItemOptions {
|
|||
}
|
||||
proxyInputs(IonItemOptions, ['side']);
|
||||
|
||||
export declare interface IonItemSliding extends StencilComponents<'IonItemSliding'> {}
|
||||
@Component({ selector: 'ion-item-sliding', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['disabled'] })
|
||||
export declare interface IonItemSliding extends Components.IonItemSliding {}
|
||||
@Component({ selector: 'ion-item-sliding', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['disabled'] })
|
||||
export class IonItemSliding {
|
||||
ionDrag!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -417,8 +417,8 @@ export class IonItemSliding {
|
|||
proxyMethods(IonItemSliding, ['getOpenAmount', 'getSlidingRatio', 'open', 'close', 'closeOpened']);
|
||||
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 declare interface IonLabel extends Components.IonLabel {}
|
||||
@Component({ selector: 'ion-label', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'position'] })
|
||||
export class IonLabel {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -428,8 +428,8 @@ export class IonLabel {
|
|||
}
|
||||
proxyInputs(IonLabel, ['color', 'mode', 'position']);
|
||||
|
||||
export declare interface IonList extends StencilComponents<'IonList'> {}
|
||||
@Component({ selector: 'ion-list', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'lines', 'inset'] })
|
||||
export declare interface IonList extends Components.IonList {}
|
||||
@Component({ selector: 'ion-list', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['inset', 'lines', 'mode'] })
|
||||
export class IonList {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -438,10 +438,10 @@ export class IonList {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonList, ['closeSlidingItems']);
|
||||
proxyInputs(IonList, ['mode', 'lines', 'inset']);
|
||||
proxyInputs(IonList, ['inset', 'lines', 'mode']);
|
||||
|
||||
export declare interface IonListHeader extends StencilComponents<'IonListHeader'> {}
|
||||
@Component({ selector: 'ion-list-header', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'color'] })
|
||||
export declare interface IonListHeader extends Components.IonListHeader {}
|
||||
@Component({ selector: 'ion-list-header', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonListHeader {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -449,10 +449,10 @@ export class IonListHeader {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonListHeader, ['mode', 'color']);
|
||||
proxyInputs(IonListHeader, ['color', 'mode']);
|
||||
|
||||
export declare interface IonMenu extends StencilComponents<'IonMenu'> {}
|
||||
@Component({ selector: 'ion-menu', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeGesture', 'maxEdgeStart'] })
|
||||
export declare interface IonMenu extends Components.IonMenu {}
|
||||
@Component({ selector: 'ion-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['contentId', 'disabled', 'maxEdgeStart', 'menuId', 'side', 'swipeGesture', 'type'] })
|
||||
export class IonMenu {
|
||||
ionWillOpen!: EventEmitter<CustomEvent>;
|
||||
ionWillClose!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -466,10 +466,10 @@ export class IonMenu {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonMenu, ['isOpen', 'isActive', 'open', 'close', 'toggle', 'setOpen']);
|
||||
proxyInputs(IonMenu, ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeGesture', 'maxEdgeStart']);
|
||||
proxyInputs(IonMenu, ['contentId', 'disabled', 'maxEdgeStart', 'menuId', 'side', 'swipeGesture', 'type']);
|
||||
|
||||
export declare interface IonMenuButton extends StencilComponents<'IonMenuButton'> {}
|
||||
@Component({ selector: 'ion-menu-button', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'disabled', 'menu', 'autoHide', 'type'] })
|
||||
export declare interface IonMenuButton extends Components.IonMenuButton {}
|
||||
@Component({ selector: 'ion-menu-button', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['autoHide', 'color', 'disabled', 'menu', 'type'] })
|
||||
export class IonMenuButton {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -477,10 +477,10 @@ export class IonMenuButton {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonMenuButton, ['color', 'mode', 'disabled', 'menu', 'autoHide', 'type']);
|
||||
proxyInputs(IonMenuButton, ['autoHide', 'color', 'disabled', 'menu', 'type']);
|
||||
|
||||
export declare interface IonMenuToggle extends StencilComponents<'IonMenuToggle'> {}
|
||||
@Component({ selector: 'ion-menu-toggle', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['menu', 'autoHide'] })
|
||||
export declare interface IonMenuToggle extends Components.IonMenuToggle {}
|
||||
@Component({ selector: 'ion-menu-toggle', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['autoHide', 'menu'] })
|
||||
export class IonMenuToggle {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -488,10 +488,10 @@ export class IonMenuToggle {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonMenuToggle, ['menu', 'autoHide']);
|
||||
proxyInputs(IonMenuToggle, ['autoHide', 'menu']);
|
||||
|
||||
export declare interface IonNav extends StencilComponents<'IonNav'> {}
|
||||
@Component({ selector: 'ion-nav', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['swipeGesture', 'animated', 'animation', 'rootParams', 'root'] })
|
||||
export declare interface IonNav extends Components.IonNav {}
|
||||
@Component({ selector: 'ion-nav', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['animated', 'animation', 'root', 'rootParams', 'swipeGesture'] })
|
||||
export class IonNav {
|
||||
ionNavWillChange!: EventEmitter<CustomEvent>;
|
||||
ionNavDidChange!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -503,10 +503,10 @@ export class IonNav {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonNav, ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'getActive', 'getByIndex', 'canGoBack', 'getPrevious']);
|
||||
proxyInputs(IonNav, ['swipeGesture', 'animated', 'animation', 'rootParams', 'root']);
|
||||
proxyInputs(IonNav, ['animated', 'animation', 'root', 'rootParams', 'swipeGesture']);
|
||||
|
||||
export declare interface IonNavPop extends StencilComponents<'IonNavPop'> {}
|
||||
@Component({ selector: 'ion-nav-pop', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonNavPop extends Components.IonNavPop {}
|
||||
@Component({ selector: 'ion-nav-pop', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonNavPop {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -515,8 +515,8 @@ export class IonNavPop {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonNavPush extends StencilComponents<'IonNavPush'> {}
|
||||
@Component({ selector: 'ion-nav-push', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['component', 'componentProps'] })
|
||||
export declare interface IonNavPush extends Components.IonNavPush {}
|
||||
@Component({ selector: 'ion-nav-push', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['component', 'componentProps'] })
|
||||
export class IonNavPush {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -526,8 +526,8 @@ export class IonNavPush {
|
|||
}
|
||||
proxyInputs(IonNavPush, ['component', 'componentProps']);
|
||||
|
||||
export declare interface IonNavSetRoot extends StencilComponents<'IonNavSetRoot'> {}
|
||||
@Component({ selector: 'ion-nav-set-root', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['component', 'componentProps'] })
|
||||
export declare interface IonNavSetRoot extends Components.IonNavSetRoot {}
|
||||
@Component({ selector: 'ion-nav-set-root', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['component', 'componentProps'] })
|
||||
export class IonNavSetRoot {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -537,8 +537,8 @@ export class IonNavSetRoot {
|
|||
}
|
||||
proxyInputs(IonNavSetRoot, ['component', 'componentProps']);
|
||||
|
||||
export declare interface IonNote extends StencilComponents<'IonNote'> {}
|
||||
@Component({ selector: 'ion-note', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export declare interface IonNote extends Components.IonNote {}
|
||||
@Component({ selector: 'ion-note', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonNote {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -548,8 +548,8 @@ export class IonNote {
|
|||
}
|
||||
proxyInputs(IonNote, ['color', 'mode']);
|
||||
|
||||
export declare interface IonProgressBar extends StencilComponents<'IonProgressBar'> {}
|
||||
@Component({ selector: 'ion-progress-bar', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'type', 'reversed', 'value', 'buffer', 'color'] })
|
||||
export declare interface IonProgressBar extends Components.IonProgressBar {}
|
||||
@Component({ selector: 'ion-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['buffer', 'color', 'mode', 'reversed', 'type', 'value'] })
|
||||
export class IonProgressBar {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -557,10 +557,10 @@ export class IonProgressBar {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonProgressBar, ['mode', 'type', 'reversed', 'value', 'buffer', 'color']);
|
||||
proxyInputs(IonProgressBar, ['buffer', 'color', 'mode', 'reversed', 'type', 'value']);
|
||||
|
||||
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 declare interface IonRadio extends Components.IonRadio {}
|
||||
@Component({ selector: 'ion-radio', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['checked', 'color', 'disabled', 'mode', 'name', 'value'] })
|
||||
export class IonRadio {
|
||||
ionSelect!: EventEmitter<CustomEvent>;
|
||||
ionFocus!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -572,10 +572,10 @@ export class IonRadio {
|
|||
proxyOutputs(this, this.el, ['ionSelect', 'ionFocus', 'ionBlur']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonRadio, ['color', 'mode', 'name', 'disabled', 'checked', 'value']);
|
||||
proxyInputs(IonRadio, ['checked', 'color', 'disabled', 'mode', 'name', 'value']);
|
||||
|
||||
export declare interface IonRadioGroup extends StencilComponents<'IonRadioGroup'> {}
|
||||
@Component({ selector: 'ion-radio-group', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['allowEmptySelection', 'name', 'value'] })
|
||||
export declare interface IonRadioGroup extends Components.IonRadioGroup {}
|
||||
@Component({ selector: 'ion-radio-group', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['allowEmptySelection', 'name', 'value'] })
|
||||
export class IonRadioGroup {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -587,8 +587,8 @@ export class IonRadioGroup {
|
|||
}
|
||||
proxyInputs(IonRadioGroup, ['allowEmptySelection', 'name', 'value']);
|
||||
|
||||
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', 'ticks', 'disabled', 'value'] })
|
||||
export declare interface IonRange extends Components.IonRange {}
|
||||
@Component({ selector: 'ion-range', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'debounce', 'disabled', 'dualKnobs', 'max', 'min', 'mode', 'name', 'pin', 'snaps', 'step', 'ticks', 'value'] })
|
||||
export class IonRange {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
ionFocus!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -600,10 +600,10 @@ export class IonRange {
|
|||
proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonRange, ['color', 'mode', 'debounce', 'name', 'dualKnobs', 'min', 'max', 'pin', 'snaps', 'step', 'ticks', 'disabled', 'value']);
|
||||
proxyInputs(IonRange, ['color', 'debounce', 'disabled', 'dualKnobs', 'max', 'min', 'mode', 'name', 'pin', 'snaps', 'step', 'ticks', 'value']);
|
||||
|
||||
export declare interface IonRefresher extends StencilComponents<'IonRefresher'> {}
|
||||
@Component({ selector: 'ion-refresher', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['pullMin', 'pullMax', 'closeDuration', 'snapbackDuration', 'pullFactor', 'disabled'] })
|
||||
export declare interface IonRefresher extends Components.IonRefresher {}
|
||||
@Component({ selector: 'ion-refresher', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['closeDuration', 'disabled', 'pullFactor', 'pullMax', 'pullMin', 'snapbackDuration'] })
|
||||
export class IonRefresher {
|
||||
ionRefresh!: EventEmitter<CustomEvent>;
|
||||
ionPull!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -616,10 +616,10 @@ export class IonRefresher {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonRefresher, ['complete', 'cancel', 'getProgress']);
|
||||
proxyInputs(IonRefresher, ['pullMin', 'pullMax', 'closeDuration', 'snapbackDuration', 'pullFactor', 'disabled']);
|
||||
proxyInputs(IonRefresher, ['closeDuration', 'disabled', 'pullFactor', 'pullMax', 'pullMin', 'snapbackDuration']);
|
||||
|
||||
export declare interface IonRefresherContent extends StencilComponents<'IonRefresherContent'> {}
|
||||
@Component({ selector: 'ion-refresher-content', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['pullingIcon', 'pullingText', 'refreshingSpinner', 'refreshingText'] })
|
||||
export declare interface IonRefresherContent extends Components.IonRefresherContent {}
|
||||
@Component({ selector: 'ion-refresher-content', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['pullingIcon', 'pullingText', 'refreshingSpinner', 'refreshingText'] })
|
||||
export class IonRefresherContent {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -629,8 +629,8 @@ export class IonRefresherContent {
|
|||
}
|
||||
proxyInputs(IonRefresherContent, ['pullingIcon', 'pullingText', 'refreshingSpinner', 'refreshingText']);
|
||||
|
||||
export declare interface IonReorder extends StencilComponents<'IonReorder'> {}
|
||||
@Component({ selector: 'ion-reorder', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonReorder extends Components.IonReorder {}
|
||||
@Component({ selector: 'ion-reorder', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonReorder {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -639,8 +639,8 @@ export class IonReorder {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonReorderGroup extends StencilComponents<'IonReorderGroup'> {}
|
||||
@Component({ selector: 'ion-reorder-group', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['disabled'] })
|
||||
export declare interface IonReorderGroup extends Components.IonReorderGroup {}
|
||||
@Component({ selector: 'ion-reorder-group', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['disabled'] })
|
||||
export class IonReorderGroup {
|
||||
ionItemReorder!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -653,8 +653,8 @@ export class IonReorderGroup {
|
|||
proxyMethods(IonReorderGroup, ['complete']);
|
||||
proxyInputs(IonReorderGroup, ['disabled']);
|
||||
|
||||
export declare interface IonRippleEffect extends StencilComponents<'IonRippleEffect'> {}
|
||||
@Component({ selector: 'ion-ripple-effect', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['type'] })
|
||||
export declare interface IonRippleEffect extends Components.IonRippleEffect {}
|
||||
@Component({ selector: 'ion-ripple-effect', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['type'] })
|
||||
export class IonRippleEffect {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -665,8 +665,8 @@ export class IonRippleEffect {
|
|||
proxyMethods(IonRippleEffect, ['addRipple']);
|
||||
proxyInputs(IonRippleEffect, ['type']);
|
||||
|
||||
export declare interface IonRow extends StencilComponents<'IonRow'> {}
|
||||
@Component({ selector: 'ion-row', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonRow extends Components.IonRow {}
|
||||
@Component({ selector: 'ion-row', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonRow {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -675,8 +675,8 @@ export class IonRow {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonSearchbar extends StencilComponents<'IonSearchbar'> {}
|
||||
@Component({ selector: 'ion-searchbar', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'debounce', 'disabled', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value'] })
|
||||
export declare interface IonSearchbar extends Components.IonSearchbar {}
|
||||
@Component({ selector: 'ion-searchbar', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'color', 'debounce', 'disabled', 'mode', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value'] })
|
||||
export class IonSearchbar {
|
||||
ionInput!: EventEmitter<CustomEvent>;
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -692,10 +692,10 @@ export class IonSearchbar {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonSearchbar, ['setFocus', 'getInputElement']);
|
||||
proxyInputs(IonSearchbar, ['color', 'mode', 'animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'debounce', 'disabled', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value']);
|
||||
proxyInputs(IonSearchbar, ['animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'color', 'debounce', 'disabled', 'mode', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value']);
|
||||
|
||||
export declare interface IonSegment extends StencilComponents<'IonSegment'> {}
|
||||
@Component({ selector: 'ion-segment', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'disabled', 'scrollable', 'value'] })
|
||||
export declare interface IonSegment extends Components.IonSegment {}
|
||||
@Component({ selector: 'ion-segment', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'disabled', 'mode', 'scrollable', 'value'] })
|
||||
export class IonSegment {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
ionStyle!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -706,10 +706,10 @@ export class IonSegment {
|
|||
proxyOutputs(this, this.el, ['ionChange', 'ionStyle']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonSegment, ['color', 'mode', 'disabled', 'scrollable', 'value']);
|
||||
proxyInputs(IonSegment, ['color', 'disabled', 'mode', 'scrollable', 'value']);
|
||||
|
||||
export declare interface IonSegmentButton extends StencilComponents<'IonSegmentButton'> {}
|
||||
@Component({ selector: 'ion-segment-button', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'checked', 'disabled', 'layout', 'type', 'value'] })
|
||||
export declare interface IonSegmentButton extends Components.IonSegmentButton {}
|
||||
@Component({ selector: 'ion-segment-button', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['checked', 'disabled', 'layout', 'mode', 'type', 'value'] })
|
||||
export class IonSegmentButton {
|
||||
ionSelect!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -719,10 +719,10 @@ export class IonSegmentButton {
|
|||
proxyOutputs(this, this.el, ['ionSelect']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonSegmentButton, ['mode', 'checked', 'disabled', 'layout', 'type', 'value']);
|
||||
proxyInputs(IonSegmentButton, ['checked', 'disabled', 'layout', 'mode', 'type', 'value']);
|
||||
|
||||
export declare interface IonSelect extends StencilComponents<'IonSelect'> {}
|
||||
@Component({ selector: 'ion-select', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'disabled', 'cancelText', 'okText', 'placeholder', 'name', 'selectedText', 'multiple', 'interface', 'interfaceOptions', 'compareWith', 'value'] })
|
||||
export declare interface IonSelect extends Components.IonSelect {}
|
||||
@Component({ selector: 'ion-select', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['cancelText', 'compareWith', 'disabled', 'interface', 'interfaceOptions', 'mode', 'multiple', 'name', 'okText', 'placeholder', 'selectedText', 'value'] })
|
||||
export class IonSelect {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
ionCancel!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -736,10 +736,10 @@ export class IonSelect {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonSelect, ['open']);
|
||||
proxyInputs(IonSelect, ['mode', 'disabled', 'cancelText', 'okText', 'placeholder', 'name', 'selectedText', 'multiple', 'interface', 'interfaceOptions', 'compareWith', 'value']);
|
||||
proxyInputs(IonSelect, ['cancelText', 'compareWith', 'disabled', 'interface', 'interfaceOptions', 'mode', 'multiple', 'name', 'okText', 'placeholder', 'selectedText', 'value']);
|
||||
|
||||
export declare interface IonSelectOption extends StencilComponents<'IonSelectOption'> {}
|
||||
@Component({ selector: 'ion-select-option', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['disabled', 'selected', 'value'] })
|
||||
export declare interface IonSelectOption extends Components.IonSelectOption {}
|
||||
@Component({ selector: 'ion-select-option', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['disabled', 'selected', 'value'] })
|
||||
export class IonSelectOption {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -749,8 +749,8 @@ export class IonSelectOption {
|
|||
}
|
||||
proxyInputs(IonSelectOption, ['disabled', 'selected', 'value']);
|
||||
|
||||
export declare interface IonSkeletonText extends StencilComponents<'IonSkeletonText'> {}
|
||||
@Component({ selector: 'ion-skeleton-text', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['animated', 'width'] })
|
||||
export declare interface IonSkeletonText extends Components.IonSkeletonText {}
|
||||
@Component({ selector: 'ion-skeleton-text', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['animated', 'width'] })
|
||||
export class IonSkeletonText {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -760,8 +760,8 @@ export class IonSkeletonText {
|
|||
}
|
||||
proxyInputs(IonSkeletonText, ['animated', 'width']);
|
||||
|
||||
export declare interface IonSlide extends StencilComponents<'IonSlide'> {}
|
||||
@Component({ selector: 'ion-slide', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonSlide extends Components.IonSlide {}
|
||||
@Component({ selector: 'ion-slide', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonSlide {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -770,8 +770,8 @@ export class IonSlide {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonSlides extends StencilComponents<'IonSlides'> {}
|
||||
@Component({ selector: 'ion-slides', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'options', 'pager', 'scrollbar'] })
|
||||
export declare interface IonSlides extends Components.IonSlides {}
|
||||
@Component({ selector: 'ion-slides', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['mode', 'options', 'pager', 'scrollbar'] })
|
||||
export class IonSlides {
|
||||
ionSlidesDidLoad!: EventEmitter<CustomEvent>;
|
||||
ionSlideTap!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -799,8 +799,8 @@ export class IonSlides {
|
|||
proxyMethods(IonSlides, ['update', 'updateAutoHeight', 'slideTo', 'slideNext', 'slidePrev', 'getActiveIndex', 'getPreviousIndex', 'length', 'isEnd', 'isBeginning', 'startAutoplay', 'stopAutoplay', 'lockSwipeToNext', 'lockSwipeToPrev', 'lockSwipes']);
|
||||
proxyInputs(IonSlides, ['mode', 'options', 'pager', 'scrollbar']);
|
||||
|
||||
export declare interface IonSpinner extends StencilComponents<'IonSpinner'> {}
|
||||
@Component({ selector: 'ion-spinner', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'duration', 'name', 'paused'] })
|
||||
export declare interface IonSpinner extends Components.IonSpinner {}
|
||||
@Component({ selector: 'ion-spinner', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'duration', 'name', 'paused'] })
|
||||
export class IonSpinner {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -810,8 +810,8 @@ export class IonSpinner {
|
|||
}
|
||||
proxyInputs(IonSpinner, ['color', 'duration', 'name', 'paused']);
|
||||
|
||||
export declare interface IonSplitPane extends StencilComponents<'IonSplitPane'> {}
|
||||
@Component({ selector: 'ion-split-pane', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['contentId', 'disabled', 'when'] })
|
||||
export declare interface IonSplitPane extends Components.IonSplitPane {}
|
||||
@Component({ selector: 'ion-split-pane', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['contentId', 'disabled', 'when'] })
|
||||
export class IonSplitPane {
|
||||
ionSplitPaneVisible!: EventEmitter<CustomEvent>;
|
||||
protected el: HTMLElement;
|
||||
|
|
@ -823,8 +823,8 @@ export class IonSplitPane {
|
|||
}
|
||||
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 declare interface IonTabBar extends Components.IonTabBar {}
|
||||
@Component({ selector: 'ion-tab-bar', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode', 'selectedTab', 'translucent'] })
|
||||
export class IonTabBar {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -832,10 +832,10 @@ export class IonTabBar {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonTabBar, ['mode', 'color', 'selectedTab', 'translucent']);
|
||||
proxyInputs(IonTabBar, ['color', 'mode', 'selectedTab', 'translucent']);
|
||||
|
||||
export declare interface IonTabButton extends StencilComponents<'IonTabButton'> {}
|
||||
@Component({ selector: 'ion-tab-button', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'disabled', 'download', 'href', 'rel', 'layout', 'selected', 'tab', 'target'] })
|
||||
export declare interface IonTabButton extends Components.IonTabButton {}
|
||||
@Component({ selector: 'ion-tab-button', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['disabled', 'download', 'href', 'layout', 'mode', 'rel', 'selected', 'tab', 'target'] })
|
||||
export class IonTabButton {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -843,10 +843,10 @@ export class IonTabButton {
|
|||
this.el = r.nativeElement;
|
||||
}
|
||||
}
|
||||
proxyInputs(IonTabButton, ['mode', 'disabled', 'download', 'href', 'rel', 'layout', 'selected', 'tab', 'target']);
|
||||
proxyInputs(IonTabButton, ['disabled', 'download', 'href', 'layout', 'mode', 'rel', 'selected', 'tab', 'target']);
|
||||
|
||||
export declare interface IonText extends StencilComponents<'IonText'> {}
|
||||
@Component({ selector: 'ion-text', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export declare interface IonText extends Components.IonText {}
|
||||
@Component({ selector: 'ion-text', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonText {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -856,8 +856,8 @@ export class IonText {
|
|||
}
|
||||
proxyInputs(IonText, ['color', 'mode']);
|
||||
|
||||
export declare interface IonTextarea extends StencilComponents<'IonTextarea'> {}
|
||||
@Component({ selector: 'ion-textarea', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'color', 'autocapitalize', 'autofocus', 'clearOnEdit', 'debounce', 'disabled', 'maxlength', 'minlength', 'name', 'placeholder', 'readonly', 'required', 'spellcheck', 'cols', 'rows', 'wrap', 'autoGrow', 'value'] })
|
||||
export declare interface IonTextarea extends Components.IonTextarea {}
|
||||
@Component({ selector: 'ion-textarea', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['autoGrow', 'autocapitalize', 'autofocus', 'clearOnEdit', 'color', 'cols', 'debounce', 'disabled', 'maxlength', 'minlength', 'mode', 'name', 'placeholder', 'readonly', 'required', 'rows', 'spellcheck', 'value', 'wrap'] })
|
||||
export class IonTextarea {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
ionInput!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -871,10 +871,10 @@ export class IonTextarea {
|
|||
}
|
||||
}
|
||||
proxyMethods(IonTextarea, ['setFocus', 'getInputElement']);
|
||||
proxyInputs(IonTextarea, ['mode', 'color', 'autocapitalize', 'autofocus', 'clearOnEdit', 'debounce', 'disabled', 'maxlength', 'minlength', 'name', 'placeholder', 'readonly', 'required', 'spellcheck', 'cols', 'rows', 'wrap', 'autoGrow', 'value']);
|
||||
proxyInputs(IonTextarea, ['autoGrow', 'autocapitalize', 'autofocus', 'clearOnEdit', 'color', 'cols', 'debounce', 'disabled', 'maxlength', 'minlength', 'mode', 'name', 'placeholder', 'readonly', 'required', 'rows', 'spellcheck', 'value', 'wrap']);
|
||||
|
||||
export declare interface IonThumbnail extends StencilComponents<'IonThumbnail'> {}
|
||||
@Component({ selector: 'ion-thumbnail', changeDetection: 0, template: '<ng-content></ng-content>' })
|
||||
export declare interface IonThumbnail extends Components.IonThumbnail {}
|
||||
@Component({ selector: 'ion-thumbnail', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>' })
|
||||
export class IonThumbnail {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -883,8 +883,8 @@ export class IonThumbnail {
|
|||
}
|
||||
}
|
||||
|
||||
export declare interface IonTitle extends StencilComponents<'IonTitle'> {}
|
||||
@Component({ selector: 'ion-title', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color'] })
|
||||
export declare interface IonTitle extends Components.IonTitle {}
|
||||
@Component({ selector: 'ion-title', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color'] })
|
||||
export class IonTitle {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
@ -894,8 +894,8 @@ export class IonTitle {
|
|||
}
|
||||
proxyInputs(IonTitle, ['color']);
|
||||
|
||||
export declare interface IonToggle extends StencilComponents<'IonToggle'> {}
|
||||
@Component({ selector: 'ion-toggle', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['mode', 'color', 'name', 'checked', 'disabled', 'value'] })
|
||||
export declare interface IonToggle extends Components.IonToggle {}
|
||||
@Component({ selector: 'ion-toggle', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['checked', 'color', 'disabled', 'mode', 'name', 'value'] })
|
||||
export class IonToggle {
|
||||
ionChange!: EventEmitter<CustomEvent>;
|
||||
ionFocus!: EventEmitter<CustomEvent>;
|
||||
|
|
@ -907,10 +907,10 @@ export class IonToggle {
|
|||
proxyOutputs(this, this.el, ['ionChange', 'ionFocus', 'ionBlur']);
|
||||
}
|
||||
}
|
||||
proxyInputs(IonToggle, ['mode', 'color', 'name', 'checked', 'disabled', 'value']);
|
||||
proxyInputs(IonToggle, ['checked', 'color', 'disabled', 'mode', 'name', 'value']);
|
||||
|
||||
export declare interface IonToolbar extends StencilComponents<'IonToolbar'> {}
|
||||
@Component({ selector: 'ion-toolbar', changeDetection: 0, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export declare interface IonToolbar extends Components.IonToolbar {}
|
||||
@Component({ selector: 'ion-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: '<ng-content></ng-content>', inputs: ['color', 'mode'] })
|
||||
export class IonToolbar {
|
||||
protected el: HTMLElement;
|
||||
constructor(c: ChangeDetectorRef, r: ElementRef) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { Inject, Injectable } from '@angular/core';
|
||||
import { ActionSheetOptions } from '@ionic/core';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { ActionSheetOptions, actionSheetController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -8,7 +7,7 @@ import { OverlayBaseController } from '../util/overlay';
|
|||
providedIn: 'root',
|
||||
})
|
||||
export class ActionSheetController extends OverlayBaseController<ActionSheetOptions, HTMLIonActionSheetElement> {
|
||||
constructor(@Inject(DOCUMENT) doc: any) {
|
||||
super('ion-action-sheet-controller', doc);
|
||||
constructor() {
|
||||
super(actionSheetController);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { Inject, Injectable } from '@angular/core';
|
||||
import { AlertOptions } from '@ionic/core';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { AlertOptions, alertController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -8,7 +7,7 @@ import { OverlayBaseController } from '../util/overlay';
|
|||
providedIn: 'root',
|
||||
})
|
||||
export class AlertController extends OverlayBaseController<AlertOptions, HTMLIonAlertElement> {
|
||||
constructor(@Inject(DOCUMENT) doc: any) {
|
||||
super('ion-alert-controller', doc);
|
||||
constructor() {
|
||||
super(alertController);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { Inject, Injectable } from '@angular/core';
|
||||
import { LoadingOptions } from '@ionic/core';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { LoadingOptions, loadingController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -8,7 +7,7 @@ import { OverlayBaseController } from '../util/overlay';
|
|||
providedIn: 'root',
|
||||
})
|
||||
export class LoadingController extends OverlayBaseController<LoadingOptions, HTMLIonLoadingElement> {
|
||||
constructor(@Inject(DOCUMENT) doc: any) {
|
||||
super('ion-loading-controller', doc);
|
||||
constructor() {
|
||||
super(loadingController);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { ComponentFactoryResolver, Inject, Injectable, Injector } from '@angular/core';
|
||||
import { ModalOptions } from '@ionic/core';
|
||||
import { ComponentFactoryResolver, Injectable, Injector } from '@angular/core';
|
||||
import { ModalOptions, modalController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -13,9 +12,8 @@ export class ModalController extends OverlayBaseController<ModalOptions, HTMLIon
|
|||
private angularDelegate: AngularDelegate,
|
||||
private resolver: ComponentFactoryResolver,
|
||||
private injector: Injector,
|
||||
@Inject(DOCUMENT) doc: any
|
||||
) {
|
||||
super('ion-modal-controller', doc);
|
||||
super(modalController);
|
||||
}
|
||||
|
||||
create(opts: ModalOptions): Promise<HTMLIonModalElement> {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { Inject, Injectable } from '@angular/core';
|
||||
import { PickerOptions } from '@ionic/core';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { PickerOptions, pickerController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -8,7 +7,7 @@ import { OverlayBaseController } from '../util/overlay';
|
|||
providedIn: 'root',
|
||||
})
|
||||
export class PickerController extends OverlayBaseController<PickerOptions, HTMLIonPickerElement> {
|
||||
constructor(@Inject(DOCUMENT) doc: any) {
|
||||
super('ion-picker-controller', doc);
|
||||
constructor() {
|
||||
super(pickerController);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { ComponentFactoryResolver, Inject, Injectable, Injector } from '@angular/core';
|
||||
import { PopoverOptions } from '@ionic/core';
|
||||
import { ComponentFactoryResolver, Injectable, Injector } from '@angular/core';
|
||||
import { PopoverOptions, popoverController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -13,9 +12,8 @@ export class PopoverController extends OverlayBaseController<PopoverOptions, HTM
|
|||
private angularDelegate: AngularDelegate,
|
||||
private resolver: ComponentFactoryResolver,
|
||||
private injector: Injector,
|
||||
@Inject(DOCUMENT) doc: any
|
||||
) {
|
||||
super('ion-popover-controller', doc);
|
||||
super(popoverController);
|
||||
}
|
||||
|
||||
create(opts: PopoverOptions): Promise<HTMLIonPopoverElement> {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { DOCUMENT } from '@angular/common';
|
||||
import { Inject, Injectable } from '@angular/core';
|
||||
import { ToastOptions } from '@ionic/core';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { ToastOptions, toastController } from '@ionic/core';
|
||||
|
||||
import { OverlayBaseController } from '../util/overlay';
|
||||
|
||||
|
|
@ -8,7 +7,7 @@ import { OverlayBaseController } from '../util/overlay';
|
|||
providedIn: 'root',
|
||||
})
|
||||
export class ToastController extends OverlayBaseController<ToastOptions, HTMLIonToastElement> {
|
||||
constructor(@Inject(DOCUMENT) doc: any) {
|
||||
super('ion-toast-controller', doc);
|
||||
constructor() {
|
||||
super(toastController);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
|
||||
export interface IonicGlobal {
|
||||
config?: any;
|
||||
ael?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;
|
||||
raf?: (ts: number) => void;
|
||||
rel?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;
|
||||
asyncQueue?: boolean;
|
||||
}
|
||||
|
||||
export interface IonicWindow extends Window {
|
||||
Ionic: IonicGlobal;
|
||||
__zone_symbol__requestAnimationFrame: (ts: number) => void;
|
||||
__zone_symbol__requestAnimationFrame?: (ts: FrameRequestCallback) => number;
|
||||
}
|
||||
|
||||
export interface HTMLStencilElement extends HTMLElement {
|
||||
componentOnReady(): Promise<this>;
|
||||
forceUpdate(): void;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,26 +1,31 @@
|
|||
import { proxyMethod } from './util';
|
||||
|
||||
export class OverlayBaseController<Opts, Overlay> {
|
||||
constructor(private ctrl: string, private doc: Document) {}
|
||||
interface ControllerShape<Opts, HTMLElm> {
|
||||
create(options: Opts): Promise<HTMLElm>;
|
||||
dismiss(data?: any, role?: string, id?: string): Promise<boolean>;
|
||||
getTop(): Promise<HTMLElm | undefined>;
|
||||
}
|
||||
|
||||
export class OverlayBaseController<Opts, Overlay> implements ControllerShape<Opts, Overlay> {
|
||||
constructor(private ctrl: ControllerShape<Opts, Overlay>) {}
|
||||
|
||||
/**
|
||||
* Creates a new overlay
|
||||
*/
|
||||
create(opts?: Opts): Promise<Overlay> {
|
||||
return proxyMethod(this.ctrl, this.doc, 'create', opts);
|
||||
create(opts: Opts) {
|
||||
return this.ctrl.create(opts);
|
||||
}
|
||||
|
||||
/**
|
||||
* When `id` is not provided, it dismisses the top overlay.
|
||||
*/
|
||||
dismiss(data?: any, role?: string, id?: string): Promise<void> {
|
||||
return proxyMethod(this.ctrl, this.doc, 'dismiss', data, role, id);
|
||||
dismiss(data?: any, role?: string, id?: string) {
|
||||
return this.ctrl.dismiss(data, role, id);
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the top overlay.
|
||||
*/
|
||||
getTop(): Promise<Overlay | undefined> {
|
||||
return proxyMethod(this.ctrl, this.doc, 'getTop');
|
||||
getTop() {
|
||||
return this.ctrl.getTop();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
import { HTMLStencilElement } from '../types/interfaces';
|
||||
|
||||
export function proxyMethod(ctrlName: string, doc: Document, methodName: string, ...args: any[]) {
|
||||
const controller = ensureElementInBody(ctrlName, doc);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { browser, element, by, protractor } from 'protractor';
|
||||
import { waitTime, testStack, testLifeCycle, handleErrorMessages } from './utils';
|
||||
import { HttpUrlEncodingCodec } from '@angular/common/http';
|
||||
|
||||
const EC = protractor.ExpectedConditions;
|
||||
|
||||
|
|
@ -8,36 +7,38 @@ describe('router-link params and fragments', () => {
|
|||
const queryParam = 'A&=#Y';
|
||||
const fragment = 'myDiv1';
|
||||
const id = 'MyPageID==';
|
||||
|
||||
|
||||
afterEach(() => {
|
||||
handleErrorMessages();
|
||||
});
|
||||
|
||||
|
||||
it('should go to a page with properly encoded values', async () => {
|
||||
await browser.get('/router-link?ionic:_testing=true');
|
||||
await element(by.css('#queryParamsFragment')).click();
|
||||
|
||||
|
||||
const expectedRoute = `${encodeURIComponent(id)}?token=${encodeURIComponent(queryParam)}#${encodeURIComponent(fragment)}`;
|
||||
|
||||
browser.wait(EC.urlContains(expectedRoute), 5000);
|
||||
});
|
||||
|
||||
|
||||
it('should return to a page with preserved query param and fragment', async () => {
|
||||
await browser.get('/router-link?ionic:_testing=true');
|
||||
await element(by.css('#queryParamsFragment')).click();
|
||||
await element(by.css('#goToPage3')).click();
|
||||
|
||||
await waitTime(200);
|
||||
await element(by.css('#goToPage3')).click();
|
||||
|
||||
browser.wait(EC.urlContains('router-link-page3'), 5000);
|
||||
|
||||
await element(by.css('#goBackFromPage3')).click();
|
||||
|
||||
await waitTime(200);
|
||||
|
||||
await element(by.css('#goBackFromPage3')).click();
|
||||
|
||||
const expectedRoute = `${encodeURIComponent(id)}?token=${encodeURIComponent(queryParam)}#${encodeURIComponent(fragment)}`;
|
||||
browser.wait(EC.urlContains(expectedRoute), 5000);
|
||||
});
|
||||
|
||||
|
||||
it('should preserve query param and fragment with defaultHref string', async () => {
|
||||
await browser.get('/router-link-page3?ionic:_testing=true');
|
||||
|
||||
|
||||
await element(by.css('#goBackFromPage3')).click();
|
||||
|
||||
const expectedRoute = '?token=ABC#fragment';
|
||||
|
|
|
|||
|
|
@ -140,6 +140,7 @@ describe('tabs', () => {
|
|||
const tab = await getSelectedTab();
|
||||
await tab.$('#goto-nested-page1').click();
|
||||
|
||||
await waitTime(600);
|
||||
await testStack('app-nested-outlet ion-router-outlet', ['app-nested-outlet-page']);
|
||||
|
||||
const nestedOutlet = await element(by.css('app-nested-outlet'));
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@
|
|||
"dependencies": {
|
||||
"source-map": {
|
||||
"version": "0.5.6",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
|
||||
"resolved": "http://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
|
||||
"integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -421,7 +421,7 @@
|
|||
},
|
||||
"load-json-file": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
|
||||
"integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -463,7 +463,7 @@
|
|||
},
|
||||
"minimist": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -489,7 +489,7 @@
|
|||
},
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -953,7 +953,7 @@
|
|||
},
|
||||
"@types/q": {
|
||||
"version": "0.0.32",
|
||||
"resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
|
||||
"resolved": "http://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
|
||||
"integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -1348,6 +1348,7 @@
|
|||
"resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
|
||||
"integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"delegates": "^1.0.0",
|
||||
"readable-stream": "^2.0.6"
|
||||
|
|
@ -1476,7 +1477,7 @@
|
|||
},
|
||||
"util": {
|
||||
"version": "0.10.3",
|
||||
"resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
|
||||
"resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz",
|
||||
"integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -1499,7 +1500,7 @@
|
|||
},
|
||||
"async": {
|
||||
"version": "1.5.2",
|
||||
"resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
|
||||
"resolved": "http://registry.npmjs.org/async/-/async-1.5.2.tgz",
|
||||
"integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -1579,7 +1580,7 @@
|
|||
},
|
||||
"chalk": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
|
||||
"resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
|
||||
"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -1837,7 +1838,7 @@
|
|||
"dependencies": {
|
||||
"minimist": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
|
||||
"dev": true
|
||||
}
|
||||
|
|
@ -1934,7 +1935,7 @@
|
|||
},
|
||||
"browserify-aes": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
|
||||
"integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -1971,7 +1972,7 @@
|
|||
},
|
||||
"browserify-rsa": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
|
||||
"integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -2025,7 +2026,7 @@
|
|||
},
|
||||
"buffer": {
|
||||
"version": "4.9.1",
|
||||
"resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
|
||||
"integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -2100,7 +2101,7 @@
|
|||
},
|
||||
"cacache": {
|
||||
"version": "10.0.4",
|
||||
"resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
|
||||
"resolved": "http://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
|
||||
"integrity": "sha512-Dph0MzuH+rTQzGPNT9fAnrPmMmjKfST6trxJeK7NQuHRaVw24VzPRWTmg9MpcwOVQZO0E1FBICUlFeNaKPIfHA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -2151,7 +2152,7 @@
|
|||
},
|
||||
"camelcase-keys": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
|
||||
"integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -2558,7 +2559,8 @@
|
|||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
|
||||
"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"constants-browserify": {
|
||||
"version": "1.0.0",
|
||||
|
|
@ -2682,7 +2684,7 @@
|
|||
},
|
||||
"create-hash": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
|
||||
"integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -2695,7 +2697,7 @@
|
|||
},
|
||||
"create-hmac": {
|
||||
"version": "1.1.7",
|
||||
"resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
|
||||
"resolved": "http://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
|
||||
"integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -2929,7 +2931,7 @@
|
|||
"dependencies": {
|
||||
"globby": {
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
|
||||
"integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -2942,7 +2944,7 @@
|
|||
"dependencies": {
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
}
|
||||
|
|
@ -2960,7 +2962,8 @@
|
|||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
|
||||
"integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"depd": {
|
||||
"version": "1.1.2",
|
||||
|
|
@ -3019,7 +3022,7 @@
|
|||
},
|
||||
"diffie-hellman": {
|
||||
"version": "5.0.3",
|
||||
"resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
|
||||
"resolved": "http://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
|
||||
"integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -3186,7 +3189,7 @@
|
|||
},
|
||||
"engine.io-client": {
|
||||
"version": "3.2.1",
|
||||
"resolved": "http://registry.npmjs.org/engine.io-client/-/engine.io-client-3.2.1.tgz",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-3.2.1.tgz",
|
||||
"integrity": "sha512-y5AbkytWeM4jQr7m/koQLc5AxpRKC1hEVUb/s1FUAWEJq5AzJJ4NLvzuKPuxtDi5Mq755WuDvZ6Iv2rXj4PTzw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -3310,7 +3313,7 @@
|
|||
"dependencies": {
|
||||
"source-map": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
|
||||
"integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -3474,7 +3477,7 @@
|
|||
},
|
||||
"expand-range": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "http://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
|
||||
"resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
|
||||
"integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -3533,7 +3536,7 @@
|
|||
},
|
||||
"expand-range": {
|
||||
"version": "1.8.2",
|
||||
"resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
|
||||
"resolved": "http://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
|
||||
"integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -3847,7 +3850,7 @@
|
|||
},
|
||||
"finalhandler": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/finalhandler/-/finalhandler-1.1.1.tgz",
|
||||
"integrity": "sha512-Y1GUDo39ez4aHAw7MysnUD5JzYX+WaIj8I57kO3aEPT1fFRL4sr7mjei97FgnwhAyyzRYmQZaTHb2+9uZ1dPtg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -3880,6 +3883,12 @@
|
|||
"locate-path": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"flatted": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.0.tgz",
|
||||
"integrity": "sha512-R+H8IZclI8AAkSBRQJLVOsxwAoHd6WC40b4QTNWIjzAa6BXOBfQcM587MXDTVPeYaopFNWHUFLx7eNmHDSxMWg==",
|
||||
"dev": true
|
||||
},
|
||||
"flush-write-stream": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.0.3.tgz",
|
||||
|
|
@ -4029,7 +4038,8 @@
|
|||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"aproba": {
|
||||
"version": "1.2.0",
|
||||
|
|
@ -4050,12 +4060,14 @@
|
|||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
|
|
@ -4070,17 +4082,20 @@
|
|||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
|
|
@ -4197,7 +4212,8 @@
|
|||
"inherits": {
|
||||
"version": "2.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
|
|
@ -4209,6 +4225,7 @@
|
|||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
|
|
@ -4223,6 +4240,7 @@
|
|||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
|
|
@ -4230,12 +4248,14 @@
|
|||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.2.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.1",
|
||||
"yallist": "^3.0.0"
|
||||
|
|
@ -4254,6 +4274,7 @@
|
|||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
|
|
@ -4334,7 +4355,8 @@
|
|||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
|
|
@ -4346,6 +4368,7 @@
|
|||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
|
|
@ -4431,7 +4454,8 @@
|
|||
"safe-buffer": {
|
||||
"version": "5.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
|
|
@ -4467,6 +4491,7 @@
|
|||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
|
|
@ -4486,6 +4511,7 @@
|
|||
"version": "3.0.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
}
|
||||
|
|
@ -4529,12 +4555,14 @@
|
|||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"yallist": {
|
||||
"version": "3.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -4543,6 +4571,7 @@
|
|||
"resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
|
||||
"integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"graceful-fs": "^4.1.2",
|
||||
"inherits": "~2.0.0",
|
||||
|
|
@ -4555,6 +4584,7 @@
|
|||
"resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
|
||||
"integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"aproba": "^1.0.3",
|
||||
"console-control-strings": "^1.0.0",
|
||||
|
|
@ -4592,11 +4622,12 @@
|
|||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
|
||||
"integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"get-stream": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
|
||||
"integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -4817,7 +4848,8 @@
|
|||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
|
||||
"integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"has-value": {
|
||||
"version": "1.0.0",
|
||||
|
|
@ -4970,7 +5002,7 @@
|
|||
},
|
||||
"http-proxy-middleware": {
|
||||
"version": "0.18.0",
|
||||
"resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.18.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.18.0.tgz",
|
||||
"integrity": "sha512-Fs25KVMPAIIcgjMZkVHJoKg9VcXcC1C8yb9JUgeDvVXY0S/zgVIhMb+qVswDIgtJe2DfckMSY2d6TuTEutlk6Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -5578,7 +5610,8 @@
|
|||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
|
||||
"integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"is-windows": {
|
||||
"version": "1.0.2",
|
||||
|
|
@ -5755,7 +5788,7 @@
|
|||
},
|
||||
"fast-deep-equal": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz",
|
||||
"integrity": "sha1-wFNHeBfIa1HaqFPIHgWbcz0CNhQ=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -5955,7 +5988,7 @@
|
|||
},
|
||||
"jsesc": {
|
||||
"version": "1.3.0",
|
||||
"resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
|
||||
"integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -5991,7 +6024,7 @@
|
|||
},
|
||||
"json5": {
|
||||
"version": "0.5.1",
|
||||
"resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
|
||||
"integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -6028,13 +6061,13 @@
|
|||
"dependencies": {
|
||||
"core-js": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/core-js/-/core-js-2.3.0.tgz",
|
||||
"integrity": "sha1-+rg/uwstjchfpjbEudNMdUIMbWU=",
|
||||
"dev": true
|
||||
},
|
||||
"es6-promise": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.0.2.tgz",
|
||||
"resolved": "http://registry.npmjs.org/es6-promise/-/es6-promise-3.0.2.tgz",
|
||||
"integrity": "sha1-AQ1YWEI6XxGJeWZfRkhqlcbuK7Y=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -6046,7 +6079,7 @@
|
|||
},
|
||||
"readable-stream": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
|
||||
"resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
|
||||
"integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -6060,16 +6093,16 @@
|
|||
},
|
||||
"string_decoder": {
|
||||
"version": "0.10.31",
|
||||
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
|
||||
"resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
|
||||
"integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"karma": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/karma/-/karma-3.1.1.tgz",
|
||||
"integrity": "sha512-NetT3wPCQMNB36uiL9LLyhrOt8SQwrEKt0xD3+KpTCfm0VxVyUJdPL5oTq2Ic5ouemgL/Iz4wqXEbF3zea9kQQ==",
|
||||
"version": "3.1.4",
|
||||
"resolved": "https://registry.npmjs.org/karma/-/karma-3.1.4.tgz",
|
||||
"integrity": "sha512-31Vo8Qr5glN+dZEVIpnPCxEGleqE0EY6CtC2X9TagRV3rRQ3SNrvfhddICkJgUK3AgqpeKSZau03QumTGhGoSw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"bluebird": "^3.3.0",
|
||||
|
|
@ -6082,11 +6115,12 @@
|
|||
"di": "^0.0.1",
|
||||
"dom-serialize": "^2.2.0",
|
||||
"expand-braces": "^0.1.1",
|
||||
"flatted": "^2.0.0",
|
||||
"glob": "^7.1.1",
|
||||
"graceful-fs": "^4.1.2",
|
||||
"http-proxy": "^1.13.0",
|
||||
"isbinaryfile": "^3.0.0",
|
||||
"lodash": "^4.17.4",
|
||||
"lodash": "^4.17.5",
|
||||
"log4js": "^3.0.0",
|
||||
"mime": "^2.3.1",
|
||||
"minimatch": "^3.0.2",
|
||||
|
|
@ -6098,13 +6132,13 @@
|
|||
"socket.io": "2.1.1",
|
||||
"source-map": "^0.6.1",
|
||||
"tmp": "0.0.33",
|
||||
"useragent": "2.2.1"
|
||||
"useragent": "2.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"mime": {
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/mime/-/mime-2.4.0.tgz",
|
||||
"integrity": "sha512-ikBcWwyqXQSHKtciCcctu9YfPbFYZ4+gbHEmE0Q8jzcTYQg5dHCr3g2wwAZjPoJfQVXZq6KXAjpXOTf5/cjT7w==",
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/mime/-/mime-2.4.2.tgz",
|
||||
"integrity": "sha512-zJBfZDkwRu+j3Pdd2aHsR5GfH2jIWhmL1ZzBoc+X+3JEti2hbArWcyJ+1laC1D2/U/W1a/+Cegj0/OnEU2ybjg==",
|
||||
"dev": true
|
||||
},
|
||||
"source-map": {
|
||||
|
|
@ -6248,9 +6282,10 @@
|
|||
},
|
||||
"load-json-file": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
|
||||
"integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"graceful-fs": "^4.1.2",
|
||||
"parse-json": "^2.2.0",
|
||||
|
|
@ -6261,9 +6296,10 @@
|
|||
"dependencies": {
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -6532,7 +6568,8 @@
|
|||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
|
||||
"integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"map-visit": {
|
||||
"version": "1.0.0",
|
||||
|
|
@ -6589,7 +6626,7 @@
|
|||
},
|
||||
"meow": {
|
||||
"version": "3.7.0",
|
||||
"resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
|
||||
"integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -6608,7 +6645,7 @@
|
|||
"dependencies": {
|
||||
"minimist": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
|
|
@ -6935,7 +6972,7 @@
|
|||
"dependencies": {
|
||||
"semver": {
|
||||
"version": "5.3.0",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
|
||||
"integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
|
|
@ -7027,7 +7064,7 @@
|
|||
},
|
||||
"chalk": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
|
||||
"resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
|
||||
"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -7151,6 +7188,7 @@
|
|||
"resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
|
||||
"integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"are-we-there-yet": "~1.1.2",
|
||||
"console-control-strings": "~1.1.0",
|
||||
|
|
@ -7367,7 +7405,7 @@
|
|||
},
|
||||
"os-locale": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
|
||||
"integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -7405,7 +7443,7 @@
|
|||
},
|
||||
"p-is-promise": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/p-is-promise/-/p-is-promise-1.1.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/p-is-promise/-/p-is-promise-1.1.0.tgz",
|
||||
"integrity": "sha1-nJRWmJ6fZYgBewQ01WCXZ1w9oF4=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -7984,7 +8022,7 @@
|
|||
},
|
||||
"chalk": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
|
||||
"resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
|
||||
"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -8012,7 +8050,7 @@
|
|||
},
|
||||
"globby": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
|
||||
"integrity": "sha1-69hGZ8oNuzMLmbz8aOrCvFQ3Dg0=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -8026,13 +8064,13 @@
|
|||
},
|
||||
"minimist": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
|
||||
"dev": true
|
||||
},
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -8256,7 +8294,7 @@
|
|||
"dependencies": {
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
}
|
||||
|
|
@ -8267,6 +8305,7 @@
|
|||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
|
||||
"integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"load-json-file": "^1.0.0",
|
||||
"normalize-package-data": "^2.3.2",
|
||||
|
|
@ -8278,6 +8317,7 @@
|
|||
"resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
|
||||
"integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"graceful-fs": "^4.1.2",
|
||||
"pify": "^2.0.0",
|
||||
|
|
@ -8286,9 +8326,10 @@
|
|||
},
|
||||
"pify": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -8297,6 +8338,7 @@
|
|||
"resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
|
||||
"integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"find-up": "^1.0.0",
|
||||
"read-pkg": "^1.0.0"
|
||||
|
|
@ -8307,6 +8349,7 @@
|
|||
"resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
|
||||
"integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"path-exists": "^2.0.0",
|
||||
"pinkie-promise": "^2.0.0"
|
||||
|
|
@ -8317,6 +8360,7 @@
|
|||
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
|
||||
"integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"pinkie-promise": "^2.0.0"
|
||||
}
|
||||
|
|
@ -8678,7 +8722,7 @@
|
|||
},
|
||||
"sax": {
|
||||
"version": "0.5.8",
|
||||
"resolved": "https://registry.npmjs.org/sax/-/sax-0.5.8.tgz",
|
||||
"resolved": "http://registry.npmjs.org/sax/-/sax-0.5.8.tgz",
|
||||
"integrity": "sha1-1HLbIo6zMcJQaw6MFVJK25OdEsE=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -8706,7 +8750,7 @@
|
|||
"dependencies": {
|
||||
"source-map": {
|
||||
"version": "0.4.4",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
|
||||
"resolved": "http://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
|
||||
"integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -8883,7 +8927,7 @@
|
|||
},
|
||||
"sha.js": {
|
||||
"version": "2.4.11",
|
||||
"resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
|
||||
"resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
|
||||
"integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -9133,7 +9177,7 @@
|
|||
},
|
||||
"socket.io-parser": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "http://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.2.0.tgz",
|
||||
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.2.0.tgz",
|
||||
"integrity": "sha512-FYiBx7rc/KORMJlgsXysflWx/RIvtqZbyGLlHZvjfmPTPeuD/I8MaW7cfFrj5tRltICJdgwflhfZ3NVVbVLFQA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -9507,7 +9551,7 @@
|
|||
},
|
||||
"stream-browserify": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
|
||||
"integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -9595,7 +9639,7 @@
|
|||
},
|
||||
"strip-ansi": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
|
||||
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -9607,13 +9651,14 @@
|
|||
"resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
|
||||
"integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"is-utf8": "^0.2.0"
|
||||
}
|
||||
},
|
||||
"strip-eof": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
|
||||
"integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
@ -9667,7 +9712,7 @@
|
|||
},
|
||||
"source-map": {
|
||||
"version": "0.1.43",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
|
||||
"resolved": "http://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
|
||||
"integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -9710,7 +9755,7 @@
|
|||
},
|
||||
"tar": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
|
||||
"resolved": "http://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
|
||||
"integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
|
|
@ -10343,21 +10388,13 @@
|
|||
"dev": true
|
||||
},
|
||||
"useragent": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.1.tgz",
|
||||
"integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4=",
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/useragent/-/useragent-2.3.0.tgz",
|
||||
"integrity": "sha512-4AoH4pxuSvHCjqLO04sU6U/uE65BYza8l/KKBS0b0hnUPWi+cQ2BpeTEwejCSx9SPV5/U03nniDTrWx5NrmKdw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"lru-cache": "2.2.x",
|
||||
"lru-cache": "4.1.x",
|
||||
"tmp": "0.0.x"
|
||||
},
|
||||
"dependencies": {
|
||||
"lru-cache": {
|
||||
"version": "2.2.4",
|
||||
"resolved": "http://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
|
||||
"integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0=",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"util": {
|
||||
|
|
@ -10530,7 +10567,7 @@
|
|||
},
|
||||
"source-map": {
|
||||
"version": "0.4.4",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
|
||||
"resolved": "http://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
|
||||
"integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -10930,6 +10967,7 @@
|
|||
"resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
|
||||
"integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"string-width": "^1.0.2 || 2"
|
||||
}
|
||||
|
|
@ -10951,7 +10989,7 @@
|
|||
},
|
||||
"wrap-ansi": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
|
||||
"resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
|
||||
"integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -10996,7 +11034,7 @@
|
|||
},
|
||||
"xmlbuilder": {
|
||||
"version": "9.0.7",
|
||||
"resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-9.0.7.tgz",
|
||||
"resolved": "http://registry.npmjs.org/xmlbuilder/-/xmlbuilder-9.0.7.tgz",
|
||||
"integrity": "sha1-Ey7mPS7FVlxVfiD0wi35rKaGsQ0=",
|
||||
"dev": true
|
||||
},
|
||||
|
|
|
|||
|
|
@ -32,9 +32,9 @@
|
|||
"@angular/cli": "~7.2.1",
|
||||
"@angular/compiler-cli": "~7.2.1",
|
||||
"@angular/language-service": "~7.2.1",
|
||||
"@types/node": "~8.9.4",
|
||||
"@types/jasmine": "~2.8.8",
|
||||
"@types/jasminewd2": "~2.0.3",
|
||||
"@types/node": "~8.9.4",
|
||||
"codelyzer": "~4.5.0",
|
||||
"jasmine-core": "~2.99.1",
|
||||
"jasmine-spec-reporter": "~4.2.1",
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ cp -a ../../package.json node_modules/@ionic/angular/package.json
|
|||
|
||||
# Copy core dist
|
||||
rm -rf node_modules/@ionic/core/dist
|
||||
rm -rf node_modules/@ionic/core/loader
|
||||
cp -a ../../../core/dist node_modules/@ionic/core/dist
|
||||
cp -a ../../../core/loader node_modules/@ionic/core/loader
|
||||
cp -a ../../../core/package.json node_modules/@ionic/core/package.json
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>
|
||||
Modal test
|
||||
</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content padding>
|
||||
<ion-button (click)="openAlert()" id="action-button">Open Alert</ion-button>
|
||||
</ion-content>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
import { Component, NgZone } from '@angular/core';
|
||||
import { AlertController } from '@ionic/angular';
|
||||
import { NavComponent } from '../nav/nav.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-alert',
|
||||
templateUrl: './alert.component.html',
|
||||
})
|
||||
export class AlertComponent {
|
||||
|
||||
constructor(
|
||||
private alertCtrl: AlertController
|
||||
) { }
|
||||
|
||||
async openAlert() {
|
||||
const alert = await this.alertCtrl.create({
|
||||
header: 'Hello',
|
||||
message: 'Some text'
|
||||
});
|
||||
await alert.present();
|
||||
}
|
||||
}
|
||||
|
|
@ -23,9 +23,11 @@ import { FormComponent } from './form/form.component';
|
|||
import { NavigationPage1Component } from './navigation-page1/navigation-page1.component';
|
||||
import { NavigationPage2Component } from './navigation-page2/navigation-page2.component';
|
||||
import { NavigationPage3Component } from './navigation-page3/navigation-page3.component';
|
||||
import { AlertComponent } from './alert/alert.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{ path: '', component: HomePageComponent },
|
||||
{ path: 'alerts', component: AlertComponent },
|
||||
{ path: 'inputs', component: InputsComponent },
|
||||
{ path: 'form', component: FormComponent },
|
||||
{ path: 'modals', component: ModalComponent },
|
||||
|
|
|
|||
|
|
@ -32,6 +32,7 @@ import { FormComponent } from './form/form.component';
|
|||
import { NavigationPage1Component } from './navigation-page1/navigation-page1.component';
|
||||
import { NavigationPage2Component } from './navigation-page2/navigation-page2.component';
|
||||
import { NavigationPage3Component } from './navigation-page3/navigation-page3.component';
|
||||
import { AlertComponent } from './alert/alert.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
|
@ -61,7 +62,8 @@ import { NavigationPage3Component } from './navigation-page3/navigation-page3.co
|
|||
FormComponent,
|
||||
NavigationPage1Component,
|
||||
NavigationPage2Component,
|
||||
NavigationPage3Component
|
||||
NavigationPage3Component,
|
||||
AlertComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
|
|
|||
|
|
@ -7,6 +7,11 @@
|
|||
</ion-header>
|
||||
<ion-content>
|
||||
<ion-list>
|
||||
<ion-item routerLink="/alerts">
|
||||
<ion-label>
|
||||
Alerts test
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-item routerLink="/inputs">
|
||||
<ion-label>
|
||||
Inputs test
|
||||
|
|
|
|||
|
|
@ -23,8 +23,9 @@ The Ionic Core package contains the Web Components that make up the reusable UI
|
|||
Easiest way to start using Ionic Core is by adding a script tag to the CDN:
|
||||
|
||||
```html
|
||||
<link href="https://unpkg.com/@ionic/core@4.5.0/css/ionic.bundle.css" rel="stylesheet">
|
||||
<script src="https://unpkg.com/@ionic/core@4.5.0/dist/ionic.js"></script>
|
||||
<script type="module" src="https://unpkg.com/@ionic/core@one/dist/ionic/ionic.esm.js"></script>
|
||||
<script nomodule src="https://unpkg.com/@ionic/core@one/dist/ionic/ionic.js"></script>
|
||||
<link href="https://unpkg.com/@ionic/core@4.4.0/css/ionic.bundle.css" rel="stylesheet">
|
||||
```
|
||||
|
||||
Any Ionic component added to the webpage will automatically load. This includes writing the component tag directly in HTML, or using JavaScript such as `document.createElement('ion-toggle')`.
|
||||
|
|
|
|||
433
core/api.txt
433
core/api.txt
|
|
@ -1,9 +1,4 @@
|
|||
|
||||
ion-action-sheet-controller,none
|
||||
ion-action-sheet-controller,method,create,create(options: ActionSheetOptions) => Promise<HTMLIonActionSheetElement>
|
||||
ion-action-sheet-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-action-sheet-controller,method,getTop,getTop() => Promise<HTMLIonActionSheetElement | undefined>
|
||||
|
||||
ion-action-sheet,scoped
|
||||
ion-action-sheet,prop,animated,boolean,true,false,false
|
||||
ion-action-sheet,prop,backdropDismiss,boolean,true,false,false
|
||||
|
|
@ -20,9 +15,9 @@ ion-action-sheet,method,dismiss,dismiss(data?: any, role?: string | undefined) =
|
|||
ion-action-sheet,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-action-sheet,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-action-sheet,method,present,present() => Promise<void>
|
||||
ion-action-sheet,event,ionActionSheetDidDismiss,OverlayEventDetail,true
|
||||
ion-action-sheet,event,ionActionSheetDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-action-sheet,event,ionActionSheetDidPresent,void,true
|
||||
ion-action-sheet,event,ionActionSheetWillDismiss,OverlayEventDetail,true
|
||||
ion-action-sheet,event,ionActionSheetWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-action-sheet,event,ionActionSheetWillPresent,void,true
|
||||
ion-action-sheet,css-prop,--background
|
||||
ion-action-sheet,css-prop,--background-activated
|
||||
|
|
@ -35,10 +30,10 @@ ion-action-sheet,css-prop,--min-height
|
|||
ion-action-sheet,css-prop,--min-width
|
||||
ion-action-sheet,css-prop,--width
|
||||
|
||||
ion-alert-controller,none
|
||||
ion-alert-controller,method,create,create(options: AlertOptions) => Promise<HTMLIonAlertElement>
|
||||
ion-alert-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-alert-controller,method,getTop,getTop() => Promise<HTMLIonAlertElement | undefined>
|
||||
ion-action-sheet-controller,none
|
||||
ion-action-sheet-controller,method,create,create(options: ActionSheetOptions) => Promise<HTMLIonActionSheetElement>
|
||||
ion-action-sheet-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-action-sheet-controller,method,getTop,getTop() => Promise<HTMLIonActionSheetElement | undefined>
|
||||
|
||||
ion-alert,scoped
|
||||
ion-alert,prop,animated,boolean,true,false,false
|
||||
|
|
@ -58,9 +53,9 @@ ion-alert,method,dismiss,dismiss(data?: any, role?: string | undefined) => Promi
|
|||
ion-alert,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-alert,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-alert,method,present,present() => Promise<void>
|
||||
ion-alert,event,ionAlertDidDismiss,OverlayEventDetail,true
|
||||
ion-alert,event,ionAlertDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-alert,event,ionAlertDidPresent,void,true
|
||||
ion-alert,event,ionAlertWillDismiss,OverlayEventDetail,true
|
||||
ion-alert,event,ionAlertWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-alert,event,ionAlertWillPresent,void,true
|
||||
ion-alert,css-prop,--background
|
||||
ion-alert,css-prop,--height
|
||||
|
|
@ -70,6 +65,11 @@ ion-alert,css-prop,--min-height
|
|||
ion-alert,css-prop,--min-width
|
||||
ion-alert,css-prop,--width
|
||||
|
||||
ion-alert-controller,none
|
||||
ion-alert-controller,method,create,create(options: AlertOptions) => Promise<HTMLIonAlertElement>
|
||||
ion-alert-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-alert-controller,method,getTop,getTop() => Promise<HTMLIonAlertElement | undefined>
|
||||
|
||||
ion-anchor,shadow
|
||||
ion-anchor,prop,color,string | undefined,undefined,false,false
|
||||
ion-anchor,prop,download,string | undefined,undefined,false,false
|
||||
|
|
@ -181,6 +181,20 @@ ion-button,css-prop,--transition
|
|||
|
||||
ion-buttons,scoped
|
||||
|
||||
ion-card,scoped
|
||||
ion-card,prop,button,boolean,false,false,false
|
||||
ion-card,prop,color,string | undefined,undefined,false,false
|
||||
ion-card,prop,disabled,boolean,false,false,false
|
||||
ion-card,prop,download,string | undefined,undefined,false,false
|
||||
ion-card,prop,href,string | undefined,undefined,false,false
|
||||
ion-card,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-card,prop,rel,string | undefined,undefined,false,false
|
||||
ion-card,prop,routerDirection,"back" | "forward" | "root",'forward',false,false
|
||||
ion-card,prop,target,string | undefined,undefined,false,false
|
||||
ion-card,prop,type,"button" | "reset" | "submit",'button',false,false
|
||||
ion-card,css-prop,--background
|
||||
ion-card,css-prop,--color
|
||||
|
||||
ion-card-content,none
|
||||
ion-card-content,prop,mode,"ios" | "md",undefined,false,false
|
||||
|
||||
|
|
@ -199,20 +213,6 @@ ion-card-title,prop,color,string | undefined,undefined,false,false
|
|||
ion-card-title,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-card-title,css-prop,--color
|
||||
|
||||
ion-card,scoped
|
||||
ion-card,prop,button,boolean,false,false,false
|
||||
ion-card,prop,color,string | undefined,undefined,false,false
|
||||
ion-card,prop,disabled,boolean,false,false,false
|
||||
ion-card,prop,download,string | undefined,undefined,false,false
|
||||
ion-card,prop,href,string | undefined,undefined,false,false
|
||||
ion-card,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-card,prop,rel,string | undefined,undefined,false,false
|
||||
ion-card,prop,routerDirection,"back" | "forward" | "root",'forward',false,false
|
||||
ion-card,prop,target,string | undefined,undefined,false,false
|
||||
ion-card,prop,type,"button" | "reset" | "submit",'button',false,false
|
||||
ion-card,css-prop,--background
|
||||
ion-card,css-prop,--color
|
||||
|
||||
ion-checkbox,shadow
|
||||
ion-checkbox,prop,checked,boolean,false,false,false
|
||||
ion-checkbox,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -334,6 +334,13 @@ ion-datetime,css-prop,--padding-start
|
|||
ion-datetime,css-prop,--padding-top
|
||||
ion-datetime,css-prop,--placeholder-color
|
||||
|
||||
ion-fab,shadow
|
||||
ion-fab,prop,activated,boolean,false,false,false
|
||||
ion-fab,prop,edge,boolean,false,false,false
|
||||
ion-fab,prop,horizontal,"center" | "end" | "start" | undefined,undefined,false,false
|
||||
ion-fab,prop,vertical,"bottom" | "center" | "top" | undefined,undefined,false,false
|
||||
ion-fab,method,close,close() => Promise<void>
|
||||
|
||||
ion-fab-button,shadow
|
||||
ion-fab-button,prop,activated,boolean,false,false,false
|
||||
ion-fab-button,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -372,13 +379,6 @@ ion-fab-list,shadow
|
|||
ion-fab-list,prop,activated,boolean,false,false,false
|
||||
ion-fab-list,prop,side,"bottom" | "end" | "start" | "top",'bottom',false,false
|
||||
|
||||
ion-fab,shadow
|
||||
ion-fab,prop,activated,boolean,false,false,false
|
||||
ion-fab,prop,edge,boolean,false,false,false
|
||||
ion-fab,prop,horizontal,"center" | "end" | "start" | undefined,undefined,false,false
|
||||
ion-fab,prop,vertical,"bottom" | "center" | "top" | undefined,undefined,false,false
|
||||
ion-fab,method,close,close() => void
|
||||
|
||||
ion-footer,none
|
||||
ion-footer,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-footer,prop,translucent,boolean,false,false,false
|
||||
|
|
@ -409,17 +409,17 @@ ion-img,event,ionError,void,true
|
|||
ion-img,event,ionImgDidLoad,void,true
|
||||
ion-img,event,ionImgWillLoad,void,true
|
||||
|
||||
ion-infinite-scroll-content,none
|
||||
ion-infinite-scroll-content,prop,loadingSpinner,"bubbles" | "circles" | "crescent" | "dots" | "lines" | "lines-small" | null | undefined,undefined,false,false
|
||||
ion-infinite-scroll-content,prop,loadingText,string | undefined,undefined,false,false
|
||||
|
||||
ion-infinite-scroll,none
|
||||
ion-infinite-scroll,prop,disabled,boolean,false,false,false
|
||||
ion-infinite-scroll,prop,position,"bottom" | "top",'bottom',false,false
|
||||
ion-infinite-scroll,prop,threshold,string,'15%',false,false
|
||||
ion-infinite-scroll,method,complete,complete() => void
|
||||
ion-infinite-scroll,method,complete,complete() => Promise<void>
|
||||
ion-infinite-scroll,event,ionInfinite,void,true
|
||||
|
||||
ion-infinite-scroll-content,none
|
||||
ion-infinite-scroll-content,prop,loadingSpinner,"bubbles" | "circles" | "crescent" | "dots" | "lines" | "lines-small" | null | undefined,undefined,false,false
|
||||
ion-infinite-scroll-content,prop,loadingText,string | undefined,undefined,false,false
|
||||
|
||||
ion-input,scoped
|
||||
ion-input,prop,accept,string | undefined,undefined,false,false
|
||||
ion-input,prop,autocapitalize,string,'off',false,false
|
||||
|
|
@ -449,7 +449,7 @@ ion-input,prop,step,string | undefined,undefined,false,false
|
|||
ion-input,prop,type,"date" | "email" | "number" | "password" | "search" | "tel" | "text" | "time" | "url",'text',false,false
|
||||
ion-input,prop,value,null | string | undefined,'',false,false
|
||||
ion-input,method,getInputElement,getInputElement() => Promise<HTMLInputElement>
|
||||
ion-input,method,setFocus,setFocus() => void
|
||||
ion-input,method,setFocus,setFocus() => Promise<void>
|
||||
ion-input,event,ionBlur,void,true
|
||||
ion-input,event,ionChange,InputChangeEventDetail,true
|
||||
ion-input,event,ionFocus,void,true
|
||||
|
|
@ -465,49 +465,6 @@ ion-input,css-prop,--placeholder-font-style
|
|||
ion-input,css-prop,--placeholder-font-weight
|
||||
ion-input,css-prop,--placeholder-opacity
|
||||
|
||||
ion-item-divider,shadow
|
||||
ion-item-divider,prop,color,string | undefined,undefined,false,false
|
||||
ion-item-divider,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-item-divider,prop,sticky,boolean,false,false,false
|
||||
ion-item-divider,css-prop,--background
|
||||
ion-item-divider,css-prop,--color
|
||||
ion-item-divider,css-prop,--inner-padding-bottom
|
||||
ion-item-divider,css-prop,--inner-padding-end
|
||||
ion-item-divider,css-prop,--inner-padding-start
|
||||
ion-item-divider,css-prop,--inner-padding-top
|
||||
ion-item-divider,css-prop,--padding-bottom
|
||||
ion-item-divider,css-prop,--padding-end
|
||||
ion-item-divider,css-prop,--padding-start
|
||||
ion-item-divider,css-prop,--padding-top
|
||||
|
||||
ion-item-group,none
|
||||
|
||||
ion-item-option,shadow
|
||||
ion-item-option,prop,color,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,disabled,boolean,false,false,false
|
||||
ion-item-option,prop,download,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,expandable,boolean,false,false,false
|
||||
ion-item-option,prop,href,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-item-option,prop,rel,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,target,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,type,"button" | "reset" | "submit",'button',false,false
|
||||
ion-item-option,css-prop,--background
|
||||
ion-item-option,css-prop,--color
|
||||
|
||||
ion-item-options,none
|
||||
ion-item-options,prop,side,"end" | "start",'end',false,false
|
||||
ion-item-options,event,ionSwipe,any,true
|
||||
|
||||
ion-item-sliding,none
|
||||
ion-item-sliding,prop,disabled,boolean,false,false,false
|
||||
ion-item-sliding,method,close,close() => Promise<void>
|
||||
ion-item-sliding,method,closeOpened,closeOpened() => Promise<boolean>
|
||||
ion-item-sliding,method,getOpenAmount,getOpenAmount() => Promise<number>
|
||||
ion-item-sliding,method,getSlidingRatio,getSlidingRatio() => Promise<number>
|
||||
ion-item-sliding,method,open,open(side: "start" | "end" | undefined) => Promise<void>
|
||||
ion-item-sliding,event,ionDrag,void,true
|
||||
|
||||
ion-item,shadow
|
||||
ion-item,prop,button,boolean,false,false,false
|
||||
ion-item,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -551,28 +508,66 @@ ion-item,css-prop,--padding-top
|
|||
ion-item,css-prop,--ripple-color
|
||||
ion-item,css-prop,--transition
|
||||
|
||||
ion-item-divider,shadow
|
||||
ion-item-divider,prop,color,string | undefined,undefined,false,false
|
||||
ion-item-divider,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-item-divider,prop,sticky,boolean,false,false,false
|
||||
ion-item-divider,css-prop,--background
|
||||
ion-item-divider,css-prop,--color
|
||||
ion-item-divider,css-prop,--inner-padding-bottom
|
||||
ion-item-divider,css-prop,--inner-padding-end
|
||||
ion-item-divider,css-prop,--inner-padding-start
|
||||
ion-item-divider,css-prop,--inner-padding-top
|
||||
ion-item-divider,css-prop,--padding-bottom
|
||||
ion-item-divider,css-prop,--padding-end
|
||||
ion-item-divider,css-prop,--padding-start
|
||||
ion-item-divider,css-prop,--padding-top
|
||||
|
||||
ion-item-group,none
|
||||
|
||||
ion-item-option,shadow
|
||||
ion-item-option,prop,color,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,disabled,boolean,false,false,false
|
||||
ion-item-option,prop,download,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,expandable,boolean,false,false,false
|
||||
ion-item-option,prop,href,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-item-option,prop,rel,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,target,string | undefined,undefined,false,false
|
||||
ion-item-option,prop,type,"button" | "reset" | "submit",'button',false,false
|
||||
ion-item-option,css-prop,--background
|
||||
ion-item-option,css-prop,--color
|
||||
|
||||
ion-item-options,none
|
||||
ion-item-options,prop,side,"end" | "start",'end',false,false
|
||||
ion-item-options,event,ionSwipe,any,true
|
||||
|
||||
ion-item-sliding,none
|
||||
ion-item-sliding,prop,disabled,boolean,false,false,false
|
||||
ion-item-sliding,method,close,close() => Promise<void>
|
||||
ion-item-sliding,method,closeOpened,closeOpened() => Promise<boolean>
|
||||
ion-item-sliding,method,getOpenAmount,getOpenAmount() => Promise<number>
|
||||
ion-item-sliding,method,getSlidingRatio,getSlidingRatio() => Promise<number>
|
||||
ion-item-sliding,method,open,open(side: "start" | "end" | undefined) => Promise<void>
|
||||
ion-item-sliding,event,ionDrag,any,true
|
||||
|
||||
ion-label,scoped
|
||||
ion-label,prop,color,string | undefined,undefined,false,false
|
||||
ion-label,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-label,prop,position,"fixed" | "floating" | "stacked" | undefined,undefined,false,false
|
||||
ion-label,css-prop,--color
|
||||
|
||||
ion-list-header,shadow
|
||||
ion-list-header,prop,color,string | undefined,undefined,false,false
|
||||
ion-list-header,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-list-header,css-prop,--background
|
||||
ion-list-header,css-prop,--color
|
||||
|
||||
ion-list,none
|
||||
ion-list,prop,inset,boolean,false,false,false
|
||||
ion-list,prop,lines,"full" | "inset" | "none" | undefined,undefined,false,false
|
||||
ion-list,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-list,method,closeSlidingItems,closeSlidingItems() => Promise<boolean>
|
||||
|
||||
ion-loading-controller,none
|
||||
ion-loading-controller,method,create,create(options?: LoadingOptions | undefined) => Promise<HTMLIonLoadingElement>
|
||||
ion-loading-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-loading-controller,method,getTop,getTop() => Promise<HTMLIonLoadingElement | undefined>
|
||||
ion-list-header,shadow
|
||||
ion-list-header,prop,color,string | undefined,undefined,false,false
|
||||
ion-list-header,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-list-header,css-prop,--background
|
||||
ion-list-header,css-prop,--color
|
||||
|
||||
ion-loading,scoped
|
||||
ion-loading,prop,animated,boolean,true,false,false
|
||||
|
|
@ -591,9 +586,9 @@ ion-loading,method,dismiss,dismiss(data?: any, role?: string | undefined) => Pro
|
|||
ion-loading,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-loading,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-loading,method,present,present() => Promise<void>
|
||||
ion-loading,event,ionLoadingDidDismiss,OverlayEventDetail,true
|
||||
ion-loading,event,ionLoadingDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-loading,event,ionLoadingDidPresent,void,true
|
||||
ion-loading,event,ionLoadingWillDismiss,OverlayEventDetail,true
|
||||
ion-loading,event,ionLoadingWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-loading,event,ionLoadingWillPresent,void,true
|
||||
ion-loading,css-prop,--background
|
||||
ion-loading,css-prop,--height
|
||||
|
|
@ -604,42 +599,10 @@ ion-loading,css-prop,--min-width
|
|||
ion-loading,css-prop,--spinner-color
|
||||
ion-loading,css-prop,--width
|
||||
|
||||
ion-menu-button,shadow
|
||||
ion-menu-button,prop,autoHide,boolean,true,false,false
|
||||
ion-menu-button,prop,color,string | undefined,undefined,false,false
|
||||
ion-menu-button,prop,disabled,boolean,false,false,false
|
||||
ion-menu-button,prop,menu,string | undefined,undefined,false,false
|
||||
ion-menu-button,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-menu-button,prop,type,"button" | "reset" | "submit",'button',false,false
|
||||
ion-menu-button,css-prop,--background
|
||||
ion-menu-button,css-prop,--background-focused
|
||||
ion-menu-button,css-prop,--background-hover
|
||||
ion-menu-button,css-prop,--border-radius
|
||||
ion-menu-button,css-prop,--color
|
||||
ion-menu-button,css-prop,--color-focused
|
||||
ion-menu-button,css-prop,--color-hover
|
||||
ion-menu-button,css-prop,--padding-bottom
|
||||
ion-menu-button,css-prop,--padding-end
|
||||
ion-menu-button,css-prop,--padding-start
|
||||
ion-menu-button,css-prop,--padding-top
|
||||
|
||||
ion-menu-controller,none
|
||||
ion-menu-controller,method,close,close(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,enable,enable(enable: boolean, menu?: string | null | undefined) => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,get,get(menu?: string | null | undefined) => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,getMenus,getMenus() => Promise<HTMLIonMenuElement[]>
|
||||
ion-menu-controller,method,getOpen,getOpen() => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,isAnimating,isAnimating() => Promise<boolean>
|
||||
ion-menu-controller,method,isEnabled,isEnabled(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,isOpen,isOpen(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,open,open(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,registerAnimation,registerAnimation(name: string, animation: AnimationBuilder) => void
|
||||
ion-menu-controller,method,swipeGesture,swipeGesture(enable: boolean, menu?: string | null | undefined) => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,toggle,toggle(menu?: string | null | undefined) => Promise<boolean>
|
||||
|
||||
ion-menu-toggle,shadow
|
||||
ion-menu-toggle,prop,autoHide,boolean,true,false,false
|
||||
ion-menu-toggle,prop,menu,string | undefined,undefined,false,false
|
||||
ion-loading-controller,none
|
||||
ion-loading-controller,method,create,create(options?: LoadingOptions | undefined) => Promise<HTMLIonLoadingElement>
|
||||
ion-loading-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-loading-controller,method,getTop,getTop() => Promise<HTMLIonLoadingElement | undefined>
|
||||
|
||||
ion-menu,shadow
|
||||
ion-menu,prop,contentId,string | undefined,undefined,false,false
|
||||
|
|
@ -667,10 +630,41 @@ ion-menu,css-prop,--min-height
|
|||
ion-menu,css-prop,--min-width
|
||||
ion-menu,css-prop,--width
|
||||
|
||||
ion-modal-controller,none
|
||||
ion-modal-controller,method,create,create<T extends ComponentRef>(options: ModalOptions<T>) => Promise<HTMLIonModalElement>
|
||||
ion-modal-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-modal-controller,method,getTop,getTop() => Promise<HTMLIonModalElement | undefined>
|
||||
ion-menu-button,shadow
|
||||
ion-menu-button,prop,autoHide,boolean,true,false,false
|
||||
ion-menu-button,prop,color,string | undefined,undefined,false,false
|
||||
ion-menu-button,prop,disabled,boolean,false,false,false
|
||||
ion-menu-button,prop,menu,string | undefined,undefined,false,false
|
||||
ion-menu-button,prop,type,"button" | "reset" | "submit",'button',false,false
|
||||
ion-menu-button,css-prop,--background
|
||||
ion-menu-button,css-prop,--background-focused
|
||||
ion-menu-button,css-prop,--background-hover
|
||||
ion-menu-button,css-prop,--border-radius
|
||||
ion-menu-button,css-prop,--color
|
||||
ion-menu-button,css-prop,--color-focused
|
||||
ion-menu-button,css-prop,--color-hover
|
||||
ion-menu-button,css-prop,--padding-bottom
|
||||
ion-menu-button,css-prop,--padding-end
|
||||
ion-menu-button,css-prop,--padding-start
|
||||
ion-menu-button,css-prop,--padding-top
|
||||
|
||||
ion-menu-controller,none
|
||||
ion-menu-controller,method,close,close(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,enable,enable(enable: boolean, menu?: string | null | undefined) => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,get,get(menu?: string | null | undefined) => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,getMenus,getMenus() => Promise<HTMLIonMenuElement[]>
|
||||
ion-menu-controller,method,getOpen,getOpen() => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,isAnimating,isAnimating() => Promise<boolean>
|
||||
ion-menu-controller,method,isEnabled,isEnabled(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,isOpen,isOpen(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,open,open(menu?: string | null | undefined) => Promise<boolean>
|
||||
ion-menu-controller,method,registerAnimation,registerAnimation(name: string, animation: AnimationBuilder) => Promise<void>
|
||||
ion-menu-controller,method,swipeGesture,swipeGesture(enable: boolean, menu?: string | null | undefined) => Promise<HTMLIonMenuElement | undefined>
|
||||
ion-menu-controller,method,toggle,toggle(menu?: string | null | undefined) => Promise<boolean>
|
||||
|
||||
ion-menu-toggle,shadow
|
||||
ion-menu-toggle,prop,autoHide,boolean,true,false,false
|
||||
ion-menu-toggle,prop,menu,string | undefined,undefined,false,false
|
||||
|
||||
ion-modal,scoped
|
||||
ion-modal,prop,animated,boolean,true,false,false
|
||||
|
|
@ -687,9 +681,9 @@ ion-modal,method,dismiss,dismiss(data?: any, role?: string | undefined) => Promi
|
|||
ion-modal,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-modal,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-modal,method,present,present() => Promise<void>
|
||||
ion-modal,event,ionModalDidDismiss,OverlayEventDetail,true
|
||||
ion-modal,event,ionModalDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-modal,event,ionModalDidPresent,void,true
|
||||
ion-modal,event,ionModalWillDismiss,OverlayEventDetail,true
|
||||
ion-modal,event,ionModalWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-modal,event,ionModalWillPresent,void,true
|
||||
ion-modal,css-prop,--background
|
||||
ion-modal,css-prop,--border-color
|
||||
|
|
@ -703,15 +697,10 @@ ion-modal,css-prop,--min-height
|
|||
ion-modal,css-prop,--min-width
|
||||
ion-modal,css-prop,--width
|
||||
|
||||
ion-nav-pop,none
|
||||
|
||||
ion-nav-push,none
|
||||
ion-nav-push,prop,component,Function | HTMLElement | ViewController | null | string | undefined,undefined,false,false
|
||||
ion-nav-push,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
|
||||
|
||||
ion-nav-set-root,none
|
||||
ion-nav-set-root,prop,component,Function | HTMLElement | ViewController | null | string | undefined,undefined,false,false
|
||||
ion-nav-set-root,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
|
||||
ion-modal-controller,none
|
||||
ion-modal-controller,method,create,create<T extends ComponentRef>(options: ModalOptions<T>) => Promise<HTMLIonModalElement>
|
||||
ion-modal-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-modal-controller,method,getTop,getTop() => Promise<HTMLIonModalElement | undefined>
|
||||
|
||||
ion-nav,shadow
|
||||
ion-nav,prop,animated,boolean,true,false,false
|
||||
|
|
@ -735,16 +724,21 @@ ion-nav,method,setRoot,setRoot<T extends NavComponent>(component: T, componentPr
|
|||
ion-nav,event,ionNavDidChange,void,false
|
||||
ion-nav,event,ionNavWillChange,void,false
|
||||
|
||||
ion-nav-pop,none
|
||||
|
||||
ion-nav-push,none
|
||||
ion-nav-push,prop,component,Function | HTMLElement | ViewController | null | string | undefined,undefined,false,false
|
||||
ion-nav-push,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
|
||||
|
||||
ion-nav-set-root,none
|
||||
ion-nav-set-root,prop,component,Function | HTMLElement | ViewController | null | string | undefined,undefined,false,false
|
||||
ion-nav-set-root,prop,componentProps,undefined | { [key: string]: any; },undefined,false,false
|
||||
|
||||
ion-note,shadow
|
||||
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-controller,none
|
||||
ion-picker-controller,method,create,create(options: PickerOptions) => Promise<HTMLIonPickerElement>
|
||||
ion-picker-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-picker-controller,method,getTop,getTop() => Promise<HTMLIonPickerElement | undefined>
|
||||
|
||||
ion-picker,scoped
|
||||
ion-picker,prop,animated,boolean,true,false,false
|
||||
ion-picker,prop,backdropDismiss,boolean,true,false,false
|
||||
|
|
@ -762,9 +756,9 @@ ion-picker,method,getColumn,getColumn(name: string) => Promise<PickerColumn | un
|
|||
ion-picker,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-picker,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-picker,method,present,present() => Promise<void>
|
||||
ion-picker,event,ionPickerDidDismiss,OverlayEventDetail,true
|
||||
ion-picker,event,ionPickerDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-picker,event,ionPickerDidPresent,void,true
|
||||
ion-picker,event,ionPickerWillDismiss,OverlayEventDetail,true
|
||||
ion-picker,event,ionPickerWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-picker,event,ionPickerWillPresent,void,true
|
||||
ion-picker,css-prop,--background
|
||||
ion-picker,css-prop,--background-rgb
|
||||
|
|
@ -779,10 +773,10 @@ ion-picker,css-prop,--min-height
|
|||
ion-picker,css-prop,--min-width
|
||||
ion-picker,css-prop,--width
|
||||
|
||||
ion-popover-controller,none
|
||||
ion-popover-controller,method,create,create<T extends ComponentRef>(options: PopoverOptions<T>) => Promise<HTMLIonPopoverElement>
|
||||
ion-popover-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-popover-controller,method,getTop,getTop() => Promise<HTMLIonPopoverElement | undefined>
|
||||
ion-picker-controller,none
|
||||
ion-picker-controller,method,create,create(options: PickerOptions) => Promise<HTMLIonPickerElement>
|
||||
ion-picker-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-picker-controller,method,getTop,getTop() => Promise<HTMLIonPickerElement | undefined>
|
||||
|
||||
ion-popover,scoped
|
||||
ion-popover,prop,animated,boolean,true,false,false
|
||||
|
|
@ -801,9 +795,9 @@ ion-popover,method,dismiss,dismiss(data?: any, role?: string | undefined) => Pro
|
|||
ion-popover,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-popover,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-popover,method,present,present() => Promise<void>
|
||||
ion-popover,event,ionPopoverDidDismiss,OverlayEventDetail,true
|
||||
ion-popover,event,ionPopoverDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-popover,event,ionPopoverDidPresent,void,true
|
||||
ion-popover,event,ionPopoverWillDismiss,OverlayEventDetail,true
|
||||
ion-popover,event,ionPopoverWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-popover,event,ionPopoverWillPresent,void,true
|
||||
ion-popover,css-prop,--background
|
||||
ion-popover,css-prop,--box-shadow
|
||||
|
|
@ -814,6 +808,11 @@ ion-popover,css-prop,--min-height
|
|||
ion-popover,css-prop,--min-width
|
||||
ion-popover,css-prop,--width
|
||||
|
||||
ion-popover-controller,none
|
||||
ion-popover-controller,method,create,create<T extends ComponentRef>(options: PopoverOptions<T>) => Promise<HTMLIonPopoverElement>
|
||||
ion-popover-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-popover-controller,method,getTop,getTop() => Promise<HTMLIonPopoverElement | undefined>
|
||||
|
||||
ion-progress-bar,shadow
|
||||
ion-progress-bar,prop,buffer,number,1,false,false
|
||||
ion-progress-bar,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -825,12 +824,6 @@ ion-progress-bar,css-prop,--background
|
|||
ion-progress-bar,css-prop,--buffer-background
|
||||
ion-progress-bar,css-prop,--progress-background
|
||||
|
||||
ion-radio-group,none
|
||||
ion-radio-group,prop,allowEmptySelection,boolean,false,false,false
|
||||
ion-radio-group,prop,name,string,this.inputId,false,false
|
||||
ion-radio-group,prop,value,any,undefined,false,false
|
||||
ion-radio-group,event,ionChange,RadioGroupChangeEventDetail,true
|
||||
|
||||
ion-radio,shadow
|
||||
ion-radio,prop,checked,boolean,false,false,false
|
||||
ion-radio,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -844,6 +837,12 @@ ion-radio,event,ionSelect,RadioChangeEventDetail,true
|
|||
ion-radio,css-prop,--color
|
||||
ion-radio,css-prop,--color-checked
|
||||
|
||||
ion-radio-group,none
|
||||
ion-radio-group,prop,allowEmptySelection,boolean,false,false,false
|
||||
ion-radio-group,prop,name,string,this.inputId,false,false
|
||||
ion-radio-group,prop,value,any,undefined,false,false
|
||||
ion-radio-group,event,ionChange,RadioGroupChangeEventDetail,true
|
||||
|
||||
ion-range,shadow
|
||||
ion-range,prop,color,string | undefined,undefined,false,false
|
||||
ion-range,prop,debounce,number,0,false,false
|
||||
|
|
@ -871,12 +870,6 @@ ion-range,css-prop,--knob-border-radius
|
|||
ion-range,css-prop,--knob-box-shadow
|
||||
ion-range,css-prop,--knob-size
|
||||
|
||||
ion-refresher-content,none
|
||||
ion-refresher-content,prop,pullingIcon,null | string | undefined,undefined,false,false
|
||||
ion-refresher-content,prop,pullingText,string | undefined,undefined,false,false
|
||||
ion-refresher-content,prop,refreshingSpinner,"bubbles" | "circles" | "crescent" | "dots" | "lines" | "lines-small" | null | undefined,undefined,false,false
|
||||
ion-refresher-content,prop,refreshingText,string | undefined,undefined,false,false
|
||||
|
||||
ion-refresher,none
|
||||
ion-refresher,prop,closeDuration,string,'280ms',false,false
|
||||
ion-refresher,prop,disabled,boolean,false,false,false
|
||||
|
|
@ -884,38 +877,40 @@ ion-refresher,prop,pullFactor,number,1,false,false
|
|||
ion-refresher,prop,pullMax,number,this.pullMin + 60,false,false
|
||||
ion-refresher,prop,pullMin,number,60,false,false
|
||||
ion-refresher,prop,snapbackDuration,string,'280ms',false,false
|
||||
ion-refresher,method,cancel,cancel() => void
|
||||
ion-refresher,method,complete,complete() => void
|
||||
ion-refresher,method,cancel,cancel() => Promise<void>
|
||||
ion-refresher,method,complete,complete() => Promise<void>
|
||||
ion-refresher,method,getProgress,getProgress() => Promise<number>
|
||||
ion-refresher,event,ionPull,void,true
|
||||
ion-refresher,event,ionRefresh,RefresherEventDetail,true
|
||||
ion-refresher,event,ionStart,void,true
|
||||
|
||||
ion-refresher-content,none
|
||||
ion-refresher-content,prop,pullingIcon,null | string | undefined,undefined,false,false
|
||||
ion-refresher-content,prop,pullingText,string | undefined,undefined,false,false
|
||||
ion-refresher-content,prop,refreshingSpinner,"bubbles" | "circles" | "crescent" | "dots" | "lines" | "lines-small" | null | undefined,undefined,false,false
|
||||
ion-refresher-content,prop,refreshingText,string | undefined,undefined,false,false
|
||||
|
||||
ion-reorder,shadow
|
||||
|
||||
ion-reorder-group,none
|
||||
ion-reorder-group,prop,disabled,boolean,true,false,false
|
||||
ion-reorder-group,method,complete,complete(listOrReorder?: boolean | any[] | undefined) => Promise<any>
|
||||
ion-reorder-group,event,ionItemReorder,ItemReorderEventDetail,true
|
||||
|
||||
ion-reorder,shadow
|
||||
|
||||
ion-ripple-effect,shadow
|
||||
ion-ripple-effect,prop,type,"bounded" | "unbounded",'bounded',false,false
|
||||
ion-ripple-effect,method,addRipple,addRipple(x: number, y: number) => Promise<() => void>
|
||||
|
||||
ion-route-redirect,none
|
||||
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,none
|
||||
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
|
||||
|
||||
ion-router-outlet,shadow
|
||||
ion-router-outlet,prop,animated,boolean,true,false,false
|
||||
ion-router-outlet,prop,animation,((Animation: Animation, baseEl: any, opts?: any) => Promise<Animation>) | undefined,undefined,false,false
|
||||
ion-route-redirect,none
|
||||
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,any,true
|
||||
|
||||
ion-router,none
|
||||
ion-router,prop,root,string,'/',false,false
|
||||
|
|
@ -925,6 +920,10 @@ ion-router,method,push,push(url: string, direction?: RouterDirection) => Promise
|
|||
ion-router,event,ionRouteDidChange,RouterEventDetail,true
|
||||
ion-router,event,ionRouteWillChange,RouterEventDetail,true
|
||||
|
||||
ion-router-outlet,shadow
|
||||
ion-router-outlet,prop,animated,boolean,true,false,false
|
||||
ion-router-outlet,prop,animation,((Animation: Animation, baseEl: any, opts?: any) => Promise<Animation>) | undefined,undefined,false,false
|
||||
|
||||
ion-row,shadow
|
||||
|
||||
ion-searchbar,scoped
|
||||
|
|
@ -945,7 +944,7 @@ ion-searchbar,prop,spellcheck,boolean,false,false,false
|
|||
ion-searchbar,prop,type,"email" | "number" | "password" | "search" | "tel" | "text" | "url",'search',false,false
|
||||
ion-searchbar,prop,value,null | string | undefined,'',false,false
|
||||
ion-searchbar,method,getInputElement,getInputElement() => Promise<HTMLInputElement>
|
||||
ion-searchbar,method,setFocus,setFocus() => void
|
||||
ion-searchbar,method,setFocus,setFocus() => Promise<void>
|
||||
ion-searchbar,event,ionBlur,void,true
|
||||
ion-searchbar,event,ionCancel,void,true
|
||||
ion-searchbar,event,ionChange,SearchbarChangeEventDetail,true
|
||||
|
|
@ -962,6 +961,15 @@ ion-searchbar,css-prop,--placeholder-font-style
|
|||
ion-searchbar,css-prop,--placeholder-font-weight
|
||||
ion-searchbar,css-prop,--placeholder-opacity
|
||||
|
||||
ion-segment,scoped
|
||||
ion-segment,prop,color,string | undefined,undefined,false,false
|
||||
ion-segment,prop,disabled,boolean,false,false,false
|
||||
ion-segment,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-segment,prop,scrollable,boolean,false,false,false
|
||||
ion-segment,prop,value,null | string | undefined,undefined,false,false
|
||||
ion-segment,event,ionChange,SegmentChangeEventDetail,true
|
||||
ion-segment,event,ionStyle,StyleEventDetail,true
|
||||
|
||||
ion-segment-button,shadow
|
||||
ion-segment-button,prop,checked,boolean,false,false,false
|
||||
ion-segment-button,prop,disabled,boolean,false,false,false
|
||||
|
|
@ -995,20 +1003,6 @@ ion-segment-button,css-prop,--padding-start
|
|||
ion-segment-button,css-prop,--padding-top
|
||||
ion-segment-button,css-prop,--transition
|
||||
|
||||
ion-segment,scoped
|
||||
ion-segment,prop,color,string | undefined,undefined,false,false
|
||||
ion-segment,prop,disabled,boolean,false,false,false
|
||||
ion-segment,prop,mode,"ios" | "md",undefined,false,false
|
||||
ion-segment,prop,scrollable,boolean,false,false,false
|
||||
ion-segment,prop,value,null | string | undefined,undefined,false,false
|
||||
ion-segment,event,ionChange,SegmentChangeEventDetail,true
|
||||
ion-segment,event,ionStyle,StyleEventDetail,true
|
||||
|
||||
ion-select-option,shadow
|
||||
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,shadow
|
||||
ion-select,prop,cancelText,string,'Cancel',false,false
|
||||
ion-select,prop,compareWith,((currentValue: any, compareValue: any) => boolean) | null | string | undefined,undefined,false,false
|
||||
|
|
@ -1022,7 +1016,7 @@ ion-select,prop,okText,string,'OK',false,false
|
|||
ion-select,prop,placeholder,null | string | undefined,undefined,false,false
|
||||
ion-select,prop,selectedText,null | string | undefined,undefined,false,false
|
||||
ion-select,prop,value,any,undefined,false,false
|
||||
ion-select,method,open,open(event?: UIEvent | undefined) => Promise<HTMLIonActionSheetElement | HTMLIonAlertElement | HTMLIonPopoverElement | undefined>
|
||||
ion-select,method,open,open(event?: UIEvent | undefined) => Promise<any>
|
||||
ion-select,event,ionBlur,void,true
|
||||
ion-select,event,ionCancel,void,true
|
||||
ion-select,event,ionChange,SelectChangeEventDetail,true
|
||||
|
|
@ -1032,6 +1026,11 @@ ion-select,css-prop,--padding-end
|
|||
ion-select,css-prop,--padding-start
|
||||
ion-select,css-prop,--padding-top
|
||||
|
||||
ion-select-option,shadow
|
||||
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-skeleton-text,shadow
|
||||
ion-skeleton-text,prop,animated,boolean,false,false,false
|
||||
ion-skeleton-text,prop,width,string | undefined,undefined,false,false
|
||||
|
|
@ -1091,9 +1090,14 @@ ion-split-pane,none
|
|||
ion-split-pane,prop,contentId,string | undefined,undefined,false,false
|
||||
ion-split-pane,prop,disabled,boolean,false,false,false
|
||||
ion-split-pane,prop,when,boolean | string,QUERY['lg'],false,false
|
||||
ion-split-pane,event,ionSplitPaneVisible,{visible: boolean},true
|
||||
ion-split-pane,event,ionSplitPaneVisible,{ visible: boolean; },true
|
||||
ion-split-pane,css-prop,--border
|
||||
|
||||
ion-tab,shadow
|
||||
ion-tab,prop,component,Function | HTMLElement | null | string | undefined,undefined,false,false
|
||||
ion-tab,prop,tab,string,undefined,true,false
|
||||
ion-tab,method,setActive,setActive() => Promise<void>
|
||||
|
||||
ion-tab-bar,shadow
|
||||
ion-tab-bar,prop,color,string | undefined,undefined,false,false
|
||||
ion-tab-bar,prop,mode,"ios" | "md",undefined,false,false
|
||||
|
|
@ -1123,17 +1127,12 @@ ion-tab-button,css-prop,--padding-start
|
|||
ion-tab-button,css-prop,--padding-top
|
||||
ion-tab-button,css-prop,--ripple-color
|
||||
|
||||
ion-tab,shadow
|
||||
ion-tab,prop,component,Function | HTMLElement | null | string | undefined,undefined,false,false
|
||||
ion-tab,prop,tab,string,undefined,true,false
|
||||
ion-tab,method,setActive,setActive() => Promise<void>
|
||||
|
||||
ion-tabs,shadow
|
||||
ion-tabs,method,getSelected,getSelected() => Promise<string | undefined>
|
||||
ion-tabs,method,getTab,getTab(tab: string | HTMLIonTabElement) => Promise<HTMLIonTabElement | undefined>
|
||||
ion-tabs,method,select,select(tab: string | HTMLIonTabElement) => Promise<boolean>
|
||||
ion-tabs,event,ionTabsDidChange,{tab: string},false
|
||||
ion-tabs,event,ionTabsWillChange,{tab: string},false
|
||||
ion-tabs,event,ionTabsDidChange,{ tab: string; },false
|
||||
ion-tabs,event,ionTabsWillChange,{ tab: string; },false
|
||||
|
||||
ion-text,shadow
|
||||
ion-text,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -1160,7 +1159,7 @@ ion-textarea,prop,spellcheck,boolean,false,false,false
|
|||
ion-textarea,prop,value,null | string | undefined,'',false,false
|
||||
ion-textarea,prop,wrap,"hard" | "off" | "soft" | undefined,undefined,false,false
|
||||
ion-textarea,method,getInputElement,getInputElement() => Promise<HTMLTextAreaElement>
|
||||
ion-textarea,method,setFocus,setFocus() => void
|
||||
ion-textarea,method,setFocus,setFocus() => Promise<void>
|
||||
ion-textarea,event,ionBlur,void,true
|
||||
ion-textarea,event,ionChange,TextareaChangeEventDetail,true
|
||||
ion-textarea,event,ionFocus,void,true
|
||||
|
|
@ -1185,11 +1184,6 @@ ion-title,shadow
|
|||
ion-title,prop,color,string | undefined,undefined,false,false
|
||||
ion-title,css-prop,--color
|
||||
|
||||
ion-toast-controller,none
|
||||
ion-toast-controller,method,create,create(options?: ToastOptions | undefined) => Promise<HTMLIonToastElement>
|
||||
ion-toast-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-toast-controller,method,getTop,getTop() => Promise<HTMLIonToastElement | undefined>
|
||||
|
||||
ion-toast,shadow
|
||||
ion-toast,prop,animated,boolean,true,false,false
|
||||
ion-toast,prop,buttons,(string | ToastButton)[] | undefined,undefined,false,false
|
||||
|
|
@ -1210,9 +1204,9 @@ ion-toast,method,dismiss,dismiss(data?: any, role?: string | undefined) => Promi
|
|||
ion-toast,method,onDidDismiss,onDidDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-toast,method,onWillDismiss,onWillDismiss() => Promise<OverlayEventDetail<any>>
|
||||
ion-toast,method,present,present() => Promise<void>
|
||||
ion-toast,event,ionToastDidDismiss,OverlayEventDetail,true
|
||||
ion-toast,event,ionToastDidDismiss,OverlayEventDetail<any>,true
|
||||
ion-toast,event,ionToastDidPresent,void,true
|
||||
ion-toast,event,ionToastWillDismiss,OverlayEventDetail,true
|
||||
ion-toast,event,ionToastWillDismiss,OverlayEventDetail<any>,true
|
||||
ion-toast,event,ionToastWillPresent,void,true
|
||||
ion-toast,css-prop,--background
|
||||
ion-toast,css-prop,--border-color
|
||||
|
|
@ -1231,6 +1225,11 @@ ion-toast,css-prop,--min-width
|
|||
ion-toast,css-prop,--start
|
||||
ion-toast,css-prop,--width
|
||||
|
||||
ion-toast-controller,none
|
||||
ion-toast-controller,method,create,create(options?: ToastOptions | undefined) => Promise<HTMLIonToastElement>
|
||||
ion-toast-controller,method,dismiss,dismiss(data?: any, role?: string | undefined, id?: string | undefined) => Promise<boolean>
|
||||
ion-toast-controller,method,getTop,getTop() => Promise<HTMLIonToastElement | undefined>
|
||||
|
||||
ion-toggle,shadow
|
||||
ion-toggle,prop,checked,boolean,false,false,false
|
||||
ion-toggle,prop,color,string | undefined,undefined,false,false
|
||||
|
|
@ -1273,6 +1272,6 @@ ion-virtual-scroll,prop,nodeRender,((el: HTMLElement | null, cell: Cell, domInde
|
|||
ion-virtual-scroll,prop,renderFooter,((item: any, index: number) => any) | undefined,undefined,false,false
|
||||
ion-virtual-scroll,prop,renderHeader,((item: any, index: number) => any) | undefined,undefined,false,false
|
||||
ion-virtual-scroll,prop,renderItem,((item: any, index: number) => any) | undefined,undefined,false,false
|
||||
ion-virtual-scroll,method,checkEnd,checkEnd() => void
|
||||
ion-virtual-scroll,method,checkRange,checkRange(offset: number, length?: number) => void
|
||||
ion-virtual-scroll,method,checkEnd,checkEnd() => Promise<void>
|
||||
ion-virtual-scroll,method,checkRange,checkRange(offset: number, len?: number) => Promise<void>
|
||||
ion-virtual-scroll,method,positionForItem,positionForItem(index: number) => Promise<number>
|
||||
|
|
@ -16,43 +16,44 @@
|
|||
"pwa"
|
||||
],
|
||||
"main": "dist/index.js",
|
||||
"unpkg": "dist/ionic.js",
|
||||
"module": "dist/esm/index.js",
|
||||
"es2015": "dist/esm/es2017/index.js",
|
||||
"es2017": "dist/esm/es2017/index.js",
|
||||
"jsnext:main": "dist/esm/es2017/index.js",
|
||||
"types": "dist/types/interface.d.ts",
|
||||
"unpkg": "dist/ionic/ionic.js",
|
||||
"module": "dist/index.mjs",
|
||||
"es2015": "dist/esm/index.mjs",
|
||||
"es2017": "dist/esm/index.mjs",
|
||||
"jsnext:main": "dist/esm/index.mjs",
|
||||
"collection:main": "dist/collection/index.js",
|
||||
"collection": "dist/collection/collection-manifest.json",
|
||||
"webComponents": "dist/web-components.json",
|
||||
"types": "dist/types/interface.d.ts",
|
||||
"files": [
|
||||
"dist/",
|
||||
"css/",
|
||||
"loader/"
|
||||
],
|
||||
"dependencies": {
|
||||
"ionicons": "4.5.8"
|
||||
"ionicons": "4.5.10-0",
|
||||
"tslib": "^1.10.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@stencil/core": "0.17.3-0",
|
||||
"@stencil/sass": "0.1.1",
|
||||
"@stencil/core": "1.0.7",
|
||||
"@stencil/sass": "latest",
|
||||
"@stencil/utils": "latest",
|
||||
"@types/jest": "^23.3.13",
|
||||
"@types/jest": "24.0.13",
|
||||
"@types/node": "10.12.18",
|
||||
"@types/puppeteer": "1.11.2",
|
||||
"@types/swiper": "^4.4.2",
|
||||
"agadoo": "^1.0.0",
|
||||
"autoprefixer": "9.4.6",
|
||||
"@types/puppeteer": "1.12.4",
|
||||
"@types/swiper": "4.4.1",
|
||||
"aws-sdk": "^2.320.0",
|
||||
"chromedriver": "^2.38.3",
|
||||
"clean-css-cli": "^4.1.11",
|
||||
"fs-extra": "^7.0.0",
|
||||
"jest": "23.6.0",
|
||||
"jest-cli": "23.6.0",
|
||||
"jest": "24.8.0",
|
||||
"jest-cli": "24.8.0",
|
||||
"np": "^3.0.4",
|
||||
"pixelmatch": "4.0.2",
|
||||
"puppeteer": "1.11.0",
|
||||
"puppeteer": "1.17.0",
|
||||
"rollup": "1.1.2",
|
||||
"rollup-plugin-node-resolve": "4.0.0",
|
||||
"rollup-plugin-virtual": "^1.0.1",
|
||||
"sass": "^1.20.1",
|
||||
"stylelint": "9.10.1",
|
||||
"stylelint-order": "2.0.0",
|
||||
"swiper": "4.4.6",
|
||||
|
|
@ -69,7 +70,7 @@
|
|||
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s",
|
||||
"clean": "node scripts/clean.js",
|
||||
"css.minify": "cleancss -O2 -o ./css/ionic.bundle.css ./css/ionic.bundle.css",
|
||||
"css.sass": "node-sass --output ./css src/css --output-style compressed",
|
||||
"css.sass": "sass src/css:./css",
|
||||
"lint": "npm run lint.ts && npm run lint.sass",
|
||||
"lint.fix": "npm run lint.ts.fix && npm run lint.sass.fix",
|
||||
"lint.sass": "stylelint 'src/**/*.scss'",
|
||||
|
|
@ -77,14 +78,16 @@
|
|||
"lint.ts": "tslint --project .",
|
||||
"lint.ts.fix": "tslint --project . --fix",
|
||||
"prerelease": "npm run validate && np prerelease --yolo --any-branch --tag next",
|
||||
"prerender.e2e": "node scripts/testing/prerender-e2e.js",
|
||||
"start": "npm run build.css && stencil build --dev --watch --serve",
|
||||
"test": "stencil test --spec --e2e",
|
||||
"test.spec": "stencil test --spec",
|
||||
"test.spec.debug": "npx --node-arg=\"--inspect-brk\" stencil test --spec",
|
||||
"test.e2e": "stencil test --e2e",
|
||||
"test.screenshot": "stencil test --e2e --screenshot --screenshot-connector=scripts/screenshot/dev.js",
|
||||
"test.screenshot.ci": "stencil test --e2e --screenshot --screenshot-connector=scripts/screenshot/ci.js --ci",
|
||||
"test.watch": "jest --watch --no-cache",
|
||||
"test.treeshake": "agadoo dist/collection/index.js",
|
||||
"test.treeshake": "node scripts/treeshaking.js dist/index.mjs",
|
||||
"validate": "npm run lint && npm run test && npm run build && npm run test.treeshake"
|
||||
},
|
||||
"author": "Ionic Team",
|
||||
|
|
@ -96,5 +99,8 @@
|
|||
"bugs": {
|
||||
"url": "https://github.com/ionic-team/ionic/issues"
|
||||
},
|
||||
"homepage": "https://github.com/ionic-team/ionic#readme"
|
||||
"homepage": "https://github.com/ionic-team/ionic#readme",
|
||||
"jest": {
|
||||
"preset": "@stencil/core/testing"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,17 +1,21 @@
|
|||
|
||||
|
||||
const fs = require('fs');
|
||||
|
||||
function apiSpecGenerator(opts) {
|
||||
return (docsData) => {
|
||||
const content = [];
|
||||
docsData.components.forEach(cmp => generateComponent(cmp, content));
|
||||
return {
|
||||
type: 'docs-custom',
|
||||
generator: (docsData) => {
|
||||
const content = [];
|
||||
docsData.components.forEach(cmp => generateComponent(cmp, content));
|
||||
|
||||
const contentStr = content.join('\n');
|
||||
return new Promise(resolve => {
|
||||
fs.writeFile(opts.file, contentStr, () => {
|
||||
resolve();
|
||||
const contentStr = content.join('\n');
|
||||
return new Promise(resolve => {
|
||||
fs.writeFile(opts.file, contentStr, () => {
|
||||
resolve();
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,8 +4,7 @@ const path = require('path');
|
|||
|
||||
const cleanDirs = [
|
||||
'dist',
|
||||
'css',
|
||||
'.stencil'
|
||||
'css'
|
||||
];
|
||||
|
||||
cleanDirs.forEach(dir => {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,89 @@
|
|||
|
||||
const path = require('path');
|
||||
const { rollup } = require('rollup');
|
||||
const virtual = require('rollup-plugin-virtual');
|
||||
const fs = require('fs');
|
||||
|
||||
function main() {
|
||||
const input = process.argv[2] || get_input();
|
||||
check(input).then(result => {
|
||||
const relative = path.relative(process.cwd(), input);
|
||||
|
||||
if (result.shaken) {
|
||||
console.error(`Success! ${relative} is fully tree-shakeable`);
|
||||
} else {
|
||||
error(`Failed to tree-shake ${relative}`);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function error(msg) {
|
||||
console.error(msg);
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
function get_input() {
|
||||
if (!fs.existsSync('package.json')) {
|
||||
error(`Could not find package.json`);
|
||||
}
|
||||
|
||||
const pkg = JSON.parse(fs.readFileSync('package.json'), 'utf-8');
|
||||
|
||||
const unresolved = pkg.module || pkg.main || 'index';
|
||||
const resolved = resolve(unresolved);
|
||||
|
||||
if (!resolved) {
|
||||
error(`Could not resolve entry point`);
|
||||
}
|
||||
|
||||
return resolved;
|
||||
}
|
||||
|
||||
function resolve(file) {
|
||||
if (is_directory(file)) {
|
||||
return if_exists(`${file}/index.mjs`) || if_exists(`${file}/index.js`);
|
||||
}
|
||||
|
||||
return if_exists(file) || if_exists(`${file}.mjs`) || if_exists(`${file}.js`);
|
||||
}
|
||||
|
||||
function is_directory(file) {
|
||||
try {
|
||||
const stats = fs.statSync(file);
|
||||
return stats.isDirectory();
|
||||
} catch (err) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function if_exists(file) {
|
||||
return fs.existsSync(file) ? file : null;
|
||||
}
|
||||
|
||||
const check = input => {
|
||||
const resolved = path.resolve(input);
|
||||
|
||||
return rollup({
|
||||
input: '__agadoo__',
|
||||
plugins: [
|
||||
virtual({
|
||||
__agadoo__: `import ${JSON.stringify(resolved)}`,
|
||||
'tslib': '',
|
||||
})
|
||||
],
|
||||
onwarn: (warning, handle) => {
|
||||
if (warning.code !== 'EMPTY_BUNDLE') handle(warning);
|
||||
}
|
||||
}).then(bundle => bundle.generate({
|
||||
format: 'es'
|
||||
})).then(o => {
|
||||
const output = o.output;
|
||||
console.log(output);
|
||||
return {
|
||||
shaken: output.length === 1 && output[0].code.trim() === ''
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
main();
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -17,7 +17,7 @@ export class ActionSheetController implements ComponentInterface, OverlayControl
|
|||
*/
|
||||
@Method()
|
||||
create(options: ActionSheetOptions): Promise<HTMLIonActionSheetElement> {
|
||||
return createOverlay(this.doc.createElement('ion-action-sheet'), options);
|
||||
return createOverlay('ion-action-sheet', options);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -32,7 +32,7 @@ export class ActionSheetController implements ComponentInterface, OverlayControl
|
|||
*/
|
||||
@Method()
|
||||
dismiss(data?: any, role?: string, id?: string) {
|
||||
return dismissOverlay(this.doc, data, role, 'ion-action-sheet', id);
|
||||
return dismissOverlay(document, data, role, 'ion-action-sheet', id);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -40,6 +40,6 @@ export class ActionSheetController implements ComponentInterface, OverlayControl
|
|||
*/
|
||||
@Method()
|
||||
async getTop(): Promise<HTMLIonActionSheetElement | undefined> {
|
||||
return getOverlay(this.doc, 'ion-action-sheet') as HTMLIonActionSheetElement;
|
||||
return getOverlay(document, 'ion-action-sheet') as HTMLIonActionSheetElement;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,12 +11,6 @@ Action Sheet controllers programmatically control the action sheet component. Ac
|
|||
|
||||
Create an action sheet overlay with action sheet options.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| --------- | -------------------- | ---------------------------------------------- |
|
||||
| `options` | `ActionSheetOptions` | The options to use to create the action sheet. |
|
||||
|
||||
#### Returns
|
||||
|
||||
Type: `Promise<HTMLIonActionSheetElement>`
|
||||
|
|
@ -27,14 +21,6 @@ Type: `Promise<HTMLIonActionSheetElement>`
|
|||
|
||||
Dismiss the open action sheet overlay.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| ------ | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `data` | `any` | Any data to emit in the dismiss events. |
|
||||
| `role` | `string \| undefined` | The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. |
|
||||
| `id` | `string \| undefined` | The id of the action sheet to dismiss. If an id is not provided, it will dismiss the most recently opened action sheet. |
|
||||
|
||||
#### Returns
|
||||
|
||||
Type: `Promise<boolean>`
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop, h } from '@stencil/core';
|
||||
|
||||
import { ActionSheetButton, Animation, AnimationBuilder, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { ActionSheetButton, Animation, AnimationBuilder, Config, CssClassMap, OverlayEventDetail, OverlayInterface } from '../../interface';
|
||||
import { BACKDROP, dismiss, eventMethod, isCancel, present } from '../../utils/overlays';
|
||||
import { getClassMap } from '../../utils/theme';
|
||||
|
||||
|
|
@ -9,6 +10,9 @@ import { iosLeaveAnimation } from './animations/ios.leave';
|
|||
import { mdEnterAnimation } from './animations/md.enter';
|
||||
import { mdLeaveAnimation } from './animations/md.leave';
|
||||
|
||||
/**
|
||||
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
||||
*/
|
||||
@Component({
|
||||
tag: 'ion-action-sheet',
|
||||
styleUrls: {
|
||||
|
|
@ -21,6 +25,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||
|
||||
presented = false;
|
||||
animation?: Animation;
|
||||
mode = getIonMode(this);
|
||||
|
||||
@Element() el!: HTMLElement;
|
||||
|
||||
|
|
@ -28,11 +33,6 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||
/** @internal */
|
||||
@Prop() overlayIndex!: number;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
/**
|
||||
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
|
||||
*/
|
||||
|
|
@ -195,6 +195,8 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||
}
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return {
|
||||
'role': 'dialog',
|
||||
'aria-modal': 'true',
|
||||
|
|
@ -202,7 +204,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||
zIndex: 20000 + this.overlayIndex,
|
||||
},
|
||||
class: {
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
|
||||
...getClassMap(this.cssClass),
|
||||
'action-sheet-translucent': this.translucent
|
||||
|
|
@ -211,6 +213,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||
}
|
||||
|
||||
render() {
|
||||
const mode = getIonMode(this);
|
||||
const allButtons = this.getButtons();
|
||||
const cancelButton = allButtons.find(b => b.role === 'cancel');
|
||||
const buttons = allButtons.filter(b => b.role !== 'cancel');
|
||||
|
|
@ -232,7 +235,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
|
|||
{b.icon && <ion-icon icon={b.icon} lazy={false} class="action-sheet-icon" />}
|
||||
{b.text}
|
||||
</span>
|
||||
{this.mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
|
||||
{mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -126,28 +126,19 @@ async function presentActionSheet() {
|
|||
### React
|
||||
|
||||
```typescript
|
||||
import React, { Component } from 'react'
|
||||
import { IonActionSheet } from '@ionic/react';
|
||||
import React, { useState } from 'react'
|
||||
import { IonActionSheet, IonContent, IonButton } from '@ionic/react';
|
||||
|
||||
type Props = {}
|
||||
type State = {
|
||||
showActionSheet: boolean
|
||||
}
|
||||
export const ActionSheetExample: React.FunctionComponent = () => {
|
||||
|
||||
export default class ActionSheetExample extends Component<Props, State> {
|
||||
const [showActionSheet, setShowActionSheet] = useState(false);
|
||||
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
showActionSheet: false
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
return (
|
||||
<IonContent>
|
||||
<IonButton onClick={() => setShowActionSheet(true)} expand="block">Show Action Sheet</IonButton>
|
||||
<IonActionSheet
|
||||
isOpen={this.state.showActionSheet}
|
||||
onDidDismiss={() => this.setState(() => ({ showActionSheet: false }))}
|
||||
isOpen={showActionSheet}
|
||||
onDidDismiss={() => setShowActionSheet(false)}
|
||||
buttons={[{
|
||||
text: 'Delete',
|
||||
role: 'destructive',
|
||||
|
|
@ -183,9 +174,12 @@ export default class ActionSheetExample extends Component<Props, State> {
|
|||
}]}
|
||||
>
|
||||
</IonActionSheet>
|
||||
);
|
||||
}
|
||||
</IonContent>
|
||||
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
|
@ -273,12 +267,12 @@ export default {
|
|||
|
||||
## Events
|
||||
|
||||
| Event | Description | Type |
|
||||
| --------------------------- | --------------------------------------- | --------------------------------- |
|
||||
| `ionActionSheetDidDismiss` | Emitted after the alert has dismissed. | `CustomEvent<OverlayEventDetail>` |
|
||||
| `ionActionSheetDidPresent` | Emitted after the alert has presented. | `CustomEvent<void>` |
|
||||
| `ionActionSheetWillDismiss` | Emitted before the alert has dismissed. | `CustomEvent<OverlayEventDetail>` |
|
||||
| `ionActionSheetWillPresent` | Emitted before the alert has presented. | `CustomEvent<void>` |
|
||||
| Event | Description | Type |
|
||||
| --------------------------- | --------------------------------------- | -------------------------------------- |
|
||||
| `ionActionSheetDidDismiss` | Emitted after the alert has dismissed. | `CustomEvent<OverlayEventDetail<any>>` |
|
||||
| `ionActionSheetDidPresent` | Emitted after the alert has presented. | `CustomEvent<void>` |
|
||||
| `ionActionSheetWillDismiss` | Emitted before the alert has dismissed. | `CustomEvent<OverlayEventDetail<any>>` |
|
||||
| `ionActionSheetWillPresent` | Emitted before the alert has presented. | `CustomEvent<void>` |
|
||||
|
||||
|
||||
## Methods
|
||||
|
|
@ -287,13 +281,6 @@ export default {
|
|||
|
||||
Dismiss the action sheet overlay after it has been presented.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| ------ | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `data` | `any` | Any data to emit in the dismiss events. |
|
||||
| `role` | `string \| undefined` | The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. |
|
||||
|
||||
#### Returns
|
||||
|
||||
Type: `Promise<boolean>`
|
||||
|
|
@ -347,6 +334,23 @@ Type: `Promise<void>`
|
|||
| `--width` | Width of the action sheet |
|
||||
|
||||
|
||||
## Dependencies
|
||||
|
||||
### Depends on
|
||||
|
||||
- [ion-backdrop](../backdrop)
|
||||
- ion-icon
|
||||
- [ion-ripple-effect](../ripple-effect)
|
||||
|
||||
### Graph
|
||||
```mermaid
|
||||
graph TD;
|
||||
ion-action-sheet --> ion-backdrop
|
||||
ion-action-sheet --> ion-icon
|
||||
ion-action-sheet --> ion-ripple-effect
|
||||
style ion-action-sheet fill:#f9f,stroke:#333,stroke-width:4px
|
||||
```
|
||||
|
||||
----------------------------------------------
|
||||
|
||||
*Built with [StencilJS](https://stenciljs.com/)*
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<button id="basic" onclick="presentBasic()">Basic</button>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -1,26 +1,17 @@
|
|||
```typescript
|
||||
import React, { Component } from 'react'
|
||||
import { IonActionSheet } from '@ionic/react';
|
||||
import React, { useState } from 'react'
|
||||
import { IonActionSheet, IonContent, IonButton } from '@ionic/react';
|
||||
|
||||
type Props = {}
|
||||
type State = {
|
||||
showActionSheet: boolean
|
||||
}
|
||||
export const ActionSheetExample: React.FunctionComponent = () => {
|
||||
|
||||
export default class ActionSheetExample extends Component<Props, State> {
|
||||
const [showActionSheet, setShowActionSheet] = useState(false);
|
||||
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
showActionSheet: false
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
return (
|
||||
<IonContent>
|
||||
<IonButton onClick={() => setShowActionSheet(true)} expand="block">Show Action Sheet</IonButton>
|
||||
<IonActionSheet
|
||||
isOpen={this.state.showActionSheet}
|
||||
onDidDismiss={() => this.setState(() => ({ showActionSheet: false }))}
|
||||
isOpen={showActionSheet}
|
||||
onDidDismiss={() => setShowActionSheet(false)}
|
||||
buttons={[{
|
||||
text: 'Delete',
|
||||
role: 'destructive',
|
||||
|
|
@ -56,7 +47,10 @@ export default class ActionSheetExample extends Component<Props, State> {
|
|||
}]}
|
||||
>
|
||||
</IonActionSheet>
|
||||
);
|
||||
}
|
||||
</IonContent>
|
||||
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
```
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ export class AlertController implements ComponentInterface, OverlayController {
|
|||
*/
|
||||
@Method()
|
||||
create(options: AlertOptions): Promise<HTMLIonAlertElement> {
|
||||
return createOverlay(this.doc.createElement('ion-alert'), options);
|
||||
return createOverlay('ion-alert', options);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -32,7 +32,7 @@ export class AlertController implements ComponentInterface, OverlayController {
|
|||
*/
|
||||
@Method()
|
||||
dismiss(data?: any, role?: string, id?: string) {
|
||||
return dismissOverlay(this.doc, data, role, 'ion-alert', id);
|
||||
return dismissOverlay(document, data, role, 'ion-alert', id);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -40,6 +40,6 @@ export class AlertController implements ComponentInterface, OverlayController {
|
|||
*/
|
||||
@Method()
|
||||
async getTop(): Promise<HTMLIonAlertElement | undefined> {
|
||||
return getOverlay(this.doc, 'ion-alert') as HTMLIonAlertElement;
|
||||
return getOverlay(document, 'ion-alert') as HTMLIonAlertElement;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,12 +12,6 @@ Alert controllers programmatically control the alert component. Alerts can be cr
|
|||
|
||||
Create an alert overlay with alert options.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| --------- | -------------- | --------------------------------------- |
|
||||
| `options` | `AlertOptions` | The options to use to create the alert. |
|
||||
|
||||
#### Returns
|
||||
|
||||
Type: `Promise<HTMLIonAlertElement>`
|
||||
|
|
@ -28,14 +22,6 @@ Type: `Promise<HTMLIonAlertElement>`
|
|||
|
||||
Dismiss the open alert overlay.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| ------ | --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `data` | `any` | Any data to emit in the dismiss events. |
|
||||
| `role` | `string \| undefined` | The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. |
|
||||
| `id` | `string \| undefined` | The id of the alert to dismiss. If an id is not provided, it will dismiss the most recently opened alert. |
|
||||
|
||||
#### Returns
|
||||
|
||||
Type: `Promise<boolean>`
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop, Watch } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop, Watch, h } from '@stencil/core';
|
||||
|
||||
import { AlertButton, AlertInput, Animation, AnimationBuilder, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { AlertButton, AlertInput, Animation, AnimationBuilder, Config, CssClassMap, OverlayEventDetail, OverlayInterface } from '../../interface';
|
||||
import { BACKDROP, dismiss, eventMethod, isCancel, present } from '../../utils/overlays';
|
||||
import { sanitizeDOMString } from '../../utils/sanitization';
|
||||
import { getClassMap } from '../../utils/theme';
|
||||
|
|
@ -10,6 +11,9 @@ import { iosLeaveAnimation } from './animations/ios.leave';
|
|||
import { mdEnterAnimation } from './animations/md.enter';
|
||||
import { mdLeaveAnimation } from './animations/md.leave';
|
||||
|
||||
/**
|
||||
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
||||
*/
|
||||
@Component({
|
||||
tag: 'ion-alert',
|
||||
styleUrls: {
|
||||
|
|
@ -27,19 +31,15 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
|
||||
presented = false;
|
||||
animation?: Animation;
|
||||
mode = getIonMode(this);
|
||||
|
||||
@Element() el!: HTMLStencilElement;
|
||||
@Element() el!: HTMLIonAlertElement;
|
||||
|
||||
@Prop({ context: 'config' }) config!: Config;
|
||||
|
||||
/** @internal */
|
||||
@Prop() overlayIndex!: number;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
/**
|
||||
* If `true`, the keyboard will be automatically dismissed when the overlay is presented.
|
||||
*/
|
||||
|
|
@ -306,6 +306,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
|
||||
private renderCheckbox(labelledby: string | undefined) {
|
||||
const inputs = this.processedInputs;
|
||||
const mode = getIonMode(this);
|
||||
if (inputs.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
|
@ -330,7 +331,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
{i.label}
|
||||
</div>
|
||||
</div>
|
||||
{this.mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
|
||||
{mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
|
@ -395,6 +396,8 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
}
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return {
|
||||
'role': 'dialog',
|
||||
'aria-modal': 'true',
|
||||
|
|
@ -403,7 +406,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
},
|
||||
class: {
|
||||
...getClassMap(this.cssClass),
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
'alert-translucent': this.translucent
|
||||
}
|
||||
};
|
||||
|
|
@ -411,6 +414,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
|
||||
private renderAlertButtons() {
|
||||
const buttons = this.processedButtons;
|
||||
const mode = getIonMode(this);
|
||||
const alertButtonGroupClass = {
|
||||
'alert-button-group': true,
|
||||
'alert-button-group-vertical': buttons.length > 2
|
||||
|
|
@ -422,7 +426,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
|
|||
<span class="alert-button-inner">
|
||||
{button.text}
|
||||
</span>
|
||||
{this.mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
|
||||
{mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -529,274 +529,258 @@ async function presentAlertCheckbox() {
|
|||
### React
|
||||
|
||||
```tsx
|
||||
import React, { Component } from 'react'
|
||||
import { IonAlert } from '@ionic/react';
|
||||
import React, { useState } from 'react';
|
||||
import { IonAlert, IonButton, IonContent } from '@ionic/react';
|
||||
|
||||
type Props = {}
|
||||
type State = {
|
||||
showAlert1: boolean
|
||||
showAlert2: boolean
|
||||
showAlert3: boolean
|
||||
showAlert4: boolean
|
||||
showAlert5: boolean
|
||||
showAlert6: boolean
|
||||
}
|
||||
export const AlertExample: React.FunctionComponent = () => {
|
||||
|
||||
export default class AlertExample extends Component<Props, State> {
|
||||
const [showAlert1, setShowAlert1] = useState(false);
|
||||
const [showAlert2, setShowAlert2] = useState(false);
|
||||
const [showAlert3, setShowAlert3] = useState(false);
|
||||
const [showAlert4, setShowAlert4] = useState(false);
|
||||
const [showAlert5, setShowAlert5] = useState(false);
|
||||
const [showAlert6, setShowAlert6] = useState(false);
|
||||
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
showAlert1: false
|
||||
showAlert2: false
|
||||
showAlert3: false
|
||||
showAlert4: false
|
||||
showAlert5: false
|
||||
showAlert6: false
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert1}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert1: false }))}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['OK']}
|
||||
>
|
||||
</IonAlert>
|
||||
<IonContent>
|
||||
<IonButton onClick={() => setShowAlert1(true)} expand="block">Show Alert 1</IonButton>
|
||||
<IonButton onClick={() => setShowAlert2(true)} expand="block">Show Alert 2</IonButton>
|
||||
<IonButton onClick={() => setShowAlert3(true)} expand="block">Show Alert 3</IonButton>
|
||||
<IonButton onClick={() => setShowAlert4(true)} expand="block">Show Alert 4</IonButton>
|
||||
<IonButton onClick={() => setShowAlert5(true)} expand="block">Show Alert 5</IonButton>
|
||||
<IonButton onClick={() => setShowAlert6(true)} expand="block">Show Alert 6</IonButton>
|
||||
<IonAlert
|
||||
isOpen={showAlert1}
|
||||
onDidDismiss={() => setShowAlert1(false)}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['OK']}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={showAlert2}
|
||||
onDidDismiss={() => setShowAlert2(false)}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['Cancel', 'Open Modal', 'Delete']}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert2}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert2: false }))}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['Cancel', 'Open Modal', 'Delete']}
|
||||
>
|
||||
</IonAlert>
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert3}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert3: false }))}
|
||||
header={'Confirm!'}
|
||||
message={'Message <strong>text</strong>!!!'}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: (blah) => {
|
||||
console.log('Confirm Cancel: blah');
|
||||
<IonAlert
|
||||
isOpen={showAlert3}
|
||||
onDidDismiss={() => setShowAlert3(false)}
|
||||
header={'Confirm!'}
|
||||
message={'Message <strong>text</strong>!!!'}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: blah => {
|
||||
console.log('Confirm Cancel: blah');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Okay',
|
||||
handler: () => {
|
||||
console.log('Confirm Okay');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
text: 'Okay',
|
||||
handler: () => {
|
||||
console.log('Confirm Okay');
|
||||
]}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={showAlert4}
|
||||
onDidDismiss={() => setShowAlert4(false)}
|
||||
header={'Prompt!'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'name1',
|
||||
type: 'text',
|
||||
placeholder: 'Placeholder 1'
|
||||
},
|
||||
{
|
||||
name: 'name2',
|
||||
type: 'text',
|
||||
id: 'name2-id',
|
||||
value: 'hello',
|
||||
placeholder: 'Placeholder 2'
|
||||
},
|
||||
{
|
||||
name: 'name3',
|
||||
value: 'http://ionicframework.com',
|
||||
type: 'url',
|
||||
placeholder: 'Favorite site ever'
|
||||
},
|
||||
// input date with min & max
|
||||
{
|
||||
name: 'name4',
|
||||
type: 'date',
|
||||
min: '2017-03-01',
|
||||
max: '2018-01-12'
|
||||
},
|
||||
// input date without min nor max
|
||||
{
|
||||
name: 'name5',
|
||||
type: 'date'
|
||||
},
|
||||
{
|
||||
name: 'name6',
|
||||
type: 'number',
|
||||
min: -5,
|
||||
max: 10
|
||||
},
|
||||
{
|
||||
name: 'name7',
|
||||
type: 'number'
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert4}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert4: false }))}
|
||||
header={'Prompt!'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'name1',
|
||||
type: 'text',
|
||||
placeholder: 'Placeholder 1'
|
||||
},
|
||||
{
|
||||
name: 'name2',
|
||||
type: 'text',
|
||||
id: 'name2-id',
|
||||
value: 'hello',
|
||||
placeholder: 'Placeholder 2'
|
||||
},
|
||||
{
|
||||
name: 'name3',
|
||||
value: 'http://ionicframework.com',
|
||||
type: 'url',
|
||||
placeholder: 'Favorite site ever'
|
||||
},
|
||||
// input date with min & max
|
||||
{
|
||||
name: 'name4',
|
||||
type: 'date',
|
||||
min: '2017-03-01',
|
||||
max: '2018-01-12'
|
||||
},
|
||||
// input date without min nor max
|
||||
{
|
||||
name: 'name5',
|
||||
type: 'date'
|
||||
},
|
||||
{
|
||||
name: 'name6',
|
||||
type: 'number',
|
||||
min: -5,
|
||||
max: 10
|
||||
},
|
||||
{
|
||||
name: 'name7',
|
||||
type: 'number'
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
]}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={showAlert5}
|
||||
onDidDismiss={() => setShowAlert5(false)}
|
||||
header={'Radio'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'radio1',
|
||||
type: 'radio',
|
||||
label: 'Radio 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'radio2',
|
||||
type: 'radio',
|
||||
label: 'Radio 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'radio3',
|
||||
type: 'radio',
|
||||
label: 'Radio 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'radio4',
|
||||
type: 'radio',
|
||||
label: 'Radio 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'radio5',
|
||||
type: 'radio',
|
||||
label: 'Radio 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'radio6',
|
||||
type: 'radio',
|
||||
label: 'Radio 6',
|
||||
value: 'value6'
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
|
||||
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert5}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert5: false }))}
|
||||
header={'Radio'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'radio1',
|
||||
type: 'radio',
|
||||
label: 'Radio 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'radio2',
|
||||
type: 'radio',
|
||||
label: 'Radio 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'radio3',
|
||||
type: 'radio',
|
||||
label: 'Radio 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'radio4',
|
||||
type: 'radio',
|
||||
label: 'Radio 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'radio5',
|
||||
type: 'radio',
|
||||
label: 'Radio 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'radio6',
|
||||
type: 'radio',
|
||||
label: 'Radio 6',
|
||||
value: 'value6'
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
]}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert6}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert6: false }))}
|
||||
header={'Checkbox'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'checkbox1',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'checkbox2',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'checkbox3',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'checkbox4',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'checkbox5',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'checkbox6',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 6',
|
||||
value: 'value6'
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
<IonAlert
|
||||
isOpen={showAlert6}
|
||||
onDidDismiss={() => setShowAlert6(false)}
|
||||
header={'Checkbox'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'checkbox1',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'checkbox2',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'checkbox3',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'checkbox4',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'checkbox5',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'checkbox6',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 6',
|
||||
value: 'value6'
|
||||
}
|
||||
}, {
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
]}
|
||||
/>
|
||||
</IonContent>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default AlertExample;
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
|
@ -1073,12 +1057,12 @@ export default {
|
|||
|
||||
## Events
|
||||
|
||||
| Event | Description | Type |
|
||||
| --------------------- | --------------------------------------- | --------------------------------- |
|
||||
| `ionAlertDidDismiss` | Emitted after the alert has dismissed. | `CustomEvent<OverlayEventDetail>` |
|
||||
| `ionAlertDidPresent` | Emitted after the alert has presented. | `CustomEvent<void>` |
|
||||
| `ionAlertWillDismiss` | Emitted before the alert has dismissed. | `CustomEvent<OverlayEventDetail>` |
|
||||
| `ionAlertWillPresent` | Emitted before the alert has presented. | `CustomEvent<void>` |
|
||||
| Event | Description | Type |
|
||||
| --------------------- | --------------------------------------- | -------------------------------------- |
|
||||
| `ionAlertDidDismiss` | Emitted after the alert has dismissed. | `CustomEvent<OverlayEventDetail<any>>` |
|
||||
| `ionAlertDidPresent` | Emitted after the alert has presented. | `CustomEvent<void>` |
|
||||
| `ionAlertWillDismiss` | Emitted before the alert has dismissed. | `CustomEvent<OverlayEventDetail<any>>` |
|
||||
| `ionAlertWillPresent` | Emitted before the alert has presented. | `CustomEvent<void>` |
|
||||
|
||||
|
||||
## Methods
|
||||
|
|
@ -1087,13 +1071,6 @@ export default {
|
|||
|
||||
Dismiss the alert overlay after it has been presented.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| ------ | --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `data` | `any` | Any data to emit in the dismiss events. |
|
||||
| `role` | `string \| undefined` | The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`. |
|
||||
|
||||
#### Returns
|
||||
|
||||
Type: `Promise<boolean>`
|
||||
|
|
@ -1144,6 +1121,21 @@ Type: `Promise<void>`
|
|||
| `--width` | Width of the alert |
|
||||
|
||||
|
||||
## Dependencies
|
||||
|
||||
### Depends on
|
||||
|
||||
- [ion-ripple-effect](../ripple-effect)
|
||||
- [ion-backdrop](../backdrop)
|
||||
|
||||
### Graph
|
||||
```mermaid
|
||||
graph TD;
|
||||
ion-alert --> ion-ripple-effect
|
||||
ion-alert --> ion-backdrop
|
||||
style ion-alert fill:#f9f,stroke:#333,stroke-width:4px
|
||||
```
|
||||
|
||||
----------------------------------------------
|
||||
|
||||
*Built with [StencilJS](https://stenciljs.com/)*
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<button id="basic" onclick="presentAlert()">Alert</button>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -1,270 +1,254 @@
|
|||
```tsx
|
||||
import React, { Component } from 'react'
|
||||
import { IonAlert } from '@ionic/react';
|
||||
import React, { useState } from 'react';
|
||||
import { IonAlert, IonButton, IonContent } from '@ionic/react';
|
||||
|
||||
type Props = {}
|
||||
type State = {
|
||||
showAlert1: boolean
|
||||
showAlert2: boolean
|
||||
showAlert3: boolean
|
||||
showAlert4: boolean
|
||||
showAlert5: boolean
|
||||
showAlert6: boolean
|
||||
}
|
||||
export const AlertExample: React.FunctionComponent = () => {
|
||||
|
||||
export default class AlertExample extends Component<Props, State> {
|
||||
const [showAlert1, setShowAlert1] = useState(false);
|
||||
const [showAlert2, setShowAlert2] = useState(false);
|
||||
const [showAlert3, setShowAlert3] = useState(false);
|
||||
const [showAlert4, setShowAlert4] = useState(false);
|
||||
const [showAlert5, setShowAlert5] = useState(false);
|
||||
const [showAlert6, setShowAlert6] = useState(false);
|
||||
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
showAlert1: false
|
||||
showAlert2: false
|
||||
showAlert3: false
|
||||
showAlert4: false
|
||||
showAlert5: false
|
||||
showAlert6: false
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert1}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert1: false }))}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['OK']}
|
||||
>
|
||||
</IonAlert>
|
||||
<IonContent>
|
||||
<IonButton onClick={() => setShowAlert1(true)} expand="block">Show Alert 1</IonButton>
|
||||
<IonButton onClick={() => setShowAlert2(true)} expand="block">Show Alert 2</IonButton>
|
||||
<IonButton onClick={() => setShowAlert3(true)} expand="block">Show Alert 3</IonButton>
|
||||
<IonButton onClick={() => setShowAlert4(true)} expand="block">Show Alert 4</IonButton>
|
||||
<IonButton onClick={() => setShowAlert5(true)} expand="block">Show Alert 5</IonButton>
|
||||
<IonButton onClick={() => setShowAlert6(true)} expand="block">Show Alert 6</IonButton>
|
||||
<IonAlert
|
||||
isOpen={showAlert1}
|
||||
onDidDismiss={() => setShowAlert1(false)}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['OK']}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={showAlert2}
|
||||
onDidDismiss={() => setShowAlert2(false)}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['Cancel', 'Open Modal', 'Delete']}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert2}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert2: false }))}
|
||||
header={'Alert'}
|
||||
subHeader={'Subtitle'}
|
||||
message={'This is an alert message.'}
|
||||
buttons={['Cancel', 'Open Modal', 'Delete']}
|
||||
>
|
||||
</IonAlert>
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert3}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert3: false }))}
|
||||
header={'Confirm!'}
|
||||
message={'Message <strong>text</strong>!!!'}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: (blah) => {
|
||||
console.log('Confirm Cancel: blah');
|
||||
<IonAlert
|
||||
isOpen={showAlert3}
|
||||
onDidDismiss={() => setShowAlert3(false)}
|
||||
header={'Confirm!'}
|
||||
message={'Message <strong>text</strong>!!!'}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: blah => {
|
||||
console.log('Confirm Cancel: blah');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Okay',
|
||||
handler: () => {
|
||||
console.log('Confirm Okay');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
text: 'Okay',
|
||||
handler: () => {
|
||||
console.log('Confirm Okay');
|
||||
]}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={showAlert4}
|
||||
onDidDismiss={() => setShowAlert4(false)}
|
||||
header={'Prompt!'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'name1',
|
||||
type: 'text',
|
||||
placeholder: 'Placeholder 1'
|
||||
},
|
||||
{
|
||||
name: 'name2',
|
||||
type: 'text',
|
||||
id: 'name2-id',
|
||||
value: 'hello',
|
||||
placeholder: 'Placeholder 2'
|
||||
},
|
||||
{
|
||||
name: 'name3',
|
||||
value: 'http://ionicframework.com',
|
||||
type: 'url',
|
||||
placeholder: 'Favorite site ever'
|
||||
},
|
||||
// input date with min & max
|
||||
{
|
||||
name: 'name4',
|
||||
type: 'date',
|
||||
min: '2017-03-01',
|
||||
max: '2018-01-12'
|
||||
},
|
||||
// input date without min nor max
|
||||
{
|
||||
name: 'name5',
|
||||
type: 'date'
|
||||
},
|
||||
{
|
||||
name: 'name6',
|
||||
type: 'number',
|
||||
min: -5,
|
||||
max: 10
|
||||
},
|
||||
{
|
||||
name: 'name7',
|
||||
type: 'number'
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert4}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert4: false }))}
|
||||
header={'Prompt!'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'name1',
|
||||
type: 'text',
|
||||
placeholder: 'Placeholder 1'
|
||||
},
|
||||
{
|
||||
name: 'name2',
|
||||
type: 'text',
|
||||
id: 'name2-id',
|
||||
value: 'hello',
|
||||
placeholder: 'Placeholder 2'
|
||||
},
|
||||
{
|
||||
name: 'name3',
|
||||
value: 'http://ionicframework.com',
|
||||
type: 'url',
|
||||
placeholder: 'Favorite site ever'
|
||||
},
|
||||
// input date with min & max
|
||||
{
|
||||
name: 'name4',
|
||||
type: 'date',
|
||||
min: '2017-03-01',
|
||||
max: '2018-01-12'
|
||||
},
|
||||
// input date without min nor max
|
||||
{
|
||||
name: 'name5',
|
||||
type: 'date'
|
||||
},
|
||||
{
|
||||
name: 'name6',
|
||||
type: 'number',
|
||||
min: -5,
|
||||
max: 10
|
||||
},
|
||||
{
|
||||
name: 'name7',
|
||||
type: 'number'
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
]}
|
||||
/>
|
||||
|
||||
<IonAlert
|
||||
isOpen={showAlert5}
|
||||
onDidDismiss={() => setShowAlert5(false)}
|
||||
header={'Radio'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'radio1',
|
||||
type: 'radio',
|
||||
label: 'Radio 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'radio2',
|
||||
type: 'radio',
|
||||
label: 'Radio 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'radio3',
|
||||
type: 'radio',
|
||||
label: 'Radio 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'radio4',
|
||||
type: 'radio',
|
||||
label: 'Radio 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'radio5',
|
||||
type: 'radio',
|
||||
label: 'Radio 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'radio6',
|
||||
type: 'radio',
|
||||
label: 'Radio 6',
|
||||
value: 'value6'
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
|
||||
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert5}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert5: false }))}
|
||||
header={'Radio'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'radio1',
|
||||
type: 'radio',
|
||||
label: 'Radio 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'radio2',
|
||||
type: 'radio',
|
||||
label: 'Radio 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'radio3',
|
||||
type: 'radio',
|
||||
label: 'Radio 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'radio4',
|
||||
type: 'radio',
|
||||
label: 'Radio 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'radio5',
|
||||
type: 'radio',
|
||||
label: 'Radio 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'radio6',
|
||||
type: 'radio',
|
||||
label: 'Radio 6',
|
||||
value: 'value6'
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
]}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<IonAlert
|
||||
isOpen={this.state.showAlert6}
|
||||
onDidDismiss={() => this.setState(() => ({ showAlert6: false }))}
|
||||
header={'Checkbox'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'checkbox1',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'checkbox2',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'checkbox3',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'checkbox4',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'checkbox5',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'checkbox6',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 6',
|
||||
value: 'value6'
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
<IonAlert
|
||||
isOpen={showAlert6}
|
||||
onDidDismiss={() => setShowAlert6(false)}
|
||||
header={'Checkbox'}
|
||||
inputs={[
|
||||
{
|
||||
name: 'checkbox1',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 1',
|
||||
value: 'value1',
|
||||
checked: true
|
||||
},
|
||||
{
|
||||
name: 'checkbox2',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 2',
|
||||
value: 'value2'
|
||||
},
|
||||
{
|
||||
name: 'checkbox3',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 3',
|
||||
value: 'value3'
|
||||
},
|
||||
{
|
||||
name: 'checkbox4',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 4',
|
||||
value: 'value4'
|
||||
},
|
||||
{
|
||||
name: 'checkbox5',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 5',
|
||||
value: 'value5'
|
||||
},
|
||||
{
|
||||
name: 'checkbox6',
|
||||
type: 'checkbox',
|
||||
label: 'Checkbox 6',
|
||||
value: 'value6'
|
||||
}
|
||||
}, {
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'secondary',
|
||||
handler: () => {
|
||||
console.log('Confirm Cancel');
|
||||
}
|
||||
},
|
||||
{
|
||||
text: 'Ok',
|
||||
handler: () => {
|
||||
console.log('Confirm Ok');
|
||||
}
|
||||
}
|
||||
}
|
||||
]}
|
||||
>
|
||||
</IonAlert>
|
||||
]}
|
||||
/>
|
||||
</IonContent>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default AlertExample;
|
||||
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Component, ComponentInterface, Listen, Prop } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Listen, Prop, h } from '@stencil/core';
|
||||
|
||||
import { Color, Mode, RouterDirection } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { Color, RouterDirection } from '../../interface';
|
||||
import { AnchorInterface } from '../../utils/element-interface';
|
||||
import { createColorClasses, openURL } from '../../utils/theme';
|
||||
|
||||
|
|
@ -10,7 +11,6 @@ import { createColorClasses, openURL } from '../../utils/theme';
|
|||
shadow: true
|
||||
})
|
||||
export class Anchor implements ComponentInterface, AnchorInterface {
|
||||
mode!: Mode;
|
||||
|
||||
@Prop({ context: 'window' }) win!: Window;
|
||||
|
||||
|
|
@ -60,10 +60,12 @@ export class Anchor implements ComponentInterface, AnchorInterface {
|
|||
}
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
console.log('anchor', mode);
|
||||
return {
|
||||
class: {
|
||||
...createColorClasses(this.color),
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
'ion-activatable': true
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body class="ion-padding">
|
||||
<h1>Default</h1>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Component, ComponentInterface, Element, Prop, QueueApi } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Element, Prop } from '@stencil/core';
|
||||
|
||||
import { Config, Mode } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { Config } from '../../interface';
|
||||
import { rIC } from '../../utils/helpers';
|
||||
import { isPlatform } from '../../utils/platform';
|
||||
|
||||
|
|
@ -9,33 +10,33 @@ import { isPlatform } from '../../utils/platform';
|
|||
styleUrl: 'app.scss'
|
||||
})
|
||||
export class App implements ComponentInterface {
|
||||
mode!: Mode;
|
||||
|
||||
@Element() el!: HTMLElement;
|
||||
|
||||
@Prop({ context: 'window' }) win!: Window;
|
||||
@Prop({ context: 'config' }) config!: Config;
|
||||
@Prop({ context: 'queue' }) queue!: QueueApi;
|
||||
|
||||
componentDidLoad() {
|
||||
rIC(() => {
|
||||
const { win, config, queue } = this;
|
||||
const { win, config } = this;
|
||||
|
||||
if (!config.getBoolean('_testing')) {
|
||||
importTapClick(win, config);
|
||||
}
|
||||
|
||||
importInputShims(win, config);
|
||||
importStatusTap(win, config, queue);
|
||||
importStatusTap(win, config);
|
||||
importHardwareBackButton(win, config);
|
||||
importFocusVisible(win);
|
||||
});
|
||||
}
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return {
|
||||
class: {
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
'ion-page': true,
|
||||
'force-statusbar-padding': this.config.getBoolean('_forceStatusbarPadding')
|
||||
}
|
||||
|
|
@ -50,10 +51,10 @@ function importHardwareBackButton(win: Window, config: Config) {
|
|||
}
|
||||
}
|
||||
|
||||
function importStatusTap(win: Window, config: Config, queue: QueueApi) {
|
||||
function importStatusTap(win: Window, config: Config) {
|
||||
const statusTap = config.getBoolean('statusTap', isPlatform(win, 'hybrid'));
|
||||
if (statusTap) {
|
||||
import('../../utils/status-tap').then(module => module.startStatusTap(win, queue));
|
||||
import('../../utils/status-tap').then(module => module.startStatusTap(win));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
<style>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script> <style>
|
||||
.safe-area {
|
||||
--ion-safe-area-top: 40px;
|
||||
--ion-safe-area-right: 40px;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Component, ComponentInterface } from '@stencil/core';
|
||||
import { Component, ComponentInterface, h } from '@stencil/core';
|
||||
|
||||
import { Mode } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
|
||||
@Component({
|
||||
tag: 'ion-avatar',
|
||||
|
|
@ -11,12 +11,13 @@ import { Mode } from '../../interface';
|
|||
shadow: true
|
||||
})
|
||||
export class Avatar implements ComponentInterface {
|
||||
mode!: Mode;
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return {
|
||||
class: {
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,10 +37,10 @@ Avatars can be used by themselves or inside of any element. If placed inside of
|
|||
|
||||
```tsx
|
||||
import React from 'react'
|
||||
import { IonAvatar, IonChip, IonItem, IonLabel } from '@ionic/react';
|
||||
import { IonAvatar, IonChip, IonItem, IonLabel, IonContent } from '@ionic/react';
|
||||
|
||||
const AvatarExample: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const AvatarExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
<IonAvatar>
|
||||
<img src="https://gravatar.com/avatar/dba6bae8c566f9d4041fb9cd9ada7741?d=identicon&f=y" />
|
||||
</IonAvatar>
|
||||
|
|
@ -58,10 +58,8 @@ const AvatarExample: React.SFC<{}> = () => (
|
|||
</IonAvatar>
|
||||
<IonLabel>Item Avatar</IonLabel>
|
||||
</IonItem>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default AvatarExample;
|
||||
```
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body class="ion-padding">
|
||||
<h1>Default</h1>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
```tsx
|
||||
import React from 'react'
|
||||
import { IonAvatar, IonChip, IonItem, IonLabel } from '@ionic/react';
|
||||
import { IonAvatar, IonChip, IonItem, IonLabel, IonContent } from '@ionic/react';
|
||||
|
||||
const AvatarExample: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const AvatarExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
<IonAvatar>
|
||||
<img src="https://gravatar.com/avatar/dba6bae8c566f9d4041fb9cd9ada7741?d=identicon&f=y" />
|
||||
</IonAvatar>
|
||||
|
|
@ -21,8 +21,6 @@ const AvatarExample: React.SFC<{}> = () => (
|
|||
</IonAvatar>
|
||||
<IonLabel>Item Avatar</IonLabel>
|
||||
</IonItem>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default AvatarExample;
|
||||
```
|
||||
|
|
@ -1,9 +1,13 @@
|
|||
import { Component, ComponentInterface, Element, Listen, Prop } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Element, Listen, Prop, h } from '@stencil/core';
|
||||
|
||||
import { Color, Config, Mode } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { Color, Config } from '../../interface';
|
||||
import { ButtonInterface } from '../../utils/element-interface';
|
||||
import { createColorClasses, openURL } from '../../utils/theme';
|
||||
|
||||
/**
|
||||
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
||||
*/
|
||||
@Component({
|
||||
tag: 'ion-back-button',
|
||||
styleUrls: {
|
||||
|
|
@ -14,6 +18,7 @@ import { createColorClasses, openURL } from '../../utils/theme';
|
|||
})
|
||||
export class BackButton implements ComponentInterface, ButtonInterface {
|
||||
|
||||
private mode = getIonMode(this);
|
||||
@Element() el!: HTMLElement;
|
||||
|
||||
@Prop({ context: 'config' }) config!: Config;
|
||||
|
|
@ -26,11 +31,6 @@ export class BackButton implements ComponentInterface, ButtonInterface {
|
|||
*/
|
||||
@Prop() color?: Color;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
/**
|
||||
* The url to navigate back to by default when there is no history.
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -119,16 +119,15 @@ To change what is displayed in the back button, use the `text` and `icon` proper
|
|||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { IonBackButton, IonHeader, IonToolbar, IonButtons, IonMenuButton, IonContent } from '@ionic/react';
|
||||
|
||||
import { IonBackButton, IonHeader, IonToolbar, IonButtons, IonMenuButton } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const BackButtonExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default back button --*/}
|
||||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton goBack={() => {}} />
|
||||
<IonBackButton />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -137,7 +136,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton goBack={() => {}} defaultHref="home" />
|
||||
<IonBackButton defaultHref="home" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -146,11 +145,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton
|
||||
goBack={() => {}}
|
||||
text="buttonText"
|
||||
icon="buttonIcon"
|
||||
/>
|
||||
<IonBackButton text="buttonText" icon="buttonIcon" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -159,7 +154,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton goBack={() => {}} text="" icon="add" />
|
||||
<IonBackButton text="" icon="add" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -169,14 +164,12 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonMenuButton />
|
||||
<IonBackButton goBack={() => {}} color="danger" />
|
||||
<IonBackButton color="danger" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
||||
|
||||
|
|
@ -286,6 +279,21 @@ export default Example;
|
|||
| `--transition` | Transition of the button |
|
||||
|
||||
|
||||
## Dependencies
|
||||
|
||||
### Depends on
|
||||
|
||||
- ion-icon
|
||||
- [ion-ripple-effect](../ripple-effect)
|
||||
|
||||
### Graph
|
||||
```mermaid
|
||||
graph TD;
|
||||
ion-back-button --> ion-icon
|
||||
ion-back-button --> ion-ripple-effect
|
||||
style ion-back-button fill:#f9f,stroke:#333,stroke-width:4px
|
||||
```
|
||||
|
||||
----------------------------------------------
|
||||
|
||||
*Built with [StencilJS](https://stenciljs.com/)*
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
<script>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script> <script>
|
||||
class PageOne extends HTMLElement {
|
||||
connectedCallback() {
|
||||
this.innerHTML = `
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
<script src="../../../../../dist/ionic/ionic.js"></script>
|
||||
</head>
|
||||
|
||||
<body onload="loadFirstPage()">
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body onload="loadFirstPage()">
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<h3>Default</h3>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,14 @@
|
|||
```tsx
|
||||
import React from 'react';
|
||||
import { IonBackButton, IonHeader, IonToolbar, IonButtons, IonMenuButton, IonContent } from '@ionic/react';
|
||||
|
||||
import { IonBackButton, IonHeader, IonToolbar, IonButtons, IonMenuButton } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const BackButtonExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default back button --*/}
|
||||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton goBack={() => {}} />
|
||||
<IonBackButton />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -18,7 +17,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton goBack={() => {}} defaultHref="home" />
|
||||
<IonBackButton defaultHref="home" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -27,11 +26,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton
|
||||
goBack={() => {}}
|
||||
text="buttonText"
|
||||
icon="buttonIcon"
|
||||
/>
|
||||
<IonBackButton text="buttonText" icon="buttonIcon" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -40,7 +35,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonHeader>
|
||||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonBackButton goBack={() => {}} text="" icon="add" />
|
||||
<IonBackButton text="" icon="add" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
|
|
@ -50,12 +45,10 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonToolbar>
|
||||
<IonButtons slot="start">
|
||||
<IonMenuButton />
|
||||
<IonBackButton goBack={() => {}} color="danger" />
|
||||
<IonBackButton color="danger" />
|
||||
</IonButtons>
|
||||
</IonToolbar>
|
||||
</IonHeader>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { Component, ComponentInterface, Event, EventEmitter, Listen, Prop } from '@stencil/core';
|
||||
|
||||
import { Mode } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { GESTURE_CONTROLLER } from '../../utils/gesture';
|
||||
import { now } from '../../utils/helpers';
|
||||
|
||||
|
|
@ -13,7 +13,6 @@ import { now } from '../../utils/helpers';
|
|||
shadow: true
|
||||
})
|
||||
export class Backdrop implements ComponentInterface {
|
||||
mode!: Mode;
|
||||
|
||||
private lastClick = -10000;
|
||||
private blocker = GESTURE_CONTROLLER.createBlocker({
|
||||
|
|
@ -77,10 +76,12 @@ export class Backdrop implements ComponentInterface {
|
|||
}
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return {
|
||||
tabindex: '-1',
|
||||
class: {
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
'backdrop-hide': !this.visible,
|
||||
'backdrop-no-tappable': !this.tappable,
|
||||
}
|
||||
|
|
|
|||
|
|
@ -78,11 +78,10 @@ backdrop.stopPropagation = false;
|
|||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { IonBackdrop, IonContent } from '@ionic/react';
|
||||
|
||||
import { IonBackdrop } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const BackdropExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default backdrop --*/}
|
||||
<IonBackdrop />
|
||||
|
||||
|
|
@ -95,15 +94,9 @@ const Example: React.SFC<{}> = () => (
|
|||
{/*-- Backdrop with propagation --*/}
|
||||
<IonBackdrop stopPropagation={false} />
|
||||
|
||||
<IonBackdrop
|
||||
tappable={true}
|
||||
visible={true}
|
||||
stopPropagation={true}
|
||||
/>
|
||||
</>
|
||||
<IonBackdrop tappable={true} visible={true} stopPropagation={true} />
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
||||
|
||||
|
|
@ -161,6 +154,31 @@ export default Example;
|
|||
| `ionBackdropTap` | Emitted when the backdrop is tapped. | `CustomEvent<void>` |
|
||||
|
||||
|
||||
## Dependencies
|
||||
|
||||
### Used by
|
||||
|
||||
- [ion-action-sheet](../action-sheet)
|
||||
- [ion-alert](../alert)
|
||||
- [ion-loading](../loading)
|
||||
- [ion-menu](../menu)
|
||||
- [ion-modal](../modal)
|
||||
- [ion-picker](../picker)
|
||||
- [ion-popover](../popover)
|
||||
|
||||
### Graph
|
||||
```mermaid
|
||||
graph TD;
|
||||
ion-action-sheet --> ion-backdrop
|
||||
ion-alert --> ion-backdrop
|
||||
ion-loading --> ion-backdrop
|
||||
ion-menu --> ion-backdrop
|
||||
ion-modal --> ion-backdrop
|
||||
ion-picker --> ion-backdrop
|
||||
ion-popover --> ion-backdrop
|
||||
style ion-backdrop fill:#f9f,stroke:#333,stroke-width:4px
|
||||
```
|
||||
|
||||
----------------------------------------------
|
||||
|
||||
*Built with [StencilJS](https://stenciljs.com/)*
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
```tsx
|
||||
import React from 'react';
|
||||
import { IonBackdrop, IonContent } from '@ionic/react';
|
||||
|
||||
import { IonBackdrop } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const BackdropExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default backdrop --*/}
|
||||
<IonBackdrop />
|
||||
|
||||
|
|
@ -17,13 +16,7 @@ const Example: React.SFC<{}> = () => (
|
|||
{/*-- Backdrop with propagation --*/}
|
||||
<IonBackdrop stopPropagation={false} />
|
||||
|
||||
<IonBackdrop
|
||||
tappable={true}
|
||||
visible={true}
|
||||
stopPropagation={true}
|
||||
/>
|
||||
</>
|
||||
<IonBackdrop tappable={true} visible={true} stopPropagation={true} />
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,8 +1,12 @@
|
|||
import { Component, ComponentInterface, Prop } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Prop, h } from '@stencil/core';
|
||||
|
||||
import { Color, Mode } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { Color } from '../../interface';
|
||||
import { createColorClasses } from '../../utils/theme';
|
||||
|
||||
/**
|
||||
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
||||
*/
|
||||
@Component({
|
||||
tag: 'ion-badge',
|
||||
styleUrls: {
|
||||
|
|
@ -19,16 +23,13 @@ export class Badge implements ComponentInterface {
|
|||
*/
|
||||
@Prop() color?: Color;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return {
|
||||
class: {
|
||||
...createColorClasses(this.color),
|
||||
[`${this.mode}`]: true
|
||||
[`${mode}`]: true
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,11 +38,10 @@ Badges are inline block elements that usually appear near another element. Typic
|
|||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { IonBadge, IonItem, IonLabel, IonContent } from '@ionic/react';
|
||||
|
||||
import { IonBadge, IonItem, IonLabel } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const BadgeExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default --*/}
|
||||
<IonBadge>99</IonBadge>
|
||||
|
||||
|
|
@ -63,10 +62,8 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonLabel>My Item</IonLabel>
|
||||
<IonBadge slot="end">22</IonBadge>
|
||||
</IonItem>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body class="ion-padding">
|
||||
<h1>Default</h1>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
```tsx
|
||||
import React from 'react';
|
||||
import { IonBadge, IonItem, IonLabel, IonContent } from '@ionic/react';
|
||||
|
||||
import { IonBadge, IonItem, IonLabel } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const BadgeExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default --*/}
|
||||
<IonBadge>99</IonBadge>
|
||||
|
||||
|
|
@ -25,8 +24,6 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonLabel>My Item</IonLabel>
|
||||
<IonBadge slot="end">22</IonBadge>
|
||||
</IonItem>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,11 +1,14 @@
|
|||
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Prop } from '@stencil/core';
|
||||
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Prop, h } from '@stencil/core';
|
||||
|
||||
import { Color, Mode, RouterDirection } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
import { Color, RouterDirection } from '../../interface';
|
||||
import { AnchorInterface, ButtonInterface } from '../../utils/element-interface';
|
||||
import { hasShadowDom } from '../../utils/helpers';
|
||||
import { createColorClasses, openURL } from '../../utils/theme';
|
||||
|
||||
/**
|
||||
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
|
||||
*
|
||||
* @slot - Content is placed between the named slots if provided without a slot.
|
||||
* @slot icon-only - Should be used on an icon in a button that has no text.
|
||||
* @slot start - Content is placed to the left of the button text in LTR, and to the right in RTL.
|
||||
|
|
@ -35,11 +38,6 @@ export class Button implements ComponentInterface, AnchorInterface, ButtonInterf
|
|||
*/
|
||||
@Prop() color?: Color;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
/**
|
||||
* The type of button.
|
||||
*/
|
||||
|
|
@ -179,6 +177,7 @@ export class Button implements ComponentInterface, AnchorInterface, ButtonInterf
|
|||
}
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
const { buttonType, disabled, color, expand, hasIconOnly, shape, strong } = this;
|
||||
let fill = this.fill;
|
||||
if (fill === undefined) {
|
||||
|
|
@ -189,7 +188,7 @@ export class Button implements ComponentInterface, AnchorInterface, ButtonInterf
|
|||
'aria-disabled': disabled ? 'true' : null,
|
||||
class: {
|
||||
...createColorClasses(color),
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
[buttonType]: true,
|
||||
[`${buttonType}-${expand}`]: expand !== undefined,
|
||||
[`${buttonType}-${size}`]: size !== undefined,
|
||||
|
|
@ -206,6 +205,7 @@ export class Button implements ComponentInterface, AnchorInterface, ButtonInterf
|
|||
}
|
||||
|
||||
render() {
|
||||
const mode = getIonMode(this);
|
||||
const TagType = this.href === undefined ? 'button' : 'a' as any;
|
||||
const attrs = (TagType === 'button')
|
||||
? { type: this.type }
|
||||
|
|
@ -230,7 +230,7 @@ export class Button implements ComponentInterface, AnchorInterface, ButtonInterf
|
|||
<slot></slot>
|
||||
<slot name="end"></slot>
|
||||
</span>
|
||||
{this.mode === 'md' && <ion-ripple-effect type={this.rippleType}></ion-ripple-effect>}
|
||||
{mode === 'md' && <ion-ripple-effect type={this.rippleType}></ion-ripple-effect>}
|
||||
</TagType>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -96,10 +96,10 @@ This attribute specifies the size of the button. Setting this attribute will cha
|
|||
```tsx
|
||||
import React from 'react';
|
||||
|
||||
import { IonButton, IonIcon } from '@ionic/react';
|
||||
import { IonButton, IonIcon, IonContent } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const ButtonExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default --*/}
|
||||
<IonButton>Default</IonButton>
|
||||
|
||||
|
|
@ -148,10 +148,9 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonButton size="large">Large</IonButton>
|
||||
<IonButton>Default</IonButton>
|
||||
<IonButton size="small">Small</IonButton>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
||||
|
||||
|
|
@ -277,6 +276,19 @@ export default Example;
|
|||
| `--transition` | Transition of the button |
|
||||
|
||||
|
||||
## Dependencies
|
||||
|
||||
### Depends on
|
||||
|
||||
- [ion-ripple-effect](../ripple-effect)
|
||||
|
||||
### Graph
|
||||
```mermaid
|
||||
graph TD;
|
||||
ion-button --> ion-ripple-effect
|
||||
style ion-button fill:#f9f,stroke:#333,stroke-width:4px
|
||||
```
|
||||
|
||||
----------------------------------------------
|
||||
|
||||
*Built with [StencilJS](https://stenciljs.com/)*
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
@ -121,7 +121,7 @@
|
|||
}
|
||||
|
||||
function toggleDisabled() {
|
||||
var buttonEl = this.document.getElementById('disabledButton');
|
||||
var buttonEl = document.getElementById('disabledButton');
|
||||
console.log(buttonEl);
|
||||
buttonEl.disabled = !buttonEl.disabled;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/core.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<h3>Default</h3>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@
|
|||
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
|
||||
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
|
||||
<script src="../../../../../scripts/testing/scripts.js"></script>
|
||||
<script src="../../../../../dist/ionic.js"></script>
|
||||
</head>
|
||||
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
|
||||
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
|
||||
|
||||
<body>
|
||||
<ion-app>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
```tsx
|
||||
import React from 'react';
|
||||
|
||||
import { IonButton, IonIcon } from '@ionic/react';
|
||||
import { IonButton, IonIcon, IonContent } from '@ionic/react';
|
||||
|
||||
const Example: React.SFC<{}> = () => (
|
||||
<>
|
||||
export const ButtonExample: React.FunctionComponent = () => (
|
||||
<IonContent>
|
||||
{/*-- Default --*/}
|
||||
<IonButton>Default</IonButton>
|
||||
|
||||
|
|
@ -53,8 +53,7 @@ const Example: React.SFC<{}> = () => (
|
|||
<IonButton size="large">Large</IonButton>
|
||||
<IonButton>Default</IonButton>
|
||||
<IonButton size="small">Small</IonButton>
|
||||
</>
|
||||
</IonContent>
|
||||
);
|
||||
|
||||
export default Example;
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Component, ComponentInterface } from '@stencil/core';
|
||||
|
||||
import { Mode } from '../../interface';
|
||||
import { getIonMode } from '../../global/ionic-global';
|
||||
|
||||
@Component({
|
||||
tag: 'ion-buttons',
|
||||
|
|
@ -11,12 +11,12 @@ import { Mode } from '../../interface';
|
|||
scoped: true,
|
||||
})
|
||||
export class Buttons implements ComponentInterface {
|
||||
mode!: Mode;
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
return {
|
||||
class: {
|
||||
[`${this.mode}`]: true
|
||||
[`${mode}`]: true
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue