mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
feat(chip-button) change clear attr to fill
This commit is contained in:
3045
packages/core/src/components.d.ts
vendored
3045
packages/core/src/components.d.ts
vendored
File diff suppressed because it is too large
Load Diff
@ -33,9 +33,9 @@ export class ChipButton {
|
||||
@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.
|
||||
@ -73,15 +73,7 @@ export class ChipButton {
|
||||
* Chip buttons can only be clear or default (solid)
|
||||
*/
|
||||
private getStyleClassList(buttonType: string): string[] {
|
||||
let classList = [].concat(
|
||||
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;
|
||||
return this.getColorClassList(this.color, buttonType, this.fill || 'default', this.mode);
|
||||
}
|
||||
|
||||
render() {
|
||||
|
@ -7,11 +7,6 @@
|
||||
|
||||
## Properties
|
||||
|
||||
#### clear
|
||||
|
||||
boolean
|
||||
|
||||
|
||||
#### color
|
||||
|
||||
string
|
||||
@ -22,6 +17,13 @@ string
|
||||
boolean
|
||||
|
||||
|
||||
#### fill
|
||||
|
||||
string
|
||||
|
||||
Set to `"clear"` for a transparent button style.
|
||||
|
||||
|
||||
#### href
|
||||
|
||||
string
|
||||
@ -34,11 +36,6 @@ any
|
||||
|
||||
## Attributes
|
||||
|
||||
#### clear
|
||||
|
||||
boolean
|
||||
|
||||
|
||||
#### color
|
||||
|
||||
string
|
||||
@ -49,6 +46,13 @@ string
|
||||
boolean
|
||||
|
||||
|
||||
#### fill
|
||||
|
||||
string
|
||||
|
||||
Set to `"clear"` for a transparent button style.
|
||||
|
||||
|
||||
#### href
|
||||
|
||||
string
|
||||
|
@ -77,7 +77,7 @@
|
||||
|
||||
<ion-chip id="chip1">
|
||||
<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-chip-button>
|
||||
</ion-chip>
|
||||
@ -95,7 +95,7 @@
|
||||
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
|
||||
</ion-avatar>
|
||||
<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-chip-button>
|
||||
</ion-chip>
|
||||
@ -103,7 +103,7 @@
|
||||
<ion-chip color="primary" id="chip4">
|
||||
<ion-icon name="pin"></ion-icon>
|
||||
<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-chip-button>
|
||||
</ion-chip>
|
||||
@ -113,7 +113,7 @@
|
||||
<ion-chip slot="end" id="chip5">
|
||||
<ion-icon name="pin" color="primary"></ion-icon>
|
||||
<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-chip-button>
|
||||
</ion-chip>
|
||||
|
Reference in New Issue
Block a user