Chip

Компактна позначка статусу з шістьма смисловими тонами.

Тони

чернеткана розглядіопублікованопотребує увагипомилкаінформація

API

Props

Назва	Тип	Типово	Опис
`tone`	neutralaccentsuccesswarningdangerinfo	`"neutral"`	Смисловий колір. Кожен тон бере трійку токенів: текст / фон / межа.
`size`	xssm	`"xs"`	Висота чипа. На мобільному кожен розмір вищий за десктопний.
`label`	`string`	—	Доступна назва. Потрібна, коли чип показує лише крапку чи іконку.
`title`	`string`	—	Значення нативного `title`. Потрібне, коли текст чипа обрізано.
`clickable`	`boolean`	—	Робить чип інтерактивним: рендериться як `button`, отримує роль і стає доступним із клавіатури.
`dot`	`boolean`	—	Кольорова крапка замість іконки — компактний індикатор статусу.

Події

Назва	Payload	Опис
`click`	`[event: MouseEvent]`	Клік. Спрацьовує лише коли задано `clickable`.

Слоти

Назва	Опис
`default`	Текст чипа.
`icon`	Іконка перед текстом. Ігнорується, якщо задано `dot`.

Коли використовувати

Для стану сутності в списку чи таблиці: статус публікації, роль, тег.

Коли НЕ використовувати

Не передавайте статус лише кольором. Тон — підсилення, а не носій сенсу: dot без тексту потребує label, інакше стан недоступний для скрінрідера й невидимий для дальтоніка.

Доступність

Семантичний тег обирається за інтерактивністю, а не за виглядом: clickable перетворює чип на <button>. <div @click> недоступний із клавіатури й не має ролі.