Skip to content

Commit 80bceb7

Browse files
authored
Merge pull request #250 from IgniteUI/ibarakov/angular-add-chip-variants
feat(angular): add chip variants
1 parent 8d99ea3 commit 80bceb7

2 files changed

Lines changed: 19 additions & 0 deletions

File tree

docs/angular/src/content/en/components/chip.mdx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,15 @@ The <ApiLink type="Chip" /> has an <ApiLink type="Chip" member="id" label="id" /
9898
</igx-chip>
9999
```
100100

101+
## Variants
102+
103+
The Angular chip supports several pre-defined stylistic variants. You can change the variant by assigning one of the supported values - `primary`, `info`, `success`, `warning`, or `danger` to the <ApiLink type="Chip" member="variant" label="variant" /> input property.
104+
105+
```html
106+
<igx-chip variant="success">Success</igx-chip>
107+
```
108+
109+
<Sample src="/data-display/chip-variants" height={100} alt="Angular Chip Variants Example" />
101110

102111
### Selection
103112

docs/angular/src/content/jp/components/chip.mdx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,16 @@ Ignite UI for Angular Chips モジュールまたはディレクティブをイ
9999
</igx-chip>
100100
```
101101

102+
## バリアント
103+
104+
Angular チップは、いくつかの定義済みスタイル バリアントをサポートしています。<ApiLink type="Chip" member="variant" label="variant" /> 入力プロパティにサポートされている値のいずれか (`primary``info``success``warning`、または `danger`) を割り当てることで、バリアントを変更できます。
105+
106+
```html
107+
<igx-chip variant="success">Success</igx-chip>
108+
```
109+
110+
<Sample src="/data-display/chip-variants" height={100} alt="Angular Chip バリアントの例" />
111+
102112
### 選択
103113

104114
<Image src={selectingDefault} alt="Selecting Default" class="responsive-img" />

0 commit comments

Comments
 (0)