@hai-dev/ui-kit 1.2.2 → 1.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/error-upload-dialog.css +1 -1
- package/dist/assets/upload-dialog-errors.css +1 -1
- package/dist/components/code-input/code-input.js +112 -94
- package/dist/components/code-input/constants.d.ts +1 -0
- package/dist/components/code-input/constants.js +9 -8
- package/dist/components/photo-crop-uploader/components/error-upload-dialog/error-upload-dialog.js +43 -23
- package/dist/components/photo-crop-uploader/components/upload-dialog/upload-dialog-errors.js +3 -2
- package/dist/components/photo-crop-uploader/components/upload-dialog/upload-dialog.js +81 -80
- package/dist/components/photo-crop-uploader/constants.d.ts +2 -2
- package/dist/components/photo-crop-uploader/constants.js +1 -1
- package/dist/components/photo-crop-uploader/errors/photo-size.error.d.ts +1 -1
- package/dist/components/photo-crop-uploader/errors/photo-size.error.js +17 -12
- package/dist/components/photo-crop-uploader/locale.js +2 -2
- package/dist/components/photo-crop-uploader/photo-crop-uploader.js +35 -28
- package/dist/components/photo-crop-uploader/utils/read-photo.d.ts +1 -1
- package/dist/components/photo-crop-uploader/utils/read-photo.js +39 -39
- package/dist/raw-cross-BhC4FBfp.js +4 -0
- package/dist/upload-dialog-errors-BIwMA_MN.js +89 -0
- package/package.json +1 -1
- package/dist/upload-dialog-errors-B7V0G-Ey.js +0 -71
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._dialog_gqnoq_1{font-family:var(--font-inter, sans-serif);z-index:4250!important}._dialog_gqnoq_1._dark_gqnoq_5 .MuiPaper-root{background-color:#191b28;color:#fff}._dialog_gqnoq_1._dark_gqnoq_5 .MuiPaper-root ._dialogErrorText_gqnoq_9::-webkit-scrollbar{height:8px;width:8px}._dialog_gqnoq_1._dark_gqnoq_5 .MuiPaper-root ._dialogErrorText_gqnoq_9::-webkit-scrollbar-track{background:#070e1d;border-radius:16px}._dialog_gqnoq_1._dark_gqnoq_5 .MuiPaper-root ._dialogErrorText_gqnoq_9::-webkit-scrollbar-thumb{background-color:#ffffff24;border-radius:16px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21{position:absolute;right:0;top:0;padding:32px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21 ._close_gqnoq_27{width:40px;height:40px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21 ._close_gqnoq_27 img{width:22px;height:22px}._dialog_gqnoq_1 .MuiPaper-root ._title_gqnoq_35{margin-right:40px}@media(max-width:767px){._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21{padding:24px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21 ._close_gqnoq_27{width:36px;height:36px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21 ._close_gqnoq_27 img{width:20px;height:20px}._dialog_gqnoq_1 .MuiPaper-root ._title_gqnoq_35{margin-right:36px}}@media(max-width:575px){._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21{padding:8px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21 ._close_gqnoq_27{width:32px;height:32px}._dialog_gqnoq_1 .MuiPaper-root ._topActions_gqnoq_21 ._close_gqnoq_27 img{width:18px;height:18px}._dialog_gqnoq_1 .MuiPaper-root ._title_gqnoq_35{margin-right:32px}}@media(max-width:767px){._dialogErrorText_gqnoq_9{font-size:18px}}@media(max-width:575px){._dialogErrorText_gqnoq_9{font-size:16px}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._dialog_1v8d5_1{font-family:var(--font-inter, sans-serif);z-index:4250!important}._dialog_1v8d5_1._dark_1v8d5_5 .MuiPaper-root{background-color:#191b28;color:#fff}._dialog_1v8d5_1._dark_1v8d5_5 .MuiPaper-root ._errorContent_1v8d5_9::-webkit-scrollbar{height:8px;width:8px}._dialog_1v8d5_1._dark_1v8d5_5 .MuiPaper-root ._errorContent_1v8d5_9::-webkit-scrollbar-track{background:#070e1d;border-radius:16px}._dialog_1v8d5_1._dark_1v8d5_5 .MuiPaper-root ._errorContent_1v8d5_9::-webkit-scrollbar-thumb{background-color:#ffffff24;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root{border-radius:24px;padding:48px;max-width:100%;max-height:100%;display:flex;flex-direction:column;overflow:hidden}._dialog_1v8d5_1 .MuiPaper-root::-webkit-scrollbar{height:8px;width:8px}._dialog_1v8d5_1 .MuiPaper-root::-webkit-scrollbar-track{background:#070e1d;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root::-webkit-scrollbar-thumb{background-color:#ffffff24;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9::-webkit-scrollbar{height:8px;width:8px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9::-webkit-scrollbar-track{background:#070e1d;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9::-webkit-scrollbar-thumb{background-color:#ffffff24;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9{margin:32px 0 24px;display:flex;flex-direction:column;padding:0;gap:16px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9 ._errorItem_1v8d5_61{font-size:22px;letter-spacing:0%;line-height:150%;font-weight:500;color:#e2402fe0}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9 ._errorItem_1v8d5_61 ._fileName_1v8d5_68{font-weight:700}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71{position:absolute;right:0;top:0;padding:32px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71 ._close_1v8d5_77{width:40px;height:40px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71 ._close_1v8d5_77 img{width:22px;height:22px}._dialog_1v8d5_1 .MuiPaper-root ._botActions_1v8d5_85{padding:0;display:flex;justify-content:space-between;gap:8px}._dialog_1v8d5_1 .MuiPaper-root ._botActions_1v8d5_85 ._button_1v8d5_91{width:100%;text-transform:none;margin-left:0}._dialog_1v8d5_1 .MuiPaper-root ._title_1v8d5_96{padding:0;font-weight:600;font-size:32px;line-height:100%;margin-right:40px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103{max-height:100%;margin:32px 0 24px;padding:0;display:flex;flex:1;gap:12px;align-items:center;justify-content:center}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103::-webkit-scrollbar{height:8px;width:8px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103::-webkit-scrollbar-track{background:#070e1d;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103::-webkit-scrollbar-thumb{background-color:#ffffff24;border-radius:16px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103._many_1v8d5_125{justify-content:space-between;align-items:stretch}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103._many_1v8d5_125 ._cropWrapper_1v8d5_129{flex:1}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103 ._cropWrapper_1v8d5_129{display:flex;justify-content:center;align-items:center;min-width:0;min-height:0;max-width:100%;max-height:100%}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103 ._crop_1v8d5_129{max-width:100%;overflow:hidden}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103 ._crop_1v8d5_129 img{max-width:100%;max-height:max(240px,min(670px,100dvh - 270px));width:auto;height:auto}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103 ._crop_1v8d5_129 .ReactCrop__child-wrapper,._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103 ._crop_1v8d5_129 .ReactCrop__crop-mask{border-radius:12px}@media(max-width:767px){._dialog_1v8d5_1 .MuiPaper-root{padding:24px;margin:12px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71{position:absolute;right:0;top:0;padding:24px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71 ._close_1v8d5_77{width:36px;height:36px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71 ._close_1v8d5_77 img{width:20px;height:20px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9{margin:16px 0 12px;gap:8px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9 ._errorItem_1v8d5_61{font-size:18px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103{flex-direction:column;margin:20px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103._many_1v8d5_125 ._crop_1v8d5_129 img{max-height:max(100px,min(670px,100dvh - 340px))}._dialog_1v8d5_1 .MuiPaper-root ._botActions_1v8d5_85{flex-direction:column-reverse}._dialog_1v8d5_1 .MuiPaper-root ._title_1v8d5_96{font-size:20px;margin-right:36px}}._dialog_1v8d5_1 .MuiPaper-root ._dialogText_1v8d5_198{color:#e2402fe0}@media(max-width:575px){._dialog_1v8d5_1 .MuiPaper-root{padding:16px;margin:8px}._dialog_1v8d5_1 .MuiPaper-root ._content_1v8d5_103{margin:12px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71{position:absolute;right:0;top:0;padding:8px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71 ._close_1v8d5_77{width:32px;height:32px}._dialog_1v8d5_1 .MuiPaper-root ._topActions_1v8d5_71 ._close_1v8d5_77 img{width:18px;height:18px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9{margin:8px 0;gap:4px}._dialog_1v8d5_1 .MuiPaper-root ._errorContent_1v8d5_9 ._errorItem_1v8d5_61{font-size:16px}._dialog_1v8d5_1 .MuiPaper-root ._title_1v8d5_96{font-size:16px;margin-right:32px}}
|
|
@@ -1,114 +1,132 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { InputBase as
|
|
4
|
-
import
|
|
5
|
-
import { DEFAULT_CODE_LENGTH as
|
|
6
|
-
import { RU_LOCALE as
|
|
7
|
-
import { getCodeInputLabel as
|
|
8
|
-
import { slideDownAnimation as
|
|
9
|
-
import '../../assets/code-input.css';const
|
|
10
|
-
codeInput:
|
|
11
|
-
isPatient:
|
|
12
|
-
codeInputItem:
|
|
13
|
-
},
|
|
1
|
+
import { jsx as q } from "react/jsx-runtime";
|
|
2
|
+
import { useState as T, useRef as C, useEffect as d } from "react";
|
|
3
|
+
import { InputBase as j } from "@mui/material";
|
|
4
|
+
import N from "classnames";
|
|
5
|
+
import { DEFAULT_CODE_LENGTH as S, NOT_CODE_REGEX as b, BACKSPACE_KEY as F, ARROW_LEFT_KEY as Y, ARROW_RIGHT_KEY as B, ENTER_KEY as G, CODE_REGEX as I, TAB_KEY as U, FOCUSABLE_SELECTOR as H } from "./constants.js";
|
|
6
|
+
import { RU_LOCALE as W } from "../../constants.js";
|
|
7
|
+
import { getCodeInputLabel as X } from "./utils/get-code-input-label.js";
|
|
8
|
+
import { slideDownAnimation as k } from "./utils/slide-down-animate.js";
|
|
9
|
+
import '../../assets/code-input.css';const z = "_codeInput_1iq1n_1", J = "_isPatient_1iq1n_5", Q = "_codeInputItem_1iq1n_5", y = {
|
|
10
|
+
codeInput: z,
|
|
11
|
+
isPatient: J,
|
|
12
|
+
codeInputItem: Q
|
|
13
|
+
}, rt = (R) => {
|
|
14
14
|
const {
|
|
15
|
-
className:
|
|
16
|
-
autoFocus:
|
|
15
|
+
className: A,
|
|
16
|
+
autoFocus: g,
|
|
17
17
|
value: E = "",
|
|
18
|
-
length:
|
|
18
|
+
length: r = S,
|
|
19
19
|
disabled: f,
|
|
20
20
|
onChange: p,
|
|
21
|
-
onComplete:
|
|
22
|
-
locale:
|
|
23
|
-
isPatient:
|
|
24
|
-
} =
|
|
25
|
-
E.split("").slice(0,
|
|
26
|
-
), s =
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
21
|
+
onComplete: h,
|
|
22
|
+
locale: M = W,
|
|
23
|
+
isPatient: w = !1
|
|
24
|
+
} = R, [u, l] = T(
|
|
25
|
+
E.split("").slice(0, r)
|
|
26
|
+
), s = C([]), D = C(null), _ = () => {
|
|
27
|
+
const n = D.current, t = s.current[r - 1];
|
|
28
|
+
if (!n || !t) return;
|
|
29
|
+
const e = Array.from(
|
|
30
|
+
document.querySelectorAll(H)
|
|
31
|
+
), o = e.indexOf(t);
|
|
32
|
+
if (o !== -1) {
|
|
33
|
+
for (let c = o + 1; c < e.length; c++)
|
|
34
|
+
if (!n.contains(e[c])) {
|
|
35
|
+
e[c].focus();
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
t.blur();
|
|
39
|
+
}
|
|
40
|
+
};
|
|
41
|
+
d(() => {
|
|
42
|
+
l((n) => {
|
|
43
|
+
if (E === n.join("")) return n;
|
|
44
|
+
const t = E.split("").slice(0, r);
|
|
45
|
+
for (; t.length < r; )
|
|
32
46
|
t.push("");
|
|
33
47
|
return t;
|
|
34
48
|
});
|
|
35
|
-
}, [E,
|
|
36
|
-
|
|
37
|
-
}, [
|
|
38
|
-
const
|
|
39
|
-
const
|
|
40
|
-
if (
|
|
49
|
+
}, [E, r]), d(() => {
|
|
50
|
+
g && s.current[0] && !f && s.current[0]?.focus();
|
|
51
|
+
}, [g, f]);
|
|
52
|
+
const K = (n, t) => {
|
|
53
|
+
const e = n.target.value;
|
|
54
|
+
if (e && !I.test(e))
|
|
41
55
|
return;
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
const i =
|
|
45
|
-
p?.(i),
|
|
46
|
-
},
|
|
47
|
-
if (
|
|
48
|
-
if (!
|
|
49
|
-
const
|
|
50
|
-
|
|
51
|
-
} else if (
|
|
52
|
-
const
|
|
53
|
-
|
|
56
|
+
const o = e.slice(-1), c = [...u];
|
|
57
|
+
c[t] = o, l(c), k(s.current[t]);
|
|
58
|
+
const i = c.join("");
|
|
59
|
+
p?.(i), o && t < r - 1 ? queueMicrotask(() => s.current[t + 1]?.focus()) : o && t === r - 1 && i.length === r && !c.includes("") && (queueMicrotask(() => _()), h?.(i));
|
|
60
|
+
}, O = (n, t) => {
|
|
61
|
+
if (n.key === F) {
|
|
62
|
+
if (!u[t] && t > 0) {
|
|
63
|
+
const e = [...u];
|
|
64
|
+
e[t - 1] = "", l(e), queueMicrotask(() => s.current[t - 1]?.focus()), p?.(e.join(""));
|
|
65
|
+
} else if (u[t]) {
|
|
66
|
+
const e = [...u];
|
|
67
|
+
e[t] = "", l(e), p?.(e.join(""));
|
|
54
68
|
}
|
|
55
|
-
|
|
69
|
+
n.preventDefault();
|
|
56
70
|
return;
|
|
57
71
|
}
|
|
58
|
-
if (
|
|
59
|
-
queueMicrotask(() => s.current[t - 1]?.focus()),
|
|
72
|
+
if (n.key === Y && t > 0) {
|
|
73
|
+
queueMicrotask(() => s.current[t - 1]?.focus()), n.preventDefault();
|
|
60
74
|
return;
|
|
61
75
|
}
|
|
62
|
-
if (
|
|
63
|
-
queueMicrotask(() => s.current[t + 1]?.focus()),
|
|
76
|
+
if (n.key === B && t < r - 1) {
|
|
77
|
+
queueMicrotask(() => s.current[t + 1]?.focus()), n.preventDefault();
|
|
64
78
|
return;
|
|
65
79
|
}
|
|
66
|
-
if (
|
|
67
|
-
const
|
|
68
|
-
|
|
80
|
+
if (n.key === G) {
|
|
81
|
+
const e = u.findIndex((o) => !o);
|
|
82
|
+
e !== -1 && (queueMicrotask(() => s.current[e]?.focus()), n.preventDefault());
|
|
83
|
+
return;
|
|
69
84
|
}
|
|
70
|
-
if (
|
|
71
|
-
|
|
72
|
-
const
|
|
73
|
-
|
|
74
|
-
const
|
|
75
|
-
p?.(
|
|
85
|
+
if (I.test(n.key)) {
|
|
86
|
+
n.preventDefault();
|
|
87
|
+
const e = n.key, o = [...u];
|
|
88
|
+
o[t] = e, l(o), k(s.current[t]);
|
|
89
|
+
const c = o.join("");
|
|
90
|
+
p?.(c), t < r - 1 ? queueMicrotask(() => s.current[t + 1]?.focus()) : c.length === r && !o.includes("") && (queueMicrotask(() => _()), h?.(c));
|
|
76
91
|
return;
|
|
77
92
|
}
|
|
78
|
-
!
|
|
79
|
-
},
|
|
80
|
-
|
|
81
|
-
const
|
|
82
|
-
if (!
|
|
93
|
+
!n.ctrlKey && !n.metaKey && n.key !== U && !I.test(n.key) && n.preventDefault();
|
|
94
|
+
}, V = (n) => {
|
|
95
|
+
n.preventDefault();
|
|
96
|
+
const e = n.clipboardData.getData("text").trim().replace(b, "").slice(0, r);
|
|
97
|
+
if (!e)
|
|
83
98
|
return;
|
|
84
|
-
const
|
|
85
|
-
|
|
86
|
-
m <
|
|
99
|
+
const o = [...u];
|
|
100
|
+
e.split("").forEach((a, m) => {
|
|
101
|
+
m < r && (o[m] = a, k(s.current[m]));
|
|
87
102
|
});
|
|
88
|
-
for (let a =
|
|
89
|
-
|
|
90
|
-
l(
|
|
91
|
-
const
|
|
92
|
-
p?.(
|
|
93
|
-
const i =
|
|
94
|
-
(a, m) => m >=
|
|
103
|
+
for (let a = e.length; a < r; a++)
|
|
104
|
+
o[a] = "";
|
|
105
|
+
l(o);
|
|
106
|
+
const c = o.join("");
|
|
107
|
+
p?.(c);
|
|
108
|
+
const i = o.findIndex(
|
|
109
|
+
(a, m) => m >= e.length && !a
|
|
95
110
|
);
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
},
|
|
100
|
-
f || s.current[
|
|
111
|
+
i !== -1 ? queueMicrotask(() => s.current[i]?.focus()) : e.length >= r ? queueMicrotask(() => _()) : queueMicrotask(
|
|
112
|
+
() => s.current[Math.min(e.length, r - 1)]?.focus()
|
|
113
|
+
), c.length === r && !o.includes("") && h?.(c);
|
|
114
|
+
}, L = (n) => {
|
|
115
|
+
f || s.current[n]?.select();
|
|
116
|
+
}, P = (n) => {
|
|
117
|
+
f || s.current[n]?.select();
|
|
101
118
|
};
|
|
102
|
-
return /* @__PURE__ */
|
|
119
|
+
return /* @__PURE__ */ q(
|
|
103
120
|
"div",
|
|
104
121
|
{
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
122
|
+
ref: D,
|
|
123
|
+
className: N(y.codeInput, w && y.isPatient, A),
|
|
124
|
+
children: Array.from({ length: r }, (n, t) => /* @__PURE__ */ q(
|
|
125
|
+
j,
|
|
108
126
|
{
|
|
109
|
-
className:
|
|
110
|
-
inputRef: (
|
|
111
|
-
s.current[t] =
|
|
127
|
+
className: y.codeInputItem,
|
|
128
|
+
inputRef: (e) => {
|
|
129
|
+
s.current[t] = e;
|
|
112
130
|
},
|
|
113
131
|
inputProps: {
|
|
114
132
|
pattern: "[0-9]*",
|
|
@@ -116,14 +134,14 @@ import '../../assets/code-input.css';const U = "_codeInput_1iq1n_1", W = "_isPat
|
|
|
116
134
|
},
|
|
117
135
|
type: "text",
|
|
118
136
|
inputMode: "numeric",
|
|
119
|
-
value:
|
|
137
|
+
value: u[t] || "",
|
|
120
138
|
disabled: f,
|
|
121
|
-
onSelect: () =>
|
|
122
|
-
onFocus: () =>
|
|
123
|
-
onChange: (
|
|
124
|
-
onKeyDown: (
|
|
125
|
-
onPaste:
|
|
126
|
-
"aria-label":
|
|
139
|
+
onSelect: () => P(t),
|
|
140
|
+
onFocus: () => L(t),
|
|
141
|
+
onChange: (e) => K(e, t),
|
|
142
|
+
onKeyDown: (e) => O(e, t),
|
|
143
|
+
onPaste: V,
|
|
144
|
+
"aria-label": X(t, r, M)
|
|
127
145
|
},
|
|
128
146
|
t
|
|
129
147
|
))
|
|
@@ -131,5 +149,5 @@ import '../../assets/code-input.css';const U = "_codeInput_1iq1n_1", W = "_isPat
|
|
|
131
149
|
);
|
|
132
150
|
};
|
|
133
151
|
export {
|
|
134
|
-
|
|
152
|
+
rt as CodeInput
|
|
135
153
|
};
|
|
@@ -6,3 +6,4 @@ export declare const ARROW_LEFT_KEY = "ArrowLeft";
|
|
|
6
6
|
export declare const ARROW_RIGHT_KEY = "ArrowRight";
|
|
7
7
|
export declare const ENTER_KEY = "Enter";
|
|
8
8
|
export declare const TAB_KEY = "Tab";
|
|
9
|
+
export declare const FOCUSABLE_SELECTOR = "a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])";
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
const
|
|
1
|
+
const t = 6, E = /^\d+$/, n = /\D/g, o = "Backspace", e = "ArrowLeft", s = "ArrowRight", _ = "Enter", a = "Tab", c = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
|
|
2
2
|
export {
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
e as ARROW_LEFT_KEY,
|
|
4
|
+
s as ARROW_RIGHT_KEY,
|
|
5
5
|
o as BACKSPACE_KEY,
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
E as CODE_REGEX,
|
|
7
|
+
t as DEFAULT_CODE_LENGTH,
|
|
8
|
+
_ as ENTER_KEY,
|
|
9
|
+
c as FOCUSABLE_SELECTOR,
|
|
10
|
+
n as NOT_CODE_REGEX,
|
|
11
|
+
a as TAB_KEY
|
|
11
12
|
};
|
package/dist/components/photo-crop-uploader/components/error-upload-dialog/error-upload-dialog.js
CHANGED
|
@@ -1,35 +1,55 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { Dialog as
|
|
3
|
-
import
|
|
4
|
-
import { localizedText as
|
|
1
|
+
import { jsxs as m, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import { Dialog as _, DialogActions as i, IconButton as p, DialogTitle as q, DialogContent as E, DialogContentText as h, Button as x } from "@mui/material";
|
|
3
|
+
import r from "classnames";
|
|
4
|
+
import { localizedText as e } from "../../locale.js";
|
|
5
5
|
import { EN_LOCALE as D, DARK_THEME as T } from "../../../../constants.js";
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
import { c as f } from "../../../../raw-cross-BhC4FBfp.js";
|
|
7
|
+
import '../../../../assets/error-upload-dialog.css';const A = "_dialog_gqnoq_1", C = "_dark_gqnoq_5", N = "_dialogErrorText_gqnoq_9", k = "_topActions_gqnoq_21", b = "_close_gqnoq_27", u = "_title_gqnoq_35", l = {
|
|
8
|
+
dialog: A,
|
|
9
|
+
dark: C,
|
|
10
|
+
dialogErrorText: N,
|
|
11
|
+
topActions: k,
|
|
12
|
+
close: b,
|
|
13
|
+
title: u
|
|
14
|
+
}, H = (s) => {
|
|
11
15
|
const {
|
|
12
|
-
photoError:
|
|
13
|
-
onCloseErrorDialog:
|
|
14
|
-
locale:
|
|
15
|
-
theme:
|
|
16
|
-
className:
|
|
16
|
+
photoError: a,
|
|
17
|
+
onCloseErrorDialog: c,
|
|
18
|
+
locale: t = D,
|
|
19
|
+
theme: n = T,
|
|
20
|
+
className: g,
|
|
17
21
|
...d
|
|
18
|
-
} =
|
|
19
|
-
return /* @__PURE__ */
|
|
20
|
-
|
|
22
|
+
} = s;
|
|
23
|
+
return /* @__PURE__ */ m(
|
|
24
|
+
_,
|
|
21
25
|
{
|
|
22
|
-
className:
|
|
23
|
-
onClose:
|
|
26
|
+
className: r(l.dialog, g, l[n]),
|
|
27
|
+
onClose: c,
|
|
24
28
|
...d,
|
|
25
29
|
children: [
|
|
26
|
-
/* @__PURE__ */ o(
|
|
27
|
-
|
|
28
|
-
|
|
30
|
+
/* @__PURE__ */ o(i, { className: r(l.topActions), children: /* @__PURE__ */ o(
|
|
31
|
+
p,
|
|
32
|
+
{
|
|
33
|
+
onClick: c,
|
|
34
|
+
className: r(l.close),
|
|
35
|
+
"aria-label": e[t].close,
|
|
36
|
+
children: /* @__PURE__ */ o(
|
|
37
|
+
"img",
|
|
38
|
+
{
|
|
39
|
+
draggable: !1,
|
|
40
|
+
src: f,
|
|
41
|
+
alt: e[t].close
|
|
42
|
+
}
|
|
43
|
+
)
|
|
44
|
+
}
|
|
45
|
+
) }),
|
|
46
|
+
/* @__PURE__ */ o(q, { className: r(l.title), children: e[t].error }),
|
|
47
|
+
/* @__PURE__ */ o(E, { children: /* @__PURE__ */ o(h, { className: r(l.dialogErrorText), children: a }) }),
|
|
48
|
+
/* @__PURE__ */ o(i, { children: /* @__PURE__ */ o(x, { onClick: c, children: e[t].back }) })
|
|
29
49
|
]
|
|
30
50
|
}
|
|
31
51
|
);
|
|
32
52
|
};
|
|
33
53
|
export {
|
|
34
|
-
|
|
54
|
+
H as ErrorUploadDialog
|
|
35
55
|
};
|
package/dist/components/photo-crop-uploader/components/upload-dialog/upload-dialog-errors.js
CHANGED
|
@@ -3,8 +3,9 @@ import "@mui/material";
|
|
|
3
3
|
import "classnames";
|
|
4
4
|
import "../../locale.js";
|
|
5
5
|
import "../../../../constants.js";
|
|
6
|
-
import
|
|
6
|
+
import "../../../../raw-cross-BhC4FBfp.js";
|
|
7
|
+
import { U } from "../../../../upload-dialog-errors-BIwMA_MN.js";
|
|
7
8
|
import "../../../button/button.js";
|
|
8
9
|
export {
|
|
9
|
-
|
|
10
|
+
U as UploadDialogErrors
|
|
10
11
|
};
|
|
@@ -1,133 +1,134 @@
|
|
|
1
|
-
import { jsx as t, jsxs as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { useScaledMinDimension as
|
|
4
|
-
import { Dialog as
|
|
5
|
-
import
|
|
1
|
+
import { jsx as t, jsxs as u, Fragment as H } from "react/jsx-runtime";
|
|
2
|
+
import { useState as O, useCallback as j } from "react";
|
|
3
|
+
import { useScaledMinDimension as v } from "./use-scaled-min-dimension.js";
|
|
4
|
+
import { Dialog as g, DialogContent as D, DialogActions as C, IconButton as K, DialogTitle as q } from "@mui/material";
|
|
5
|
+
import w from "react-image-crop";
|
|
6
6
|
import e from "classnames";
|
|
7
|
-
import { s as o, U as
|
|
8
|
-
import { PhotoList as
|
|
9
|
-
import { localizedText as
|
|
10
|
-
import { EN_LOCALE as
|
|
11
|
-
import { DEFAULT_MIN_DIMENSION as
|
|
12
|
-
import {
|
|
7
|
+
import { s as o, U as G } from "../../../../upload-dialog-errors-BIwMA_MN.js";
|
|
8
|
+
import { PhotoList as J } from "../photo-list/photo-list.js";
|
|
9
|
+
import { localizedText as l } from "../../locale.js";
|
|
10
|
+
import { EN_LOCALE as Q, DARK_THEME as X } from "../../../../constants.js";
|
|
11
|
+
import { DEFAULT_MIN_DIMENSION as Y, DEFAULT_ASPECT_RATIO as Z } from "../../constants.js";
|
|
12
|
+
import { c as $ } from "../../../../raw-cross-BhC4FBfp.js";
|
|
13
|
+
import { CircularProgressLoader as oo } from "../../../circular-progress-loader/circular-progress-loader.js";
|
|
13
14
|
import { Button as b } from "../../../button/button.js";
|
|
14
|
-
import '../../../../assets/upload-dialog.css';const
|
|
15
|
+
import '../../../../assets/upload-dialog.css';const Co = (E) => {
|
|
15
16
|
const {
|
|
16
|
-
onCloseDialogHandler:
|
|
17
|
+
onCloseDialogHandler: n,
|
|
17
18
|
photoSources: a = [],
|
|
18
|
-
photoCrops:
|
|
19
|
-
onCropChange:
|
|
19
|
+
photoCrops: k = [],
|
|
20
|
+
onCropChange: S = () => {
|
|
20
21
|
},
|
|
21
|
-
onPhotoLoad:
|
|
22
|
+
onPhotoLoad: A,
|
|
22
23
|
imageRef: s,
|
|
23
24
|
photoError: f,
|
|
24
|
-
onPhotoCrop:
|
|
25
|
-
onNextPhoto:
|
|
26
|
-
onSkipCrop:
|
|
25
|
+
onPhotoCrop: I,
|
|
26
|
+
onNextPhoto: L,
|
|
27
|
+
onSkipCrop: x,
|
|
27
28
|
onClearErrors: T,
|
|
28
|
-
minDimension: P =
|
|
29
|
-
aspectRatio:
|
|
30
|
-
locale:
|
|
31
|
-
circular:
|
|
32
|
-
keepSelection:
|
|
33
|
-
photoSourceLoading:
|
|
29
|
+
minDimension: P = Y,
|
|
30
|
+
aspectRatio: R = Z,
|
|
31
|
+
locale: r = Q,
|
|
32
|
+
circular: W,
|
|
33
|
+
keepSelection: _ = !0,
|
|
34
|
+
photoSourceLoading: U,
|
|
34
35
|
className: c,
|
|
35
36
|
photoIndex: i,
|
|
36
|
-
loadingValue:
|
|
37
|
+
loadingValue: z,
|
|
37
38
|
errors: m,
|
|
38
|
-
theme:
|
|
39
|
-
...
|
|
40
|
-
} =
|
|
39
|
+
theme: p = X,
|
|
40
|
+
...h
|
|
41
|
+
} = E, d = a.slice(i).length > 1, [M, V] = O(null), y = j(
|
|
41
42
|
(N) => {
|
|
42
|
-
s && (s.current = N),
|
|
43
|
+
s && (s.current = N), V(N);
|
|
43
44
|
},
|
|
44
45
|
[s]
|
|
45
|
-
), { minWidth:
|
|
46
|
-
return
|
|
47
|
-
|
|
46
|
+
), { minWidth: B, minHeight: F } = v(M, P);
|
|
47
|
+
return U || !a.length && !m?.length ? /* @__PURE__ */ t(
|
|
48
|
+
g,
|
|
48
49
|
{
|
|
49
|
-
className: e(o.dialog, c, o[
|
|
50
|
-
onClose:
|
|
51
|
-
...
|
|
52
|
-
children: /* @__PURE__ */ t(
|
|
50
|
+
className: e(o.dialog, c, o[p]),
|
|
51
|
+
onClose: n,
|
|
52
|
+
...h,
|
|
53
|
+
children: /* @__PURE__ */ t(D, { className: e(o.content), children: /* @__PURE__ */ t(oo, { value: z }) })
|
|
53
54
|
}
|
|
54
55
|
) : m?.length ? /* @__PURE__ */ t(
|
|
55
|
-
|
|
56
|
+
g,
|
|
56
57
|
{
|
|
57
|
-
className: e(o.dialog, c, o[
|
|
58
|
-
onClose:
|
|
59
|
-
...
|
|
58
|
+
className: e(o.dialog, c, o[p]),
|
|
59
|
+
onClose: n,
|
|
60
|
+
...h,
|
|
60
61
|
children: /* @__PURE__ */ t(
|
|
61
|
-
|
|
62
|
+
G,
|
|
62
63
|
{
|
|
63
|
-
locale:
|
|
64
|
+
locale: r,
|
|
64
65
|
photoSources: a,
|
|
65
66
|
errors: m,
|
|
66
|
-
onCloseDialogHandler:
|
|
67
|
+
onCloseDialogHandler: n,
|
|
67
68
|
onClearErrors: T
|
|
68
69
|
}
|
|
69
70
|
)
|
|
70
71
|
}
|
|
71
|
-
) : /* @__PURE__ */
|
|
72
|
-
|
|
72
|
+
) : /* @__PURE__ */ u(
|
|
73
|
+
g,
|
|
73
74
|
{
|
|
74
|
-
className: e(o.dialog, c, o[
|
|
75
|
-
onClose:
|
|
76
|
-
...
|
|
75
|
+
className: e(o.dialog, c, o[p]),
|
|
76
|
+
onClose: n,
|
|
77
|
+
...h,
|
|
77
78
|
children: [
|
|
78
79
|
/* @__PURE__ */ t(C, { className: e(o.topActions), children: /* @__PURE__ */ t(
|
|
79
|
-
|
|
80
|
+
K,
|
|
80
81
|
{
|
|
81
|
-
onClick:
|
|
82
|
+
onClick: n,
|
|
82
83
|
className: e(o.close),
|
|
83
|
-
"aria-label":
|
|
84
|
+
"aria-label": l[r].back,
|
|
84
85
|
children: /* @__PURE__ */ t(
|
|
85
86
|
"img",
|
|
86
87
|
{
|
|
87
88
|
draggable: !1,
|
|
88
|
-
src:
|
|
89
|
-
alt:
|
|
89
|
+
src: $,
|
|
90
|
+
alt: l[r].back
|
|
90
91
|
}
|
|
91
92
|
)
|
|
92
93
|
}
|
|
93
94
|
) }),
|
|
94
|
-
/* @__PURE__ */ t(
|
|
95
|
-
/* @__PURE__ */
|
|
96
|
-
!!a.length && /* @__PURE__ */ t(
|
|
97
|
-
|
|
95
|
+
/* @__PURE__ */ t(q, { className: e(o.title), children: l[r]["photo-crop"] }),
|
|
96
|
+
/* @__PURE__ */ u(D, { className: e(o.content, d && o.many), children: [
|
|
97
|
+
!!a.length && /* @__PURE__ */ t("div", { className: e(o.cropWrapper), children: /* @__PURE__ */ t(
|
|
98
|
+
w,
|
|
98
99
|
{
|
|
99
100
|
className: e(o.crop),
|
|
100
|
-
crop:
|
|
101
|
-
circularCrop:
|
|
102
|
-
keepSelection:
|
|
103
|
-
aspect:
|
|
104
|
-
minWidth:
|
|
105
|
-
minHeight:
|
|
106
|
-
onChange:
|
|
101
|
+
crop: k[i],
|
|
102
|
+
circularCrop: W,
|
|
103
|
+
keepSelection: _,
|
|
104
|
+
aspect: R,
|
|
105
|
+
minWidth: B,
|
|
106
|
+
minHeight: F,
|
|
107
|
+
onChange: S,
|
|
107
108
|
children: /* @__PURE__ */ t(
|
|
108
109
|
"img",
|
|
109
110
|
{
|
|
110
|
-
onLoad:
|
|
111
|
+
onLoad: A,
|
|
111
112
|
src: a[i],
|
|
112
|
-
ref:
|
|
113
|
-
alt:
|
|
113
|
+
ref: y,
|
|
114
|
+
alt: l[r]["photo-crop"],
|
|
114
115
|
draggable: !1
|
|
115
116
|
},
|
|
116
117
|
i
|
|
117
118
|
)
|
|
118
119
|
}
|
|
119
|
-
),
|
|
120
|
-
|
|
121
|
-
|
|
120
|
+
) }),
|
|
121
|
+
d && /* @__PURE__ */ t(
|
|
122
|
+
J,
|
|
122
123
|
{
|
|
123
|
-
locale:
|
|
124
|
+
locale: r,
|
|
124
125
|
photoSources: a,
|
|
125
126
|
photoIndex: i
|
|
126
127
|
}
|
|
127
128
|
)
|
|
128
129
|
] }),
|
|
129
130
|
f && /* @__PURE__ */ t(C, { className: e(o.dialogText), children: f }),
|
|
130
|
-
/* @__PURE__ */ t(C, { className: e(o.botActions), children:
|
|
131
|
+
/* @__PURE__ */ t(C, { className: e(o.botActions), children: d ? /* @__PURE__ */ u(H, { children: [
|
|
131
132
|
/* @__PURE__ */ t(
|
|
132
133
|
b,
|
|
133
134
|
{
|
|
@@ -136,8 +137,8 @@ import '../../../../assets/upload-dialog.css';const oo = "data:image/svg+xml,%3c
|
|
|
136
137
|
buttonVariant: "outlined",
|
|
137
138
|
buttonWeight: 500,
|
|
138
139
|
className: e(o.button),
|
|
139
|
-
onClick:
|
|
140
|
-
children:
|
|
140
|
+
onClick: x,
|
|
141
|
+
children: l[r].skip
|
|
141
142
|
}
|
|
142
143
|
),
|
|
143
144
|
/* @__PURE__ */ t(
|
|
@@ -148,8 +149,8 @@ import '../../../../assets/upload-dialog.css';const oo = "data:image/svg+xml,%3c
|
|
|
148
149
|
buttonVariant: "outlined",
|
|
149
150
|
buttonWeight: 500,
|
|
150
151
|
className: e(o.button),
|
|
151
|
-
onClick:
|
|
152
|
-
children:
|
|
152
|
+
onClick: L,
|
|
153
|
+
children: l[r].continue
|
|
153
154
|
}
|
|
154
155
|
)
|
|
155
156
|
] }) : /* @__PURE__ */ t(
|
|
@@ -161,8 +162,8 @@ import '../../../../assets/upload-dialog.css';const oo = "data:image/svg+xml,%3c
|
|
|
161
162
|
buttonVariant: "outlined",
|
|
162
163
|
buttonWeight: 500,
|
|
163
164
|
className: e(o.button),
|
|
164
|
-
onClick:
|
|
165
|
-
children:
|
|
165
|
+
onClick: I,
|
|
166
|
+
children: l[r].crop
|
|
166
167
|
}
|
|
167
168
|
) })
|
|
168
169
|
]
|
|
@@ -170,5 +171,5 @@ import '../../../../assets/upload-dialog.css';const oo = "data:image/svg+xml,%3c
|
|
|
170
171
|
);
|
|
171
172
|
};
|
|
172
173
|
export {
|
|
173
|
-
|
|
174
|
+
Co as UploadDialog
|
|
174
175
|
};
|
|
@@ -46,8 +46,8 @@ export declare const MS_UNIT = "ms";
|
|
|
46
46
|
export declare const MB_UNIT = "mb";
|
|
47
47
|
export declare const MB_FRACTION_DIGITS = 1;
|
|
48
48
|
export declare const FULL_CROP_SIZE = 100;
|
|
49
|
-
export declare const MAX_ASPECT_RATIO =
|
|
50
|
-
export declare const MIN_ASPECT_RATIO
|
|
49
|
+
export declare const MAX_ASPECT_RATIO = 5;
|
|
50
|
+
export declare const MIN_ASPECT_RATIO: number;
|
|
51
51
|
export declare const FULL_PROGRESS_VALUE = 100;
|
|
52
52
|
export declare const PHOTO_LOADING_DELAY = 100;
|
|
53
53
|
export declare const RESET_DATA_DELAY = 500;
|
|
@@ -28,7 +28,7 @@ const D = 1, i = 670, L = 90, _ = ".jpg", I = ".jpeg", A = ".png", o = ".svg", M
|
|
|
28
28
|
WEBP_IMAGE_TYPE: [n],
|
|
29
29
|
ICO_IMAGE_TYPE: [T],
|
|
30
30
|
MICROSOFT_ICO_IMAGE_TYPE: [T]
|
|
31
|
-
}, R = 500, V = 10 * E * E, a = 50 * E * E, b = "2d", J = "high", v = "%", W = "px", d = "ms", f = "mb", j = 1, r = 100, w =
|
|
31
|
+
}, R = 500, V = 10 * E * E, a = 50 * E * E, b = "2d", J = "high", v = "%", W = "px", d = "ms", f = "mb", j = 1, r = 100, w = 5, x = 1 / 5, H = 100, Z = 100, h = 500;
|
|
32
32
|
export {
|
|
33
33
|
M as BMP_IMAGE_EXT,
|
|
34
34
|
O as BMP_IMAGE_TYPE,
|
|
@@ -4,7 +4,7 @@ type MinDimension = number | typeof UNKNOWN_MIN_DIMENSION;
|
|
|
4
4
|
export declare class PhotoSizeError extends Error {
|
|
5
5
|
minDimension: MinDimension;
|
|
6
6
|
constructor(message: string, minDimension: MinDimension);
|
|
7
|
-
static get(minDimension?: MinDimension, locale?: Locale): PhotoSizeError;
|
|
7
|
+
static get(minDimension?: MinDimension, locale?: Locale, aspectRatio?: number): PhotoSizeError;
|
|
8
8
|
private static getMessage;
|
|
9
9
|
}
|
|
10
10
|
export {};
|
|
@@ -1,19 +1,24 @@
|
|
|
1
|
-
import { localizedText as
|
|
2
|
-
import { EN_LOCALE as
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { localizedText as c } from "../locale.js";
|
|
2
|
+
import { EN_LOCALE as E } from "../../../constants.js";
|
|
3
|
+
import { DEFAULT_ASPECT_RATIO as $ } from "../constants.js";
|
|
4
|
+
const g = "PhotoSizeError", h = "X", f = "unknown";
|
|
5
|
+
class u extends Error {
|
|
5
6
|
minDimension;
|
|
6
|
-
constructor(t,
|
|
7
|
-
super(t), this.name =
|
|
7
|
+
constructor(t, r) {
|
|
8
|
+
super(t), this.name = g, this.minDimension = r;
|
|
8
9
|
}
|
|
9
|
-
static get(t =
|
|
10
|
-
const
|
|
11
|
-
return new
|
|
10
|
+
static get(t = f, r = E, e = $) {
|
|
11
|
+
const s = this.getMessage(t, r, e);
|
|
12
|
+
return new u(s, t);
|
|
12
13
|
}
|
|
13
|
-
static getMessage(t =
|
|
14
|
-
|
|
14
|
+
static getMessage(t = f, r = E, e = $) {
|
|
15
|
+
const s = c[r]["photo-size-error"], o = c[r].pixels;
|
|
16
|
+
if (typeof t != "number")
|
|
17
|
+
return `${s} ${t} ${h} ${t} ${o}`;
|
|
18
|
+
const N = e >= 1 ? Math.ceil(t * e) : t, _ = e >= 1 ? t : Math.ceil(t / e);
|
|
19
|
+
return `${s} ${N} ${h} ${_} ${o}`;
|
|
15
20
|
}
|
|
16
21
|
}
|
|
17
22
|
export {
|
|
18
|
-
|
|
23
|
+
u as PhotoSizeError
|
|
19
24
|
};
|
|
@@ -22,7 +22,7 @@ const e = {
|
|
|
22
22
|
"paint-abort": "Rendering of photo was interrupted",
|
|
23
23
|
continue: "Continue",
|
|
24
24
|
skip: "Skip area selection",
|
|
25
|
-
aspect: "The aspect ratio of the cropped image must not be greater than
|
|
25
|
+
aspect: "The aspect ratio of the cropped image must not be greater than 5",
|
|
26
26
|
close: "Close",
|
|
27
27
|
"not-uploaded": "Files were not uploaded",
|
|
28
28
|
"some-not-uploaded": "Some files were not uploaded",
|
|
@@ -52,7 +52,7 @@ const e = {
|
|
|
52
52
|
"paint-abort": "Отрисовка фотографии была прервана",
|
|
53
53
|
continue: "Продолжить",
|
|
54
54
|
skip: "Пропустить выбор области",
|
|
55
|
-
aspect: "Соотношение сторон обрезаемого изображения не должно быть больше
|
|
55
|
+
aspect: "Соотношение сторон обрезаемого изображения не должно быть больше 5",
|
|
56
56
|
close: "Закрыть",
|
|
57
57
|
"not-uploaded": "Файлы не были загружены",
|
|
58
58
|
"some-not-uploaded": "Некоторые файлы не были загружены",
|
|
@@ -4,7 +4,7 @@ import { convertToPercentCrop as bo, convertToPixelCrop as ko } from "react-imag
|
|
|
4
4
|
import zo from "classnames";
|
|
5
5
|
import { localizedText as jo } from "./locale.js";
|
|
6
6
|
import { EN_LOCALE as Wo, DARK_THEME as Bo } from "../../constants.js";
|
|
7
|
-
import { DEFAULT_MIN_DIMENSION as Go, DEFAULT_ASPECT_RATIO as Xo, DEFAULT_TIMEOUT as Yo, DEFAULT_FILE_MAX_SIZE as Zo, DEFAULT_VIDEO_FILE_MAX_SIZE as Ko, DEFAULT_BASE_DIMENSION as qo, FULL_PROGRESS_VALUE as oo, PHOTO_LOADING_DELAY as Jo, RESET_DATA_DELAY as
|
|
7
|
+
import { DEFAULT_MIN_DIMENSION as Go, DEFAULT_ASPECT_RATIO as Xo, DEFAULT_TIMEOUT as Yo, DEFAULT_FILE_MAX_SIZE as Zo, DEFAULT_VIDEO_FILE_MAX_SIZE as Ko, DEFAULT_BASE_DIMENSION as qo, FULL_PROGRESS_VALUE as oo, PHOTO_LOADING_DELAY as Jo, RESET_DATA_DELAY as C } from "./constants.js";
|
|
8
8
|
import { UploadDialog as Qo } from "./components/upload-dialog/upload-dialog.js";
|
|
9
9
|
import { UploadButton as $o } from "./components/upload-button/upload-button.js";
|
|
10
10
|
import { ErrorUploadDialog as oe } from "./components/error-upload-dialog/error-upload-dialog.js";
|
|
@@ -37,7 +37,7 @@ function Te(a) {
|
|
|
37
37
|
},
|
|
38
38
|
showErrorPopup: mo = !1,
|
|
39
39
|
minDimension: l = Go,
|
|
40
|
-
aspectRatio:
|
|
40
|
+
aspectRatio: f = Xo,
|
|
41
41
|
locale: n = Wo,
|
|
42
42
|
timeout: y = Yo,
|
|
43
43
|
fileMaxSize: N = Zo,
|
|
@@ -61,48 +61,48 @@ function Te(a) {
|
|
|
61
61
|
onEndCrop: se,
|
|
62
62
|
onClose: ae,
|
|
63
63
|
..._o
|
|
64
|
-
} = Lo, [To, g] = i(!1), [P, D] = i([]), [x, I] = i([]),
|
|
64
|
+
} = Lo, [To, g] = i(!1), [P, D] = i([]), [x, I] = i([]), h = U([]), m = U([]), [p, W] = i(0), B = U(null), G = U(null), [c, O] = i(!1), [Ao, X] = i(0), [Y, Z] = i(""), [Uo, S] = i([]), [wo, K] = i(!1), vo = To || c && E, xo = () => {
|
|
65
65
|
S([]);
|
|
66
66
|
}, F = (e = []) => {
|
|
67
67
|
c || (a.returnCropParams === !0 && a.onClose?.(
|
|
68
68
|
e,
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
), g(!1), setTimeout(() => S([]),
|
|
72
|
-
|
|
73
|
-
},
|
|
69
|
+
h.current,
|
|
70
|
+
m.current
|
|
71
|
+
), g(!1), setTimeout(() => S([]), C), setTimeout(() => D([]), C), setTimeout(() => {
|
|
72
|
+
h.current = [], m.current = [];
|
|
73
|
+
}, C));
|
|
74
74
|
}, R = (e = []) => {
|
|
75
75
|
c || (a.returnCropParams || a.onClose?.(
|
|
76
76
|
e,
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
), g(!1), setTimeout(() => S([]),
|
|
80
|
-
|
|
81
|
-
},
|
|
77
|
+
h.current,
|
|
78
|
+
m.current
|
|
79
|
+
), g(!1), setTimeout(() => S([]), C), setTimeout(() => D([]), C), setTimeout(() => {
|
|
80
|
+
h.current = [], m.current = [];
|
|
81
|
+
}, C));
|
|
82
82
|
}, q = () => {
|
|
83
83
|
c || (a.returnCropParams === !0 ? F([]) : R([]));
|
|
84
84
|
}, Io = () => {
|
|
85
85
|
K(!1);
|
|
86
86
|
}, L = (e, t = e, o = [], r = !1) => {
|
|
87
|
-
lo(e), Z(""), D(e), I(Array(e.length)), W(0), g(!0),
|
|
87
|
+
lo(e), Z(""), D(e), I(Array(e.length)), W(0), g(!0), h.current = t, m.current = o, !e.length && !r && q();
|
|
88
88
|
}, M = (e) => {
|
|
89
|
-
e instanceof Error && (console.warn(e.message), co(e), Z(e.message), K(!0), D([]), g(!1),
|
|
89
|
+
e instanceof Error && (console.warn(e.message), co(e), Z(e.message), K(!0), D([]), g(!1), h.current = [], m.current = []);
|
|
90
90
|
}, Oo = async (e) => {
|
|
91
91
|
const { files: t } = e.target;
|
|
92
92
|
if (t?.length && !c)
|
|
93
93
|
try {
|
|
94
94
|
if (O(!0), io(), E) {
|
|
95
95
|
const o = Array.from(t), r = oo / o.length, _ = [], u = [], Q = [], T = [];
|
|
96
|
-
for (const
|
|
97
|
-
const No = eo(
|
|
96
|
+
for (const d of o) {
|
|
97
|
+
const No = eo(d);
|
|
98
98
|
try {
|
|
99
99
|
if (v && No) {
|
|
100
|
-
to(
|
|
101
|
-
const s = URL.createObjectURL(
|
|
100
|
+
to(d, H, n);
|
|
101
|
+
const s = URL.createObjectURL(d);
|
|
102
102
|
Q.push(u.length), u.push(s);
|
|
103
103
|
} else {
|
|
104
104
|
ro(
|
|
105
|
-
|
|
105
|
+
d,
|
|
106
106
|
{
|
|
107
107
|
maxSize: N,
|
|
108
108
|
allowedExtensions: w,
|
|
@@ -111,17 +111,18 @@ function Te(a) {
|
|
|
111
111
|
n
|
|
112
112
|
);
|
|
113
113
|
const s = await no(
|
|
114
|
-
|
|
114
|
+
d,
|
|
115
115
|
l,
|
|
116
116
|
n,
|
|
117
|
-
y
|
|
117
|
+
y,
|
|
118
|
+
f
|
|
118
119
|
);
|
|
119
120
|
_.push(s), u.push(s);
|
|
120
121
|
}
|
|
121
122
|
} catch (s) {
|
|
122
123
|
let $ = "";
|
|
123
124
|
s instanceof Error && ($ = s.message), T.push({
|
|
124
|
-
photoName:
|
|
125
|
+
photoName: d.name,
|
|
125
126
|
errorMessage: $
|
|
126
127
|
});
|
|
127
128
|
}
|
|
@@ -144,7 +145,13 @@ function Te(a) {
|
|
|
144
145
|
{ maxSize: N, allowedExtensions: w, allowedMimeTypes: V },
|
|
145
146
|
n
|
|
146
147
|
);
|
|
147
|
-
const r = await no(
|
|
148
|
+
const r = await no(
|
|
149
|
+
o,
|
|
150
|
+
l,
|
|
151
|
+
n,
|
|
152
|
+
y,
|
|
153
|
+
f
|
|
154
|
+
);
|
|
148
155
|
L([r]);
|
|
149
156
|
}
|
|
150
157
|
}
|
|
@@ -160,7 +167,7 @@ function Te(a) {
|
|
|
160
167
|
t,
|
|
161
168
|
o,
|
|
162
169
|
l,
|
|
163
|
-
|
|
170
|
+
f,
|
|
164
171
|
!1,
|
|
165
172
|
So
|
|
166
173
|
);
|
|
@@ -222,7 +229,7 @@ function Te(a) {
|
|
|
222
229
|
(o) => so(
|
|
223
230
|
o,
|
|
224
231
|
l,
|
|
225
|
-
|
|
232
|
+
f,
|
|
226
233
|
n,
|
|
227
234
|
!0,
|
|
228
235
|
b
|
|
@@ -236,7 +243,7 @@ function Te(a) {
|
|
|
236
243
|
(o) => so(
|
|
237
244
|
o,
|
|
238
245
|
l,
|
|
239
|
-
|
|
246
|
+
f,
|
|
240
247
|
n,
|
|
241
248
|
!1
|
|
242
249
|
)
|
|
@@ -291,7 +298,7 @@ function Te(a) {
|
|
|
291
298
|
onPhotoLoad: Fo,
|
|
292
299
|
imageRef: B,
|
|
293
300
|
minDimension: l,
|
|
294
|
-
aspectRatio:
|
|
301
|
+
aspectRatio: f,
|
|
295
302
|
locale: n,
|
|
296
303
|
circular: Co,
|
|
297
304
|
keepSelection: go,
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { Locale } from '../../../types';
|
|
2
2
|
import { PhotoDataUrl } from '../types';
|
|
3
|
-
export declare const readPhoto: (file: File, minDimension?: number, locale?: Locale, timeout?: number) => Promise<PhotoDataUrl>;
|
|
3
|
+
export declare const readPhoto: (file: File, minDimension?: number, locale?: Locale, timeout?: number, aspectRatio?: number) => Promise<PhotoDataUrl>;
|
|
@@ -1,54 +1,54 @@
|
|
|
1
|
-
import { localizedText as
|
|
1
|
+
import { localizedText as E } from "../locale.js";
|
|
2
2
|
import { EN_LOCALE as c } from "../../../constants.js";
|
|
3
|
-
import { DEFAULT_MIN_DIMENSION as
|
|
4
|
-
import { PhotoSizeError as
|
|
5
|
-
const
|
|
6
|
-
(
|
|
7
|
-
const
|
|
3
|
+
import { DEFAULT_MIN_DIMENSION as h, DEFAULT_TIMEOUT as w, DEFAULT_ASPECT_RATIO as M, MS_UNIT as g, MAX_ASPECT_RATIO as v, MIN_ASPECT_RATIO as S } from "../constants.js";
|
|
4
|
+
import { PhotoSizeError as U } from "../errors/photo-size.error.js";
|
|
5
|
+
const p = async (m, a = h, o = c, A = w, d = M) => new Promise(
|
|
6
|
+
(f, t) => {
|
|
7
|
+
const e = new FileReader();
|
|
8
8
|
let r = !1;
|
|
9
|
-
const
|
|
10
|
-
r || (r = !0,
|
|
9
|
+
const u = setTimeout(() => {
|
|
10
|
+
r || (r = !0, e.abort(), t(
|
|
11
11
|
new Error(
|
|
12
|
-
`${
|
|
12
|
+
`${E[o]["timeout-error"]}: ${A}${g}`
|
|
13
13
|
)
|
|
14
14
|
));
|
|
15
|
-
},
|
|
16
|
-
|
|
15
|
+
}, A);
|
|
16
|
+
e.addEventListener("load", () => {
|
|
17
17
|
if (r) return;
|
|
18
|
-
r = !0, clearTimeout(
|
|
19
|
-
const
|
|
20
|
-
if (!
|
|
21
|
-
|
|
18
|
+
r = !0, clearTimeout(u);
|
|
19
|
+
const i = e.result?.toString() || "";
|
|
20
|
+
if (!i) {
|
|
21
|
+
f("");
|
|
22
22
|
return;
|
|
23
23
|
}
|
|
24
|
-
const
|
|
25
|
-
|
|
26
|
-
const { naturalWidth: n, naturalHeight:
|
|
27
|
-
if (n <
|
|
28
|
-
const
|
|
29
|
-
|
|
30
|
-
} else if (
|
|
31
|
-
const
|
|
32
|
-
|
|
24
|
+
const s = new Image();
|
|
25
|
+
s.src = i, s.addEventListener("load", () => {
|
|
26
|
+
const { naturalWidth: n, naturalHeight: I } = s, L = I / n, _ = d >= 1 ? Math.ceil(a * d) : a, l = d >= 1 ? a : Math.ceil(a / d);
|
|
27
|
+
if (n < _ || I < l) {
|
|
28
|
+
const T = U.get(a, o, d);
|
|
29
|
+
t(T);
|
|
30
|
+
} else if (L > v || L < S) {
|
|
31
|
+
const T = new Error(E[o].aspect);
|
|
32
|
+
t(T);
|
|
33
33
|
} else
|
|
34
|
-
|
|
35
|
-
}),
|
|
36
|
-
const n = new Error(
|
|
37
|
-
|
|
38
|
-
}),
|
|
39
|
-
const n = new Error(
|
|
40
|
-
|
|
34
|
+
f(i);
|
|
35
|
+
}), s.addEventListener("error", () => {
|
|
36
|
+
const n = new Error(E[o]["paint-error"]);
|
|
37
|
+
t(n);
|
|
38
|
+
}), s.addEventListener("abort", () => {
|
|
39
|
+
const n = new Error(E[o]["read-abort"]);
|
|
40
|
+
t(n);
|
|
41
41
|
});
|
|
42
|
-
}),
|
|
43
|
-
r || (r = !0, clearTimeout(
|
|
44
|
-
}),
|
|
42
|
+
}), e.addEventListener("error", () => {
|
|
43
|
+
r || (r = !0, clearTimeout(u), t(e.error));
|
|
44
|
+
}), e.addEventListener("abort", () => {
|
|
45
45
|
if (r) return;
|
|
46
|
-
r = !0, clearTimeout(
|
|
47
|
-
const
|
|
48
|
-
|
|
49
|
-
}),
|
|
46
|
+
r = !0, clearTimeout(u);
|
|
47
|
+
const i = new Error(E[o]["paint-abort"]);
|
|
48
|
+
t(i);
|
|
49
|
+
}), e.readAsDataURL(m);
|
|
50
50
|
}
|
|
51
51
|
);
|
|
52
52
|
export {
|
|
53
|
-
|
|
53
|
+
p as readPhoto
|
|
54
54
|
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
const s = "data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M2.27623%200.391122C1.75553%20-0.129577%200.911316%20-0.129578%200.390616%200.391122C-0.130083%200.911821%20-0.130083%201.75604%200.390616%202.27674L6.04747%207.93359L0.390616%2013.5904C-0.130083%2014.1111%20-0.130083%2014.9554%200.390616%2015.4761C0.911316%2015.9968%201.75553%2015.9968%202.27623%2015.4761L7.93309%209.81921L13.5899%2015.4761C14.1106%2015.9968%2014.9549%2015.9968%2015.4756%2015.4761C15.9963%2014.9554%2015.9963%2014.1111%2015.4756%2013.5904L9.81871%207.93359L15.4756%202.27674C15.9963%201.75604%2015.9963%200.911822%2015.4756%200.391122C14.9549%20-0.129577%2014.1106%20-0.129578%2013.5899%200.391123L7.93309%206.04798L2.27623%200.391122Z'%20fill='%233AA8FF'/%3e%3c/svg%3e";
|
|
2
|
+
export {
|
|
3
|
+
s as c
|
|
4
|
+
};
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import { jsxs as l, Fragment as i, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import { DialogActions as d, IconButton as v, DialogTitle as h, DialogContent as N, Divider as C } from "@mui/material";
|
|
3
|
+
import t from "classnames";
|
|
4
|
+
import { localizedText as r } from "./components/photo-crop-uploader/locale.js";
|
|
5
|
+
import { EN_LOCALE as f, DASH_SYMBOL as A } from "./constants.js";
|
|
6
|
+
import { c as x } from "./raw-cross-BhC4FBfp.js";
|
|
7
|
+
import { Button as _ } from "./components/button/button.js";
|
|
8
|
+
import './assets/upload-dialog-errors.css';const D = "_dialog_1v8d5_1", k = "_dark_1v8d5_5", I = "_errorContent_1v8d5_9", B = "_errorItem_1v8d5_61", S = "_fileName_1v8d5_68", T = "_topActions_1v8d5_71", W = "_close_1v8d5_77", y = "_botActions_1v8d5_85", E = "_button_1v8d5_91", z = "_title_1v8d5_96", L = "_content_1v8d5_103", j = "_many_1v8d5_125", H = "_cropWrapper_1v8d5_129", O = "_crop_1v8d5_129", U = "_dialogText_1v8d5_198", e = {
|
|
9
|
+
dialog: D,
|
|
10
|
+
dark: k,
|
|
11
|
+
errorContent: I,
|
|
12
|
+
errorItem: B,
|
|
13
|
+
fileName: S,
|
|
14
|
+
topActions: T,
|
|
15
|
+
close: W,
|
|
16
|
+
botActions: y,
|
|
17
|
+
button: E,
|
|
18
|
+
title: z,
|
|
19
|
+
content: L,
|
|
20
|
+
many: j,
|
|
21
|
+
cropWrapper: H,
|
|
22
|
+
crop: O,
|
|
23
|
+
dialogText: U
|
|
24
|
+
}, G = (m) => {
|
|
25
|
+
const {
|
|
26
|
+
photoSources: c,
|
|
27
|
+
errors: p = [],
|
|
28
|
+
onCloseDialogHandler: s,
|
|
29
|
+
onClearErrors: u,
|
|
30
|
+
locale: n = f
|
|
31
|
+
} = m;
|
|
32
|
+
return /* @__PURE__ */ l(i, { children: [
|
|
33
|
+
/* @__PURE__ */ o(d, { className: t(e.topActions), children: /* @__PURE__ */ o(
|
|
34
|
+
v,
|
|
35
|
+
{
|
|
36
|
+
onClick: s,
|
|
37
|
+
className: t(e.close),
|
|
38
|
+
"aria-label": r[n].close,
|
|
39
|
+
children: /* @__PURE__ */ o(
|
|
40
|
+
"img",
|
|
41
|
+
{
|
|
42
|
+
draggable: !1,
|
|
43
|
+
src: x,
|
|
44
|
+
alt: r[n].close
|
|
45
|
+
}
|
|
46
|
+
)
|
|
47
|
+
}
|
|
48
|
+
) }),
|
|
49
|
+
/* @__PURE__ */ o(h, { className: t(e.title), children: c.length ? r[n]["some-not-uploaded"] : r[n]["not-uploaded"] }),
|
|
50
|
+
/* @__PURE__ */ o(N, { className: t(e.errorContent), children: p.map(({ photoName: b, errorMessage: g }, a) => /* @__PURE__ */ l(i, { children: [
|
|
51
|
+
!!a && /* @__PURE__ */ o(C, {}),
|
|
52
|
+
/* @__PURE__ */ l("div", { className: t(e.errorItem), children: [
|
|
53
|
+
/* @__PURE__ */ o("span", { className: t(e.fileName), children: b }),
|
|
54
|
+
" ",
|
|
55
|
+
` ${A} ${g}`
|
|
56
|
+
] })
|
|
57
|
+
] }, a)) }),
|
|
58
|
+
/* @__PURE__ */ l(d, { className: t(e.botActions), children: [
|
|
59
|
+
/* @__PURE__ */ o(
|
|
60
|
+
_,
|
|
61
|
+
{
|
|
62
|
+
buttonSize: "small",
|
|
63
|
+
buttonColor: "red",
|
|
64
|
+
buttonVariant: "outlined",
|
|
65
|
+
buttonWeight: 500,
|
|
66
|
+
onClick: s,
|
|
67
|
+
className: t(e.button),
|
|
68
|
+
children: r[n].close
|
|
69
|
+
}
|
|
70
|
+
),
|
|
71
|
+
!!c.length && /* @__PURE__ */ o(
|
|
72
|
+
_,
|
|
73
|
+
{
|
|
74
|
+
buttonSize: "small",
|
|
75
|
+
buttonColor: "blue",
|
|
76
|
+
buttonVariant: "outlined",
|
|
77
|
+
buttonWeight: 500,
|
|
78
|
+
onClick: u,
|
|
79
|
+
className: t(e.button),
|
|
80
|
+
children: r[n].continue
|
|
81
|
+
}
|
|
82
|
+
)
|
|
83
|
+
] })
|
|
84
|
+
] });
|
|
85
|
+
};
|
|
86
|
+
export {
|
|
87
|
+
G as U,
|
|
88
|
+
e as s
|
|
89
|
+
};
|
package/package.json
CHANGED
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import { jsxs as r, Fragment as i, jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import { DialogTitle as g, DialogContent as v, Divider as h, DialogActions as C } from "@mui/material";
|
|
3
|
-
import o from "classnames";
|
|
4
|
-
import { localizedText as c } from "./components/photo-crop-uploader/locale.js";
|
|
5
|
-
import { EN_LOCALE as N, DASH_SYMBOL as f } from "./constants.js";
|
|
6
|
-
import { Button as a } from "./components/button/button.js";
|
|
7
|
-
import './assets/upload-dialog-errors.css';const A = "_dialog_c18v1_1", x = "_dark_c18v1_5", D = "_errorContent_c18v1_9", k = "_errorItem_c18v1_61", S = "_fileName_c18v1_68", T = "_topActions_c18v1_71", y = "_close_c18v1_77", B = "_botActions_c18v1_85", E = "_button_c18v1_91", I = "_title_c18v1_96", z = "_content_c18v1_103", L = "_many_c18v1_125", j = "_crop_c18v1_129", H = "_dialogText_c18v1_177", t = {
|
|
8
|
-
dialog: A,
|
|
9
|
-
dark: x,
|
|
10
|
-
errorContent: D,
|
|
11
|
-
errorItem: k,
|
|
12
|
-
fileName: S,
|
|
13
|
-
topActions: T,
|
|
14
|
-
close: y,
|
|
15
|
-
botActions: B,
|
|
16
|
-
button: E,
|
|
17
|
-
title: I,
|
|
18
|
-
content: z,
|
|
19
|
-
many: L,
|
|
20
|
-
crop: j,
|
|
21
|
-
dialogText: H
|
|
22
|
-
}, M = (_) => {
|
|
23
|
-
const {
|
|
24
|
-
photoSources: l,
|
|
25
|
-
errors: m = [],
|
|
26
|
-
onCloseDialogHandler: d,
|
|
27
|
-
onClearErrors: u,
|
|
28
|
-
locale: e = N
|
|
29
|
-
} = _;
|
|
30
|
-
return /* @__PURE__ */ r(i, { children: [
|
|
31
|
-
/* @__PURE__ */ n(g, { className: o(t.title), children: l.length ? c[e]["some-not-uploaded"] : c[e]["not-uploaded"] }),
|
|
32
|
-
/* @__PURE__ */ n(v, { className: o(t.errorContent), children: m.map(({ photoName: p, errorMessage: b }, s) => /* @__PURE__ */ r(i, { children: [
|
|
33
|
-
!!s && /* @__PURE__ */ n(h, {}),
|
|
34
|
-
/* @__PURE__ */ r("div", { className: o(t.errorItem), children: [
|
|
35
|
-
/* @__PURE__ */ n("span", { className: o(t.fileName), children: p }),
|
|
36
|
-
" ",
|
|
37
|
-
` ${f} ${b}`
|
|
38
|
-
] })
|
|
39
|
-
] }, s)) }),
|
|
40
|
-
/* @__PURE__ */ r(C, { className: o(t.botActions), children: [
|
|
41
|
-
/* @__PURE__ */ n(
|
|
42
|
-
a,
|
|
43
|
-
{
|
|
44
|
-
buttonSize: "small",
|
|
45
|
-
buttonColor: "red",
|
|
46
|
-
buttonVariant: "outlined",
|
|
47
|
-
buttonWeight: 500,
|
|
48
|
-
onClick: d,
|
|
49
|
-
className: o(t.button),
|
|
50
|
-
children: c[e].close
|
|
51
|
-
}
|
|
52
|
-
),
|
|
53
|
-
!!l.length && /* @__PURE__ */ n(
|
|
54
|
-
a,
|
|
55
|
-
{
|
|
56
|
-
buttonSize: "small",
|
|
57
|
-
buttonColor: "blue",
|
|
58
|
-
buttonVariant: "outlined",
|
|
59
|
-
buttonWeight: 500,
|
|
60
|
-
onClick: u,
|
|
61
|
-
className: o(t.button),
|
|
62
|
-
children: c[e].continue
|
|
63
|
-
}
|
|
64
|
-
)
|
|
65
|
-
] })
|
|
66
|
-
] });
|
|
67
|
-
};
|
|
68
|
-
export {
|
|
69
|
-
M as U,
|
|
70
|
-
t as s
|
|
71
|
-
};
|