@snack-uikit/status
v0.5.2
Published
Индикация статуса (точка или точка с текстом)
Downloads
348
Readme
Status
Installation
npm i @snack-uikit/status
Example
import { Status, StatusIndicator } from '@snack-uikit/status';
<Status
label="Text after status"
appearance='pink'
size='xs'
hasBackground={true}
/>
<StatusIndicator
appearance='violet'
size='l'
/>
Status
Props
| name | type | default value | description |
|------|------|---------------|-------------|
| label* | string
| - | Текст |
| size | enum Size: "xs"
, "s"
| xs | Размер |
| appearance | enum Appearance: "primary"
, "neutral"
, "red"
, "orange"
, "yellow"
, "green"
, "blue"
, "violet"
, "pink"
| primary | Внешний вид |
| hasBackground | boolean
| - | Наличие фона |
| className | string
| - | CSS-класс |
StatusIndicator
Props
| name | type | default value | description |
|------|------|---------------|-------------|
| size | enum Size: "xs"
, "s"
, "xxs"
, "m"
, "l"
| m | Размер |
| appearance | enum Appearance: "primary"
, "neutral"
, "red"
, "orange"
, "yellow"
, "green"
, "blue"
, "violet"
, "pink"
| primary | Внешний вид |
| className | string
| - | CSS-класс |