mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-23 05:58:26 +08:00
fix(): update to Stencil One 🎉🎊
This commit is contained in:
@ -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-chip',
|
||||
styleUrls: {
|
||||
@ -19,21 +23,17 @@ export class Chip implements ComponentInterface {
|
||||
*/
|
||||
@Prop() color?: Color;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
/**
|
||||
* Display an outline style button.
|
||||
*/
|
||||
@Prop() outline = false;
|
||||
|
||||
hostData() {
|
||||
const mode = getIonMode(this);
|
||||
return {
|
||||
class: {
|
||||
...createColorClasses(this.color),
|
||||
[`${this.mode}`]: true,
|
||||
[`${mode}`]: true,
|
||||
'chip-outline': this.outline,
|
||||
'ion-activatable': true,
|
||||
}
|
||||
@ -41,9 +41,11 @@ export class Chip implements ComponentInterface {
|
||||
}
|
||||
|
||||
render() {
|
||||
const mode = getIonMode(this);
|
||||
|
||||
return [
|
||||
<slot></slot>,
|
||||
this.mode === 'md' ? <ion-ripple-effect></ion-ripple-effect> : null
|
||||
mode === 'md' ? <ion-ripple-effect></ion-ripple-effect> : null
|
||||
];
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user