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

feat(chip-button) change clear attr to fill

Browse Source
This commit is contained in:
Cam Wiegert
2018-01-08 14:37:30 -06:00
parent 2cb2a8c4ea
commit c248db2d5f
4 changed files with 22 additions and 3069 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3045
packages/core/src/components.d.ts vendored
View File

File diff suppressed because it is too large Load Diff

14
packages/core/src/components/chip-button/chip-button.tsx
View File

@ -33,9 +33,9 @@ export class ChipButton {
@Prop() mode: 'ios' | 'md'; @Prop() mode: 'ios' | 'md';
/** /**
* @input {boolean} If true, activates a transparent button style. * Set to `"clear"` for a transparent button style.
*/ */
@Prop() clear: boolean = false; @Prop() fill: string;
/** /**
* @input {boolean} If true, sets the button into a disabled state. * @input {boolean} If true, sets the button into a disabled state.
@ -73,15 +73,7 @@ export class ChipButton {
* Chip buttons can only be clear or default (solid) * Chip buttons can only be clear or default (solid)
*/ */
private getStyleClassList(buttonType: string): string[] { private getStyleClassList(buttonType: string): string[] {
let classList = [].concat( return this.getColorClassList(this.color, buttonType, this.fill || 'default', this.mode);
this.clear ? this.getColorClassList(this.color, buttonType, 'clear', this.mode) : []
);
if (classList.length === 0) {
classList = this.getColorClassList(this.color, buttonType, 'default', this.mode);
}
return classList;
} }
render() { render() {

24
packages/core/src/components/chip-button/readme.md
View File

@ -7,11 +7,6 @@
## Properties ## Properties
#### clear
boolean
#### color #### color
string string
@ -22,6 +17,13 @@ string
boolean boolean
#### fill
string
Set to `"clear"` for a transparent button style.
#### href #### href
string string
@ -34,11 +36,6 @@ any
## Attributes ## Attributes
#### clear
boolean
#### color #### color
string string
@ -49,6 +46,13 @@ string
boolean boolean
#### fill
string
Set to `"clear"` for a transparent button style.
#### href #### href
string string

8
packages/core/src/components/chip/test/basic/index.html
View File

@ -77,7 +77,7 @@
<ion-chip id="chip1"> <ion-chip id="chip1">
<ion-label>Default</ion-label> <ion-label>Default</ion-label>
<ion-chip-button clear onclick="del('chip1')" class="my-custom-chip"> <ion-chip-button fill="clear" onclick="del('chip1')" class="my-custom-chip">
<ion-icon name="close-circle"></ion-icon> <ion-icon name="close-circle"></ion-icon>
</ion-chip-button> </ion-chip-button>
</ion-chip> </ion-chip>
@ -95,7 +95,7 @@
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw=="> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
</ion-avatar> </ion-avatar>
<ion-label>With Avatar</ion-label> <ion-label>With Avatar</ion-label>
<ion-chip-button clear color="dark" onclick="del('chip3')"> <ion-chip-button fill="clear" color="dark" onclick="del('chip3')">
<ion-icon name="close-circle"></ion-icon> <ion-icon name="close-circle"></ion-icon>
</ion-chip-button> </ion-chip-button>
</ion-chip> </ion-chip>
@ -103,7 +103,7 @@
<ion-chip color="primary" id="chip4"> <ion-chip color="primary" id="chip4">
<ion-icon name="pin"></ion-icon> <ion-icon name="pin"></ion-icon>
<ion-label>Primary</ion-label> <ion-label>Primary</ion-label>
<ion-chip-button clear onclick="del('chip4')"> <ion-chip-button fill="clear" onclick="del('chip4')">
<ion-icon name="close-circle"></ion-icon> <ion-icon name="close-circle"></ion-icon>
</ion-chip-button> </ion-chip-button>
</ion-chip> </ion-chip>
@ -113,7 +113,7 @@
<ion-chip slot="end" id="chip5"> <ion-chip slot="end" id="chip5">
<ion-icon name="pin" color="primary"></ion-icon> <ion-icon name="pin" color="primary"></ion-icon>
<ion-label>Default</ion-label> <ion-label>Default</ion-label>
<ion-chip-button clear color="light" onclick="del('chip5')"> <ion-chip-button fill="clear" color="light" onclick="del('chip5')">
<ion-icon name="close-circle"></ion-icon> <ion-icon name="close-circle"></ion-icon>
</ion-chip-button> </ion-chip-button>
</ion-chip> </ion-chip>