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

refactor(chip): update styles, remove chip-icon and chip-button (#16264)

Browse Source 
This reimplements chip, removing the extraneous chip-button and chip-icon components and updating the design to match the updated Material Design spec.
This commit is contained in:
Cam Wiegert
2018-11-08 14:58:29 -06:00
committed by GitHub
parent 6794447e10
commit 91f07bc097
28 changed files with 304 additions and 1177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
core/src/components.d.ts vendored
View File

@ -819,96 +819,6 @@ export namespace Components {
'value'?: string;
}
interface IonChipButton {
/**
* The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
*/
'color'?: Color;
/**
* If `true`, the user cannot interact with the chip button.
*/
'disabled': boolean;
/**
* Set to `"clear"` for a transparent button or to `"solid"` for a filled background.
*/
'fill': 'clear' | 'solid';
/**
* Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.
*/
'href'?: string;
/**
* The mode determines which platform styles to use.
*/
'mode': Mode;
}
interface IonChipButtonAttributes extends StencilHTMLAttributes {
/**
* The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
*/
'color'?: Color;
/**
* If `true`, the user cannot interact with the chip button.
*/
'disabled'?: boolean;
/**
* Set to `"clear"` for a transparent button or to `"solid"` for a filled background.
*/
'fill'?: 'clear' | 'solid';
/**
* Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.
*/
'href'?: string;
/**
* The mode determines which platform styles to use.
*/
'mode'?: Mode;
}
interface IonChipIcon {
/**
* The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
*/
'color'?: Color;
/**
* Set to `"clear"` for a transparent icon or to `"solid"` for a filled background.
*/
'fill': 'clear' | 'solid';
/**
* The mode determines which platform styles to use.
*/
'mode': Mode;
/**
* The icon to use. Possible values are the same as `"ion-icon"`.
*/
'name'?: string;
/**
* The icon src to use. Possible values are the same as `"ion-icon"`.
*/
'src'?: string;
}
interface IonChipIconAttributes extends StencilHTMLAttributes {
/**
* The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
*/
'color'?: Color;
/**
* Set to `"clear"` for a transparent icon or to `"solid"` for a filled background.
*/
'fill'?: 'clear' | 'solid';
/**
* The mode determines which platform styles to use.
*/
'mode'?: Mode;
/**
* The icon to use. Possible values are the same as `"ion-icon"`.
*/
'name'?: string;
/**
* The icon src to use. Possible values are the same as `"ion-icon"`.
*/
'src'?: string;
}
interface IonChip {
/**
* The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
@ -918,6 +828,10 @@ export namespace Components {
* The mode determines which platform styles to use.
*/
'mode': Mode;
/**
* Display an outline style button.
*/
'outline': boolean;
}
interface IonChipAttributes extends StencilHTMLAttributes {
/**
@ -928,6 +842,10 @@ export namespace Components {
* The mode determines which platform styles to use.
*/
'mode'?: Mode;
/**
* Display an outline style button.
*/
'outline'?: boolean;
}
interface IonCol {
@ -5197,8 +5115,6 @@ declare global {
'IonCardTitle': Components.IonCardTitle;
'IonCard': Components.IonCard;
'IonCheckbox': Components.IonCheckbox;
'IonChipButton': Components.IonChipButton;
'IonChipIcon': Components.IonChipIcon;
'IonChip': Components.IonChip;
'IonCol': Components.IonCol;
'IonContent': Components.IonContent;
@ -5299,8 +5215,6 @@ declare global {
'ion-card-title': Components.IonCardTitleAttributes;
'ion-card': Components.IonCardAttributes;
'ion-checkbox': Components.IonCheckboxAttributes;
'ion-chip-button': Components.IonChipButtonAttributes;
'ion-chip-icon': Components.IonChipIconAttributes;
'ion-chip': Components.IonChipAttributes;
'ion-col': Components.IonColAttributes;
'ion-content': Components.IonContentAttributes;
@ -5496,18 +5410,6 @@ declare global {
new (): HTMLIonCheckboxElement;
};
interface HTMLIonChipButtonElement extends Components.IonChipButton, HTMLStencilElement {}
var HTMLIonChipButtonElement: {
prototype: HTMLIonChipButtonElement;
new (): HTMLIonChipButtonElement;
};
interface HTMLIonChipIconElement extends Components.IonChipIcon, HTMLStencilElement {}
var HTMLIonChipIconElement: {
prototype: HTMLIonChipIconElement;
new (): HTMLIonChipIconElement;
};
interface HTMLIonChipElement extends Components.IonChip, HTMLStencilElement {}
var HTMLIonChipElement: {
prototype: HTMLIonChipElement;
@ -5996,8 +5898,6 @@ declare global {
'ion-card-title': HTMLIonCardTitleElement
'ion-card': HTMLIonCardElement
'ion-checkbox': HTMLIonCheckboxElement
'ion-chip-button': HTMLIonChipButtonElement
'ion-chip-icon': HTMLIonChipIconElement
'ion-chip': HTMLIonChipElement
'ion-col': HTMLIonColElement
'ion-content': HTMLIonContentElement
@ -6098,8 +5998,6 @@ declare global {
'ion-card-title': HTMLIonCardTitleElement;
'ion-card': HTMLIonCardElement;
'ion-checkbox': HTMLIonCheckboxElement;
'ion-chip-button': HTMLIonChipButtonElement;
'ion-chip-icon': HTMLIonChipIconElement;
'ion-chip': HTMLIonChipElement;
'ion-col': HTMLIonColElement;
'ion-content': HTMLIonContentElement;