javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-15 17:42:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(angular): update proxies

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-08-16 15:44:59 +02:00
parent 3e3cc6ca45
commit f845803c04
4 changed files with 65 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
angular/src/directives/proxies-list.txt
View File

@ -5,6 +5,7 @@ export const DIRECTIVES = [
d.App,
d.Avatar,
d.BackButton,
d.Backdrop,
d.Badge,
d.Button,
d.Buttons,
@ -58,7 +59,6 @@ export const DIRECTIVES = [
d.ReorderGroup,
d.RippleEffect,
d.Row,
d.Scroll,
d.Searchbar,
d.Segment,
d.SegmentButton,

47
angular/src/directives/proxies.ts
View File

@ -47,6 +47,16 @@ export class BackButton {
}
}
export declare interface Backdrop extends StencilComponents.IonBackdrop {}
@Directive({ selector: 'ion-backdrop', inputs: ['visible', 'tappable', 'stopPropagation'], outputs: ['ionBackdropTap'] })
export class Backdrop {
ionBackdropTap: EventEmitter<any>;
constructor(r: ElementRef) {
proxyInputs(this, r, ['visible', 'tappable', 'stopPropagation']);
proxyOutputs(this, ['ionBackdropTap']);
}
}
export declare interface Badge extends StencilComponents.IonBadge {}
@Directive({ selector: 'ion-badge', inputs: ['color', 'mode'] })
export class Badge {
@ -157,11 +167,15 @@ export class Col {
}
export declare interface Content extends StencilComponents.IonContent {}
@Directive({ selector: 'ion-content', inputs: ['color', 'fullscreen', 'forceOverscroll', 'scrollEnabled', 'scrollEvents'] })
@Directive({ selector: 'ion-content', inputs: ['color', 'fullscreen', 'forceOverscroll', 'scrollX', 'scrollY', 'scrollEvents'], outputs: ['ionScrollStart', 'ionScroll', 'ionScrollEnd'] })
export class Content {
ionScrollStart: EventEmitter<any>;
ionScroll: EventEmitter<any>;
ionScrollEnd: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['getScrollElement']);
proxyInputs(this, r, ['color', 'fullscreen', 'forceOverscroll', 'scrollEnabled', 'scrollEvents']);
proxyMethods(this, r, ['getScrollElement', 'scrollToTop', 'scrollToBottom', 'scrollByPoint', 'scrollToPoint']);
proxyInputs(this, r, ['color', 'fullscreen', 'forceOverscroll', 'scrollX', 'scrollY', 'scrollEvents']);
proxyOutputs(this, ['ionScrollStart', 'ionScroll', 'ionScrollEnd']);
}
}
@ -172,6 +186,7 @@ export class Datetime {
ionChange: EventEmitter<any>;
ionStyle: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['open']);
proxyInputs(this, r, ['disabled', 'min', 'max', 'displayFormat', 'pickerFormat', 'cancelText', 'doneText', 'yearValues', 'monthValues', 'dayValues', 'hourValues', 'minuteValues', 'monthNames', 'monthShortNames', 'dayNames', 'dayShortNames', 'pickerOptions', 'placeholder', 'value']);
proxyOutputs(this, ['ionCancel', 'ionChange', 'ionStyle']);
}
@ -367,14 +382,14 @@ export class ListHeader {
}
export declare interface Menu extends StencilComponents.IonMenu {}
@Directive({ selector: 'ion-menu', inputs: ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeEnabled', 'maxEdgeStart'], outputs: ['ionOpen', 'ionClose', 'ionMenuChange'] })
@Directive({ selector: 'ion-menu', inputs: ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeGesture', 'maxEdgeStart'], outputs: ['ionOpen', 'ionClose', 'ionMenuChange'] })
export class Menu {
ionOpen: EventEmitter<any>;
ionClose: EventEmitter<any>;
ionMenuChange: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['isOpen', 'open', 'close', 'toggle', 'setOpen', 'isActive', 'getWidth']);
proxyInputs(this, r, ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeEnabled', 'maxEdgeStart']);
proxyInputs(this, r, ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeGesture', 'maxEdgeStart']);
proxyOutputs(this, ['ionOpen', 'ionClose', 'ionMenuChange']);
}
}
@ -396,14 +411,14 @@ export class MenuToggle {
}
export declare interface Nav extends StencilComponents.IonNav {}
@Directive({ selector: 'ion-nav', inputs: ['swipeBackEnabled', 'animated', 'delegate', 'rootParams', 'root'], outputs: ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange'] })
@Directive({ selector: 'ion-nav', inputs: ['swipeGesture', 'animated', 'delegate', 'rootParams', 'root'], outputs: ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange'] })
export class Nav {
ionNavWillLoad: EventEmitter<any>;
ionNavWillChange: EventEmitter<any>;
ionNavDidChange: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'setRouteId', 'getRouteId', 'canGoBack', 'getActive', 'getByIndex', 'getPrevious', 'isAnimating', 'getLength']);
proxyInputs(this, r, ['swipeBackEnabled', 'animated', 'delegate', 'rootParams', 'root']);
proxyInputs(this, r, ['swipeGesture', 'animated', 'delegate', 'rootParams', 'root']);
proxyOutputs(this, ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange']);
}
}
@ -523,19 +538,6 @@ export declare interface Row extends StencilComponents.IonRow {}
export class Row {
}
export declare interface Scroll extends StencilComponents.IonScroll {}
@Directive({ selector: 'ion-scroll', inputs: ['mode', 'forceOverscroll', 'scrollEvents'], outputs: ['ionScrollStart', 'ionScroll', 'ionScrollEnd'] })
export class Scroll {
ionScrollStart: EventEmitter<any>;
ionScroll: EventEmitter<any>;
ionScrollEnd: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['scrollToTop', 'scrollToBottom', 'scrollByPoint', 'scrollToPoint']);
proxyInputs(this, r, ['mode', 'forceOverscroll', 'scrollEvents']);
proxyOutputs(this, ['ionScrollStart', 'ionScroll', 'ionScrollEnd']);
}
}
export declare interface Searchbar extends StencilComponents.IonSearchbar {}
@Directive({ selector: 'ion-searchbar', inputs: ['color', 'mode', 'animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'debounce', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value'], outputs: ['ionInput', 'ionChange', 'ionCancel', 'ionClear', 'ionBlur', 'ionFocus'] })
export class Searchbar {
@ -580,6 +582,7 @@ export class Select {
ionBlur: EventEmitter<any>;
ionStyle: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['open']);
proxyInputs(this, r, ['disabled', 'cancelText', 'okText', 'placeholder', 'name', 'selectedText', 'multiple', 'interface', 'interfaceOptions', 'value']);
proxyOutputs(this, ['ionChange', 'ionCancel', 'ionFocus', 'ionBlur', 'ionStyle']);
}
@ -684,7 +687,7 @@ export class Tab {
}
export declare interface Tabs extends StencilComponents.IonTabs {}
@Directive({ selector: 'ion-tabs', inputs: ['color', 'name', 'tabbarHidden', 'tabbarHighlight', 'tabbarLayout', 'tabbarPlacement', 'translucent', 'scrollable', 'useRouter'], outputs: ['ionChange', 'ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange'] })
@Directive({ selector: 'ion-tabs', inputs: ['color', 'name', 'tabbarHidden', 'tabbarHighlight', 'tabbarLayout', 'tabbarPlacement', 'translucent', 'useRouter'], outputs: ['ionChange', 'ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange'] })
export class Tabs {
ionChange: EventEmitter<any>;
ionNavWillLoad: EventEmitter<any>;
@ -692,7 +695,7 @@ export class Tabs {
ionNavDidChange: EventEmitter<any>;
constructor(r: ElementRef) {
proxyMethods(this, r, ['select', 'setRouteId', 'getRouteId', 'getTab', 'getSelected']);
proxyInputs(this, r, ['color', 'name', 'tabbarHidden', 'tabbarHighlight', 'tabbarLayout', 'tabbarPlacement', 'translucent', 'scrollable', 'useRouter']);
proxyInputs(this, r, ['color', 'name', 'tabbarHidden', 'tabbarHighlight', 'tabbarLayout', 'tabbarPlacement', 'translucent', 'useRouter']);
proxyOutputs(this, ['ionChange', 'ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange']);
}
}

2
angular/src/ionic-module.ts
View File

@ -14,6 +14,7 @@ const DECLARATIONS = [
d.App,
d.Avatar,
d.BackButton,
d.Backdrop,
d.Badge,
d.Button,
d.Buttons,
@ -67,7 +68,6 @@ const DECLARATIONS = [
d.ReorderGroup,
d.RippleEffect,
d.Row,
d.Scroll,
d.Searchbar,
d.Segment,
d.SegmentButton,

35
core/src/components/tabbar/tabbar.tsx
View File

@ -104,24 +104,11 @@ export class Tabbar {
};
}
render() {
const selectedTab = this.selectedTab;
return [
this.tabs.map(tab => renderTabButton(tab, tab === selectedTab, this.mode, () => {
this.ionTabbarClick.emit(tab);
})),
this.highlight && <div class="animated tabbar-highlight" />
];
}
}
function renderTabButton(tab: HTMLIonTabElement, selected: boolean, mode: string, onClick: () => void) {
renderTabButton(tab: HTMLIonTabElement) {
const { icon, label, disabled, badge, badgeColor, href } = tab;
const selected = tab === this.selectedTab;
const hasLabel = !!label;
const hasIcon = !!icon;
const hasLabelOnly = (hasLabel && !hasIcon);
const hasIconOnly = (hasIcon && !hasLabel);
const hasBadge = !!badge;
return (
<a
role="tab"
@ -133,15 +120,15 @@ function renderTabButton(tab: HTMLIonTabElement, selected: boolean, mode: string
'tab-btn-selected': selected,
'tab-btn-has-label': hasLabel,
'tab-btn-has-icon': hasIcon,
'tab-btn-has-label-only': hasLabelOnly,
'tab-btn-has-icon-only': hasIconOnly,
'tab-btn-has-badge': hasBadge,
'tab-btn-has-label-only': hasLabel && !hasIcon,
'tab-btn-has-icon-only': hasIcon && !hasLabel,
'tab-btn-has-badge': !!badge,
'tab-btn-disabled': disabled,
'tab-btn-hidden': !tab.show
}}
onClick={ev => {
if (!tab.disabled) {
onClick();
this.ionTabbarClick.emit(tab);
}
ev.stopPropagation();
ev.preventDefault();
@ -149,7 +136,15 @@ function renderTabButton(tab: HTMLIonTabElement, selected: boolean, mode: string
{ icon && <ion-icon class="tab-btn-icon" icon={icon} lazy={false}></ion-icon> }
{ label && <span class="tab-btn-text">{label}</span> }
{ badge && <ion-badge class="tab-btn-badge" color={badgeColor}>{badge}</ion-badge> }
{ mode === 'md' && <ion-ripple-effect tapClick={true}></ion-ripple-effect> }
{ this.mode === 'md' && <ion-ripple-effect tapClick={true}></ion-ripple-effect> }
</a>
);
}
render() {
return [
this.tabs.map(tab => this.renderTabButton(tab)),
this.highlight && <div class="animated tabbar-highlight" />
];
}
}