mimir-ui-kit 1.3.2 → 1.4.0

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 (34) hide show
  1. package/README.md +53 -53
  2. package/dist/assets/Button.css +1 -1
  3. package/dist/assets/Drawer.css +1 -0
  4. package/dist/components/Button/Button.d.ts +0 -1
  5. package/dist/components/Button/Button.js +25 -25
  6. package/dist/components/Drawer/Drawer.d.ts +38 -0
  7. package/dist/components/Drawer/Drawer.js +144 -0
  8. package/dist/components/Drawer/constants.d.ts +5 -0
  9. package/dist/components/Drawer/constants.js +9 -0
  10. package/dist/components/Drawer/index.d.ts +2 -0
  11. package/dist/components/Drawer/index.js +6 -0
  12. package/dist/components/Portal/Portal.d.ts +7 -0
  13. package/dist/components/Portal/Portal.js +10 -0
  14. package/dist/components/Portal/index.d.ts +1 -0
  15. package/dist/components/Portal/index.js +4 -0
  16. package/dist/components/Steps/Steps.d.ts +3 -3
  17. package/dist/components/Steps/Steps.js +4 -9
  18. package/dist/components/Steps/types.d.ts +1 -1
  19. package/dist/components/Vote/Vote.d.ts +3 -3
  20. package/dist/components/Vote/types.d.ts +1 -1
  21. package/dist/components/index.d.ts +1 -2
  22. package/dist/components/index.js +2 -10
  23. package/dist/hooks/index.d.ts +1 -0
  24. package/dist/hooks/index.js +2 -0
  25. package/dist/hooks/useLockBodyScroll/index.d.ts +1 -0
  26. package/dist/hooks/useLockBodyScroll/index.js +4 -0
  27. package/dist/hooks/useLockBodyScroll/useLockBodyScroll.d.ts +6 -0
  28. package/dist/hooks/useLockBodyScroll/useLockBodyScroll.js +20 -0
  29. package/dist/index.js +4 -10
  30. package/package.json +127 -127
  31. package/dist/components/Steps/index.d.ts +0 -3
  32. package/dist/components/Steps/index.js +0 -8
  33. package/dist/components/Vote/index.d.ts +0 -3
  34. package/dist/components/Vote/index.js +0 -6
package/README.md CHANGED
@@ -1,54 +1,54 @@
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
- ## Поднятие версии для публикации на npm
22
-
23
- Для поднятия версии пакета перед публикацией на npm используем следующие скрипты:
24
-
25
- 1. `patch`: Этот скрипт увеличивает версию пакета на один патч (например, с версии 1.0.0 до 1.0.1). Он автоматически обновляет версию в файле package.json и создает коммит с обновленной версией.
26
- ```bash
27
- npm version patch
28
- ```
29
- 2. `minor`: Этот скрипт увеличивает версию пакета на один минорный уровень (например, с версии 1.0.0 до 1.1.0). Также обновляет версию в package.json и создает коммит.
30
- ```bash
31
- npm version minor
32
- ```
33
- 3. `major`: Этот скрипт увеличивает версию пакета на один мажорный уровень (например, с версии 1.0.0 до 2.0.0). Он также обновляет версию в package.json и создает коммит.
34
- ```bash
35
- npm version major
36
- ```
37
-
38
- ## Публикация на npm
39
-
40
- 1. Скрипт для публикации на npm:
41
- ```bash
42
- npm publish
43
- ```
44
-
45
- ## Ручная Генерация иконок
46
-
47
- 1. Экспортируем с фигмы иконку.
48
- 2. Добавляем ее в папку svgs.
49
- 3. Запускаем скрипт:
50
- ```bash
51
- npm run icons
52
- ```
53
- 4. Смотрим в папку `icons/components`
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
+ ## Поднятие версии для публикации на npm
22
+
23
+ Для поднятия версии пакета перед публикацией на npm используем следующие скрипты:
24
+
25
+ 1. `patch`: Этот скрипт увеличивает версию пакета на один патч (например, с версии 1.0.0 до 1.0.1). Он автоматически обновляет версию в файле package.json и создает коммит с обновленной версией.
26
+ ```bash
27
+ npm version patch
28
+ ```
29
+ 2. `minor`: Этот скрипт увеличивает версию пакета на один минорный уровень (например, с версии 1.0.0 до 1.1.0). Также обновляет версию в package.json и создает коммит.
30
+ ```bash
31
+ npm version minor
32
+ ```
33
+ 3. `major`: Этот скрипт увеличивает версию пакета на один мажорный уровень (например, с версии 1.0.0 до 2.0.0). Он также обновляет версию в package.json и создает коммит.
34
+ ```bash
35
+ npm version major
36
+ ```
37
+
38
+ ## Публикация на npm
39
+
40
+ 1. Скрипт для публикации на npm:
41
+ ```bash
42
+ npm publish
43
+ ```
44
+
45
+ ## Ручная Генерация иконок
46
+
47
+ 1. Экспортируем с фигмы иконку.
48
+ 2. Добавляем ее в папку svgs.
49
+ 3. Запускаем скрипт:
50
+ ```bash
51
+ npm run icons
52
+ ```
53
+ 4. Смотрим в папку `icons/components`
54
54
  5. Готово.
@@ -1 +1 @@
1
- ._button_1hqwa_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;-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-radius:var(--control-radius);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_1hqwa_2:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover)}._button_1hqwa_2:active{color:var(--button-color-active);background:var(--button-bg-color-active)}._button_1hqwa_2:focus{box-shadow:0 0 2px var(--sapphire-normal)}._button_1hqwa_2._clear_1hqwa_41:focus{box-shadow:none}._button_1hqwa_2 svg{color:currentcolor;fill:currentcolor}._button_1hqwa_2 svg path{color:currentcolor;fill:currentcolor}._xs_1hqwa_53{--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_1hqwa_61{--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_1hqwa_69{--button-height: var(--button-height-m);--button-font-size: var(--control-text-size-m);--button-space: var(--control-space-m);--button-gap: 8px;--button-border-radius: var(--button-border-radius-m)}._l_1hqwa_77{--button-height: var(--button-height-l);--button-font-size: var(--control-text-size-l);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l)}._xl_1hqwa_85{--button-height: var(--button-height-xl);--button-space: var(--control-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l);font-weight:var(--font-weight-text-medium);font-size:var(--size-text-l)}._xxl_1hqwa_94{--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);font-size:var(--size-text-l)}._default-button_1hqwa_103._primary-sapphire_1hqwa_103{--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_1hqwa_103._primary-citrine_1hqwa_112{--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_1hqwa_103._secondary-asphalt_1hqwa_121{--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_1hqwa_103._secondary-gray_1hqwa_130{--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_1hqwa_103._secondary-white_1hqwa_139{--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-hover);--button-color: var(--dark-text);--button-border: transparent}._default-button_1hqwa_103._secondary-red_1hqwa_148{--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_1hqwa_158{--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_1hqwa_158._black_1hqwa_165{--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_1hqwa_158._gray_1hqwa_174{--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_1hqwa_158._white_1hqwa_183{--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)}._full_1hqwa_193{display:block;width:100%}._disabled_1hqwa_198{--button-cursor: not-allowed;color:var(--light-text);background-color:var(--disabled)}._disabled_1hqwa_198:hover,._disabled_1hqwa_198:active,._disabled_1hqwa_198:focus{color:var(--light-text);background-color:var(--disabled);box-shadow:none}._icon-button_1hqwa_209{justify-content:center;min-width:var(--button-height);padding:0}
1
+ ._button_6nidf_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-radius:var(--control-radius);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_6nidf_2:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover)}._button_6nidf_2:active{color:var(--button-color-active);background:var(--button-bg-color-active)}._button_6nidf_2:focus{box-shadow:0 0 2px var(--sapphire-normal)}._button_6nidf_2._clear_6nidf_42:focus{box-shadow:none}._button_6nidf_2 svg{color:currentcolor;fill:currentcolor}._button_6nidf_2 svg path{color:currentcolor;fill:currentcolor}._xs_6nidf_54{--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_6nidf_62{--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_6nidf_70{--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_6nidf_78{--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_6nidf_86{--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_6nidf_95{--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)}._default-button_6nidf_104._primary-sapphire_6nidf_104{--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_6nidf_104._primary-citrine_6nidf_113{--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_6nidf_104._secondary-asphalt_6nidf_122{--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_6nidf_104._secondary-gray_6nidf_131{--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_6nidf_104._secondary-white_6nidf_140{--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_6nidf_104._secondary-red_6nidf_149{--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_6nidf_159{--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_6nidf_159._black_6nidf_166{--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_6nidf_159._gray_6nidf_175{--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_6nidf_159._white_6nidf_184{--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)}._full_6nidf_194{display:flex;justify-content:center;width:100%}._disabled_6nidf_200{--button-cursor: not-allowed;color:var(--light-text);background-color:var(--disabled)}._disabled_6nidf_200:hover,._disabled_6nidf_200:active,._disabled_6nidf_200:focus{color:var(--light-text);background-color:var(--disabled);box-shadow:none}._icon-button_6nidf_211{justify-content:center;min-width:var(--button-height);padding:0}
@@ -0,0 +1 @@
1
+ ._drawer_vy4rv_3{--drawer-width: 808px;--drawer-z-index: 1000;position:fixed;z-index:1000;z-index:var(--drawer-z-index);display:flex;flex-direction:column;width:808px;width:var(--drawer-width);height:100%;overflow:auto;background-color:var(--black-5);transition:all .3s ease;pointer-events:none}._drawer_vy4rv_3 ._content_vy4rv_17{position:relative;z-index:var(--modal-z-index);display:flex;flex:1;flex-direction:column;padding:var(--space-m) var(--space-4xl) var(--space-4xl);transition:all .3s ease}@media (max-width: 600px){._drawer_vy4rv_3 ._content_vy4rv_17{--drawer-width: 100%;padding:var(--space-m)}}._drawer_vy4rv_3 ._header_vy4rv_32{display:flex;gap:var(--space-xs);height:68px}._drawer_vy4rv_3 ._header_vy4rv_32:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_vy4rv_3 ._header_vy4rv_32 ._title_vy4rv_40{flex:1;align-self:flex-end;font-weight:var(--font-weight-text-medium);font-size:var(--size-text-xl3);line-height:var(--line-height-text-s1);letter-spacing:.7px}@media (max-width: 600px){._drawer_vy4rv_3 ._header_vy4rv_32 ._title_vy4rv_40{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_vy4rv_3 ._header_vy4rv_32 ._space_vy4rv_54{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_vy4rv_3 ._header_vy4rv_32{height:55px}._drawer_vy4rv_3 ._header_vy4rv_32:not(:last-child){margin-bottom:var(--space-m)}}._drawer_vy4rv_3 ._inner_vy4rv_65{flex:1}._drawer_vy4rv_3 ._button_vy4rv_68{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_vy4rv_3 ._footer_vy4rv_73{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_vy4rv_3 ._footer_vy4rv_73{padding-top:var(--space-m)}}._drawer_vy4rv_3 ._footer-button_vy4rv_82{display:block;margin-left:auto}._drawer_vy4rv_3._left_vy4rv_86{top:0;left:-100%}._drawer_vy4rv_3._right_vy4rv_90{top:0;right:-100%}._drawer_vy4rv_3._bottom_vy4rv_94{right:50%;bottom:-100%;left:50%;max-height:80vh;border-top-left-radius:var(--control-radius);border-top-right-radius:var(--control-radius);transform:translate(-50%)}._drawer_vy4rv_3._opened_vy4rv_103{transition:all .3s ease;pointer-events:auto}._drawer_vy4rv_3._opened_vy4rv_103._left_vy4rv_86{left:0%;transition:left .3s ease}._drawer_vy4rv_3._opened_vy4rv_103._right_vy4rv_90{right:0%;transition:right .3s ease}._drawer_vy4rv_3._opened_vy4rv_103._bottom_vy4rv_94{bottom:0%}._drawer_vy4rv_3._is-closing_vy4rv_118._left_vy4rv_86{left:-100%}._drawer_vy4rv_3._is-closing_vy4rv_118._right_vy4rv_90{right:-100%}._drawer_vy4rv_3._is-closing_vy4rv_118._bottom_vy4rv_94{bottom:-100%}@media (max-width: 1440px){._drawer_vy4rv_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_vy4rv_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_vy4rv_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_vy4rv_3{--drawer-width: 100%}._drawer_vy4rv_3._bottom_vy4rv_94{max-width:359px}}._overlay_vy4rv_151{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_vy4rv_151._opened_vy4rv_103{opacity:1;transition:all .3s ease}._overlay_vy4rv_151._is-closing_vy4rv_118{opacity:0;transition:all .3s ease}
@@ -26,7 +26,6 @@ export type TProps = TCommonButtonProps & ComponentProps<'button'> & {
26
26
  };
27
27
  /**
28
28
  * Компонент кнопки, который можно настраивать с различными темами и размерами.
29
-
30
29
  */
31
30
  export declare const Button: import('react').ForwardRefExoticComponent<(Omit<import('./types').TButtonDefaultFormProps & {
32
31
  isIconButton: true;
@@ -1,21 +1,21 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import { forwardRef } from "react";
3
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
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 = "_button_1hqwa_2";
7
- const clear = "_clear_1hqwa_41";
8
- const xs = "_xs_1hqwa_53";
9
- const s = "_s_1hqwa_61";
10
- const m = "_m_1hqwa_69";
11
- const l = "_l_1hqwa_77";
12
- const xl = "_xl_1hqwa_85";
13
- const xxl = "_xxl_1hqwa_94";
14
- const black = "_black_1hqwa_165";
15
- const gray = "_gray_1hqwa_174";
16
- const white = "_white_1hqwa_183";
17
- const full = "_full_1hqwa_193";
18
- const disabled = "_disabled_1hqwa_198";
6
+ import '../../assets/Button.css';const button = "_button_6nidf_2";
7
+ const clear = "_clear_6nidf_42";
8
+ const xs = "_xs_6nidf_54";
9
+ const s = "_s_6nidf_62";
10
+ const m = "_m_6nidf_70";
11
+ const l = "_l_6nidf_78";
12
+ const xl = "_xl_6nidf_86";
13
+ const xxl = "_xxl_6nidf_95";
14
+ const black = "_black_6nidf_166";
15
+ const gray = "_gray_6nidf_175";
16
+ const white = "_white_6nidf_184";
17
+ const full = "_full_6nidf_194";
18
+ const disabled = "_disabled_6nidf_200";
19
19
  const cls = {
20
20
  button,
21
21
  clear,
@@ -25,20 +25,20 @@ const cls = {
25
25
  l,
26
26
  xl,
27
27
  xxl,
28
- "default-button": "_default-button_1hqwa_103",
29
- "primary-sapphire": "_primary-sapphire_1hqwa_103",
30
- "primary-citrine": "_primary-citrine_1hqwa_112",
31
- "secondary-asphalt": "_secondary-asphalt_1hqwa_121",
32
- "secondary-gray": "_secondary-gray_1hqwa_130",
33
- "secondary-white": "_secondary-white_1hqwa_139",
34
- "secondary-red": "_secondary-red_1hqwa_148",
35
- "round-button": "_round-button_1hqwa_158",
28
+ "default-button": "_default-button_6nidf_104",
29
+ "primary-sapphire": "_primary-sapphire_6nidf_104",
30
+ "primary-citrine": "_primary-citrine_6nidf_113",
31
+ "secondary-asphalt": "_secondary-asphalt_6nidf_122",
32
+ "secondary-gray": "_secondary-gray_6nidf_131",
33
+ "secondary-white": "_secondary-white_6nidf_140",
34
+ "secondary-red": "_secondary-red_6nidf_149",
35
+ "round-button": "_round-button_6nidf_159",
36
36
  black,
37
37
  gray,
38
38
  white,
39
39
  full,
40
40
  disabled,
41
- "icon-button": "_icon-button_1hqwa_209"
41
+ "icon-button": "_icon-button_6nidf_211"
42
42
  };
43
43
  const Button = forwardRef(
44
44
  (props, ref) => {
@@ -68,9 +68,9 @@ const Button = forwardRef(
68
68
  };
69
69
  const buttonClassNames = classNames(
70
70
  cls.button,
71
+ className,
71
72
  mods,
72
- clear2 ? [] : [cls[form ?? ""], cls[size]],
73
- className
73
+ clear2 ? [] : [cls[form ?? ""], cls[size]]
74
74
  );
75
75
  return /* @__PURE__ */ jsxs(
76
76
  "button",
@@ -0,0 +1,38 @@
1
+ import { PropsWithChildren, ReactNode } from 'react';
2
+ import { EDrawerPosition } from './constants';
3
+
4
+ type TProps = {
5
+ /**
6
+ * Обязательный заголовок.
7
+ */
8
+ title: string;
9
+ /**
10
+ * Флаг отвечачающий за показ/скрытие.
11
+ */
12
+ isOpen?: boolean;
13
+ /**
14
+ * Настраиваемый паддинг для body, что бы избежать скачка контента при overflow: hidden
15
+ */
16
+ paddingRight?: number;
17
+ /**
18
+ * Функция закрытия шторки
19
+ */
20
+ onClose?: VoidFunction;
21
+ /**
22
+ * Дополнительный класс для родительской обертки.
23
+ */
24
+ className?: string;
25
+ /**
26
+ * Позиция шторки.
27
+ */
28
+ position?: `${EDrawerPosition}` | EDrawerPosition;
29
+ /**
30
+ * Кастомный footer. По дефолту в нем расположена кнопка для закрытия.
31
+ */
32
+ footer?: ReactNode;
33
+ };
34
+ /**
35
+ * Компонент шторки, который может выезжать слева, справа или внизу.
36
+ */
37
+ export declare const Drawer: ({ isOpen, onClose, title, className, position, paddingRight, footer, children }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
38
+ export {};
@@ -0,0 +1,144 @@
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
+ import { c as classNames } from "../../index-CweZ_OcN.js";
3
+ import { useState, useRef, useCallback, useEffect } from "react";
4
+ import { EDrawerPosition } from "./constants.js";
5
+ import { useMediaQuery } from "../../hooks/useMediaQuery/useMediaQuery.js";
6
+ import { EMediaQuery } from "../../hooks/useMediaQuery/constants.js";
7
+ import { useLockBodyScroll } from "../../hooks/useLockBodyScroll/useLockBodyScroll.js";
8
+ import { Button } from "../Button/Button.js";
9
+ import { EButtonVariantDefault, EButtonSize } from "../Button/constants.js";
10
+ import { Portal } from "../Portal/Portal.js";
11
+ import '../../assets/Drawer.css';const drawer = "_drawer_vy4rv_3";
12
+ const content = "_content_vy4rv_17";
13
+ const header = "_header_vy4rv_32";
14
+ const title = "_title_vy4rv_40";
15
+ const space = "_space_vy4rv_54";
16
+ const inner = "_inner_vy4rv_65";
17
+ const button = "_button_vy4rv_68";
18
+ const footer = "_footer_vy4rv_73";
19
+ const left = "_left_vy4rv_86";
20
+ const right = "_right_vy4rv_90";
21
+ const bottom = "_bottom_vy4rv_94";
22
+ const opened = "_opened_vy4rv_103";
23
+ const overlay = "_overlay_vy4rv_151";
24
+ const cls = {
25
+ drawer,
26
+ content,
27
+ header,
28
+ title,
29
+ space,
30
+ inner,
31
+ button,
32
+ footer,
33
+ "footer-button": "_footer-button_vy4rv_82",
34
+ left,
35
+ right,
36
+ bottom,
37
+ opened,
38
+ "is-closing": "_is-closing_vy4rv_118",
39
+ overlay
40
+ };
41
+ const ANIMATION_DELAY = 300;
42
+ const Drawer = ({
43
+ isOpen,
44
+ onClose,
45
+ title: title2,
46
+ className,
47
+ position = EDrawerPosition.RIGHT,
48
+ paddingRight = 8,
49
+ footer: footer2,
50
+ children
51
+ }) => {
52
+ const [isClosing, setIsClosing] = useState(false);
53
+ const [isMounted, setIsMounted] = useState(false);
54
+ const [isBodyScrollLocked, setIsBodyScrollLocked] = useState(false);
55
+ const timerRef = useRef();
56
+ const contentRef = useRef(null);
57
+ const isBottomPosition = position === EDrawerPosition.BOTTOM;
58
+ const isMobile = useMediaQuery(EMediaQuery.XS1);
59
+ useLockBodyScroll({
60
+ on: isBodyScrollLocked,
61
+ paddingRight
62
+ });
63
+ const handleClose = useCallback(() => {
64
+ if (onClose) {
65
+ setIsClosing(true);
66
+ setIsBodyScrollLocked(false);
67
+ timerRef.current = setTimeout(() => {
68
+ onClose();
69
+ setIsClosing(false);
70
+ }, ANIMATION_DELAY);
71
+ }
72
+ }, [onClose]);
73
+ const handleKeyDown = useCallback(
74
+ (event) => {
75
+ if (event.key === "Escape") {
76
+ handleClose();
77
+ }
78
+ },
79
+ [handleClose]
80
+ );
81
+ useEffect(() => {
82
+ if (isOpen) {
83
+ setIsBodyScrollLocked(true);
84
+ setIsMounted(true);
85
+ window.addEventListener("keydown", handleKeyDown);
86
+ }
87
+ return () => {
88
+ setIsMounted(false);
89
+ clearTimeout(timerRef.current);
90
+ window.removeEventListener("keydown", handleKeyDown);
91
+ };
92
+ }, [isOpen, handleKeyDown]);
93
+ const mods = {
94
+ [cls.opened]: isMounted,
95
+ [cls["is-closing"]]: isClosing
96
+ };
97
+ if (!isOpen) {
98
+ return null;
99
+ }
100
+ return /* @__PURE__ */ jsxs(Portal, { children: [
101
+ /* @__PURE__ */ jsx(
102
+ "div",
103
+ {
104
+ "aria-hidden": isOpen,
105
+ role: "dialog",
106
+ style: {
107
+ minHeight: isBottomPosition && contentRef.current ? contentRef.current.offsetHeight : void 0
108
+ },
109
+ className: classNames(cls.drawer, cls[position], mods, className),
110
+ children: /* @__PURE__ */ jsxs("section", { className: classNames(cls.content, cls[position]), children: [
111
+ /* @__PURE__ */ jsxs("header", { className: cls.header, children: [
112
+ /* @__PURE__ */ jsx("h2", { className: cls.title, children: title2 }),
113
+ /* @__PURE__ */ jsx("div", { className: cls.space, children: /* @__PURE__ */ jsx(
114
+ Button,
115
+ {
116
+ variant: EButtonVariantDefault.SecondaryWhite,
117
+ isIconButton: true,
118
+ size: isMobile ? EButtonSize.S : EButtonSize.M,
119
+ iconName: "Close16px",
120
+ onClick: handleClose,
121
+ className: cls.button
122
+ }
123
+ ) })
124
+ ] }),
125
+ /* @__PURE__ */ jsx("div", { ref: contentRef, className: cls.inner, children }),
126
+ /* @__PURE__ */ jsx("footer", { className: cls.footer, children: footer2 || /* @__PURE__ */ jsx(
127
+ Button,
128
+ {
129
+ size: isMobile ? EButtonSize.M : EButtonSize.XXL,
130
+ full: isMobile,
131
+ onClick: handleClose,
132
+ className: cls["footer-button"],
133
+ children: "Закрыть"
134
+ }
135
+ ) })
136
+ ] })
137
+ }
138
+ ),
139
+ /* @__PURE__ */ jsx("div", { className: classNames(cls.overlay, mods), onClick: handleClose })
140
+ ] });
141
+ };
142
+ export {
143
+ Drawer
144
+ };
@@ -0,0 +1,5 @@
1
+ export declare enum EDrawerPosition {
2
+ LEFT = "left",
3
+ RIGHT = "right",
4
+ BOTTOM = "bottom"
5
+ }
@@ -0,0 +1,9 @@
1
+ var EDrawerPosition = /* @__PURE__ */ ((EDrawerPosition2) => {
2
+ EDrawerPosition2["LEFT"] = "left";
3
+ EDrawerPosition2["RIGHT"] = "right";
4
+ EDrawerPosition2["BOTTOM"] = "bottom";
5
+ return EDrawerPosition2;
6
+ })(EDrawerPosition || {});
7
+ export {
8
+ EDrawerPosition
9
+ };
@@ -0,0 +1,2 @@
1
+ export { Drawer } from './Drawer';
2
+ export { EDrawerPosition } from './constants';
@@ -0,0 +1,6 @@
1
+ import { Drawer } from "./Drawer.js";
2
+ import { EDrawerPosition } from "./constants.js";
3
+ export {
4
+ Drawer,
5
+ EDrawerPosition
6
+ };
@@ -0,0 +1,7 @@
1
+ import { PropsWithChildren } from 'react';
2
+
3
+ type TProps = {
4
+ element?: HTMLElement;
5
+ };
6
+ export declare const Portal: ({ element, children }: PropsWithChildren<TProps>) => import('react').ReactPortal;
7
+ export {};
@@ -0,0 +1,10 @@
1
+ import { createPortal } from "react-dom";
2
+ const Portal = ({
3
+ element = document.body,
4
+ children
5
+ }) => {
6
+ return createPortal(children, element);
7
+ };
8
+ export {
9
+ Portal
10
+ };
@@ -0,0 +1 @@
1
+ export { Portal } from './Portal';
@@ -0,0 +1,4 @@
1
+ import { Portal } from "./Portal.js";
2
+ export {
3
+ Portal
4
+ };
@@ -1,7 +1,7 @@
1
1
  import { EStepsPrimaryColor, EStepsSecondaryColor } from './constants';
2
- import { TCommonStepsProps } from './types';
2
+ import { TCommonStepProps } from './types';
3
3
 
4
- export type TProps = TCommonStepsProps & {
4
+ export type TProps = TCommonStepProps & {
5
5
  /**
6
6
  * Класс, применяемый к корневому элементу
7
7
  */
@@ -39,7 +39,7 @@ export type TProps = TCommonStepsProps & {
39
39
  */
40
40
  secondaryColor?: EStepsSecondaryColor;
41
41
  };
42
- export declare const Steps: import('react').ForwardRefExoticComponent<TCommonStepsProps & {
42
+ export declare const Steps: import('react').ForwardRefExoticComponent<TCommonStepProps & {
43
43
  /**
44
44
  * Класс, применяемый к корневому элементу
45
45
  */
@@ -1,6 +1,6 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
3
- import { forwardRef, useId, useState, useRef, useEffect } from "react";
3
+ import { forwardRef, useId, useState, useEffect } from "react";
4
4
  import { ZERO_STEP, EStepsSize, EStepsPrimaryColor, ID_SEPARATOR, EStepsColorType, StepSize, DIFF_BETWEEN_STEP_AND_INDEX } from "./constants.js";
5
5
  import { Icon } from "../../icons/Icon.js";
6
6
  import '../../assets/Steps.css';const container = "_container_j31xr_2";
@@ -46,21 +46,16 @@ const Steps = forwardRef(
46
46
  const idPrefix = useId();
47
47
  const [step2, setStep] = useState(current);
48
48
  const [hoveredStep, setHoveredStep] = useState(null);
49
- const stepWasChangedRef = useRef(null);
50
49
  useEffect(() => {
51
50
  setStep(current);
52
51
  }, [current]);
52
+ useEffect(() => {
53
+ onClick && onClick(step2);
54
+ }, [onClick, step2]);
53
55
  const handleClick = (idx) => {
54
56
  const clickedStep = idx + DIFF_BETWEEN_STEP_AND_INDEX;
55
- stepWasChangedRef.current = true;
56
57
  setStep(clickedStep !== step2 ? clickedStep : ZERO_STEP);
57
58
  };
58
- useEffect(() => {
59
- if (stepWasChangedRef.current === true) {
60
- onClick && onClick(step2);
61
- stepWasChangedRef.current = false;
62
- }
63
- }, [onClick, step2]);
64
59
  const handleMouseEnter = (evt) => {
65
60
  const hoveredIdx = Number(evt.currentTarget.id.split(ID_SEPARATOR)[1]);
66
61
  setHoveredStep(hoveredIdx);
@@ -1,6 +1,6 @@
1
1
  import { EStepsSize } from './constants';
2
2
 
3
3
  export type TSize = `${EStepsSize}` | EStepsSize;
4
- export type TCommonStepsProps = {
4
+ export type TCommonStepProps = {
5
5
  size?: TSize;
6
6
  };
@@ -1,7 +1,7 @@
1
- import { TCommonVoteProps } from './types';
1
+ import { TCommonStepProps } from './types';
2
2
  import { EStepsPrimaryColor, EStepsSecondaryColor } from '../Steps/constants';
3
3
 
4
- export type TProps = TCommonVoteProps & {
4
+ export type TProps = TCommonStepProps & {
5
5
  /**
6
6
  * Класс, применяемый к корневому элементу
7
7
  */
@@ -59,7 +59,7 @@ export type TProps = TCommonVoteProps & {
59
59
  */
60
60
  needChangeFirstHalfColor?: boolean;
61
61
  };
62
- export declare const Vote: import('react').ForwardRefExoticComponent<TCommonVoteProps & {
62
+ export declare const Vote: import('react').ForwardRefExoticComponent<TCommonStepProps & {
63
63
  /**
64
64
  * Класс, применяемый к корневому элементу
65
65
  */
@@ -1,6 +1,6 @@
1
1
  import { EVoteSize } from './constants';
2
2
 
3
3
  export type TSize = `${EVoteSize}` | EVoteSize;
4
- export type TCommonVoteProps = {
4
+ export type TCommonStepProps = {
5
5
  size?: TSize;
6
6
  };
@@ -13,5 +13,4 @@ export type { TButtonPropsWithoutStyles } from './MergedButton';
13
13
  export { Image } from './Image';
14
14
  export { Loader } from './Loader';
15
15
  export { Slider } from './Slider';
16
- export { Steps, EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize, type TCommonStepsProps } from './Steps';
17
- export { Vote, EVoteSize, type TCommonVoteProps } from './Vote';
16
+ export { Drawer } from './Drawer';
@@ -12,12 +12,10 @@ import { EMergedButtonVariantRound } from "./MergedButton/constants.js";
12
12
  import { AppImage } from "./Image/Image.js";
13
13
  import { Loader } from "./Loader/Loader.js";
14
14
  import { Slider } from "./Slider/Slider.js";
15
- import { Steps } from "./Steps/Steps.js";
16
- import { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from "./Steps/constants.js";
17
- import { Vote } from "./Vote/Vote.js";
18
- import { EVoteSize } from "./Vote/constants.js";
15
+ import { Drawer } from "./Drawer/Drawer.js";
19
16
  export {
20
17
  Button,
18
+ Drawer,
21
19
  EButtonForm,
22
20
  EButtonSize,
23
21
  EButtonVariantDefault,
@@ -25,10 +23,6 @@ export {
25
23
  EInputSize,
26
24
  EInputVariant,
27
25
  EMergedButtonVariantRound,
28
- EStepsPrimaryColor,
29
- EStepsSecondaryColor,
30
- EStepsSize,
31
- EVoteSize,
32
26
  AppImage as Image,
33
27
  Input,
34
28
  InputPassword,
@@ -38,8 +32,6 @@ export {
38
32
  OtpInput,
39
33
  RadioGroup,
40
34
  Slider,
41
- Steps,
42
- Vote,
43
35
  getMaskedInputPhoneValue,
44
36
  getUnmaskedInputValue
45
37
  };
@@ -1 +1,2 @@
1
1
  export { useMediaQuery, EMediaQuery } from './useMediaQuery';
2
+ export { useLockBodyScroll } from './useLockBodyScroll';
@@ -1,6 +1,8 @@
1
1
  import { useMediaQuery } from "./useMediaQuery/useMediaQuery.js";
2
2
  import { EMediaQuery } from "./useMediaQuery/constants.js";
3
+ import { useLockBodyScroll } from "./useLockBodyScroll/useLockBodyScroll.js";
3
4
  export {
4
5
  EMediaQuery,
6
+ useLockBodyScroll,
5
7
  useMediaQuery
6
8
  };
@@ -0,0 +1 @@
1
+ export { useLockBodyScroll } from './useLockBodyScroll';
@@ -0,0 +1,4 @@
1
+ import { useLockBodyScroll } from "./useLockBodyScroll.js";
2
+ export {
3
+ useLockBodyScroll
4
+ };
@@ -0,0 +1,6 @@
1
+ type TUseLockBodyScroll = {
2
+ on?: boolean;
3
+ paddingRight?: number;
4
+ };
5
+ export declare function useLockBodyScroll({ on, paddingRight }: TUseLockBodyScroll): void;
6
+ export {};
@@ -0,0 +1,20 @@
1
+ import { useLayoutEffect } from "react";
2
+ function useLockBodyScroll({ on, paddingRight }) {
3
+ useLayoutEffect(() => {
4
+ const hasVerticalScrollbar = document.documentElement.scrollHeight > document.documentElement.clientHeight;
5
+ if (!on || !hasVerticalScrollbar) return;
6
+ const originalStyle = window.getComputedStyle(document.body).overflow;
7
+ const originalPaddingStyle = window.getComputedStyle(
8
+ document.body
9
+ ).paddingRight;
10
+ document.body.style.overflow = "hidden";
11
+ document.body.style.paddingRight = `${paddingRight}px`;
12
+ return () => {
13
+ document.body.style.overflow = originalStyle;
14
+ document.body.style.paddingRight = originalPaddingStyle;
15
+ };
16
+ }, [on, paddingRight]);
17
+ }
18
+ export {
19
+ useLockBodyScroll
20
+ };
package/dist/index.js CHANGED
@@ -12,15 +12,14 @@ import { EMergedButtonVariantRound } from "./components/MergedButton/constants.j
12
12
  import { AppImage } from "./components/Image/Image.js";
13
13
  import { Loader } from "./components/Loader/Loader.js";
14
14
  import { Slider } from "./components/Slider/Slider.js";
15
- import { Steps } from "./components/Steps/Steps.js";
16
- import { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from "./components/Steps/constants.js";
17
- import { Vote } from "./components/Vote/Vote.js";
18
- import { EVoteSize } from "./components/Vote/constants.js";
15
+ import { Drawer } from "./components/Drawer/Drawer.js";
19
16
  import { useMediaQuery } from "./hooks/useMediaQuery/useMediaQuery.js";
20
17
  import { EMediaQuery } from "./hooks/useMediaQuery/constants.js";
18
+ import { useLockBodyScroll } from "./hooks/useLockBodyScroll/useLockBodyScroll.js";
21
19
  import { Icon } from "./icons/Icon.js";
22
20
  import './assets/index.css';export {
23
21
  Button,
22
+ Drawer,
24
23
  EButtonForm,
25
24
  EButtonSize,
26
25
  EButtonVariantDefault,
@@ -29,10 +28,6 @@ import './assets/index.css';export {
29
28
  EInputVariant,
30
29
  EMediaQuery,
31
30
  EMergedButtonVariantRound,
32
- EStepsPrimaryColor,
33
- EStepsSecondaryColor,
34
- EStepsSize,
35
- EVoteSize,
36
31
  Icon,
37
32
  AppImage as Image,
38
33
  Input,
@@ -43,9 +38,8 @@ import './assets/index.css';export {
43
38
  OtpInput,
44
39
  RadioGroup,
45
40
  Slider,
46
- Steps,
47
- Vote,
48
41
  getMaskedInputPhoneValue,
49
42
  getUnmaskedInputValue,
43
+ useLockBodyScroll,
50
44
  useMediaQuery
51
45
  };
package/package.json CHANGED
@@ -1,127 +1,127 @@
1
- {
2
- "name": "mimir-ui-kit",
3
- "private": false,
4
- "version": "1.3.2",
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
- },
47
- "devDependencies": {
48
- "@chromatic-com/storybook": "^1.6.1",
49
- "@headlessui/react": "^2.1.2",
50
- "@laynezh/vite-plugin-lib-assets": "^0.5.23",
51
- "@loadable/component": "^5.15.2",
52
- "@storybook/addon-essentials": "^8.2.2",
53
- "@storybook/addon-interactions": "^8.2.2",
54
- "@storybook/addon-links": "^8.2.2",
55
- "@storybook/addon-onboarding": "^8.2.2",
56
- "@storybook/blocks": "^8.2.2",
57
- "@storybook/builder-vite": "^8.2.2",
58
- "@storybook/react": "^8.2.2",
59
- "@storybook/react-vite": "^8.2.2",
60
- "@storybook/test": "^8.2.2",
61
- "@svgr/cli": "^8.1.0",
62
- "@svgr/core": "^8.1.0",
63
- "@svgr/plugin-svgo": "^8.1.0",
64
- "@types/node": "^20.14.10",
65
- "@types/react": "^18.3.3",
66
- "@types/react-dom": "^18.3.0",
67
- "@typescript-eslint/eslint-plugin": "^7.13.1",
68
- "@typescript-eslint/parser": "^7.13.1",
69
- "@vitejs/plugin-react": "^4.3.1",
70
- "autoprefixer": "^10.4.19",
71
- "chalk": "4.1.2",
72
- "classnames": "^2.5.1",
73
- "dotenv": "^16.4.5",
74
- "eslint": "^8.57.0",
75
- "eslint-config-prettier": "^9.1.0",
76
- "eslint-plugin-import": "^2.29.1",
77
- "eslint-plugin-react-hooks": "^4.6.2",
78
- "eslint-plugin-react-refresh": "^0.4.7",
79
- "eslint-plugin-storybook": "^0.8.0",
80
- "glob": "10.3.10",
81
- "husky": "^9.0.11",
82
- "lint-staged": "^15.2.7",
83
- "p-limit": "^6.1.0",
84
- "postcss-preset-env": "^9.6.0",
85
- "prettier": "^3.3.3",
86
- "react": "^18.3.1",
87
- "react-dom": "^18.3.1",
88
- "sass": "^1.77.7",
89
- "storybook": "^8.2.2",
90
- "stylelint": "^16.7.0",
91
- "stylelint-config-idiomatic-order": "^10.0.0",
92
- "stylelint-config-rational-order": "^0.1.2",
93
- "stylelint-config-standard": "^36.0.1",
94
- "stylelint-order": "^6.0.4",
95
- "stylelint-prettier": "^5.0.0",
96
- "stylelint-scss": "^6.4.0",
97
- "superagent": "^9.0.2",
98
- "typescript": "^5.2.2",
99
- "vite": "^5.3.1",
100
- "vite-plugin-dts": "^3.9.1",
101
- "vite-plugin-lib-inject-css": "^2.1.1",
102
- "vite-plugin-svgr": "^4.2.0"
103
- },
104
- "peerDependencies": {
105
- "@headlessui/react": "^2.1.2",
106
- "react": "^18.3.1",
107
- "react-dom": "^18.3.1"
108
- },
109
- "husky": {
110
- "hooks": {
111
- "pre-commit": "lint-staged"
112
- }
113
- },
114
- "lint-staged": {
115
- "**/*.{ts,tsx}": [
116
- "eslint",
117
- "prettier --write"
118
- ],
119
- "**/*.{css,scss}": [
120
- "stylelint --fix"
121
- ]
122
- },
123
- "dependencies": {
124
- "swiper": "^11.1.5",
125
- "use-clipboard-copy": "^0.2.0"
126
- }
127
- }
1
+ {
2
+ "name": "mimir-ui-kit",
3
+ "private": false,
4
+ "version": "1.4.0",
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
+ },
47
+ "devDependencies": {
48
+ "@chromatic-com/storybook": "^1.6.1",
49
+ "@headlessui/react": "^2.1.2",
50
+ "@laynezh/vite-plugin-lib-assets": "^0.5.23",
51
+ "@loadable/component": "^5.15.2",
52
+ "@storybook/addon-essentials": "^8.2.2",
53
+ "@storybook/addon-interactions": "^8.2.2",
54
+ "@storybook/addon-links": "^8.2.2",
55
+ "@storybook/addon-onboarding": "^8.2.2",
56
+ "@storybook/blocks": "^8.2.2",
57
+ "@storybook/builder-vite": "^8.2.2",
58
+ "@storybook/react": "^8.2.2",
59
+ "@storybook/react-vite": "^8.2.2",
60
+ "@storybook/test": "^8.2.2",
61
+ "@svgr/cli": "^8.1.0",
62
+ "@svgr/core": "^8.1.0",
63
+ "@svgr/plugin-svgo": "^8.1.0",
64
+ "@types/node": "^20.14.10",
65
+ "@types/react": "^18.3.3",
66
+ "@types/react-dom": "^18.3.0",
67
+ "@typescript-eslint/eslint-plugin": "^7.13.1",
68
+ "@typescript-eslint/parser": "^7.13.1",
69
+ "@vitejs/plugin-react": "^4.3.1",
70
+ "autoprefixer": "^10.4.19",
71
+ "chalk": "4.1.2",
72
+ "classnames": "^2.5.1",
73
+ "dotenv": "^16.4.5",
74
+ "eslint": "^8.57.0",
75
+ "eslint-config-prettier": "^9.1.0",
76
+ "eslint-plugin-import": "^2.29.1",
77
+ "eslint-plugin-react-hooks": "^4.6.2",
78
+ "eslint-plugin-react-refresh": "^0.4.7",
79
+ "eslint-plugin-storybook": "^0.8.0",
80
+ "glob": "10.3.10",
81
+ "husky": "^9.0.11",
82
+ "lint-staged": "^15.2.7",
83
+ "p-limit": "^6.1.0",
84
+ "postcss-preset-env": "^9.6.0",
85
+ "prettier": "^3.3.3",
86
+ "react": "^18.3.1",
87
+ "react-dom": "^18.3.1",
88
+ "sass": "^1.77.7",
89
+ "storybook": "^8.2.2",
90
+ "stylelint": "^16.7.0",
91
+ "stylelint-config-idiomatic-order": "^10.0.0",
92
+ "stylelint-config-rational-order": "^0.1.2",
93
+ "stylelint-config-standard": "^36.0.1",
94
+ "stylelint-order": "^6.0.4",
95
+ "stylelint-prettier": "^5.0.0",
96
+ "stylelint-scss": "^6.4.0",
97
+ "superagent": "^9.0.2",
98
+ "typescript": "^5.2.2",
99
+ "vite": "^5.3.1",
100
+ "vite-plugin-dts": "^3.9.1",
101
+ "vite-plugin-lib-inject-css": "^2.1.1",
102
+ "vite-plugin-svgr": "^4.2.0"
103
+ },
104
+ "peerDependencies": {
105
+ "@headlessui/react": "^2.1.2",
106
+ "react": "^18.3.1",
107
+ "react-dom": "^18.3.1"
108
+ },
109
+ "husky": {
110
+ "hooks": {
111
+ "pre-commit": "lint-staged"
112
+ }
113
+ },
114
+ "lint-staged": {
115
+ "**/*.{ts,tsx}": [
116
+ "eslint",
117
+ "prettier --write"
118
+ ],
119
+ "**/*.{css,scss}": [
120
+ "stylelint --fix"
121
+ ]
122
+ },
123
+ "dependencies": {
124
+ "swiper": "^11.1.5",
125
+ "use-clipboard-copy": "^0.2.0"
126
+ }
127
+ }
@@ -1,3 +0,0 @@
1
- export { Steps } from './Steps';
2
- export { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from './constants';
3
- export type { TCommonStepsProps } from './types';
@@ -1,8 +0,0 @@
1
- import { Steps } from "./Steps.js";
2
- import { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from "./constants.js";
3
- export {
4
- EStepsPrimaryColor,
5
- EStepsSecondaryColor,
6
- EStepsSize,
7
- Steps
8
- };
@@ -1,3 +0,0 @@
1
- export { Vote } from './Vote';
2
- export { EVoteSize } from './constants';
3
- export type { TCommonVoteProps, TSize } from './types';
@@ -1,6 +0,0 @@
1
- import { Vote } from "./Vote.js";
2
- import { EVoteSize } from "./constants.js";
3
- export {
4
- EVoteSize,
5
- Vote
6
- };