@snack-uikit/drawer 0.13.9 → 0.13.10

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.
Files changed (3) hide show
  1. package/CHANGELOG.md +18 -1
  2. package/README.md +88 -0
  3. package/package.json +9 -9
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.13.10 (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.13.9 (2025-11-28)</small>
7
17
 
8
18
  ### Only dependencies have been changed
@@ -69,7 +79,14 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
69
79
 
70
80
  ## 0.13.3 (2025-08-27)
71
81
 
72
- **Note:** Version bump only for package @snack-uikit/drawer
82
+ ### Only dependencies have been changed
83
+ * [@snack-uikit/button@0.19.17](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/button/CHANGELOG.md)
84
+ * [@snack-uikit/icons@0.27.5](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/icons/CHANGELOG.md)
85
+ * [@snack-uikit/scroll@0.10.6](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/scroll/CHANGELOG.md)
86
+ * [@snack-uikit/tooltip@0.18.8](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/tooltip/CHANGELOG.md)
87
+ * [@snack-uikit/truncate-string@0.7.7](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/truncate-string/CHANGELOG.md)
88
+ * [@snack-uikit/typography@0.8.12](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/typography/CHANGELOG.md)
89
+ * [@snack-uikit/utils@4.0.1](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/utils/CHANGELOG.md)
73
90
 
74
91
 
75
92
 
package/README.md CHANGED
@@ -5,7 +5,95 @@
5
5
 
6
6
  [Changelog](./CHANGELOG.md)
7
7
 
8
+ ## Description
8
9
 
10
+ - **DrawerCustom**: базовый компонент-дровер, который отвечает за анимацию, позиционирование, режим отображения (`regular`/`soft`), размеры и контейнер рендера. Позволяет собирать собственную структуру боковой панели через композицию `DrawerCustom.Header`, `DrawerCustom.Body` и `DrawerCustom.Footer`, а также поддерживает вложенные дроверы и смещение при их открытии.
11
+ - **Drawer**: готовая высокоуровневая обёртка над `DrawerCustom`, которая инкапсулирует типовую верстку дровера (заголовок, подзаголовок, иллюстрация, контент и блок кнопок). Упрощает настройку за счёт пропсов `title`, `subtitle`, `image` и объектов конфигурации кнопок, а также умеет открывать вложенный дровер и управлять обрезкой длинных заголовков.
12
+
13
+ ## DrawerCustom
14
+
15
+ ### Description
16
+
17
+ - **Гибкая основа дровера**: предоставляет низкоуровневый контрол над режимом (`mode`), положением (`position`), размерами (`size` как пресеты или произвольные значения) и контейнером рендера (`container`), что позволяет адаптировать компонент под разные сценарии.
18
+ - **Композиция через слоты**: использует дочерние компоненты `DrawerCustom.Header`, `DrawerCustom.Body` и `DrawerCustom.Footer` для построения структуры, благодаря чему можно полностью контролировать содержимое и порядок блоков.
19
+ - **Вложенные дроверы**: поддерживает проп `nestedDrawer` и `push`, за счёт чего можно открывать вложенные панели с сдвигом родительского дровера.
20
+ - **Управление состоянием и закрытием**: работает в управляемом режиме через пропы `open` и `onClose`, при необходимости может закрываться по Esc, по клику на оверлей (в режиме `regular`) и при изменении истории браузера (`closeOnPopstate`).
21
+ - **Figma**: [`DrawerCustom`](https://www.figma.com/file/jtGxAPvFJOMir7V0eQFukN/Snack-UI-Kit-1.1.0?node-id=41%3A208969&mode=drawer)
22
+
23
+ ### Example
24
+
25
+ ```tsx
26
+ import { useState } from 'react';
27
+ import { ButtonFilled } from '@snack-uikit/button';
28
+ import { DrawerCustom } from '@snack-uikit/drawer';
29
+
30
+ function DrawerCustomExample() {
31
+ const [open, setOpen] = useState(false);
32
+
33
+ const toggle = () => setOpen(prev => !prev);
34
+
35
+ return (
36
+ <>
37
+ <ButtonFilled label='Toggle drawer' onClick={toggle} />
38
+
39
+ <DrawerCustom open={open} onClose={toggle} mode='regular' position='right' size='s'>
40
+ <DrawerCustom.Header
41
+ title='Title'
42
+ subtitle='Subtitle'
43
+ image={{ src: 'image.jpg', alt: 'Drawer image' }}
44
+ />
45
+
46
+ <DrawerCustom.Body content='Drawer content' />
47
+
48
+ <DrawerCustom.Footer
49
+ actions={<ButtonFilled label='Action' onClick={toggle} />}
50
+ />
51
+ </DrawerCustom>
52
+ </>
53
+ );
54
+ }
55
+ ```
56
+
57
+ ## Drawer
58
+
59
+ ### Description
60
+
61
+ - **Готовый кейс «из коробки»**: предоставляет упрощённый API поверх `DrawerCustom`, где основные части дровера настраиваются через пропсы `title`, `subtitle`, `content` и `image` без необходимости вручную собирать хедер, тело и футер.
62
+ - **Встроенный футер с кнопками**: принимает объекты `approveButton`, `cancelButton` и `additionalButton`, автоматически создавая кнопки нужных типов и размеров, а также позволяя добавить подсказки через `tooltip`.
63
+ - **Поддержка вложенных сценариев**: через проп `nestedDrawer` можно открыть дополнительный дровер внутри текущего, при этом родитель смещается на заданное расстояние и остаётся доступным.
64
+ - **Управление длиной текстов**: проп `truncate` позволяет ограничить количество строк для заголовка и подзаголовка, сохраняя компактный вид даже при длинных текстах.
65
+ - **Figma**: [`Drawer`](https://www.figma.com/file/jtGxAPvFJOMir7V0eQFukN/Snack-UI-Kit-1.1.0?node-id=41%3A208969&mode=drawer)
66
+
67
+ ### Example
68
+
69
+ ```tsx
70
+ import { useState } from 'react';
71
+ import { Drawer } from '@snack-uikit/drawer';
72
+
73
+ function DrawerExample() {
74
+ const [open, setOpen] = useState(false);
75
+
76
+ const handleClose = () => setOpen(false);
77
+
78
+ return (
79
+ <>
80
+ <button type='button' onClick={() => setOpen(true)}>
81
+ Open drawer
82
+ </button>
83
+
84
+ <Drawer
85
+ open={open}
86
+ onClose={handleClose}
87
+ title='Drawer title'
88
+ subtitle='Optional subtitle'
89
+ content='Drawer content'
90
+ approveButton={{ label: 'Primary action', onClick: handleClose }}
91
+ cancelButton={{ label: 'Secondary action', onClick: handleClose }}
92
+ />
93
+ </>
94
+ );
95
+ }
96
+ ```
9
97
 
10
98
  [//]: DOCUMENTATION_SECTION_START
11
99
  [//]: THIS_SECTION_IS_AUTOGENERATED_PLEASE_DONT_EDIT_IT
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "access": "public"
5
5
  },
6
6
  "title": "Drawer",
7
- "version": "0.13.9",
7
+ "version": "0.13.10",
8
8
  "sideEffects": [
9
9
  "*.css",
10
10
  "*.woff",
@@ -36,15 +36,15 @@
36
36
  "license": "Apache-2.0",
37
37
  "scripts": {},
38
38
  "dependencies": {
39
- "@snack-uikit/button": "0.19.16",
40
- "@snack-uikit/icons": "0.27.4",
41
- "@snack-uikit/scroll": "0.10.5",
42
- "@snack-uikit/tooltip": "0.18.7",
43
- "@snack-uikit/truncate-string": "0.7.6",
44
- "@snack-uikit/typography": "0.8.11",
45
- "@snack-uikit/utils": "4.0.0",
39
+ "@snack-uikit/button": "0.19.17",
40
+ "@snack-uikit/icons": "0.27.5",
41
+ "@snack-uikit/scroll": "0.10.6",
42
+ "@snack-uikit/tooltip": "0.18.8",
43
+ "@snack-uikit/truncate-string": "0.7.7",
44
+ "@snack-uikit/typography": "0.8.12",
45
+ "@snack-uikit/utils": "4.0.1",
46
46
  "classnames": "2.5.1",
47
47
  "rc-drawer": "6.4.1"
48
48
  },
49
- "gitHead": "6b39e180766635f8190da903bf560d1fbcbfaf52"
49
+ "gitHead": "84371bbf91915f650a852df849cd71d416c5b7b2"
50
50
  }