Chip

Chips могут отображаться в нескольких размерах и цветах, могут содержать текст и/или иконку.

Chip

Использование

Компонент Chip может содержать текст, который указывается в свойстве text, или любой контент напрямую через children.

Свойство text можно использовать вместе со свойствами contentLeft и contentRight. С их помощью можно размещать иконку слева или справа от текста.

Так же есть свойство свойство contentClearButton, которое позволяет прокинуть кастомную иконку. Отключить отображение иконки закрытия можно с помощью свойства hasClear.

Live Editor

Result

Примеры

Размер Chip

Размер Chip задается с помощью свойства size. Возможные значения свойства: "l", "m", "s" или "xs":

Live Editor

Result

Вид Chip

Вид Chip задается с помощью свойства view.

Live Editor

Result