mimir-ui-kit 1.34.6 → 1.34.8
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{ProgressBar-C0dC7o7N.js → ProgressBar-DEFs1tWq.js} +3 -3
- package/dist/assets/ListPhotos.css +1 -1
- package/dist/components/Drawer/Drawer.js +15 -15
- package/dist/components/InputPassword/InputPassword.js +28 -26
- package/dist/components/ListPhotos/ListPhotos.js +12 -12
- package/dist/components/OtpInput/OtpInput.js +21 -15
- package/dist/components/SelectSearch/SelectSearch.d.ts +1 -0
- package/dist/components/SelectSearch/SelectSearch.js +531 -503
- package/dist/components/SelectSearch/types.d.ts +2 -0
- package/dist/components/Skeleton/SkeletonBrick/SkeletonBrick.js +14 -13
- package/dist/components/Skeleton/SkeletonCircle/SkeletonCircle.js +2 -1
- package/dist/components/Skeleton/SkeletonText/SkeletonText.js +26 -17
- package/dist/components/Slider/Slider.js +8 -1
- package/dist/components/Steps/Steps.js +10 -9
- package/dist/components/TextArea/TextArea.js +23 -23
- package/dist/components/Toasts/ProgressBar.js +1 -1
- package/dist/components/Toasts/Toast.js +1 -1
- package/dist/components/Toasts/ToastList.js +20 -19
- package/dist/components/Toasts/ToastsProvider.js +1 -1
- package/dist/components/UniversalUploader/UniversalUploader.d.ts +7 -2
- package/dist/components/UniversalUploader/UniversalUploader.js +65 -43
- package/dist/components/UniversalUploader/types.d.ts +2 -9
- package/dist/components/Uploader/Uploader.d.ts +13 -0
- package/dist/components/Uploader/Uploader.js +45 -39
- package/dist/components/UploaderFiles/UploaderFiles.d.ts +4 -0
- package/dist/components/UploaderFiles/UploaderFiles.js +17 -16
- package/dist/components/UploaderPhotos/UploaderPhotos.d.ts +1 -0
- package/dist/components/UploaderPhotos/UploaderPhotos.js +17 -15
- package/package.json +1 -1
@@ -33,14 +33,14 @@ import './assets/ProgressBar.css';const f = "_title_1z0br_37", g = "_timer_1z0br
|
|
33
33
|
}) => {
|
34
34
|
const t = n(), r = n(null);
|
35
35
|
return p(() => {
|
36
|
-
const
|
37
|
-
const
|
36
|
+
const i = Date.now(), o = () => {
|
37
|
+
const m = Date.now() - i, _ = Math.min(m / s * 100, 100);
|
38
38
|
r.current && (r.current.style.width = `${_}%`), _ < 100 && (t.current = requestAnimationFrame(o));
|
39
39
|
};
|
40
40
|
return t.current = requestAnimationFrame(o), () => {
|
41
41
|
t.current && cancelAnimationFrame(t.current);
|
42
42
|
};
|
43
|
-
}, [s]), /* @__PURE__ */ a("div", { className: e.progress, children: /* @__PURE__ */ a(
|
43
|
+
}, [s]), /* @__PURE__ */ a("div", { className: e.progress, "data-testid": "progress-bar", children: /* @__PURE__ */ a(
|
44
44
|
"div",
|
45
45
|
{
|
46
46
|
ref: r,
|
@@ -1 +1 @@
|
|
1
|
-
._list-
|
1
|
+
._list-photos_167sp_2{display:flex;gap:var(--mimir-space-m);overflow-x:auto;padding-top:var(--mimir-space-m)}._list-photos_167sp_2::-webkit-scrollbar{display:none}._list-photos_167sp_2 ._list-photos-item_167sp_11{position:relative;flex-shrink:0;width:var(--mimir-space-4xxl);height:var(--mimir-space-4xxl);overflow:hidden;border-radius:var(--mimir-control-radius);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703}._list-photos_167sp_2 ._list-photos-image_167sp_20{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}._list-photos_167sp_2 ._delete-button_167sp_25{position:absolute;top:var(--mimir-space-2xs);right:var(--mimir-space-2xs)}
|
@@ -31,24 +31,24 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
|
|
31
31
|
"is-closing": "_is-closing_1xs4d_159",
|
32
32
|
overlay: ne,
|
33
33
|
unmount: le
|
34
|
-
},
|
34
|
+
}, ie = 300, ge = ({
|
35
35
|
isOpen: r,
|
36
36
|
onClose: l,
|
37
37
|
title: N,
|
38
38
|
className: k,
|
39
39
|
unmount: f = !0,
|
40
|
-
isLoading:
|
40
|
+
isLoading: i = !1,
|
41
41
|
stickyHeader: B,
|
42
42
|
fullBottomHeight: E = !1,
|
43
|
-
position:
|
43
|
+
position: a = v.RIGHT,
|
44
44
|
paddingRight: M = 8,
|
45
45
|
footer: c,
|
46
|
-
children:
|
47
|
-
classNameInner:
|
46
|
+
children: S,
|
47
|
+
classNameInner: I,
|
48
48
|
classNameFooter: C
|
49
49
|
}) => {
|
50
50
|
const [L, h] = u(!1), [T, x] = u(!1), [D, p] = u(!1), y = X(), d = P(Q.XS1), { ref: z } = G({
|
51
|
-
enabled:
|
51
|
+
enabled: a === v.BOTTOM
|
52
52
|
});
|
53
53
|
F({
|
54
54
|
on: D,
|
@@ -57,7 +57,7 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
|
|
57
57
|
const o = g(() => {
|
58
58
|
l && (h(!0), p(!1), y.current = setTimeout(() => {
|
59
59
|
l(), h(!1);
|
60
|
-
},
|
60
|
+
}, ie));
|
61
61
|
}, [l]), _ = g(
|
62
62
|
(R) => {
|
63
63
|
R.key === "Escape" && o();
|
@@ -71,7 +71,7 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
|
|
71
71
|
[e.opened]: T,
|
72
72
|
[e["is-closing"]]: L,
|
73
73
|
[e["full-bottom-height"]]: E,
|
74
|
-
[e["is-loading"]]:
|
74
|
+
[e["is-loading"]]: i
|
75
75
|
};
|
76
76
|
return !r && f ? null : /* @__PURE__ */ m(O, { children: [
|
77
77
|
/* @__PURE__ */ t(
|
@@ -79,15 +79,15 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
|
|
79
79
|
{
|
80
80
|
"aria-hidden": !r,
|
81
81
|
role: "dialog",
|
82
|
-
className: s(e.drawer, e[
|
82
|
+
className: s(e.drawer, e[a], b, k),
|
83
83
|
children: /* @__PURE__ */ t(
|
84
84
|
"section",
|
85
85
|
{
|
86
86
|
ref: z,
|
87
|
-
className: s(e.content, e[
|
88
|
-
[e["is-loading"]]: !!
|
87
|
+
className: s(e.content, e[a], {
|
88
|
+
[e["is-loading"]]: !!i
|
89
89
|
}),
|
90
|
-
children:
|
90
|
+
children: i ? /* @__PURE__ */ t(K, {}) : /* @__PURE__ */ m(A, { children: [
|
91
91
|
/* @__PURE__ */ m(
|
92
92
|
"header",
|
93
93
|
{
|
@@ -110,7 +110,7 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
|
|
110
110
|
]
|
111
111
|
}
|
112
112
|
),
|
113
|
-
/* @__PURE__ */ t("div", { className: s(e.inner,
|
113
|
+
/* @__PURE__ */ t("div", { className: s(e.inner, I), children: S }),
|
114
114
|
/* @__PURE__ */ t("footer", { className: s(e.footer, C), children: typeof c == "function" ? c({ handleClose: o }) : c || /* @__PURE__ */ t(
|
115
115
|
w,
|
116
116
|
{
|
@@ -136,13 +136,13 @@ import '../../assets/Drawer.css';const V = "_drawer_1xs4d_3", W = "_content_1xs4
|
|
136
136
|
},
|
137
137
|
b
|
138
138
|
),
|
139
|
-
"data-
|
139
|
+
"data-testid": "drawer-overlay",
|
140
140
|
onClick: o
|
141
141
|
}
|
142
142
|
)
|
143
143
|
] });
|
144
144
|
};
|
145
145
|
export {
|
146
|
-
|
146
|
+
ie as ANIMATION_DELAY,
|
147
147
|
ge as Drawer
|
148
148
|
};
|
@@ -1,45 +1,47 @@
|
|
1
|
-
import { jsxs as
|
2
|
-
import { c
|
3
|
-
import { memo as
|
4
|
-
import { Icon as
|
5
|
-
import { Button as
|
6
|
-
import { I as
|
7
|
-
import '../../assets/InputPassword.css';const
|
8
|
-
input:
|
1
|
+
import { jsxs as i, jsx as s } from "react/jsx-runtime";
|
2
|
+
import { c } from "../../index-DIxK0V-G.js";
|
3
|
+
import { memo as w, forwardRef as u, useState as m } from "react";
|
4
|
+
import { Icon as d } from "../../icons/Icon.js";
|
5
|
+
import { Button as _ } from "../Button/Button.js";
|
6
|
+
import { I as l } from "../../Input-DGr0q5AJ.js";
|
7
|
+
import '../../assets/InputPassword.css';const b = "_input_7b9x2_2", x = "_wrapper_7b9x2_6", h = "_button_7b9x2_17", f = "_icon_7b9x2_33", N = "_show_7b9x2_38", t = {
|
8
|
+
input: b,
|
9
9
|
wrapper: x,
|
10
10
|
"input-wrapper": "_input-wrapper_7b9x2_13",
|
11
11
|
"button-wrapper": "_button-wrapper_7b9x2_17",
|
12
12
|
button: h,
|
13
13
|
icon: f,
|
14
14
|
show: N
|
15
|
-
},
|
16
|
-
|
17
|
-
({ size:
|
18
|
-
const [
|
19
|
-
return /* @__PURE__ */
|
20
|
-
/* @__PURE__ */
|
21
|
-
|
15
|
+
}, y = w(
|
16
|
+
u(
|
17
|
+
({ size: r, ...p }, a) => {
|
18
|
+
const [o, e] = m(!1), n = () => e(!o);
|
19
|
+
return /* @__PURE__ */ i("div", { className: t.wrapper, "data-testid": "input-password-wrapper", children: [
|
20
|
+
/* @__PURE__ */ s(
|
21
|
+
l,
|
22
22
|
{
|
23
23
|
ref: a,
|
24
24
|
className: t.input,
|
25
25
|
wrapperClassName: t["input-wrapper"],
|
26
|
-
size:
|
27
|
-
type:
|
26
|
+
size: r,
|
27
|
+
type: o ? "text" : "password",
|
28
|
+
"data-testid": "password-input",
|
28
29
|
...p
|
29
30
|
}
|
30
31
|
),
|
31
|
-
/* @__PURE__ */
|
32
|
-
|
32
|
+
/* @__PURE__ */ s("div", { className: t["button-wrapper"], children: /* @__PURE__ */ s(
|
33
|
+
_,
|
33
34
|
{
|
34
35
|
clear: !0,
|
35
36
|
type: "button",
|
36
37
|
className: t.button,
|
37
|
-
onClick:
|
38
|
-
|
39
|
-
|
38
|
+
onClick: n,
|
39
|
+
"data-testid": "eye-icon",
|
40
|
+
children: /* @__PURE__ */ s(
|
41
|
+
d,
|
40
42
|
{
|
41
|
-
className:
|
42
|
-
[t.show]:
|
43
|
+
className: c(t.icon, {
|
44
|
+
[t.show]: o
|
43
45
|
}),
|
44
46
|
iconName: "Eye24px"
|
45
47
|
}
|
@@ -50,7 +52,7 @@ import '../../assets/InputPassword.css';const d = "_input_7b9x2_2", x = "_wrappe
|
|
50
52
|
}
|
51
53
|
)
|
52
54
|
);
|
53
|
-
|
55
|
+
y.displayName = "InputPassword";
|
54
56
|
export {
|
55
|
-
|
57
|
+
y as InputPassword
|
56
58
|
};
|
@@ -1,32 +1,32 @@
|
|
1
1
|
import { jsx as e, jsxs as a } from "react/jsx-runtime";
|
2
2
|
import { useState as n, useEffect as _ } from "react";
|
3
|
-
import { Button as
|
3
|
+
import { Button as d } from "../Button/Button.js";
|
4
4
|
import '../../assets/ListPhotos.css';const o = {
|
5
|
-
"list-photos": "_list-
|
6
|
-
"list-photos-item": "_list-photos-
|
7
|
-
"list-photos-image": "_list-photos-
|
8
|
-
"delete-button": "_delete-
|
5
|
+
"list-photos": "_list-photos_167sp_2",
|
6
|
+
"list-photos-item": "_list-photos-item_167sp_11",
|
7
|
+
"list-photos-image": "_list-photos-image_167sp_20",
|
8
|
+
"delete-button": "_delete-button_167sp_25"
|
9
9
|
};
|
10
10
|
function N({ value: i, onChange: s }) {
|
11
|
-
const [l,
|
11
|
+
const [l, m] = n(i);
|
12
12
|
_(() => {
|
13
|
-
|
13
|
+
m(i);
|
14
14
|
}, [i]);
|
15
|
-
const
|
16
|
-
const
|
17
|
-
|
15
|
+
const p = async (t) => {
|
16
|
+
const c = [...l.filter((r) => r.id !== t)];
|
17
|
+
m(c), s == null || s({ deleteId: t, list: c });
|
18
18
|
};
|
19
19
|
return /* @__PURE__ */ e("ul", { className: o["list-photos"], children: l.map((t) => /* @__PURE__ */ a("li", { className: o["list-photos-item"], children: [
|
20
20
|
/* @__PURE__ */ e("img", { className: o["list-photos-image"], src: t.url, alt: "" }),
|
21
21
|
s && /* @__PURE__ */ e(
|
22
|
-
|
22
|
+
d,
|
23
23
|
{
|
24
24
|
isIconButton: !0,
|
25
25
|
iconName: "Close12px",
|
26
26
|
size: "m-s",
|
27
27
|
variant: "secondary-gray",
|
28
28
|
className: o["delete-button"],
|
29
|
-
onClick: () =>
|
29
|
+
onClick: () => p(t.id)
|
30
30
|
}
|
31
31
|
)
|
32
32
|
] }, t.id)) });
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import { jsx as
|
1
|
+
import { jsx as n, jsxs as g } from "react/jsx-runtime";
|
2
2
|
import { c as u } from "../../index-DIxK0V-G.js";
|
3
3
|
import { forwardRef as P, useImperativeHandle as R, Fragment as T } from "react";
|
4
4
|
import { ITEMS_PER_SEPARATOR as q, DEFAULT_VALUE_LENGTH as v } from "./constants.js";
|
5
5
|
import { useOTPInput as y } from "./hooks.js";
|
6
6
|
import { I as A } from "../../Input-DGr0q5AJ.js";
|
7
|
-
import '../../assets/OtpInput.css';const C = "_otp_1shq3_3", F = "_input_1shq3_14", L = "_separator_1shq3_28",
|
7
|
+
import '../../assets/OtpInput.css';const C = "_otp_1shq3_3", F = "_input_1shq3_14", L = "_separator_1shq3_28", r = {
|
8
8
|
otp: C,
|
9
9
|
"input-wrapper": "_input-wrapper_1shq3_14",
|
10
10
|
input: F,
|
@@ -17,43 +17,49 @@ import '../../assets/OtpInput.css';const C = "_otp_1shq3_3", F = "_input_1shq3_1
|
|
17
17
|
onChange: i,
|
18
18
|
className: h,
|
19
19
|
..._
|
20
|
-
},
|
20
|
+
}, d) => {
|
21
21
|
const {
|
22
|
-
data: { inputRefs:
|
23
|
-
handlers: { handleChange:
|
22
|
+
data: { inputRefs: s, valueItems: o },
|
23
|
+
handlers: { handleChange: f, handleFocus: I, handleKeyDown: w, handlePaste: N }
|
24
24
|
} = y({
|
25
25
|
onChange: i,
|
26
26
|
value: m,
|
27
27
|
valueLength: c
|
28
28
|
});
|
29
|
-
return R(
|
29
|
+
return R(d, () => ({
|
30
30
|
focus: () => {
|
31
31
|
var a;
|
32
|
-
(a =
|
32
|
+
(a = s.current[0]) == null || a.focus();
|
33
33
|
}
|
34
|
-
})), /* @__PURE__ */
|
35
|
-
const p = e + 1, E = l && p % q === 0 && p !==
|
34
|
+
})), /* @__PURE__ */ n("div", { className: u(r.otp, h), children: o.map((a, e) => {
|
35
|
+
const p = e + 1, E = l && p % q === 0 && p !== o.length;
|
36
36
|
return /* @__PURE__ */ g(T, { children: [
|
37
|
-
/* @__PURE__ */
|
37
|
+
/* @__PURE__ */ n(
|
38
38
|
A,
|
39
39
|
{
|
40
|
-
ref: (t) =>
|
40
|
+
ref: (t) => s.current[e] = t,
|
41
41
|
type: "text",
|
42
42
|
inputMode: "numeric",
|
43
43
|
autoComplete: "one-time-code",
|
44
44
|
pattern: "\\d{1}",
|
45
45
|
maxLength: 1,
|
46
46
|
value: a,
|
47
|
-
className:
|
48
|
-
wrapperClassName:
|
49
|
-
onChange: (t) =>
|
47
|
+
className: r.input,
|
48
|
+
wrapperClassName: r["input-wrapper"],
|
49
|
+
onChange: (t) => f(t, e),
|
50
50
|
onKeyDown: (t) => w(t, e),
|
51
51
|
onFocus: (t) => I(t, e),
|
52
52
|
onPaste: N,
|
53
53
|
..._
|
54
54
|
}
|
55
55
|
),
|
56
|
-
E && /* @__PURE__ */
|
56
|
+
E && /* @__PURE__ */ n(
|
57
|
+
"span",
|
58
|
+
{
|
59
|
+
className: u(r.separator),
|
60
|
+
"data-testid": "separator"
|
61
|
+
}
|
62
|
+
)
|
57
63
|
] }, e);
|
58
64
|
}) });
|
59
65
|
}
|
@@ -16,4 +16,5 @@ export declare const SelectSearch: import('react').ForwardRefExoticComponent<Pic
|
|
16
16
|
menuPlacement?: import('./types').TMenuPlacement;
|
17
17
|
disabled?: boolean;
|
18
18
|
searchProps?: Pick<import('../Input').TInputProps, "numbersOnly" | "maxLength">;
|
19
|
+
disableInput?: boolean;
|
19
20
|
} & import('react').RefAttributes<HTMLElement>>;
|