chore(components): update core components

This commit is contained in:
Adam Bradley
2017-05-03 11:15:42 -05:00
parent 2b2f23b71a
commit 024d787f23
8 changed files with 70 additions and 37 deletions

View File

@ -1,4 +1,4 @@
import { Component } from '../index'; import { Component, h, Ionic } from '../index';
@Component({ @Component({
@ -9,4 +9,10 @@ import { Component } from '../index';
wp: 'badge.wp.scss' wp: 'badge.wp.scss'
} }
}) })
export class Badge {} export class Badge {
render() {
return h(this, Ionic.theme(this, 'badge'),
h('slot')
);
}
}

View File

@ -1,4 +1,4 @@
import { Component, h, Ionic, Prop } from '../index'; import { Component, h, Prop } from '../index';
type CssClassObject = { [className: string]: boolean }; type CssClassObject = { [className: string]: boolean };
/** /**
@ -71,6 +71,13 @@ type CssClassObject = { [className: string]: boolean };
}) })
export class Button { export class Button {
/**
* @Prop {boolean} If true, activates the large button size.
* Type: size
*/
@Prop() role: string = 'button';
/** /**
* @Prop {boolean} If true, activates the large button size. * @Prop {boolean} If true, activates the large button size.
* Type: size * Type: size
@ -211,8 +218,6 @@ export class Button {
} }
render() { render() {
var role = 'button';
var size = var size =
(this.large ? 'large' : null) || (this.large ? 'large' : null) ||
(this.small ? 'small' : null) || (this.small ? 'small' : null) ||
@ -228,12 +233,12 @@ export class Button {
var buttonClasses: CssClassObject = [] var buttonClasses: CssClassObject = []
.concat( .concat(
this.getElementClassList(role, this.mode), this.getElementClassList(this.role, this.mode),
this.getClassList(role, shape, this.mode), this.getClassList(this.role, shape, this.mode),
this.getClassList(role, display, this.mode), this.getClassList(this.role, display, this.mode),
this.getClassList(role, size, this.mode), this.getClassList(this.role, size, this.mode),
this.getClassList(role, decorator, this.mode), this.getClassList(this.role, decorator, this.mode),
this.getStyleClassList(role) this.getStyleClassList(this.role)
) )
.reduce((prevValue, cssClass) => { .reduce((prevValue, cssClass) => {
prevValue[cssClass] = true; prevValue[cssClass] = true;

View File

@ -1,4 +1,4 @@
import { Component } from '../index'; import { Component, h, Ionic } from '../index';
@Component({ @Component({
@ -9,4 +9,10 @@ import { Component } from '../index';
wp: 'card-content.wp.scss' wp: 'card-content.wp.scss'
} }
}) })
export class CardContent {} export class CardContent {
render() {
return h(this, Ionic.theme(this, 'card-content'),
h('slot')
);
}
}

View File

@ -1,4 +1,4 @@
import { Component } from '../index'; import { Component, h, Ionic } from '../index';
@Component({ @Component({
@ -9,4 +9,10 @@ import { Component } from '../index';
wp: 'card-header.wp.scss' wp: 'card-header.wp.scss'
} }
}) })
export class CardHeader {} export class CardHeader {
render() {
return h(this, Ionic.theme(this, 'card-header'),
h('slot')
);
}
}

View File

@ -1,4 +1,4 @@
import { Component } from '../index'; import { Component, h, Ionic } from '../index';
@Component({ @Component({
@ -9,4 +9,10 @@ import { Component } from '../index';
wp: 'card-title.wp.scss' wp: 'card-title.wp.scss'
} }
}) })
export class CardTitle {} export class CardTitle {
render() {
return h(this, Ionic.theme(this, 'card-title'),
h('slot')
);
}
}

View File

@ -1,4 +1,4 @@
import { Component } from '../index'; import { Component, h, Ionic } from '../index';
@Component({ @Component({
@ -9,4 +9,10 @@ import { Component } from '../index';
wp: 'card.wp.scss' wp: 'card.wp.scss'
} }
}) })
export class Card {} export class Card {
render() {
return h(this, Ionic.theme(this, 'card'),
h('slot')
);
}
}

0
src/themes/ionic.scss Normal file
View File

View File

@ -70,7 +70,7 @@ export interface ScrollDetail extends GestureDetail {
contentWidth?: number; contentWidth?: number;
contentTop?: number; contentTop?: number;
contentBottom?: number; contentBottom?: number;
domWrite?: RequestAnimationFrame; domWrite?: DomControllerCallback;
contentElement?: HTMLElement; contentElement?: HTMLElement;
fixedElement?: HTMLElement; fixedElement?: HTMLElement;
scrollElement?: HTMLElement; scrollElement?: HTMLElement;
@ -103,8 +103,8 @@ export interface ContentDimensions {
export interface IonicGlobal { export interface IonicGlobal {
staticDir?: string; staticDir?: string;
components?: LoadComponents; components?: LoadComponents;
loadComponents?: {(bundleId: string): void}; loadComponents?: {(bundleId: string, modulesImporterFn: ModulesImporterFn, cmp0?: ComponentModeData, cmp1?: ComponentModeData, cmp2?: ComponentModeData): void};
eventNamePrefix?: string; eventNameFn?: {(eventName: string): string};
config?: Object; config?: Object;
ConfigCtrl?: ConfigApi; ConfigCtrl?: ConfigApi;
DomCtrl?: DomControllerApi; DomCtrl?: DomControllerApi;
@ -123,9 +123,9 @@ export interface NextTick {
export interface DomControllerApi { export interface DomControllerApi {
read: RequestAnimationFrame; read: DomControllerCallback;
write: RequestAnimationFrame; write: DomControllerCallback;
raf: RequestAnimationFrame; raf: DomControllerCallback;
} }
export interface RafCallback { export interface RafCallback {
@ -133,7 +133,7 @@ export interface RafCallback {
} }
export interface RequestAnimationFrame { export interface DomControllerCallback {
(cb: RafCallback): void; (cb: RafCallback): void;
} }
@ -178,11 +178,6 @@ export interface ComponentModeData {
* component mode styles * component mode styles
*/ */
[6]: string; [6]: string;
/**
* import component function
*/
[7]: ComponentModeImporterFn;
} }
@ -219,7 +214,7 @@ export interface ComponentWatchersData {
} }
export interface ComponentModeImporterFn { export interface ModulesImporterFn {
(importer: any, h: Hyperscript, Ionic: Ionic): void; (importer: any, h: Hyperscript, Ionic: Ionic): void;
} }
@ -307,9 +302,9 @@ export interface ComponentMeta {
watchers?: Watchers; watchers?: Watchers;
shadow?: boolean; shadow?: boolean;
obsAttrs?: string[]; obsAttrs?: string[];
hostCss?: string;
componentModule?: any; componentModule?: any;
modes: {[modeName: string]: ComponentMode}; modes: {[modeName: string]: ComponentMode};
priority?: 'high'|'low';
} }
@ -383,6 +378,9 @@ export interface ProxyElement extends HTMLElement {
} }
export type Side = 'left' | 'right' | 'start' | 'end';
export interface RendererApi { export interface RendererApi {
(oldVnode: VNode | Element, vnode: VNode, manualSlotProjection?: boolean): VNode; (oldVnode: VNode | Element, vnode: VNode, manualSlotProjection?: boolean): VNode;
} }
@ -396,10 +394,10 @@ export interface Hyperscript {
(sel: Node, data: VNodeData): VNode; (sel: Node, data: VNodeData): VNode;
(sel: any, data: VNodeData): VNode; (sel: any, data: VNodeData): VNode;
(sel: any, text: string): VNode; (sel: any, text: string): VNode;
(sel: any, children: Array<any>): VNode; (sel: any, children: Array<VNode | undefined | null>): VNode;
(sel: any, data: VNodeData, text: string): VNode; (sel: any, data: VNodeData, text: string): VNode;
(sel: any, data: VNodeData, children: Array<any|string>): VNode; (sel: any, data: VNodeData, children: Array<VNode | undefined | null>): VNode;
(sel: any, data: VNodeData, children: any): VNode; (sel: any, data: VNodeData, children: VNode): VNode;
} }
@ -430,7 +428,7 @@ export interface VNodeData {
export interface PlatformApi { export interface PlatformApi {
registerComponent: (tag: string, data: any[]) => ComponentMeta; registerComponent: (tag: string, data: any[]) => ComponentMeta;
getComponentMeta: (tag: string) => ComponentMeta; getComponentMeta: (tag: string) => ComponentMeta;
loadComponent: (bundleId: string, cb: Function) => void; loadComponent: (bundleId: string, priority: string, cb: Function) => void;
nextTick: NextTick; nextTick: NextTick;
isElement: (node: Node) => node is Element; isElement: (node: Node) => node is Element;