@snack-uikit/status 0.10.7 → 0.10.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +10 -0
- package/README.md +73 -16
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,16 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## <small>0.10.8 (2026-01-19)</small>
|
|
7
|
+
|
|
8
|
+
* chore(FF-6693): migrate tests from TestCafe to Playwright ([f32aff8](https://github.com/cloud-ru-tech/snack-uikit/commit/f32aff8))
|
|
9
|
+
* chore(FF-6693): tune test configs ([d194f4d](https://github.com/cloud-ru-tech/snack-uikit/commit/d194f4d))
|
|
10
|
+
* docs(FF-7788): readme update ([e3142b8](https://github.com/cloud-ru-tech/snack-uikit/commit/e3142b8))
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
6
16
|
## <small>0.10.7 (2025-11-28)</small>
|
|
7
17
|
|
|
8
18
|
### Only dependencies have been changed
|
package/README.md
CHANGED
|
@@ -5,22 +5,79 @@
|
|
|
5
5
|
|
|
6
6
|
[Changelog](./CHANGELOG.md)
|
|
7
7
|
|
|
8
|
-
##
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
8
|
+
## Description
|
|
9
|
+
|
|
10
|
+
- Пакет `@snack-uikit/status` предоставляет два компонента-индикатора статуса: полноценный текстовый статус `Status` и компактный точечный индикатор `StatusIndicator`.
|
|
11
|
+
- Оба компонента используют единую палитру состояний (`appearance`) и поддерживают несколько размеров, что позволяет согласованно маркировать состояния сущностей в разных частях интерфейса.
|
|
12
|
+
- Компоненты подходят для встраивания в строки таблиц, списки, карточки и другие плотные интерфейсные области, где важно компактно подсветить состояние.
|
|
13
|
+
|
|
14
|
+
## Status
|
|
15
|
+
|
|
16
|
+
### Description
|
|
17
|
+
|
|
18
|
+
- `Status` — текстовый индикатор состояния с цветной меткой и подписью, подходящий для отображения статуса сущности (задачи, документа, пользователя и т.п.).
|
|
19
|
+
- Поддерживает размеры `xs` и `s`, а также разные варианты внешнего вида через `appearance` (primary, neutral, red, orange, yellow, green, blue, violet, pink), что позволяет единообразно кодировать типы состояний.
|
|
20
|
+
- Может отображаться как с фоном, так и без него (`hasBackground`), чтобы адаптироваться под разные контексты и плотность интерфейса.
|
|
21
|
+
- Имеет состояние загрузки (`loading`): вместо индикатора статуса показывается спиннер, а сам статус временно переводится в нейтральный вид.
|
|
22
|
+
- Длинный текст в `label` аккуратно усечён до одной строки, чтобы статус оставался компактным и не ломал сетку.
|
|
23
|
+
- Figma: [`Status`](https://www.figma.com/file/jtGxAPvFJOMir7V0eQFukN/Snack-UI-Kit-1.1.0?node-id=41%3A21940&mode=design).
|
|
24
|
+
|
|
25
|
+
### Example
|
|
26
|
+
|
|
27
|
+
```tsx
|
|
28
|
+
import { Status } from '@snack-uikit/status';
|
|
29
|
+
|
|
30
|
+
export function StatusExample() {
|
|
31
|
+
return (
|
|
32
|
+
<>
|
|
33
|
+
<Status
|
|
34
|
+
label='В работе'
|
|
35
|
+
appearance='primary'
|
|
36
|
+
size='s'
|
|
37
|
+
/>
|
|
38
|
+
|
|
39
|
+
<Status
|
|
40
|
+
label='Черновик'
|
|
41
|
+
appearance='neutral'
|
|
42
|
+
size='xs'
|
|
43
|
+
hasBackground
|
|
44
|
+
/>
|
|
45
|
+
|
|
46
|
+
<Status
|
|
47
|
+
label='Загружается'
|
|
48
|
+
appearance='blue'
|
|
49
|
+
size='s'
|
|
50
|
+
loading
|
|
51
|
+
/>
|
|
52
|
+
</>
|
|
53
|
+
);
|
|
54
|
+
}
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
## StatusIndicator
|
|
58
|
+
|
|
59
|
+
### Description
|
|
60
|
+
|
|
61
|
+
- `StatusIndicator` — компактный точечный индикатор состояния без текста, который может использоваться как самостоятельный маркер или в составе других компонентов.
|
|
62
|
+
- Поддерживает размеры `xxs`, `xs`, `s`, `m`, `l`, что позволяет подобрать масштаб под разные элементы интерфейса (текстовые строки, иконки, заголовки).
|
|
63
|
+
- Использует те же варианты `appearance`, что и `Status`, обеспечивая визуальное единство маркировки состояний по всему продукту.
|
|
64
|
+
- Подходит для случаев, когда подпись к статусу уже присутствует отдельно (например, в заголовке или колонке таблицы), и нужен только визуальный маркер.
|
|
65
|
+
- Figma: [`StatusIndicator`](https://www.figma.com/file/jtGxAPvFJOMir7V0eQFukN/Snack-UI-Kit-1.1.0?node-id=41%3A21940&mode=design).
|
|
66
|
+
|
|
67
|
+
### Example
|
|
68
|
+
|
|
69
|
+
```tsx
|
|
70
|
+
import { StatusIndicator } from '@snack-uikit/status';
|
|
71
|
+
|
|
72
|
+
export function StatusIndicatorExample() {
|
|
73
|
+
return (
|
|
74
|
+
<div style={{ display: 'flex', gap: 8, alignItems: 'center' }}>
|
|
75
|
+
<StatusIndicator size='xs' appearance='green' />
|
|
76
|
+
<StatusIndicator size='m' appearance='orange' />
|
|
77
|
+
<StatusIndicator size='l' appearance='red' />
|
|
78
|
+
</div>
|
|
79
|
+
);
|
|
80
|
+
}
|
|
24
81
|
```
|
|
25
82
|
|
|
26
83
|
[//]: DOCUMENTATION_SECTION_START
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
6
|
"title": "Status",
|
|
7
|
-
"version": "0.10.
|
|
7
|
+
"version": "0.10.8",
|
|
8
8
|
"sideEffects": [
|
|
9
9
|
"*.css",
|
|
10
10
|
"*.woff",
|
|
@@ -36,10 +36,10 @@
|
|
|
36
36
|
"license": "Apache-2.0",
|
|
37
37
|
"scripts": {},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@snack-uikit/loaders": "0.9.
|
|
40
|
-
"@snack-uikit/truncate-string": "0.7.
|
|
41
|
-
"@snack-uikit/utils": "4.0.
|
|
39
|
+
"@snack-uikit/loaders": "0.9.10",
|
|
40
|
+
"@snack-uikit/truncate-string": "0.7.7",
|
|
41
|
+
"@snack-uikit/utils": "4.0.1",
|
|
42
42
|
"classnames": "2.5.1"
|
|
43
43
|
},
|
|
44
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "84371bbf91915f650a852df849cd71d416c5b7b2"
|
|
45
45
|
}
|