fsk-design-system 1.0.12 → 1.0.13
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/README.md +95 -95
- package/dist/Cascader.form-YODTeJZI.js +1207 -0
- package/dist/{Dropdown-s3RzcOyh.js → Dropdown-k8teGh0V.js} +1 -1
- package/dist/assets/fsk-design-system.css +1 -1
- package/dist/components/Cascader/index.js +1 -1
- package/dist/components/Dropdown/index.js +1 -1
- package/dist/components/Menu/Menu.types.d.ts +2 -0
- package/dist/components/Menu/hooks/useBuildMenuItems.d.ts +11 -0
- package/dist/components/Menu/hooks/useIndeterminateKeys.d.ts +4 -0
- package/dist/components/Menu/utils/getAllKeys.d.ts +2 -0
- package/dist/components/Menu/utils/getNormalizedLabelText.d.ts +3 -0
- package/dist/components/index.js +2 -2
- package/dist/index.js +2 -2
- package/package.json +1 -1
- package/dist/Cascader.form-F-nJ2QNB.js +0 -1190
- package/dist/Dropdown-CfFJGf2f.js +0 -33
- package/dist/components/Cascader/Dropdown/Dropdown.d.ts +0 -2
- package/dist/components/Cascader/Dropdown/Dropdown.types.d.ts +0 -5
- package/dist/components/Cascader/Dropdown/index.d.ts +0 -1
- package/dist/components/Cascader/Dropdown/index.js +0 -4
package/README.md
CHANGED
|
@@ -1,96 +1,96 @@
|
|
|
1
|
-
# FSK Design System
|
|
2
|
-
|
|
3
|
-
Универсальная дизайн-система с поддержкой тем и кастомных UI-компонентов.
|
|
4
|
-
|
|
5
|
-
## 📦 Установка
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
npm install fsk-design-system
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
## ⚡ Быстрый старт
|
|
12
|
-
|
|
13
|
-
1. **Импортируйте стили дизайн-системы в корневом файле:**
|
|
14
|
-
|
|
15
|
-
```ts
|
|
16
|
-
import 'fsk-design-system/styles.css';
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
2. **Оберните приложение в `ThemeProvider`:**
|
|
20
|
-
|
|
21
|
-
```tsx
|
|
22
|
-
import { ThemeProvider } from 'fsk-design-system';
|
|
23
|
-
|
|
24
|
-
const App = () => (
|
|
25
|
-
<ThemeProvider>
|
|
26
|
-
{/* Ваш код */}
|
|
27
|
-
</ThemeProvider>
|
|
28
|
-
);
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
3. **Оберните приложение в `ConfigProvider` для русификации:**
|
|
32
|
-
|
|
33
|
-
```tsx
|
|
34
|
-
import ConfigProvider from "antd/es/config-provider"
|
|
35
|
-
import ruRU from "antd/locale/ru_RU"
|
|
36
|
-
|
|
37
|
-
const App = () => (
|
|
38
|
-
<ConfigProvider locale={ruRU}>
|
|
39
|
-
{/* Ваш код */}
|
|
40
|
-
</ConfigProvider>
|
|
41
|
-
);
|
|
42
|
-
```
|
|
43
|
-
|
|
44
|
-
## 🔹 Смена темы через хук `useTheme`
|
|
45
|
-
|
|
46
|
-
```tsx
|
|
47
|
-
import { useTheme } from 'fsk-design-system';
|
|
48
|
-
|
|
49
|
-
const ThemeSwitcher = () => {
|
|
50
|
-
const { changeTheme } = useTheme();
|
|
51
|
-
|
|
52
|
-
return (
|
|
53
|
-
<button onClick={() => changeTheme('dark')}>
|
|
54
|
-
Переключить на тёмную тему
|
|
55
|
-
</button>
|
|
56
|
-
);
|
|
57
|
-
};
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
## 🎨 Доступные темы
|
|
61
|
-
|
|
62
|
-
| Название темы | Описание |
|
|
63
|
-
|---------------|----------------|
|
|
64
|
-
| `light` | Светлая тема (по умолчанию) |
|
|
65
|
-
| `dark` | Тёмная тема |
|
|
66
|
-
|
|
67
|
-
## 🧩 Компоненты
|
|
68
|
-
|
|
69
|
-
> Полный список компонентов — см. в [документации](https://design-system.k8s-dev.fsk.ru/)
|
|
70
|
-
|
|
71
|
-
Пример:
|
|
72
|
-
|
|
73
|
-
```tsx
|
|
74
|
-
import { Button } from 'fsk-design-system';
|
|
75
|
-
|
|
76
|
-
<Button size="xl" type="main-secondary">Click me</Button>
|
|
77
|
-
```
|
|
78
|
-
|
|
79
|
-
## 📌 Требования
|
|
80
|
-
|
|
81
|
-
```json
|
|
82
|
-
"dependencies": {
|
|
83
|
-
"@emotion/css": "^11.13.5",
|
|
84
|
-
"@emotion/react": "^11.13.3",
|
|
85
|
-
"@emotion/styled": "^11.13.0",
|
|
86
|
-
"antd": "^5.23.4",
|
|
87
|
-
"react": "^18.3.1",
|
|
88
|
-
"react-dom": "^18.3.1"
|
|
89
|
-
}
|
|
90
|
-
```
|
|
91
|
-
|
|
92
|
-
```bash
|
|
93
|
-
npm install @emotion/css@^11.13.5 @emotion/react@^11.13.3 @emotion/styled@^11.13.0 antd@^5.23.4 react@^18.3.1 react-dom@^18.3.1
|
|
94
|
-
```
|
|
95
|
-
|
|
1
|
+
# FSK Design System
|
|
2
|
+
|
|
3
|
+
Универсальная дизайн-система с поддержкой тем и кастомных UI-компонентов.
|
|
4
|
+
|
|
5
|
+
## 📦 Установка
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install fsk-design-system
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## ⚡ Быстрый старт
|
|
12
|
+
|
|
13
|
+
1. **Импортируйте стили дизайн-системы в корневом файле:**
|
|
14
|
+
|
|
15
|
+
```ts
|
|
16
|
+
import 'fsk-design-system/styles.css';
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
2. **Оберните приложение в `ThemeProvider`:**
|
|
20
|
+
|
|
21
|
+
```tsx
|
|
22
|
+
import { ThemeProvider } from 'fsk-design-system';
|
|
23
|
+
|
|
24
|
+
const App = () => (
|
|
25
|
+
<ThemeProvider>
|
|
26
|
+
{/* Ваш код */}
|
|
27
|
+
</ThemeProvider>
|
|
28
|
+
);
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
3. **Оберните приложение в `ConfigProvider` для русификации:**
|
|
32
|
+
|
|
33
|
+
```tsx
|
|
34
|
+
import ConfigProvider from "antd/es/config-provider"
|
|
35
|
+
import ruRU from "antd/locale/ru_RU"
|
|
36
|
+
|
|
37
|
+
const App = () => (
|
|
38
|
+
<ConfigProvider locale={ruRU}>
|
|
39
|
+
{/* Ваш код */}
|
|
40
|
+
</ConfigProvider>
|
|
41
|
+
);
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## 🔹 Смена темы через хук `useTheme`
|
|
45
|
+
|
|
46
|
+
```tsx
|
|
47
|
+
import { useTheme } from 'fsk-design-system';
|
|
48
|
+
|
|
49
|
+
const ThemeSwitcher = () => {
|
|
50
|
+
const { changeTheme } = useTheme();
|
|
51
|
+
|
|
52
|
+
return (
|
|
53
|
+
<button onClick={() => changeTheme('dark')}>
|
|
54
|
+
Переключить на тёмную тему
|
|
55
|
+
</button>
|
|
56
|
+
);
|
|
57
|
+
};
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
## 🎨 Доступные темы
|
|
61
|
+
|
|
62
|
+
| Название темы | Описание |
|
|
63
|
+
|---------------|----------------|
|
|
64
|
+
| `light` | Светлая тема (по умолчанию) |
|
|
65
|
+
| `dark` | Тёмная тема |
|
|
66
|
+
|
|
67
|
+
## 🧩 Компоненты
|
|
68
|
+
|
|
69
|
+
> Полный список компонентов — см. в [документации](https://design-system.k8s-dev.fsk.ru/)
|
|
70
|
+
|
|
71
|
+
Пример:
|
|
72
|
+
|
|
73
|
+
```tsx
|
|
74
|
+
import { Button } from 'fsk-design-system';
|
|
75
|
+
|
|
76
|
+
<Button size="xl" type="main-secondary">Click me</Button>
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
## 📌 Требования
|
|
80
|
+
|
|
81
|
+
```json
|
|
82
|
+
"dependencies": {
|
|
83
|
+
"@emotion/css": "^11.13.5",
|
|
84
|
+
"@emotion/react": "^11.13.3",
|
|
85
|
+
"@emotion/styled": "^11.13.0",
|
|
86
|
+
"antd": "^5.23.4",
|
|
87
|
+
"react": "^18.3.1",
|
|
88
|
+
"react-dom": "^18.3.1"
|
|
89
|
+
}
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
```bash
|
|
93
|
+
npm install @emotion/css@^11.13.5 @emotion/react@^11.13.3 @emotion/styled@^11.13.0 antd@^5.23.4 react@^18.3.1 react-dom@^18.3.1
|
|
94
|
+
```
|
|
95
|
+
|
|
96
96
|
---
|