mimir-ui-kit 1.14.3 → 1.14.5
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 +62 -62
- package/dist/assets/Button.css +1 -1
- package/dist/components/Button/Button.d.ts +52 -0
- package/dist/components/Button/Button.js +28 -23
- package/dist/components/Button/constants.d.ts +8 -1
- package/dist/components/Button/constants.js +9 -0
- package/dist/components/Button/index.d.ts +1 -1
- package/dist/components/Button/index.js +2 -1
- package/dist/components/Button/types.d.ts +7 -2
- package/dist/components/index.d.ts +1 -1
- package/dist/components/index.js +2 -1
- package/dist/index.js +2 -1
- package/package.json +128 -128
package/README.md
CHANGED
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
# Mimir-ui
|
|
2
|
-
|
|
3
|
-
## Установка и запуск проекта
|
|
4
|
-
|
|
5
|
-
1. Установите зависимости:
|
|
6
|
-
```bash
|
|
7
|
-
npm install
|
|
8
|
-
```
|
|
9
|
-
2. Запуск storybook
|
|
10
|
-
```bash
|
|
11
|
-
npm run storybook
|
|
12
|
-
```
|
|
13
|
-
|
|
14
|
-
## Сборка проекта
|
|
15
|
-
|
|
16
|
-
1. Скрипт для сборки
|
|
17
|
-
```bash
|
|
18
|
-
npm run build
|
|
19
|
-
```
|
|
20
|
-
|
|
21
|
-
## Создание нового компонента
|
|
22
|
-
|
|
23
|
-
```bash
|
|
24
|
-
npm run create-component <ComponentName>
|
|
25
|
-
```
|
|
26
|
-
|
|
27
|
-
## Поднятие версии для публикации на npm
|
|
28
|
-
|
|
29
|
-
Для поднятия версии пакета перед публикацией на npm используем следующие скрипты:
|
|
30
|
-
|
|
31
|
-
1. `patch`: Этот скрипт увеличивает версию пакета на один патч (например, с версии 1.0.0 до 1.0.1). Он автоматически обновляет версию в файле package.json и создает коммит с обновленной версией.
|
|
32
|
-
|
|
33
|
-
```bash
|
|
34
|
-
npm version patch
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
2. `minor`: Этот скрипт увеличивает версию пакета на один минорный уровень (например, с версии 1.0.0 до 1.1.0). Также обновляет версию в package.json и создает коммит.
|
|
38
|
-
```bash
|
|
39
|
-
npm version minor
|
|
40
|
-
```
|
|
41
|
-
3. `major`: Этот скрипт увеличивает версию пакета на один мажорный уровень (например, с версии 1.0.0 до 2.0.0). Он также обновляет версию в package.json и создает коммит.
|
|
42
|
-
```bash
|
|
43
|
-
npm version major
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
## Публикация на npm
|
|
47
|
-
|
|
48
|
-
1. Скрипт для публикации на npm:
|
|
49
|
-
```bash
|
|
50
|
-
npm publish
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
## Ручная Генерация иконок
|
|
54
|
-
|
|
55
|
-
1. Экспортируем с фигмы иконку.
|
|
56
|
-
2. Добавляем ее в папку svgs.
|
|
57
|
-
3. Запускаем скрипт:
|
|
58
|
-
```bash
|
|
59
|
-
npm run icons
|
|
60
|
-
```
|
|
61
|
-
4. Смотрим в папку `icons/components`
|
|
62
|
-
5. Готово.
|
|
1
|
+
# Mimir-ui
|
|
2
|
+
|
|
3
|
+
## Установка и запуск проекта
|
|
4
|
+
|
|
5
|
+
1. Установите зависимости:
|
|
6
|
+
```bash
|
|
7
|
+
npm install
|
|
8
|
+
```
|
|
9
|
+
2. Запуск storybook
|
|
10
|
+
```bash
|
|
11
|
+
npm run storybook
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Сборка проекта
|
|
15
|
+
|
|
16
|
+
1. Скрипт для сборки
|
|
17
|
+
```bash
|
|
18
|
+
npm run build
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Создание нового компонента
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
npm run create-component <ComponentName>
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
## Поднятие версии для публикации на npm
|
|
28
|
+
|
|
29
|
+
Для поднятия версии пакета перед публикацией на npm используем следующие скрипты:
|
|
30
|
+
|
|
31
|
+
1. `patch`: Этот скрипт увеличивает версию пакета на один патч (например, с версии 1.0.0 до 1.0.1). Он автоматически обновляет версию в файле package.json и создает коммит с обновленной версией.
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
npm version patch
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
2. `minor`: Этот скрипт увеличивает версию пакета на один минорный уровень (например, с версии 1.0.0 до 1.1.0). Также обновляет версию в package.json и создает коммит.
|
|
38
|
+
```bash
|
|
39
|
+
npm version minor
|
|
40
|
+
```
|
|
41
|
+
3. `major`: Этот скрипт увеличивает версию пакета на один мажорный уровень (например, с версии 1.0.0 до 2.0.0). Он также обновляет версию в package.json и создает коммит.
|
|
42
|
+
```bash
|
|
43
|
+
npm version major
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
## Публикация на npm
|
|
47
|
+
|
|
48
|
+
1. Скрипт для публикации на npm:
|
|
49
|
+
```bash
|
|
50
|
+
npm publish
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## Ручная Генерация иконок
|
|
54
|
+
|
|
55
|
+
1. Экспортируем с фигмы иконку.
|
|
56
|
+
2. Добавляем ее в папку svgs.
|
|
57
|
+
3. Запускаем скрипт:
|
|
58
|
+
```bash
|
|
59
|
+
npm run icons
|
|
60
|
+
```
|
|
61
|
+
4. Смотрим в папку `icons/components`
|
|
62
|
+
5. Готово.
|
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._button_dmyer_2{--button-loader-color: var(--button-color);--button-cursor: pointer;position:relative;display:inline-flex;flex-shrink:0;align-items:center;box-sizing:border-box;max-width:100%;height:var(--button-height);padding:0 var(--button-space);overflow:hidden;color:var(--button-color);font-weight:var(--font-weight-text-semibold);font-size:var(--button-font-size);font-family:var(--font-inter);line-height:var(--line-height-text-s1);white-space:nowrap;text-transform:uppercase;-webkit-text-decoration:none;text-decoration:none;text-overflow:ellipsis;-moz-column-gap:var(--button-gap);column-gap:var(--button-gap);background:var(--button-bg-color);border:none;border-color:var(--border-color);cursor:pointer;cursor:var(--button-cursor);transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}._button_dmyer_2:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover);border-color:var(--border-color-hover)}._button_dmyer_2:active{color:var(--button-color-active);background:var(--button-bg-color-active);border-color:var(--border-color-active)}._button_dmyer_2:focus{box-shadow:0 0 2px var(--sapphire-normal)}._button_dmyer_2._clear_dmyer_44:focus{box-shadow:none}._button_dmyer_2 svg{color:currentcolor;fill:currentcolor}._button_dmyer_2 svg path{color:currentcolor;fill:currentcolor}._xs_dmyer_56{--button-height: var(--button-height-xs);--button-font-size: var(--control-text-size-xs);--button-space: var(--control-space-xs);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._s_dmyer_64{--button-height: var(--button-height-s);--button-font-size: var(--control-text-size-s);--button-space: var(--control-space-s);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._m_dmyer_72{--button-height: var(--button-height-m);--button-font-size: var(--size-text-m);--button-space: var(--control-space-m);--button-gap: 8px;--button-border-radius: var(--button-border-radius-m)}._l_dmyer_80{--button-height: var(--button-height-l);--button-font-size: var(--size-text-m);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l)}._xl_dmyer_88{--button-height: var(--button-height-xl);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l);--button-font-size: var(--size-text-m);font-weight:var(--font-weight-text-medium)}._xxl_dmyer_97{--button-height: var(--button-height-xxl);--button-space: var(--control-space-xxl);--button-border-radius: var(--button-border-radius-l);--button-gap: 8px;font-weight:var(--font-weight-text-medium);--button-font-size: var(--size-text-m)}._m-s_dmyer_106{--button-height: var(--button-height-ms);font-weight:var(--font-weight-text-regular);border-radius:var(--control-radius-xs)!important;--button-gap: var(--space-2xs);--button-font-size: var(--size-text-s)}._default-button_dmyer_114{border-radius:var(--control-radius)}._default-button_dmyer_114._primary-sapphire_dmyer_117{--button-bg-color: var(--sapphire-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--sapphire-active);--button-bg-color-hover: var(--sapphire-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_dmyer_114._primary-citrine_dmyer_126{--button-bg-color: var(--citrine-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--citrine-active);--button-bg-color-hover: var(--citrine-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_dmyer_114._secondary-asphalt_dmyer_135{--button-bg-color: var(--asphalt-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--asphalt-active);--button-bg-color-hover: var(--asphalt-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_dmyer_114._secondary-gray_dmyer_144{--button-bg-color: var(--gray-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--gray-active);--button-bg-color-hover: var(--gray-hover);--button-color: var(--dark-text);--button-border: transparent}._default-button_dmyer_114._secondary-white_dmyer_153{--button-bg-color: var(--white-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--white-active);--button-bg-color-hover: var(--white);--button-color: var(--dark-text);--button-border: transparent}._default-button_dmyer_114._secondary-red_dmyer_162{--button-bg-color: var(--red-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--red-active);--button-bg-color-hover: var(--red-hover);--button-color: var(--light-text);--button-border: transparent}._round-button_dmyer_172{--button-border-radius-l: 24px;--button-border-radius-m: 20px;--button-border-radius-s: 16px;--button-border-radius-xs: 12px;border-radius:var(--button-border-radius)}._round-button_dmyer_172._black_dmyer_179{--button-bg-color: var(--asphalt-normal);--button-bg-color-hover: var(--asphalt-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--light-text);--button-color-hover: var(--light-text);--button-color-active: var(--light-text)}._round-button_dmyer_172._gray_dmyer_188{--button-bg-color: var(--gray-normal);--button-bg-color-hover: var(--gray-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._round-button_dmyer_172._white_dmyer_197{--button-bg-color: var(--white-normal);--button-bg-color-hover: var(--white-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._outline-button_dmyer_207{--button-bg-color: transparent;--button-bg-color-hover: transparent;--button-bg-color-active: transparent;--button-bg-color-focus: transparent;border:1px solid var(--border-color);border-radius:var(--control-radius)}._outline-button_dmyer_207._outline-asphalt_dmyer_215{--border-color: var(--disabled-color);--button-color: var(--black-80);--border-color-hover: var(--black-80);--button-color-hover: var(--black-80);--border-color-active: var(--black-100);--button-color-active: var(--black-100)}._outline-button_dmyer_207._outline-gray_dmyer_223{--border-color: var(--black-5);--button-color: var(--black-5);--border-color-hover: var(--black-5);--button-color-hover: var(--counter-text);--border-color-active: var(--black-80);--button-color-active: var(--white);--button-bg-color-active: var(--black-80)}._outline-button_dmyer_207._outline-white_dmyer_232{--border-color: var(--white);--button-color: var(--white);--border-color-hover: var(--white);--button-color-hover: var(--counter-text);--border-color-active: var(--black-80);--button-color-active: var(--white);--button-bg-color-active: var(--black-80)}._outline-button_dmyer_207._outline-red_dmyer_241{--border-color: var(--error-normal);--button-color: var(--error-normal);--border-color-hover: var(--red-hover);--button-color-hover: var(--red-hover);--border-color-active: var(--red-active);--button-color-active: var(--white);--button-bg-color-active: var(--red-active)}._full_dmyer_251{display:flex;justify-content:center;width:100%}._disabled_dmyer_257{--button-cursor: not-allowed;color:var(--light-text);background-color:var(--disabled)}._disabled_dmyer_257:hover,._disabled_dmyer_257:active,._disabled_dmyer_257:focus{color:var(--light-text);background-color:var(--disabled);box-shadow:none}._disabled_dmyer_257._outline-button_dmyer_207{color:var(--disabled);background-color:transparent;border:1px solid var(--disabled)}._icon-button_dmyer_273{justify-content:center;min-width:var(--button-height);padding:0}
|
|
@@ -131,4 +131,56 @@ export declare const Button: import('react').ForwardRefExoticComponent<(Omit<imp
|
|
|
131
131
|
* Идентификатор формы, к которой привязана кнопка.
|
|
132
132
|
*/
|
|
133
133
|
formId?: string;
|
|
134
|
+
}, "ref"> | Omit<import('./types').TButtonOutlineFormProps & {
|
|
135
|
+
isIconButton: true;
|
|
136
|
+
iconName: TIcon;
|
|
137
|
+
leftIcon?: never;
|
|
138
|
+
rightIcon?: never;
|
|
139
|
+
} & import('react').ClassAttributes<HTMLButtonElement> & import('react').ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
140
|
+
/**
|
|
141
|
+
* Класс, применяемый к корневому элементу кнопки.
|
|
142
|
+
*/
|
|
143
|
+
className?: string;
|
|
144
|
+
/**
|
|
145
|
+
* Флаг, указывающий, отключена ли кнопка.
|
|
146
|
+
*/
|
|
147
|
+
disabled?: boolean;
|
|
148
|
+
/**
|
|
149
|
+
* Флаг, указывающий, что кнопка занимает все доступное пространство.
|
|
150
|
+
*/
|
|
151
|
+
full?: boolean;
|
|
152
|
+
/**
|
|
153
|
+
* Флаг, отключащий абсолютно все модификации кнопки (variant, size).
|
|
154
|
+
*/
|
|
155
|
+
clear?: boolean;
|
|
156
|
+
/**
|
|
157
|
+
* Идентификатор формы, к которой привязана кнопка.
|
|
158
|
+
*/
|
|
159
|
+
formId?: string;
|
|
160
|
+
}, "ref"> | Omit<import('./types').TButtonOutlineFormProps & {
|
|
161
|
+
isIconButton?: false;
|
|
162
|
+
iconName?: never;
|
|
163
|
+
leftIcon?: import('react').ReactNode;
|
|
164
|
+
rightIcon?: import('react').ReactNode;
|
|
165
|
+
} & import('react').ClassAttributes<HTMLButtonElement> & import('react').ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
166
|
+
/**
|
|
167
|
+
* Класс, применяемый к корневому элементу кнопки.
|
|
168
|
+
*/
|
|
169
|
+
className?: string;
|
|
170
|
+
/**
|
|
171
|
+
* Флаг, указывающий, отключена ли кнопка.
|
|
172
|
+
*/
|
|
173
|
+
disabled?: boolean;
|
|
174
|
+
/**
|
|
175
|
+
* Флаг, указывающий, что кнопка занимает все доступное пространство.
|
|
176
|
+
*/
|
|
177
|
+
full?: boolean;
|
|
178
|
+
/**
|
|
179
|
+
* Флаг, отключащий абсолютно все модификации кнопки (variant, size).
|
|
180
|
+
*/
|
|
181
|
+
clear?: boolean;
|
|
182
|
+
/**
|
|
183
|
+
* Идентификатор формы, к которой привязана кнопка.
|
|
184
|
+
*/
|
|
185
|
+
formId?: string;
|
|
134
186
|
}, "ref">) & import('react').RefAttributes<HTMLButtonElement>>;
|
|
@@ -3,19 +3,19 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
|
3
3
|
import { forwardRef } from "react";
|
|
4
4
|
import { EButtonVariantDefault, EButtonForm } from "./constants.js";
|
|
5
5
|
import { Icon } from "../../icons/Icon.js";
|
|
6
|
-
import '../../assets/Button.css';const button = "
|
|
7
|
-
const clear = "
|
|
8
|
-
const xs = "
|
|
9
|
-
const s = "
|
|
10
|
-
const m = "
|
|
11
|
-
const l = "
|
|
12
|
-
const xl = "
|
|
13
|
-
const xxl = "
|
|
14
|
-
const black = "
|
|
15
|
-
const gray = "
|
|
16
|
-
const white = "
|
|
17
|
-
const full = "
|
|
18
|
-
const disabled = "
|
|
6
|
+
import '../../assets/Button.css';const button = "_button_dmyer_2";
|
|
7
|
+
const clear = "_clear_dmyer_44";
|
|
8
|
+
const xs = "_xs_dmyer_56";
|
|
9
|
+
const s = "_s_dmyer_64";
|
|
10
|
+
const m = "_m_dmyer_72";
|
|
11
|
+
const l = "_l_dmyer_80";
|
|
12
|
+
const xl = "_xl_dmyer_88";
|
|
13
|
+
const xxl = "_xxl_dmyer_97";
|
|
14
|
+
const black = "_black_dmyer_179";
|
|
15
|
+
const gray = "_gray_dmyer_188";
|
|
16
|
+
const white = "_white_dmyer_197";
|
|
17
|
+
const full = "_full_dmyer_251";
|
|
18
|
+
const disabled = "_disabled_dmyer_257";
|
|
19
19
|
const cls = {
|
|
20
20
|
button,
|
|
21
21
|
clear,
|
|
@@ -25,21 +25,26 @@ const cls = {
|
|
|
25
25
|
l,
|
|
26
26
|
xl,
|
|
27
27
|
xxl,
|
|
28
|
-
"m-s": "_m-
|
|
29
|
-
"default-button": "_default-
|
|
30
|
-
"primary-sapphire": "_primary-
|
|
31
|
-
"primary-citrine": "_primary-
|
|
32
|
-
"secondary-asphalt": "_secondary-
|
|
33
|
-
"secondary-gray": "_secondary-
|
|
34
|
-
"secondary-white": "_secondary-
|
|
35
|
-
"secondary-red": "_secondary-
|
|
36
|
-
"round-button": "_round-
|
|
28
|
+
"m-s": "_m-s_dmyer_106",
|
|
29
|
+
"default-button": "_default-button_dmyer_114",
|
|
30
|
+
"primary-sapphire": "_primary-sapphire_dmyer_117",
|
|
31
|
+
"primary-citrine": "_primary-citrine_dmyer_126",
|
|
32
|
+
"secondary-asphalt": "_secondary-asphalt_dmyer_135",
|
|
33
|
+
"secondary-gray": "_secondary-gray_dmyer_144",
|
|
34
|
+
"secondary-white": "_secondary-white_dmyer_153",
|
|
35
|
+
"secondary-red": "_secondary-red_dmyer_162",
|
|
36
|
+
"round-button": "_round-button_dmyer_172",
|
|
37
37
|
black,
|
|
38
38
|
gray,
|
|
39
39
|
white,
|
|
40
|
+
"outline-button": "_outline-button_dmyer_207",
|
|
41
|
+
"outline-asphalt": "_outline-asphalt_dmyer_215",
|
|
42
|
+
"outline-gray": "_outline-gray_dmyer_223",
|
|
43
|
+
"outline-white": "_outline-white_dmyer_232",
|
|
44
|
+
"outline-red": "_outline-red_dmyer_241",
|
|
40
45
|
full,
|
|
41
46
|
disabled,
|
|
42
|
-
"icon-button": "_icon-
|
|
47
|
+
"icon-button": "_icon-button_dmyer_273"
|
|
43
48
|
};
|
|
44
49
|
const Button = forwardRef(
|
|
45
50
|
(props, ref) => {
|
|
@@ -11,6 +11,12 @@ export declare enum EButtonVariantRound {
|
|
|
11
11
|
Gray = "gray",
|
|
12
12
|
White = "white"
|
|
13
13
|
}
|
|
14
|
+
export declare enum EButtonVariantOutline {
|
|
15
|
+
Asphalt = "outline-asphalt",
|
|
16
|
+
Gray = "outline-gray",
|
|
17
|
+
White = "outline-white",
|
|
18
|
+
Red = "outline-red"
|
|
19
|
+
}
|
|
14
20
|
export declare enum EButtonSize {
|
|
15
21
|
XS = "xs",
|
|
16
22
|
S = "s",
|
|
@@ -22,5 +28,6 @@ export declare enum EButtonSize {
|
|
|
22
28
|
}
|
|
23
29
|
export declare enum EButtonForm {
|
|
24
30
|
DefaultButton = "default-button",
|
|
25
|
-
RoundButton = "round-button"
|
|
31
|
+
RoundButton = "round-button",
|
|
32
|
+
OutlineButton = "outline-button"
|
|
26
33
|
}
|
|
@@ -13,6 +13,13 @@ var EButtonVariantRound = /* @__PURE__ */ ((EButtonVariantRound2) => {
|
|
|
13
13
|
EButtonVariantRound2["White"] = "white";
|
|
14
14
|
return EButtonVariantRound2;
|
|
15
15
|
})(EButtonVariantRound || {});
|
|
16
|
+
var EButtonVariantOutline = /* @__PURE__ */ ((EButtonVariantOutline2) => {
|
|
17
|
+
EButtonVariantOutline2["Asphalt"] = "outline-asphalt";
|
|
18
|
+
EButtonVariantOutline2["Gray"] = "outline-gray";
|
|
19
|
+
EButtonVariantOutline2["White"] = "outline-white";
|
|
20
|
+
EButtonVariantOutline2["Red"] = "outline-red";
|
|
21
|
+
return EButtonVariantOutline2;
|
|
22
|
+
})(EButtonVariantOutline || {});
|
|
16
23
|
var EButtonSize = /* @__PURE__ */ ((EButtonSize2) => {
|
|
17
24
|
EButtonSize2["XS"] = "xs";
|
|
18
25
|
EButtonSize2["S"] = "s";
|
|
@@ -26,11 +33,13 @@ var EButtonSize = /* @__PURE__ */ ((EButtonSize2) => {
|
|
|
26
33
|
var EButtonForm = /* @__PURE__ */ ((EButtonForm2) => {
|
|
27
34
|
EButtonForm2["DefaultButton"] = "default-button";
|
|
28
35
|
EButtonForm2["RoundButton"] = "round-button";
|
|
36
|
+
EButtonForm2["OutlineButton"] = "outline-button";
|
|
29
37
|
return EButtonForm2;
|
|
30
38
|
})(EButtonForm || {});
|
|
31
39
|
export {
|
|
32
40
|
EButtonForm,
|
|
33
41
|
EButtonSize,
|
|
34
42
|
EButtonVariantDefault,
|
|
43
|
+
EButtonVariantOutline,
|
|
35
44
|
EButtonVariantRound
|
|
36
45
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { Button, type TProps as TButtonProps } from './Button';
|
|
2
|
-
export { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound } from './constants';
|
|
2
|
+
export { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound, EButtonVariantOutline } from './constants';
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { Button } from "./Button.js";
|
|
2
|
-
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound } from "./constants.js";
|
|
2
|
+
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./constants.js";
|
|
3
3
|
export {
|
|
4
4
|
Button,
|
|
5
5
|
EButtonForm,
|
|
6
6
|
EButtonSize,
|
|
7
7
|
EButtonVariantDefault,
|
|
8
|
+
EButtonVariantOutline,
|
|
8
9
|
EButtonVariantRound
|
|
9
10
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
-
import { EButtonSize, EButtonVariantDefault, EButtonVariantRound, EButtonForm } from './constants';
|
|
2
|
+
import { EButtonSize, EButtonVariantDefault, EButtonVariantRound, EButtonForm, EButtonVariantOutline } from './constants';
|
|
3
3
|
import { TIcon } from '../../icons';
|
|
4
4
|
|
|
5
5
|
type TButtonRoundFormSize = Exclude<EButtonSize, 'xxl'> & Exclude<EButtonSize, 'xl'>;
|
|
@@ -13,6 +13,11 @@ export type TButtonRoundFormProps = {
|
|
|
13
13
|
variant?: EButtonVariantRound | `${EButtonVariantRound}`;
|
|
14
14
|
size?: TButtonRoundFormSize | `${TButtonRoundFormSize}`;
|
|
15
15
|
};
|
|
16
|
+
export type TButtonOutlineFormProps = {
|
|
17
|
+
form?: EButtonForm.OutlineButton;
|
|
18
|
+
variant?: EButtonVariantOutline | `${EButtonVariantOutline}`;
|
|
19
|
+
size?: EButtonSize | `${EButtonSize}`;
|
|
20
|
+
};
|
|
16
21
|
export type TButtonIsIconProps = {
|
|
17
22
|
isIconButton: true;
|
|
18
23
|
iconName: TIcon;
|
|
@@ -24,5 +29,5 @@ export type TButtonIsIconProps = {
|
|
|
24
29
|
leftIcon?: ReactNode;
|
|
25
30
|
rightIcon?: ReactNode;
|
|
26
31
|
};
|
|
27
|
-
export type TCommonButtonProps = (TButtonDefaultFormProps | TButtonRoundFormProps) & TButtonIsIconProps;
|
|
32
|
+
export type TCommonButtonProps = (TButtonDefaultFormProps | TButtonRoundFormProps | TButtonOutlineFormProps) & TButtonIsIconProps;
|
|
28
33
|
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { Button, EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound, type TButtonProps } from './Button';
|
|
1
|
+
export { Button, EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound, EButtonVariantOutline, type TButtonProps } from './Button';
|
|
2
2
|
export { Input, EInputSize, EInputVariant } from './Input';
|
|
3
3
|
export type { TInputProps, TSize, TVariant } from './Input';
|
|
4
4
|
export { InputPassword } from './InputPassword';
|
package/dist/components/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Button } from "./Button/Button.js";
|
|
2
|
-
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound } from "./Button/constants.js";
|
|
2
|
+
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./Button/constants.js";
|
|
3
3
|
import { Input } from "./Input/Input.js";
|
|
4
4
|
import { EInputSize, EInputVariant } from "./Input/constants.js";
|
|
5
5
|
import { InputPassword } from "./InputPassword/InputPassword.js";
|
|
@@ -41,6 +41,7 @@ export {
|
|
|
41
41
|
EButtonForm,
|
|
42
42
|
EButtonSize,
|
|
43
43
|
EButtonVariantDefault,
|
|
44
|
+
EButtonVariantOutline,
|
|
44
45
|
EButtonVariantRound,
|
|
45
46
|
EDrawerPosition,
|
|
46
47
|
EInputSize,
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Button } from "./components/Button/Button.js";
|
|
2
|
-
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantRound } from "./components/Button/constants.js";
|
|
2
|
+
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./components/Button/constants.js";
|
|
3
3
|
import { Input } from "./components/Input/Input.js";
|
|
4
4
|
import { EInputSize, EInputVariant } from "./components/Input/constants.js";
|
|
5
5
|
import { InputPassword } from "./components/InputPassword/InputPassword.js";
|
|
@@ -48,6 +48,7 @@ import './assets/index.css';export {
|
|
|
48
48
|
EButtonForm,
|
|
49
49
|
EButtonSize,
|
|
50
50
|
EButtonVariantDefault,
|
|
51
|
+
EButtonVariantOutline,
|
|
51
52
|
EButtonVariantRound,
|
|
52
53
|
EDrawerPosition,
|
|
53
54
|
EInputSize,
|
package/package.json
CHANGED
|
@@ -1,128 +1,128 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "mimir-ui-kit",
|
|
3
|
-
"private": false,
|
|
4
|
-
"version": "1.14.
|
|
5
|
-
"type": "module",
|
|
6
|
-
"exports": {
|
|
7
|
-
".": {
|
|
8
|
-
"types": "./dist/index.d.ts",
|
|
9
|
-
"default": "./dist/index.js"
|
|
10
|
-
},
|
|
11
|
-
"./components": {
|
|
12
|
-
"types": "./dist/components/index.d.ts",
|
|
13
|
-
"default": "./dist/components/index.js"
|
|
14
|
-
},
|
|
15
|
-
"./hooks": {
|
|
16
|
-
"types": "./dist/hooks/index.d.ts",
|
|
17
|
-
"default": "./dist/hooks/index.js"
|
|
18
|
-
},
|
|
19
|
-
"./icons": {
|
|
20
|
-
"types": "./dist/icons/index.d.ts",
|
|
21
|
-
"default": "./dist/icons/index.js"
|
|
22
|
-
},
|
|
23
|
-
"./styles": {
|
|
24
|
-
"default": "./dist/assets/index.css"
|
|
25
|
-
}
|
|
26
|
-
},
|
|
27
|
-
"module": "./dist/index.js",
|
|
28
|
-
"types": "./dist/index.d.ts",
|
|
29
|
-
"files": [
|
|
30
|
-
"dist"
|
|
31
|
-
],
|
|
32
|
-
"sideEffects": [
|
|
33
|
-
"**/*.{css,scss}"
|
|
34
|
-
],
|
|
35
|
-
"scripts": {
|
|
36
|
-
"build": "tsc --p ./tsconfig-build.json && vite build",
|
|
37
|
-
"storybook": "storybook dev -p 6006",
|
|
38
|
-
"build-storybook": "storybook build",
|
|
39
|
-
"ts:check": "tsc -b",
|
|
40
|
-
"lint:fix": "eslint . --ext ts,tsx --fix",
|
|
41
|
-
"lint:prettier": "npx prettier . --write",
|
|
42
|
-
"lint:stylelint": "stylelint '**/*.module{.css,.scss}'",
|
|
43
|
-
"lint:stylelint:fix": "stylelint '**/*.module{.css,.scss}' --fix",
|
|
44
|
-
"icons": "svgr --expand-props start ./src/icons/svgs",
|
|
45
|
-
"prepare": "husky",
|
|
46
|
-
"create-component": "node createComponent.js"
|
|
47
|
-
},
|
|
48
|
-
"devDependencies": {
|
|
49
|
-
"@chromatic-com/storybook": "^1.6.1",
|
|
50
|
-
"@headlessui/react": "^2.1.2",
|
|
51
|
-
"@laynezh/vite-plugin-lib-assets": "^0.5.23",
|
|
52
|
-
"@loadable/component": "^5.15.2",
|
|
53
|
-
"@storybook/addon-essentials": "^8.2.2",
|
|
54
|
-
"@storybook/addon-interactions": "^8.2.2",
|
|
55
|
-
"@storybook/addon-links": "^8.2.2",
|
|
56
|
-
"@storybook/addon-onboarding": "^8.2.2",
|
|
57
|
-
"@storybook/blocks": "^8.2.2",
|
|
58
|
-
"@storybook/builder-vite": "^8.2.2",
|
|
59
|
-
"@storybook/react": "^8.2.2",
|
|
60
|
-
"@storybook/react-vite": "^8.2.2",
|
|
61
|
-
"@storybook/test": "^8.2.2",
|
|
62
|
-
"@svgr/cli": "^8.1.0",
|
|
63
|
-
"@svgr/core": "^8.1.0",
|
|
64
|
-
"@svgr/plugin-svgo": "^8.1.0",
|
|
65
|
-
"@types/node": "^20.14.10",
|
|
66
|
-
"@types/react": "^18.3.3",
|
|
67
|
-
"@types/react-dom": "^18.3.0",
|
|
68
|
-
"@typescript-eslint/eslint-plugin": "^7.13.1",
|
|
69
|
-
"@typescript-eslint/parser": "^7.13.1",
|
|
70
|
-
"@vitejs/plugin-react": "^4.3.1",
|
|
71
|
-
"autoprefixer": "^10.4.19",
|
|
72
|
-
"chalk": "4.1.2",
|
|
73
|
-
"classnames": "^2.5.1",
|
|
74
|
-
"dotenv": "^16.4.5",
|
|
75
|
-
"eslint": "^8.57.0",
|
|
76
|
-
"eslint-config-prettier": "^9.1.0",
|
|
77
|
-
"eslint-plugin-import": "^2.29.1",
|
|
78
|
-
"eslint-plugin-react-hooks": "^4.6.2",
|
|
79
|
-
"eslint-plugin-react-refresh": "^0.4.7",
|
|
80
|
-
"eslint-plugin-storybook": "^0.8.0",
|
|
81
|
-
"glob": "10.3.10",
|
|
82
|
-
"husky": "^9.0.11",
|
|
83
|
-
"lint-staged": "^15.2.7",
|
|
84
|
-
"p-limit": "^6.1.0",
|
|
85
|
-
"postcss-preset-env": "^9.6.0",
|
|
86
|
-
"prettier": "^3.3.3",
|
|
87
|
-
"react": "^18.3.1",
|
|
88
|
-
"react-dom": "^18.3.1",
|
|
89
|
-
"sass": "^1.77.7",
|
|
90
|
-
"storybook": "^8.2.2",
|
|
91
|
-
"stylelint": "^16.7.0",
|
|
92
|
-
"stylelint-config-idiomatic-order": "^10.0.0",
|
|
93
|
-
"stylelint-config-rational-order": "^0.1.2",
|
|
94
|
-
"stylelint-config-standard": "^36.0.1",
|
|
95
|
-
"stylelint-order": "^6.0.4",
|
|
96
|
-
"stylelint-prettier": "^5.0.0",
|
|
97
|
-
"stylelint-scss": "^6.4.0",
|
|
98
|
-
"superagent": "^9.0.2",
|
|
99
|
-
"typescript": "^5.2.2",
|
|
100
|
-
"vite": "^5.3.1",
|
|
101
|
-
"vite-plugin-dts": "^3.9.1",
|
|
102
|
-
"vite-plugin-lib-inject-css": "^2.1.1",
|
|
103
|
-
"vite-plugin-svgr": "^4.2.0"
|
|
104
|
-
},
|
|
105
|
-
"peerDependencies": {
|
|
106
|
-
"@headlessui/react": "^2.1.2",
|
|
107
|
-
"react": "^18.3.1",
|
|
108
|
-
"react-dom": "^18.3.1"
|
|
109
|
-
},
|
|
110
|
-
"husky": {
|
|
111
|
-
"hooks": {
|
|
112
|
-
"pre-commit": "lint-staged"
|
|
113
|
-
}
|
|
114
|
-
},
|
|
115
|
-
"lint-staged": {
|
|
116
|
-
"**/*.{ts,tsx}": [
|
|
117
|
-
"eslint --ignore-path .eslintignore",
|
|
118
|
-
"prettier --write"
|
|
119
|
-
],
|
|
120
|
-
"**/*.{css,scss}": [
|
|
121
|
-
"stylelint --fix"
|
|
122
|
-
]
|
|
123
|
-
},
|
|
124
|
-
"dependencies": {
|
|
125
|
-
"swiper": "^11.1.5",
|
|
126
|
-
"use-clipboard-copy": "^0.2.0"
|
|
127
|
-
}
|
|
128
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "mimir-ui-kit",
|
|
3
|
+
"private": false,
|
|
4
|
+
"version": "1.14.5",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"exports": {
|
|
7
|
+
".": {
|
|
8
|
+
"types": "./dist/index.d.ts",
|
|
9
|
+
"default": "./dist/index.js"
|
|
10
|
+
},
|
|
11
|
+
"./components": {
|
|
12
|
+
"types": "./dist/components/index.d.ts",
|
|
13
|
+
"default": "./dist/components/index.js"
|
|
14
|
+
},
|
|
15
|
+
"./hooks": {
|
|
16
|
+
"types": "./dist/hooks/index.d.ts",
|
|
17
|
+
"default": "./dist/hooks/index.js"
|
|
18
|
+
},
|
|
19
|
+
"./icons": {
|
|
20
|
+
"types": "./dist/icons/index.d.ts",
|
|
21
|
+
"default": "./dist/icons/index.js"
|
|
22
|
+
},
|
|
23
|
+
"./styles": {
|
|
24
|
+
"default": "./dist/assets/index.css"
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
"module": "./dist/index.js",
|
|
28
|
+
"types": "./dist/index.d.ts",
|
|
29
|
+
"files": [
|
|
30
|
+
"dist"
|
|
31
|
+
],
|
|
32
|
+
"sideEffects": [
|
|
33
|
+
"**/*.{css,scss}"
|
|
34
|
+
],
|
|
35
|
+
"scripts": {
|
|
36
|
+
"build": "tsc --p ./tsconfig-build.json && vite build",
|
|
37
|
+
"storybook": "storybook dev -p 6006",
|
|
38
|
+
"build-storybook": "storybook build",
|
|
39
|
+
"ts:check": "tsc -b",
|
|
40
|
+
"lint:fix": "eslint . --ext ts,tsx --fix",
|
|
41
|
+
"lint:prettier": "npx prettier . --write",
|
|
42
|
+
"lint:stylelint": "stylelint '**/*.module{.css,.scss}'",
|
|
43
|
+
"lint:stylelint:fix": "stylelint '**/*.module{.css,.scss}' --fix",
|
|
44
|
+
"icons": "svgr --expand-props start ./src/icons/svgs",
|
|
45
|
+
"prepare": "husky",
|
|
46
|
+
"create-component": "node createComponent.js"
|
|
47
|
+
},
|
|
48
|
+
"devDependencies": {
|
|
49
|
+
"@chromatic-com/storybook": "^1.6.1",
|
|
50
|
+
"@headlessui/react": "^2.1.2",
|
|
51
|
+
"@laynezh/vite-plugin-lib-assets": "^0.5.23",
|
|
52
|
+
"@loadable/component": "^5.15.2",
|
|
53
|
+
"@storybook/addon-essentials": "^8.2.2",
|
|
54
|
+
"@storybook/addon-interactions": "^8.2.2",
|
|
55
|
+
"@storybook/addon-links": "^8.2.2",
|
|
56
|
+
"@storybook/addon-onboarding": "^8.2.2",
|
|
57
|
+
"@storybook/blocks": "^8.2.2",
|
|
58
|
+
"@storybook/builder-vite": "^8.2.2",
|
|
59
|
+
"@storybook/react": "^8.2.2",
|
|
60
|
+
"@storybook/react-vite": "^8.2.2",
|
|
61
|
+
"@storybook/test": "^8.2.2",
|
|
62
|
+
"@svgr/cli": "^8.1.0",
|
|
63
|
+
"@svgr/core": "^8.1.0",
|
|
64
|
+
"@svgr/plugin-svgo": "^8.1.0",
|
|
65
|
+
"@types/node": "^20.14.10",
|
|
66
|
+
"@types/react": "^18.3.3",
|
|
67
|
+
"@types/react-dom": "^18.3.0",
|
|
68
|
+
"@typescript-eslint/eslint-plugin": "^7.13.1",
|
|
69
|
+
"@typescript-eslint/parser": "^7.13.1",
|
|
70
|
+
"@vitejs/plugin-react": "^4.3.1",
|
|
71
|
+
"autoprefixer": "^10.4.19",
|
|
72
|
+
"chalk": "4.1.2",
|
|
73
|
+
"classnames": "^2.5.1",
|
|
74
|
+
"dotenv": "^16.4.5",
|
|
75
|
+
"eslint": "^8.57.0",
|
|
76
|
+
"eslint-config-prettier": "^9.1.0",
|
|
77
|
+
"eslint-plugin-import": "^2.29.1",
|
|
78
|
+
"eslint-plugin-react-hooks": "^4.6.2",
|
|
79
|
+
"eslint-plugin-react-refresh": "^0.4.7",
|
|
80
|
+
"eslint-plugin-storybook": "^0.8.0",
|
|
81
|
+
"glob": "10.3.10",
|
|
82
|
+
"husky": "^9.0.11",
|
|
83
|
+
"lint-staged": "^15.2.7",
|
|
84
|
+
"p-limit": "^6.1.0",
|
|
85
|
+
"postcss-preset-env": "^9.6.0",
|
|
86
|
+
"prettier": "^3.3.3",
|
|
87
|
+
"react": "^18.3.1",
|
|
88
|
+
"react-dom": "^18.3.1",
|
|
89
|
+
"sass": "^1.77.7",
|
|
90
|
+
"storybook": "^8.2.2",
|
|
91
|
+
"stylelint": "^16.7.0",
|
|
92
|
+
"stylelint-config-idiomatic-order": "^10.0.0",
|
|
93
|
+
"stylelint-config-rational-order": "^0.1.2",
|
|
94
|
+
"stylelint-config-standard": "^36.0.1",
|
|
95
|
+
"stylelint-order": "^6.0.4",
|
|
96
|
+
"stylelint-prettier": "^5.0.0",
|
|
97
|
+
"stylelint-scss": "^6.4.0",
|
|
98
|
+
"superagent": "^9.0.2",
|
|
99
|
+
"typescript": "^5.2.2",
|
|
100
|
+
"vite": "^5.3.1",
|
|
101
|
+
"vite-plugin-dts": "^3.9.1",
|
|
102
|
+
"vite-plugin-lib-inject-css": "^2.1.1",
|
|
103
|
+
"vite-plugin-svgr": "^4.2.0"
|
|
104
|
+
},
|
|
105
|
+
"peerDependencies": {
|
|
106
|
+
"@headlessui/react": "^2.1.2",
|
|
107
|
+
"react": "^18.3.1",
|
|
108
|
+
"react-dom": "^18.3.1"
|
|
109
|
+
},
|
|
110
|
+
"husky": {
|
|
111
|
+
"hooks": {
|
|
112
|
+
"pre-commit": "lint-staged"
|
|
113
|
+
}
|
|
114
|
+
},
|
|
115
|
+
"lint-staged": {
|
|
116
|
+
"**/*.{ts,tsx}": [
|
|
117
|
+
"eslint --ignore-path .eslintignore",
|
|
118
|
+
"prettier --write"
|
|
119
|
+
],
|
|
120
|
+
"**/*.{css,scss}": [
|
|
121
|
+
"stylelint --fix --formatter verbose"
|
|
122
|
+
]
|
|
123
|
+
},
|
|
124
|
+
"dependencies": {
|
|
125
|
+
"swiper": "^11.1.5",
|
|
126
|
+
"use-clipboard-copy": "^0.2.0"
|
|
127
|
+
}
|
|
128
|
+
}
|