mimir-ui-kit 1.24.2 → 1.24.4

Sign up to get free protection for your applications and to get access to all the features.
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
- };