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

fix(): update to Stencil One 🎉🎊

Browse Source
This commit is contained in:
Manu MA
2019-06-19 21:33:50 +02:00
committed by GitHub
parent 7f1829eb21
commit b40f7d36d5
572 changed files with 14426 additions and 9916 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
core/src/components/button/button.tsx
View File

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