mimir-ui-kit 1.24.2 → 1.24.4

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 (36) hide show
  1. package/dist/assets/CheckboxMimir.css +1 -0
  2. package/dist/assets/Drawer.css +1 -1
  3. package/dist/assets/ListFiles.css +1 -0
  4. package/dist/assets/ListPhotos.css +1 -1
  5. package/dist/assets/Uploader.css +1 -1
  6. package/dist/assets/UploaderPhotos.css +1 -1
  7. package/dist/components/{Switch/Switch.d.ts → CheckboxMimir/CheckboxMimir.d.ts} +2 -2
  8. package/dist/components/{Switch/Switch.js → CheckboxMimir/CheckboxMimir.js} +9 -8
  9. package/dist/components/CheckboxMimir/index.d.ts +2 -0
  10. package/dist/components/CheckboxMimir/index.js +4 -0
  11. package/dist/components/Drawer/Drawer.d.ts +5 -1
  12. package/dist/components/Drawer/Drawer.js +37 -22
  13. package/dist/components/ListFiles/ListFiles.d.ts +26 -0
  14. package/dist/components/ListFiles/ListFiles.js +47 -0
  15. package/dist/components/ListFiles/constants.d.ts +3 -0
  16. package/dist/components/ListFiles/constants.js +33 -0
  17. package/dist/components/ListFiles/index.d.ts +2 -0
  18. package/dist/components/ListFiles/index.js +4 -0
  19. package/dist/components/ListPhotos/ListPhotos.js +7 -3
  20. package/dist/components/Uploader/Uploader.js +4 -4
  21. package/dist/components/UploaderFiles/UploaderFiles.d.ts +38 -0
  22. package/dist/components/UploaderFiles/UploaderFiles.js +68 -0
  23. package/dist/components/UploaderFiles/index.d.ts +2 -0
  24. package/dist/components/UploaderFiles/index.js +4 -0
  25. package/dist/components/UploaderPhotos/UploaderPhotos.js +2 -2
  26. package/dist/components/index.d.ts +2 -2
  27. package/dist/components/index.js +2 -2
  28. package/dist/index.js +2 -2
  29. package/dist/utils/formating/FileSize.d.ts +1 -0
  30. package/dist/utils/formating/FileSize.js +15 -0
  31. package/dist/utils/index.d.ts +2 -0
  32. package/dist/utils/index.js +3 -1
  33. package/package.json +1 -1
  34. package/dist/assets/Switch.css +0 -1
  35. package/dist/components/Switch/index.d.ts +0 -2
  36. package/dist/components/Switch/index.js +0 -4
@@ -0,0 +1 @@
1
+ ._container_ktju1_2{display:flex;gap:var(--space-xs);align-items:flex-start}._checkbox_ktju1_8{position:relative;display:inline-block;flex-shrink:0;width:24px;height:24px;padding:var(--space-2xs);vertical-align:middle;background-color:var(--sapphire-20);border-radius:var(--control-radius-xs);cursor:pointer}._checkbox_ktju1_8 svg{display:none}._checkbox_ktju1_8 svg path{fill:var(--white)}._label_ktju1_27{padding-top:var(--space-2xs)}._enabled_ktju1_31{background-color:var(--sapphire-100)}._enabled_ktju1_31 svg{display:block}
@@ -1 +1 @@
1
- ._drawer_1atax_3{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;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_1atax_3::-webkit-scrollbar{width:3px}._drawer_1atax_3::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._drawer_1atax_3::-webkit-scrollbar-track{background-color:var(--white)}._drawer_1atax_3 ._content_1atax_27{position:relative;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_1atax_3 ._content_1atax_27{--drawer-width: 100%;padding:var(--space-m)}}._drawer_1atax_3 ._content_1atax_27._is-loading_1atax_41{align-items:center;justify-content:center}._drawer_1atax_3 ._header_1atax_45{display:flex;gap:var(--space-xs);min-height:68px}._drawer_1atax_3 ._header_1atax_45:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_1atax_3 ._header_1atax_45._sticky-header_1atax_53{position:-webkit-sticky;position:sticky;top:0;left:0;background-color:var(--black-5)}._drawer_1atax_3 ._header_1atax_45 ._title_1atax_59{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_1atax_3 ._header_1atax_45 ._title_1atax_59{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_1atax_3 ._header_1atax_45 ._space_1atax_73{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_1atax_3 ._header_1atax_45{min-height:55px}._drawer_1atax_3 ._header_1atax_45:not(:last-child){margin-bottom:var(--space-m)}}._drawer_1atax_3 ._inner_1atax_84{flex:1}._drawer_1atax_3 ._button_1atax_87{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_1atax_3 ._footer_1atax_92{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_1atax_3 ._footer_1atax_92{padding-top:var(--space-m)}}._drawer_1atax_3 ._footer-button_1atax_101{display:block;margin-left:auto}._drawer_1atax_3._left_1atax_105{top:0;left:-100%}._drawer_1atax_3._right_1atax_109{top:0;right:-100%}._drawer_1atax_3._full_1atax_113{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_1atax_3._bottom_1atax_123{--drawer-width: calc(100% - var(--space-m));right:50%;bottom:-100%;left:50%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:calc(100% - var(--space-xs));border-top-left-radius:var(--control-radius);border-top-right-radius:var(--control-radius);transform:translate(-50%)}._drawer_1atax_3._bottom_1atax_123._full-bottom-height_1atax_134{height:calc(100% - var(--space-xs))}._drawer_1atax_3._bottom_1atax_123._is-loading_1atax_41{height:50vh}._drawer_1atax_3._opened_1atax_140{transition:all .3s ease;pointer-events:auto}._drawer_1atax_3._opened_1atax_140._left_1atax_105{left:0%;transition:left .3s ease}._drawer_1atax_3._opened_1atax_140._right_1atax_109{right:0%;transition:right .3s ease}._drawer_1atax_3._opened_1atax_140._bottom_1atax_123{bottom:0%}._drawer_1atax_3._opened_1atax_140._full_1atax_113{transform:scale(1);opacity:1}._drawer_1atax_3._is-closing_1atax_159._left_1atax_105{left:-100%}._drawer_1atax_3._is-closing_1atax_159._right_1atax_109{right:-100%}._drawer_1atax_3._is-closing_1atax_159._bottom_1atax_123{bottom:-100%}._drawer_1atax_3._is-closing_1atax_159._full_1atax_113{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_1atax_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_1atax_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_1atax_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_1atax_3{--drawer-width: 100%}._drawer_1atax_3._bottom_1atax_123{--drawer-width: calc(100% - var(--space-xs))}}._overlay_1atax_196{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_1atax_196._opened_1atax_140{opacity:1;transition:all .3s ease}._overlay_1atax_196._is-closing_1atax_159{opacity:0;transition:all .3s ease}
1
+ ._drawer_91s5k_3{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;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_91s5k_3::-webkit-scrollbar{width:3px}._drawer_91s5k_3::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._drawer_91s5k_3::-webkit-scrollbar-track{background-color:var(--white)}._drawer_91s5k_3 ._content_91s5k_27{position:relative;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_91s5k_3 ._content_91s5k_27{--drawer-width: 100%;padding:var(--space-m)}}._drawer_91s5k_3 ._content_91s5k_27._is-loading_91s5k_41{align-items:center;justify-content:center}._drawer_91s5k_3 ._header_91s5k_45{display:flex;gap:var(--space-xs);min-height:68px}._drawer_91s5k_3 ._header_91s5k_45:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_91s5k_3 ._header_91s5k_45._sticky-header_91s5k_53{position:-webkit-sticky;position:sticky;top:0;left:0;background-color:var(--black-5)}._drawer_91s5k_3 ._header_91s5k_45 ._title_91s5k_59{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_91s5k_3 ._header_91s5k_45 ._title_91s5k_59{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_91s5k_3 ._header_91s5k_45 ._space_91s5k_73{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_91s5k_3 ._header_91s5k_45{min-height:55px}._drawer_91s5k_3 ._header_91s5k_45:not(:last-child){margin-bottom:var(--space-m)}}._drawer_91s5k_3 ._inner_91s5k_84{flex:1}._drawer_91s5k_3 ._button_91s5k_87{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_91s5k_3 ._footer_91s5k_92{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_91s5k_3 ._footer_91s5k_92{padding-top:var(--space-m)}}._drawer_91s5k_3 ._footer-button_91s5k_101{display:block;margin-left:auto}._drawer_91s5k_3._left_91s5k_105{top:0;left:-100%}._drawer_91s5k_3._right_91s5k_109{top:0;right:-100%}._drawer_91s5k_3._full_91s5k_113{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_91s5k_3._bottom_91s5k_123{--drawer-width: calc(100% - var(--space-m));right:50%;bottom:-100%;left:50%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:calc(100% - var(--space-xs));border-top-left-radius:var(--control-radius);border-top-right-radius:var(--control-radius);transform:translate(-50%)}._drawer_91s5k_3._bottom_91s5k_123._full-bottom-height_91s5k_134{height:calc(100% - var(--space-xs))}._drawer_91s5k_3._bottom_91s5k_123._is-loading_91s5k_41{height:50vh}._drawer_91s5k_3._opened_91s5k_140{transition:all .3s ease;pointer-events:auto}._drawer_91s5k_3._opened_91s5k_140._left_91s5k_105{left:0%;transition:left .3s ease}._drawer_91s5k_3._opened_91s5k_140._right_91s5k_109{right:0%;transition:right .3s ease}._drawer_91s5k_3._opened_91s5k_140._bottom_91s5k_123{bottom:0%}._drawer_91s5k_3._opened_91s5k_140._full_91s5k_113{transform:scale(1);opacity:1}._drawer_91s5k_3._is-closing_91s5k_159._left_91s5k_105{left:-100%}._drawer_91s5k_3._is-closing_91s5k_159._right_91s5k_109{right:-100%}._drawer_91s5k_3._is-closing_91s5k_159._bottom_91s5k_123{bottom:-100%}._drawer_91s5k_3._is-closing_91s5k_159._full_91s5k_113{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_91s5k_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_91s5k_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_91s5k_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_91s5k_3{--drawer-width: 100%}._drawer_91s5k_3._bottom_91s5k_123{--drawer-width: calc(100% - var(--space-xs))}}._overlay_91s5k_196{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_91s5k_196._opened_91s5k_140{opacity:1;transition:all .3s ease}._overlay_91s5k_196._opened_91s5k_140._unmount_91s5k_212{z-index:var(--overlay-z-index);-webkit-appearance:none;-moz-appearance:none;appearance:none}._overlay_91s5k_196._is-closing_91s5k_159{opacity:0;transition:all .3s ease}._overlay_91s5k_196._unmount_91s5k_212{z-index:-1;-webkit-appearance:none;-moz-appearance:none;appearance:none}
@@ -0,0 +1 @@
1
+ ._file-info_exvu6_2{display:flex;flex-direction:column;gap:var(--space-xs);overflow:hidden}._file-info_exvu6_2 ._file-info-size_exvu6_8{color:var(--disabled-color);font-weight:var(--font-weight-text-regular);font-size:var(--size-text-m);font-family:var(--font-inter),sans-serif;line-height:var(--line-height-text-xxs);text-align:left}._file-info_exvu6_2 ._file-info-name-wrapper_exvu6_16{display:table;width:100%;table-layout:fixed}._file-info_exvu6_2 ._file-info-name-wrapper_exvu6_16 ._file-info-name_exvu6_16{display:table-cell;overflow:hidden;color:var(--black-100);font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l2);font-family:var(--font-inter),sans-serif;line-height:var(--line-height-text-xl);white-space:nowrap;text-align:left;text-overflow:ellipsis}._file-upload-container_exvu6_34{display:flex;flex-direction:column;gap:var(--space-xs);width:100%;margin-bottom:0;padding-left:0}._file-upload-container_exvu6_34 ._file-upload-container-item_exvu6_42{position:relative;display:flex;align-items:center;justify-content:space-between;padding:var(--space-xs) var(--space-m);background:var(--white);border-radius:var(--control-radius)}._file-upload-container_exvu6_34 ._file-upload-container-item_exvu6_42 ._delete-button_exvu6_51{position:absolute;top:var(--space-2xs);right:var(--space-2xs);background:var(--black-5)}
@@ -1 +1 @@
1
- ._list-photos_19pfh_2{display:flex;gap:var(--space-m);overflow-x:auto}._list-photos_19pfh_2::-webkit-scrollbar{display:none}._list-photos_19pfh_2 li{position:relative;flex-shrink:0;width:64px;height:64px;overflow:hidden;border-radius:var(--control-radius);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703}._list-photos_19pfh_2 img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}._list-photos_19pfh_2 button{position:absolute;top:4px;right:4px}
1
+ ._list-photos_1m1u4_2{display:flex;gap:var(--space-m);overflow-x:auto}._list-photos_1m1u4_2::-webkit-scrollbar{display:none}._list-photos_1m1u4_2 ._list-photos-item_1m1u4_10{position:relative;flex-shrink:0;width:var(--space-4xxl);height:var(--space-4xxl);overflow:hidden;border-radius:var(--control-radius);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703}._list-photos_1m1u4_2 ._list-photos-image_1m1u4_19{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}._list-photos_1m1u4_2 ._delete-button_1m1u4_24{position:absolute;top:var(--space-2xs);right:var(--space-2xs)}
@@ -1 +1 @@
1
- ._upload-file__wrapper_165vi_2{position:relative;width:100%}._upload-file__wrapper_165vi_2 label{display:flex;flex-direction:column;gap:var(--space-m);align-items:center;justify-content:center}._upload-file__wrapper_165vi_2 label button{z-index:1}._upload-file__wrapper_165vi_2 label b{color:var(--black-100);font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l2);font-family:var(--font-inter);font-style:normal;line-height:130%;text-align:center}._upload-file__wrapper_165vi_2 label ._upload-text_165vi_25{color:var(--disabled-color);font-weight:var(--font-weight-text-regular);font-size:var(--size-text-m);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-xxs);text-align:center}._upload-file-input_165vi_35{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;opacity:0}
1
+ ._upload-file-wrapper_n3hxs_2{position:relative;width:100%}._upload-file-wrapper_n3hxs_2 label{display:flex;flex-direction:column;gap:var(--space-m);align-items:center;justify-content:center}._upload-file-wrapper_n3hxs_2 label button{z-index:1}._upload-file-wrapper_n3hxs_2 label b{color:var(--black-100);font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l2);font-family:var(--font-inter);font-style:normal;line-height:130%;text-align:center}._upload-file-wrapper_n3hxs_2 label ._upload-text_n3hxs_25{color:var(--disabled-color);font-weight:var(--font-weight-text-regular);font-size:var(--size-text-m);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-xxs);text-align:center}._upload-file-input_n3hxs_35{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;opacity:0}
@@ -1 +1 @@
1
- ._upload-file__wrapper_17bcu_2{display:flex;flex-direction:column;gap:var(--space-m);overflow:hidden}
1
+ ._upload-file-wrapper_2zki8_2{display:flex;flex-direction:column;gap:var(--space-m);overflow:hidden}
@@ -1,10 +1,10 @@
1
1
  import { CheckboxProps } from '@headlessui/react';
2
2
  import { ReactNode } from 'react';
3
3
 
4
- export type TSwitchProps = CheckboxProps & {
4
+ export type TCheckboxMimirProps = CheckboxProps & {
5
5
  children?: ReactNode;
6
6
  };
7
- export declare const Switch: import('react').ForwardRefExoticComponent<{
7
+ export declare const CheckboxMimir: import('react').ForwardRefExoticComponent<{
8
8
  suppressHydrationWarning?: boolean | undefined;
9
9
  color?: string | undefined;
10
10
  id?: string | undefined;
@@ -6,7 +6,7 @@ import { u, a, l, T, I, G, j, p as p$1, z, U, b as l$1, f, W as W$1, K } from ".
6
6
  import { r } from "../../bugs-CSBdWk0R.js";
7
7
  import { c as classNames } from "../../index-CweZ_OcN.js";
8
8
  import { Icon } from "../../icons/Icon.js";
9
- import '../../assets/Switch.css';let se = "span";
9
+ import '../../assets/CheckboxMimir.css';let se = "span";
10
10
  function ie(T$1, h) {
11
11
  let C = useId(), k = u(), x = a(), { id: g = k || `headlessui-checkbox-${C}`, disabled: e = x || false, autoFocus: s = false, checked: E, defaultChecked: v, onChange: P, name: d, value: D$1, form: R, indeterminate: n = false, ...A2 } = T$1, r$1 = l(v), [a$1, t] = T(E, P, r$1 != null ? r$1 : false), F = I(), K2 = G(), _ = p(), [p$2, c] = useState(false), u$1 = o(() => {
12
12
  c(true), t == null || t(!a$1), _.nextFrame(() => {
@@ -29,16 +29,17 @@ function L(d, l2) {
29
29
  return React__default.createElement(l$1, { value: e }, React__default.createElement(p2, { value: s }, React__default.createElement(a$1, { value: n }, React__default.createElement(f, { id: t }, H$1({ ourProps: { ref: l2, disabled: e || void 0, "aria-disabled": e || void 0 }, theirProps: { ...o2, children: React__default.createElement(W$1, null, typeof o2.children == "function" ? o2.children(i) : o2.children) }, slot: i, defaultTag: A, name: "Field" })))));
30
30
  }
31
31
  let H = W(L);
32
- const container = "_container_18cvn_2";
33
- const label = "_label_18cvn_27";
34
- const enabled = "_enabled_18cvn_31";
32
+ const container = "_container_ktju1_2";
33
+ const checkbox = "_checkbox_ktju1_8";
34
+ const label = "_label_ktju1_27";
35
+ const enabled = "_enabled_ktju1_31";
35
36
  const cls = {
36
37
  container,
37
- "switch": "_switch_18cvn_8",
38
+ checkbox,
38
39
  label,
39
40
  enabled
40
41
  };
41
- const Switch = forwardRef(
42
+ const CheckboxMimir = forwardRef(
42
43
  (props, ref) => {
43
44
  const { checked, onChange, children, id, ...restProps } = props;
44
45
  const [enabled2, setEnabled] = useState(checked);
@@ -57,7 +58,7 @@ const Switch = forwardRef(
57
58
  ref,
58
59
  checked: enabled2,
59
60
  onChange: handleChange,
60
- className: classNames(cls.switch, {
61
+ className: classNames(cls.checkbox, {
61
62
  [cls.enabled]: enabled2
62
63
  }),
63
64
  ...restProps,
@@ -69,5 +70,5 @@ const Switch = forwardRef(
69
70
  }
70
71
  );
71
72
  export {
72
- Switch
73
+ CheckboxMimir
73
74
  };
@@ -0,0 +1,2 @@
1
+ export { CheckboxMimir } from './CheckboxMimir';
2
+ export type { TCheckboxMimirProps } from './CheckboxMimir';
@@ -0,0 +1,4 @@
1
+ import { CheckboxMimir } from "./CheckboxMimir.js";
2
+ export {
3
+ CheckboxMimir
4
+ };
@@ -10,6 +10,10 @@ type TProps = {
10
10
  * Флаг отвечачающий за показ/скрытие.
11
11
  */
12
12
  isOpen?: boolean;
13
+ /**
14
+ * Флаг отвечачающий за то, должен ли компонент полность размонтироваться .
15
+ */
16
+ unmount?: boolean;
13
17
  /**
14
18
  * Настраиваемый паддинг для body, что бы избежать скачка контента при overflow: hidden
15
19
  */
@@ -48,5 +52,5 @@ type TProps = {
48
52
  /**
49
53
  * Компонент шторки, который может выезжать слева, справа или внизу.
50
54
  */
51
- export declare const Drawer: ({ isOpen, onClose, title, className, isLoading, stickyHeader, fullBottomHeight, position, paddingRight, footer, children }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
55
+ export declare const Drawer: ({ isOpen, onClose, title, className, unmount, isLoading, stickyHeader, fullBottomHeight, position, paddingRight, footer, children }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element | null;
52
56
  export {};
@@ -10,40 +10,42 @@ import { Button } from "../Button/Button.js";
10
10
  import { EButtonVariantDefault, EButtonSize } from "../Button/constants.js";
11
11
  import { Loader } from "../Loader/Loader.js";
12
12
  import { Portal } from "../Portal/Portal.js";
13
- import '../../assets/Drawer.css';const drawer = "_drawer_1atax_3";
14
- const content = "_content_1atax_27";
15
- const header = "_header_1atax_45";
16
- const title = "_title_1atax_59";
17
- const space = "_space_1atax_73";
18
- const inner = "_inner_1atax_84";
19
- const button = "_button_1atax_87";
20
- const footer = "_footer_1atax_92";
21
- const left = "_left_1atax_105";
22
- const right = "_right_1atax_109";
23
- const full = "_full_1atax_113";
24
- const bottom = "_bottom_1atax_123";
25
- const opened = "_opened_1atax_140";
26
- const overlay = "_overlay_1atax_196";
13
+ import '../../assets/Drawer.css';const drawer = "_drawer_91s5k_3";
14
+ const content = "_content_91s5k_27";
15
+ const header = "_header_91s5k_45";
16
+ const title = "_title_91s5k_59";
17
+ const space = "_space_91s5k_73";
18
+ const inner = "_inner_91s5k_84";
19
+ const button = "_button_91s5k_87";
20
+ const footer = "_footer_91s5k_92";
21
+ const left = "_left_91s5k_105";
22
+ const right = "_right_91s5k_109";
23
+ const full = "_full_91s5k_113";
24
+ const bottom = "_bottom_91s5k_123";
25
+ const opened = "_opened_91s5k_140";
26
+ const overlay = "_overlay_91s5k_196";
27
+ const unmount = "_unmount_91s5k_212";
27
28
  const cls = {
28
29
  drawer,
29
30
  content,
30
- "is-loading": "_is-loading_1atax_41",
31
+ "is-loading": "_is-loading_91s5k_41",
31
32
  header,
32
- "sticky-header": "_sticky-header_1atax_53",
33
+ "sticky-header": "_sticky-header_91s5k_53",
33
34
  title,
34
35
  space,
35
36
  inner,
36
37
  button,
37
38
  footer,
38
- "footer-button": "_footer-button_1atax_101",
39
+ "footer-button": "_footer-button_91s5k_101",
39
40
  left,
40
41
  right,
41
42
  full,
42
43
  bottom,
43
- "full-bottom-height": "_full-bottom-height_1atax_134",
44
+ "full-bottom-height": "_full-bottom-height_91s5k_134",
44
45
  opened,
45
- "is-closing": "_is-closing_1atax_159",
46
- overlay
46
+ "is-closing": "_is-closing_91s5k_159",
47
+ overlay,
48
+ unmount
47
49
  };
48
50
  const ANIMATION_DELAY = 300;
49
51
  const Drawer = ({
@@ -51,6 +53,7 @@ const Drawer = ({
51
53
  onClose,
52
54
  title: title2,
53
55
  className,
56
+ unmount: unmount2 = true,
54
57
  isLoading = false,
55
58
  stickyHeader,
56
59
  fullBottomHeight = false,
@@ -107,7 +110,7 @@ const Drawer = ({
107
110
  [cls["full-bottom-height"]]: fullBottomHeight,
108
111
  [cls["is-loading"]]: isLoading
109
112
  };
110
- if (!isOpen) {
113
+ if (!isOpen && unmount2) {
111
114
  return null;
112
115
  }
113
116
  return /* @__PURE__ */ jsxs(Portal, { children: [
@@ -163,7 +166,19 @@ const Drawer = ({
163
166
  )
164
167
  }
165
168
  ),
166
- /* @__PURE__ */ jsx("div", { className: classNames(cls.overlay, mods), onClick: handleClose })
169
+ /* @__PURE__ */ jsx(
170
+ "div",
171
+ {
172
+ className: classNames(
173
+ cls.overlay,
174
+ {
175
+ [cls.unmount]: !unmount2
176
+ },
177
+ mods
178
+ ),
179
+ onClick: handleClose
180
+ }
181
+ )
167
182
  ] });
168
183
  };
169
184
  export {
@@ -0,0 +1,26 @@
1
+ export type TListFiles = {
2
+ /**
3
+ * Массив фото
4
+ */
5
+ value: TFilesDetail[];
6
+ /**
7
+ * функция -callback, которая вызывается при изменении списка и передает обновленный список и deleteId,
8
+ */
9
+ onChange?: (e: TFileValue) => void;
10
+ };
11
+ export type TFileItem = {
12
+ id: number;
13
+ url: string;
14
+ };
15
+ export type TFileValue = {
16
+ deleteId?: number;
17
+ list: TFilesDetail[];
18
+ };
19
+ export type TFilesDetail = {
20
+ id: number;
21
+ url: string;
22
+ name: string;
23
+ size?: number;
24
+ type?: string;
25
+ };
26
+ export declare function ListFiles({ value, onChange }: TListFiles): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,47 @@
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { useState, useEffect } from "react";
3
+ import { formating } from "../../utils/index.js";
4
+ import { Button } from "../Button/Button.js";
5
+ import '../../assets/ListFiles.css';const cls = {
6
+ "file-info": "_file-info_exvu6_2",
7
+ "file-info-size": "_file-info-size_exvu6_8",
8
+ "file-info-name-wrapper": "_file-info-name-wrapper_exvu6_16",
9
+ "file-info-name": "_file-info-name_exvu6_16",
10
+ "file-upload-container": "_file-upload-container_exvu6_34",
11
+ "file-upload-container-item": "_file-upload-container-item_exvu6_42",
12
+ "delete-button": "_delete-button_exvu6_51"
13
+ };
14
+ function ListFiles({ value, onChange }) {
15
+ const [list, setList] = useState(value);
16
+ useEffect(() => {
17
+ setList(value);
18
+ }, [value]);
19
+ const onDelete = async (id) => {
20
+ const newList = [...list.filter((el) => el.id !== id)];
21
+ setList(newList);
22
+ onChange == null ? void 0 : onChange({ deleteId: id, list: newList });
23
+ };
24
+ return /* @__PURE__ */ jsx("ul", { className: cls["file-upload-container"], children: list.map((el, key) => /* @__PURE__ */ jsxs("li", { className: cls["file-upload-container-item"], children: [
25
+ /* @__PURE__ */ jsxs("div", { className: cls["file-info"], children: [
26
+ (el == null ? void 0 : el.size) && /* @__PURE__ */ jsxs("span", { className: cls["file-info-size"], children: [
27
+ " ",
28
+ formating.Size(el == null ? void 0 : el.size)
29
+ ] }),
30
+ /* @__PURE__ */ jsx("div", { className: cls["file-info-name-wrapper"], children: /* @__PURE__ */ jsx("div", { className: cls["file-info-name"], children: el.name }) })
31
+ ] }),
32
+ /* @__PURE__ */ jsx(
33
+ Button,
34
+ {
35
+ isIconButton: true,
36
+ iconName: "Close12px",
37
+ size: "m-s",
38
+ variant: "secondary-gray",
39
+ className: cls["delete-button"],
40
+ onClick: () => onDelete(el.id)
41
+ }
42
+ )
43
+ ] }, key)) });
44
+ }
45
+ export {
46
+ ListFiles
47
+ };
@@ -0,0 +1,3 @@
1
+ import { TFilesDetail } from './ListFiles';
2
+
3
+ export declare const photos: TFilesDetail[];
@@ -0,0 +1,33 @@
1
+ const photos = [
2
+ {
3
+ id: 111,
4
+ name: "ООО “КИЗ-СТРОЙ” - Свидетельство о регистрации (06.12.2003).xls",
5
+ url: "https://i.pinimg.com/736x/5a/e6/12/5ae612a7ecf50870c8f41961fefc332f.jpg",
6
+ size: 1024,
7
+ type: "image/png"
8
+ },
9
+ {
10
+ id: 112,
11
+ name: "ООО “КИЗ-СТРОЙ” - Доверенность (20.10.2005).xls",
12
+ url: "https://i1.sndcdn.com/artworks-rQAPPfrs44UvRwIz-WJkvyQ-t500x500.jpg",
13
+ size: 1024,
14
+ type: "image/png"
15
+ },
16
+ {
17
+ id: 113,
18
+ name: "Скан паспорта.pdf",
19
+ url: "https://i1.sndcdn.com/avatars-000095020320-0pmjnu-t500x500.jpg",
20
+ size: 2064,
21
+ type: "image/png"
22
+ },
23
+ {
24
+ id: 114,
25
+ name: "Прочие документы.xls",
26
+ url: "https://i1.sndcdn.com/avatars-000151937348-27m28p-t500x500.jpg",
27
+ size: 1024,
28
+ type: "image/png"
29
+ }
30
+ ];
31
+ export {
32
+ photos
33
+ };
@@ -0,0 +1,2 @@
1
+ export { ListFiles } from './ListFiles';
2
+ export type { ListFiles as TListFiles } from './ListFiles';
@@ -0,0 +1,4 @@
1
+ import { ListFiles } from "./ListFiles.js";
2
+ export {
3
+ ListFiles
4
+ };
@@ -2,7 +2,10 @@ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { useState, useEffect } from "react";
3
3
  import { Button } from "../Button/Button.js";
4
4
  import '../../assets/ListPhotos.css';const cls = {
5
- "list-photos": "_list-photos_19pfh_2"
5
+ "list-photos": "_list-photos_1m1u4_2",
6
+ "list-photos-item": "_list-photos-item_1m1u4_10",
7
+ "list-photos-image": "_list-photos-image_1m1u4_19",
8
+ "delete-button": "_delete-button_1m1u4_24"
6
9
  };
7
10
  function ListPhotos({ value, onChange }) {
8
11
  const [list, setList] = useState(value);
@@ -14,8 +17,8 @@ function ListPhotos({ value, onChange }) {
14
17
  setList(newList);
15
18
  onChange == null ? void 0 : onChange({ deleteId: id, list: newList });
16
19
  };
17
- return /* @__PURE__ */ jsx("ul", { className: cls["list-photos"], children: list.map((el) => /* @__PURE__ */ jsxs("li", { children: [
18
- /* @__PURE__ */ jsx("img", { src: el.url, alt: "" }),
20
+ return /* @__PURE__ */ jsx("ul", { className: cls["list-photos"], children: list.map((el) => /* @__PURE__ */ jsxs("li", { className: cls["list-photos-item"], children: [
21
+ /* @__PURE__ */ jsx("img", { className: cls["list-photos-image"], src: el.url, alt: "" }),
19
22
  onChange && /* @__PURE__ */ jsx(
20
23
  Button,
21
24
  {
@@ -23,6 +26,7 @@ function ListPhotos({ value, onChange }) {
23
26
  iconName: "Close12px",
24
27
  size: "m-s",
25
28
  variant: "secondary-gray",
29
+ className: cls["delete-button"],
26
30
  onClick: () => onDelete(el.id)
27
31
  }
28
32
  )
@@ -3,9 +3,9 @@ import { forwardRef, useRef, useId } from "react";
3
3
  import { Icon } from "../../icons/Icon.js";
4
4
  import { Button } from "../Button/Button.js";
5
5
  import '../../assets/Uploader.css';const cls = {
6
- "upload-file__wrapper": "_upload-file__wrapper_165vi_2",
7
- "upload-text": "_upload-text_165vi_25",
8
- "upload-file-input": "_upload-file-input_165vi_35"
6
+ "upload-file-wrapper": "_upload-file-wrapper_n3hxs_2",
7
+ "upload-text": "_upload-text_n3hxs_25",
8
+ "upload-file-input": "_upload-file-input_n3hxs_35"
9
9
  };
10
10
  const MIME = {
11
11
  jpeg: "image/jpeg",
@@ -52,7 +52,7 @@ const Uploader = forwardRef(
52
52
  var _a;
53
53
  (_a = uploaderRef.current) == null ? void 0 : _a.click();
54
54
  };
55
- return /* @__PURE__ */ jsxs("div", { className: cls["upload-file__wrapper"], ref, children: [
55
+ return /* @__PURE__ */ jsxs("div", { className: cls["upload-file-wrapper"], ref, children: [
56
56
  /* @__PURE__ */ jsx(
57
57
  "input",
58
58
  {
@@ -0,0 +1,38 @@
1
+ import { TFilesDetail } from '../ListFiles/ListFiles';
2
+ import { imageTypesArr } from '../Uploader/constants';
3
+ import { TFileItem } from '../Uploader/Uploader';
4
+
5
+ export type TUploaderFiles = {
6
+ /**
7
+ * Массив разрешенных типов файлов для настройки валидации
8
+ * 'jpeg' | 'jpg' | 'png' | 'tiff' | 'gif' | 'doc' | 'xls' | 'pdf' |'docx' | 'txt'
9
+ */
10
+ filesType: imageTypesArr[];
11
+ /**
12
+ * Наименование передаваемого массива файлов
13
+ */
14
+ arrayName: string;
15
+ /**
16
+ * Максимальный размер файлов.
17
+ */
18
+ maxSize: number;
19
+ /**
20
+ * Функция обратного вызова, передает параметры type и data,
21
+ * type 'add' в data передает массив файлов,
22
+ * type:'delete' в data передает id удаленного файла
23
+ */
24
+ onChange: (j: TOnChangeFilesUpdate) => void;
25
+ /**
26
+ * Передаваемые файлы.
27
+ */
28
+ value?: TFilesDetail[];
29
+ /**
30
+ * Максимальное количество файлов.
31
+ */
32
+ maxFiles: number;
33
+ };
34
+ export type TOnChangeFilesUpdate = {
35
+ type: string;
36
+ data: TFileItem[] | number;
37
+ };
38
+ export declare const UploaderFiles: import('react').ForwardRefExoticComponent<TUploaderFiles & import('react').RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,68 @@
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
+ import { c as classNames } from "../../index-CweZ_OcN.js";
3
+ import { forwardRef, useState, useEffect } from "react";
4
+ import { ListFiles } from "../ListFiles/ListFiles.js";
5
+ import { Uploader } from "../Uploader/Uploader.js";
6
+ import '../../assets/UploaderPhotos.css';const cls = {
7
+ "upload-file-wrapper": "_upload-file-wrapper_2zki8_2"
8
+ };
9
+ const UploaderFiles = forwardRef(
10
+ (props, ref) => {
11
+ const { filesType, arrayName, maxSize, onChange, value, maxFiles } = props;
12
+ const [files, setFiles] = useState(value || []);
13
+ const isMaxFilesReached = files.length >= maxFiles;
14
+ useEffect(() => {
15
+ if (value) {
16
+ setFiles(value);
17
+ }
18
+ }, [value]);
19
+ const onChangeValue = (e) => {
20
+ const newFiles = [
21
+ ...files,
22
+ ...e.value.map((el) => {
23
+ var _a, _b, _c;
24
+ return {
25
+ id: el.id,
26
+ url: "",
27
+ size: (_a = el == null ? void 0 : el.file) == null ? void 0 : _a.size,
28
+ name: (_b = el == null ? void 0 : el.file) == null ? void 0 : _b.name,
29
+ type: (_c = el == null ? void 0 : el.file) == null ? void 0 : _c.type
30
+ };
31
+ })
32
+ ];
33
+ setFiles(newFiles);
34
+ onChange == null ? void 0 : onChange({ type: "add", data: e.value });
35
+ };
36
+ const onDelete = (j) => {
37
+ setFiles(j.list);
38
+ if (j.deleteId) onChange == null ? void 0 : onChange({ type: "delete", data: j.deleteId });
39
+ };
40
+ return /* @__PURE__ */ jsxs(
41
+ "div",
42
+ {
43
+ className: classNames(
44
+ cls["upload-file-wrapper"],
45
+ isMaxFilesReached && cls.disabled
46
+ ),
47
+ children: [
48
+ /* @__PURE__ */ jsx(
49
+ Uploader,
50
+ {
51
+ filesType,
52
+ arrayName,
53
+ maxSize,
54
+ onChangeValue,
55
+ ref,
56
+ maxFiles,
57
+ isDisabled: isMaxFilesReached
58
+ }
59
+ ),
60
+ /* @__PURE__ */ jsx(ListFiles, { value: files, onChange: onDelete })
61
+ ]
62
+ }
63
+ );
64
+ }
65
+ );
66
+ export {
67
+ UploaderFiles
68
+ };
@@ -0,0 +1,2 @@
1
+ export { UploaderFiles } from './UploaderFiles';
2
+ export type { TUploaderFiles, TOnChangeFilesUpdate } from './UploaderFiles';
@@ -0,0 +1,4 @@
1
+ import { UploaderFiles } from "./UploaderFiles.js";
2
+ export {
3
+ UploaderFiles
4
+ };
@@ -4,7 +4,7 @@ import { forwardRef, useState, useEffect } from "react";
4
4
  import { ListPhotos } from "../ListPhotos/ListPhotos.js";
5
5
  import { Uploader } from "../Uploader/Uploader.js";
6
6
  import '../../assets/UploaderPhotos.css';const cls = {
7
- "upload-file__wrapper": "_upload-file__wrapper_17bcu_2"
7
+ "upload-file-wrapper": "_upload-file-wrapper_2zki8_2"
8
8
  };
9
9
  const UploaderPhotos = forwardRef(
10
10
  (props, ref) => {
@@ -43,7 +43,7 @@ const UploaderPhotos = forwardRef(
43
43
  "div",
44
44
  {
45
45
  className: classNames(
46
- cls["upload-file__wrapper"],
46
+ cls["upload-file-wrapper"],
47
47
  isMaxFilesReached && cls.disabled
48
48
  ),
49
49
  children: [
@@ -23,8 +23,8 @@ export { Steps, EStepsSize, EStepColor, type TCommonStepsProps } from './Steps';
23
23
  export { Vote, EVoteSize, type TCommonVoteProps, type TProps } from './Vote';
24
24
  export { SelectSearch, ESelectSearchSize } from './SelectSearch';
25
25
  export type { TSelectSearchProps, TSelectOption } from './SelectSearch';
26
- export { Switch } from './Switch';
27
- export type { TSwitchProps } from './Switch';
26
+ export { CheckboxMimir } from './CheckboxMimir';
27
+ export type { TCheckboxMimirProps } from './CheckboxMimir';
28
28
  export { Tag, ETagSize, ETagType } from './Tag';
29
29
  export { Timer } from './Timer';
30
30
  export { Accordion, AccordionItem, EAccordionSize } from './Accordion';
@@ -22,7 +22,7 @@ import { Vote } from "./Vote/Vote.js";
22
22
  import { EVoteSize } from "./Vote/constants.js";
23
23
  import { SelectSearch } from "./SelectSearch/SelectSearch.js";
24
24
  import { ESelectSearchSize } from "./SelectSearch/constants.js";
25
- import { Switch } from "./Switch/Switch.js";
25
+ import { CheckboxMimir } from "./CheckboxMimir/CheckboxMimir.js";
26
26
  import { Tag } from "./Tag/Tag.js";
27
27
  import { ETagSize, ETagType } from "./Tag/constants.js";
28
28
  import { Timer } from "./Timer/Timer.js";
@@ -47,6 +47,7 @@ export {
47
47
  Accordion,
48
48
  AccordionItem,
49
49
  Button,
50
+ CheckboxMimir,
50
51
  Chip,
51
52
  DatePicker,
52
53
  Drawer,
@@ -89,7 +90,6 @@ export {
89
90
  SelectSearch,
90
91
  Slider,
91
92
  Steps,
92
- Switch,
93
93
  TabTrail,
94
94
  Tag,
95
95
  TextArea,
package/dist/index.js CHANGED
@@ -22,7 +22,7 @@ import { Vote } from "./components/Vote/Vote.js";
22
22
  import { EVoteSize } from "./components/Vote/constants.js";
23
23
  import { SelectSearch } from "./components/SelectSearch/SelectSearch.js";
24
24
  import { ESelectSearchSize } from "./components/SelectSearch/constants.js";
25
- import { Switch } from "./components/Switch/Switch.js";
25
+ import { CheckboxMimir } from "./components/CheckboxMimir/CheckboxMimir.js";
26
26
  import { Tag } from "./components/Tag/Tag.js";
27
27
  import { ETagSize, ETagType } from "./components/Tag/constants.js";
28
28
  import { Timer } from "./components/Timer/Timer.js";
@@ -57,6 +57,7 @@ import './assets/index.css';export {
57
57
  Accordion,
58
58
  AccordionItem,
59
59
  Button,
60
+ CheckboxMimir,
60
61
  Chip,
61
62
  DatePicker,
62
63
  Drawer,
@@ -102,7 +103,6 @@ import './assets/index.css';export {
102
103
  SelectSearch,
103
104
  Slider,
104
105
  Steps,
105
- Switch,
106
106
  TabTrail,
107
107
  Tag,
108
108
  TextArea,
@@ -0,0 +1 @@
1
+ export default function Size(size: number): string;
@@ -0,0 +1,15 @@
1
+ function Size(size) {
2
+ if (!size) return "";
3
+ let i = -1;
4
+ const b = [" Kb", " Mb", " Gb", " Tb", "Pb", "Eb", "Zb", "Yb"];
5
+ const sistemParams = 1024;
6
+ const maxValue = 0.1;
7
+ do {
8
+ size /= sistemParams;
9
+ i += 1;
10
+ } while (size > sistemParams);
11
+ return Math.max(size, maxValue).toFixed(1) + b[i];
12
+ }
13
+ export {
14
+ Size as default
15
+ };
@@ -1,4 +1,5 @@
1
1
  import { default as Date } from './formating/Date';
2
+ import { default as Size } from './formating/FileSize';
2
3
  import { default as Month } from './formating/Month';
3
4
  import { default as Number } from './formating/Numbers';
4
5
  import { default as UUIDv4 } from './UUID4';
@@ -8,4 +9,5 @@ export declare const formating: {
8
9
  Month: typeof Month;
9
10
  Date: typeof Date;
10
11
  UUIDv4: typeof UUIDv4;
12
+ Size: typeof Size;
11
13
  };
@@ -1,4 +1,5 @@
1
1
  import _Date from "./formating/Date.js";
2
+ import Size from "./formating/FileSize.js";
2
3
  import Month from "./formating/Month.js";
3
4
  import Numbers from "./formating/Numbers.js";
4
5
  import UUIDv4 from "./UUID4.js";
@@ -6,7 +7,8 @@ const formating = {
6
7
  Number: Numbers,
7
8
  Month,
8
9
  Date: _Date,
9
- UUIDv4
10
+ UUIDv4,
11
+ Size
10
12
  };
11
13
  export {
12
14
  formating
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mimir-ui-kit",
3
3
  "private": false,
4
- "version": "1.24.2",
4
+ "version": "1.24.4",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {
@@ -1 +0,0 @@
1
- ._container_18cvn_2{display:flex;gap:var(--space-xs);align-items:flex-start}._switch_18cvn_8{position:relative;display:inline-block;flex-shrink:0;width:24px;height:24px;padding:var(--space-2xs);vertical-align:middle;background-color:var(--sapphire-20);border-radius:var(--control-radius-xs);cursor:pointer}._switch_18cvn_8 svg{display:none}._switch_18cvn_8 svg path{fill:var(--white)}._label_18cvn_27{padding-top:var(--space-2xs)}._enabled_18cvn_31{background-color:var(--sapphire-100)}._enabled_18cvn_31 svg{display:block}
@@ -1,2 +0,0 @@
1
- export { Switch } from './Switch';
2
- export type { TSwitchProps } from './Switch';
@@ -1,4 +0,0 @@
1
- import { Switch } from "./Switch.js";
2
- export {
3
- Switch
4
- };