mimir-ui-kit 1.41.1 → 1.41.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/styles.css +1 -1
- package/dist/components/DatePicker/DatePicker.js +80 -82
- package/dist/components/DatePicker/DatePickerModal.js +1 -1
- package/dist/components/DatePicker/MonthPickerModal.js +1 -1
- package/dist/components/DatePicker/YearPickerModal.js +1 -1
- package/dist/components/Input/Input.d.ts +1 -1
- package/dist/styles.module-Cuqm31CO.js +28 -0
- package/package.json +1 -1
- package/dist/styles.module-BlOA4RBL.js +0 -28
package/dist/assets/styles.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
._input-field-group-
|
1
|
+
._input-field-group-datePicker_o2gm6_3{display:flex;flex-direction:column;gap:var(--mimir-space-2xs)}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8{--border-color: var(--citrine-100);position:relative;display:flex;align-items:center;border-radius:var(--mimir-control-radius-s)}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15{position:relative;width:100%}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15 ._input-wrapper_o2gm6_19{flex:1}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15 ._input-wrapper_o2gm6_19 ._right-slot_o2gm6_22{order:2;padding-top:0}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15 ._inputBorderControl_o2gm6_26{border:transparent}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15:hover ._input-wrapper_o2gm6_19{background-color:var(--input-bg-color-hover)}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15:before{position:absolute;top:0;right:45px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15._editable_o2gm6_39:before{display:none}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8 ._date-wrapper_o2gm6_15 svg{cursor:pointer}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8:has([data-status=error]){--border-color: var(--error-normal)}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8:has([data-status=success]){--border-color: var(--success-normal)}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8:has([data-status=alarm]){--border-color: var(--alarm-normal)}._input-field-group-datePicker_o2gm6_3 ._wrapper_o2gm6_8._active_o2gm6_54{border-bottom:1px solid var(--border-color)}._input-field-group-datePicker_o2gm6_3 ._textError_o2gm6_57{color:var(--gos-znak-diplomatic-background-color);font-weight:var(--mimir-font-weight-text-regular);font-size:var(--mimir-size-text-s);font-family:var(--mimir-font-inter);line-height:var(--mimir-size-text-m);text-align:left}._input_o2gm6_3{padding-right:var(--mimir-space-3xl)}[data-disabled=true] ._date-wrapper_o2gm6_15:before{cursor:auto}[data-disabled=true] ._date-wrapper_o2gm6_15 ._input-wrapper_o2gm6_19{background:var(--black-20)}[data-disabled=true] ._date-wrapper_o2gm6_15 ._input-wrapper_o2gm6_19 label,[data-disabled=true] ._date-wrapper_o2gm6_15 ._input-wrapper_o2gm6_19 input{color:var(--white)}[data-disabled=true] ._button-wrapper_o2gm6_80 svg{color:var(--white);cursor:default;fill:var(--white)}._button-wrapper_o2gm6_80{position:absolute;top:0;right:0;z-index:2;display:flex;justify-content:center;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_o2gm6_80{align-self:center;background-color:transparent;border-radius:var(--mimir-control-radius-s)}._calendar-block_o2gm6_104{position:absolute;z-index:var(--mimir-zindex-dropdown);display:flex;flex-direction:column;width:368px;max-height:none;padding:var(--mimir-space-m);font-weight:var(--mimir-font-weight-text-regular);font-size:var(--mimir-size-text-l);font-family:var(--mimir-font-inter);line-height:var(--mimir-line-height-text-2xs);text-align:center;text-overflow:ellipsis;background:var(--white);border-radius:var(--mimir-control-radius-s);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703;opacity:0;transition:height .5s ease-in;font-feature-settings:"zero";font-variant-numeric:slashed-zero}._calendar-block_o2gm6_104 ._h_o2gm6_126{display:flex;width:100%;color:var(--black-100)}._calendar-block_o2gm6_104 ._b_o2gm6_80{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_o2gm6_104 ._d_o2gm6_15{display:flex;flex:1;gap:var(--mimir-space-2xs);align-items:center;justify-content:center;color:var(--black-100);font-size:var(--mimir-size-text-l);cursor:pointer}._calendar-block_o2gm6_104 ._m_o2gm6_148,._calendar-block_o2gm6_104 ._a_o2gm6_54,._calendar-block_o2gm6_104 ._prev_o2gm6_150{width:auto;height:48px;overflow:hidden}._calendar-block_o2gm6_104 ._m_o2gm6_148{display:flex;align-items:center;justify-content:center;color:var(--disabled);font-size:var(--mimir-size-text-l)}._calendar-block_o2gm6_104 ._orange_o2gm6_164{color:var(--citrine-100)}._calendar-block_o2gm6_104 ._a_o2gm6_54{color:var(--black-100);font-size:var(--mimir-size-text-l);border-radius:var(--mimir-control-radius-s)}._calendar-block_o2gm6_104 ._a_o2gm6_54:hover{background:var(--black-10)}._calendar-block_o2gm6_104 ._a_o2gm6_54:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_o2gm6_104 ._current_o2gm6_181{background:var(--sapphire-10);border-radius:var(--mimir-control-radius-s)}._calendar-block_o2gm6_104 ._monthGrid_o2gm6_186{display:grid;grid-template-columns:repeat(3,1fr)}._icon-button_o2gm6_191{display:flex}
|
@@ -1,161 +1,159 @@
|
|
1
|
-
import { jsxs as R, jsx as
|
2
|
-
import { c as
|
3
|
-
import { memo as tt, forwardRef as st, useState as
|
1
|
+
import { jsxs as R, jsx as o } from "react/jsx-runtime";
|
2
|
+
import { c as u } from "../../index-DIxK0V-G.js";
|
3
|
+
import { memo as tt, forwardRef as st, useState as w, useEffect as x } from "react";
|
4
4
|
import { MAX_DAY as et, MAX_MONTH as it, DATE_LENGTH as rt } from "./constants.js";
|
5
|
-
import { DatePickerModal as
|
6
|
-
import { MonthPickerModal as
|
7
|
-
import { c as e } from "../../styles.module-
|
5
|
+
import { DatePickerModal as ct } from "./DatePickerModal.js";
|
6
|
+
import { MonthPickerModal as at } from "./MonthPickerModal.js";
|
7
|
+
import { c as e } from "../../styles.module-Cuqm31CO.js";
|
8
8
|
import { formatDatePart as U } from "./utils.js";
|
9
|
-
import { YearPickerModal as
|
9
|
+
import { YearPickerModal as ot } from "./YearPickerModal.js";
|
10
10
|
import { useClickOutside as mt } from "../../hooks/useClickOutside/useClickOutside.js";
|
11
11
|
import { Icon as X } from "../../icons/Icon.js";
|
12
|
-
import { formating as
|
12
|
+
import { formating as n } from "../../utils/index.js";
|
13
13
|
import { I as pt } from "../../Input-DAmc_HxO.js";
|
14
14
|
import { EInputStatus as dt, EInputSize as E } from "../Input/constants.js";
|
15
15
|
const ft = {
|
16
|
-
days:
|
17
|
-
months:
|
18
|
-
years:
|
16
|
+
days: ct,
|
17
|
+
months: at,
|
18
|
+
years: ot
|
19
19
|
}, yt = tt(
|
20
20
|
st(
|
21
21
|
({
|
22
|
-
size:
|
22
|
+
size: S,
|
23
23
|
value: i,
|
24
24
|
onChangeValue: t,
|
25
|
-
name:
|
26
|
-
before:
|
25
|
+
name: c,
|
26
|
+
before: $,
|
27
27
|
type: p = "days",
|
28
|
-
error:
|
28
|
+
error: _,
|
29
29
|
onError: d,
|
30
30
|
onBlur: r,
|
31
31
|
validateImmediately: O,
|
32
32
|
variant: F,
|
33
|
-
disabled:
|
34
|
-
editable:
|
33
|
+
disabled: g = !1,
|
34
|
+
editable: D = !1,
|
35
35
|
openOnInput: Y = !0,
|
36
36
|
sendIntermediateValues: G = !1,
|
37
|
-
...
|
38
|
-
},
|
39
|
-
const [A, m] =
|
37
|
+
...k
|
38
|
+
}, K) => {
|
39
|
+
const [A, m] = w(!1), [j, f] = w(p), [a, I] = w(
|
40
40
|
() => i && !isNaN(new Date(i).getTime()) ? new Date(i) : void 0
|
41
|
-
), [
|
42
|
-
|
43
|
-
|
44
|
-
}, [
|
41
|
+
), [P, b] = w(_), [W, T] = w("");
|
42
|
+
k.status = !!P && dt.Error || k.status, x(() => {
|
43
|
+
b(_);
|
44
|
+
}, [_]), x(() => {
|
45
45
|
I(
|
46
46
|
i && !isNaN(new Date(i).getTime()) ? new Date(i) : void 0
|
47
47
|
);
|
48
|
-
}, [i]),
|
49
|
-
|
50
|
-
}, [
|
48
|
+
}, [i]), x(() => {
|
49
|
+
a && typeof a != "string" && !isNaN(a == null ? void 0 : a.getTime()) ? T(n.Date(a, "dd/mm/yyyy")) : T("");
|
50
|
+
}, [a]);
|
51
51
|
const H = i && new Date(i).getTime;
|
52
|
-
|
53
|
-
O && (H ? (
|
54
|
-
}, [O,
|
52
|
+
x(() => {
|
53
|
+
O && (H ? (b(!1), d == null || d({ name: c, active: !1 })) : (b(!0), d == null || d({ name: c, active: !0 })));
|
54
|
+
}, [O, c, H]), mt({
|
55
55
|
isActive: A,
|
56
56
|
setActive: (s) => {
|
57
57
|
m(s), f(p);
|
58
58
|
},
|
59
59
|
className: e["calendar-block"]
|
60
60
|
});
|
61
|
-
const
|
62
|
-
!
|
61
|
+
const q = () => {
|
62
|
+
!g && (Y || !D) && m(!0);
|
63
63
|
}, J = (s) => {
|
64
64
|
isNaN(s.getTime()) || (I(s), t == null || t({
|
65
|
-
value:
|
66
|
-
name:
|
67
|
-
})),
|
68
|
-
value:
|
69
|
-
name:
|
70
|
-
}), r == null || r(
|
65
|
+
value: n.Date(s, "yyyy-mm-dd"),
|
66
|
+
name: c
|
67
|
+
})), j === "years" && (p === "years" ? (m(!1), f(p)) : f("months")), j === "months" && (p === "months" ? (m(!1), f(p)) : f("days")), I(s), t == null || t({
|
68
|
+
value: n.Date(s, "yyyy-mm-dd"),
|
69
|
+
name: c
|
70
|
+
}), r == null || r(n.Date(s, "yyyy-mm-dd"));
|
71
71
|
}, Q = (s) => {
|
72
|
-
if (
|
73
|
-
const
|
74
|
-
if (
|
75
|
-
|
72
|
+
if (D) {
|
73
|
+
const l = s.target.value.replace(/[^\d]/g, "");
|
74
|
+
if (l.length === 0)
|
75
|
+
T(""), t == null || t({ value: "", name: c }), r == null || r("");
|
76
76
|
else {
|
77
|
-
const [
|
78
|
-
U(
|
79
|
-
U(
|
80
|
-
|
81
|
-
], L = [
|
82
|
-
if (
|
83
|
-
const
|
77
|
+
const [y, M, N] = [
|
78
|
+
U(l.substring(0, 2), et),
|
79
|
+
U(l.substring(2, 4), it),
|
80
|
+
l.substring(4, 8)
|
81
|
+
], L = [y, M, N].filter(Boolean).join("/");
|
82
|
+
if (T(L), G) {
|
83
|
+
const h = N ? `${N}-${M || "00"}-${y || "00"}` : [y, M, N].filter(Boolean).join("-");
|
84
84
|
t == null || t({
|
85
|
-
value:
|
86
|
-
name:
|
85
|
+
value: h,
|
86
|
+
name: c
|
87
87
|
});
|
88
88
|
}
|
89
89
|
if (L.length === rt) {
|
90
|
-
const
|
91
|
-
`${
|
90
|
+
const h = parseInt(N), v = /* @__PURE__ */ new Date(
|
91
|
+
`${h}-${M.padStart(2, "0")}-${y.padStart(2, "0")}`
|
92
92
|
);
|
93
93
|
isNaN(v.getTime()) || (I(v), t == null || t({
|
94
|
-
value:
|
95
|
-
name:
|
96
|
-
}), r == null || r(
|
94
|
+
value: n.Date(v, "yyyy-mm-dd"),
|
95
|
+
name: c
|
96
|
+
}), r == null || r(n.Date(v, "yyyy-mm-dd")));
|
97
97
|
}
|
98
98
|
}
|
99
99
|
}
|
100
|
-
}, Z =
|
100
|
+
}, Z = u(e.wrapper, A && e.active), z = u(e.input, e.inputBorderControl), C = {
|
101
101
|
onChangeValue: J,
|
102
|
-
date:
|
103
|
-
before: typeof
|
102
|
+
date: a || /* @__PURE__ */ new Date(),
|
103
|
+
before: typeof $ == "string" ? new Date($) : $,
|
104
104
|
onChangeType: f,
|
105
105
|
setIsActive: m
|
106
|
-
}, B = ft[
|
107
|
-
|
108
|
-
}, className: e["icon-button"], children: s ? /* @__PURE__ */
|
106
|
+
}, B = ft[j], V = ({ isActive: s }) => /* @__PURE__ */ o("button", { onClick: (y) => {
|
107
|
+
y.stopPropagation(), g || m(!s);
|
108
|
+
}, className: e["icon-button"], children: s ? /* @__PURE__ */ o(
|
109
109
|
X,
|
110
110
|
{
|
111
|
-
iconName:
|
111
|
+
iconName: S === E.S ? "DropdownArrowUp16px" : "DropdownArrowUp24px"
|
112
112
|
}
|
113
|
-
) : /* @__PURE__ */
|
113
|
+
) : /* @__PURE__ */ o(
|
114
114
|
X,
|
115
115
|
{
|
116
|
-
iconName:
|
116
|
+
iconName: S === E.S ? "DropdownArrowBottom16px" : "DropdownArrowDown24px"
|
117
117
|
}
|
118
118
|
) });
|
119
119
|
return /* @__PURE__ */ R("div", { className: e["input-field-group-datePicker"], children: [
|
120
|
-
/* @__PURE__ */ R("div", { className: Z, "data-disabled":
|
121
|
-
/* @__PURE__ */
|
120
|
+
/* @__PURE__ */ R("div", { className: Z, "data-disabled": g, children: [
|
121
|
+
/* @__PURE__ */ o(
|
122
122
|
"div",
|
123
123
|
{
|
124
124
|
role: "button",
|
125
|
-
"data-
|
126
|
-
className:
|
127
|
-
[e.editable]:
|
125
|
+
"data-status": k.status,
|
126
|
+
className: u(e["date-wrapper"], {
|
127
|
+
[e.editable]: D
|
128
128
|
}),
|
129
|
-
onClick:
|
130
|
-
children: /* @__PURE__ */
|
129
|
+
onClick: q,
|
130
|
+
children: /* @__PURE__ */ o(
|
131
131
|
pt,
|
132
132
|
{
|
133
|
-
ref:
|
133
|
+
ref: K,
|
134
134
|
className: z,
|
135
135
|
wrapperClassName: e["input-wrapper"],
|
136
|
-
size:
|
136
|
+
size: S,
|
137
137
|
type: "text",
|
138
138
|
variant: F,
|
139
|
-
|
140
|
-
value: q,
|
139
|
+
value: W,
|
141
140
|
onChange: Q,
|
142
141
|
rightAddon: {
|
143
142
|
addonType: "react-node",
|
144
|
-
addonContent: /* @__PURE__ */
|
143
|
+
addonContent: /* @__PURE__ */ o(V, { isActive: A })
|
145
144
|
},
|
146
145
|
rightSlotClassName: e["right-slot"],
|
147
146
|
onFocus: () => {
|
148
|
-
Y && !
|
147
|
+
Y && !D && m(!0);
|
149
148
|
},
|
150
|
-
|
151
|
-
...K
|
149
|
+
...k
|
152
150
|
}
|
153
151
|
)
|
154
152
|
}
|
155
153
|
),
|
156
|
-
A && /* @__PURE__ */
|
154
|
+
A && /* @__PURE__ */ o(B, { ...C })
|
157
155
|
] }),
|
158
|
-
|
156
|
+
P && typeof P == "string" && /* @__PURE__ */ o("div", { className: e.textError, children: P })
|
159
157
|
] });
|
160
158
|
}
|
161
159
|
)
|
@@ -3,7 +3,7 @@ import { c as x } from "../../index-DIxK0V-G.js";
|
|
3
3
|
import { useState as O } from "react";
|
4
4
|
import { week as Y, COUNT_WORK_DAYS as j } from "./constants.js";
|
5
5
|
import { useDatePickerPosition as z } from "./hooks.js";
|
6
|
-
import { c as o } from "../../styles.module-
|
6
|
+
import { c as o } from "../../styles.module-Cuqm31CO.js";
|
7
7
|
import { getUpdateDate as M } from "./utils.js";
|
8
8
|
import { Icon as G } from "../../icons/Icon.js";
|
9
9
|
import { formating as s } from "../../utils/index.js";
|
@@ -3,7 +3,7 @@ import { c as k } from "../../index-DIxK0V-G.js";
|
|
3
3
|
import { useState as $ } from "react";
|
4
4
|
import { months as x } from "./constants.js";
|
5
5
|
import { useDatePickerPosition as v } from "./hooks.js";
|
6
|
-
import { c as e } from "../../styles.module-
|
6
|
+
import { c as e } from "../../styles.module-Cuqm31CO.js";
|
7
7
|
import { Icon as B } from "../../icons/Icon.js";
|
8
8
|
import { formating as a } from "../../utils/index.js";
|
9
9
|
import { Button as b } from "../Button/Button.js";
|
@@ -2,7 +2,7 @@ import { jsxs as p, jsx as o } from "react/jsx-runtime";
|
|
2
2
|
import { c as v } from "../../index-DIxK0V-G.js";
|
3
3
|
import { useState as x } from "react";
|
4
4
|
import { useDatePickerPosition as Y } from "./hooks.js";
|
5
|
-
import { c as t } from "../../styles.module-
|
5
|
+
import { c as t } from "../../styles.module-Cuqm31CO.js";
|
6
6
|
import { formating as n } from "../../utils/index.js";
|
7
7
|
import { Button as y } from "../Button/Button.js";
|
8
8
|
const F = ({
|
@@ -0,0 +1,28 @@
|
|
1
|
+
import './assets/styles.css';const o = "_wrapper_o2gm6_8", t = "_inputBorderControl_o2gm6_26", _ = "_editable_o2gm6_39", r = "_active_o2gm6_54", n = "_textError_o2gm6_57", e = "_input_o2gm6_3", p = "_button_o2gm6_80", c = "_h_o2gm6_126", a = "_b_o2gm6_80", g = "_d_o2gm6_15", m = "_m_o2gm6_148", i = "_a_o2gm6_54", u = "_prev_o2gm6_150", s = "_orange_o2gm6_164", d = "_current_o2gm6_181", b = "_monthGrid_o2gm6_186", l = {
|
2
|
+
"input-field-group-datePicker": "_input-field-group-datePicker_o2gm6_3",
|
3
|
+
wrapper: o,
|
4
|
+
"date-wrapper": "_date-wrapper_o2gm6_15",
|
5
|
+
"input-wrapper": "_input-wrapper_o2gm6_19",
|
6
|
+
"right-slot": "_right-slot_o2gm6_22",
|
7
|
+
inputBorderControl: t,
|
8
|
+
editable: _,
|
9
|
+
active: r,
|
10
|
+
textError: n,
|
11
|
+
input: e,
|
12
|
+
"button-wrapper": "_button-wrapper_o2gm6_80",
|
13
|
+
button: p,
|
14
|
+
"calendar-block": "_calendar-block_o2gm6_104",
|
15
|
+
h: c,
|
16
|
+
b: a,
|
17
|
+
d: g,
|
18
|
+
m,
|
19
|
+
a: i,
|
20
|
+
prev: u,
|
21
|
+
orange: s,
|
22
|
+
current: d,
|
23
|
+
monthGrid: b,
|
24
|
+
"icon-button": "_icon-button_o2gm6_191"
|
25
|
+
};
|
26
|
+
export {
|
27
|
+
l as c
|
28
|
+
};
|
package/package.json
CHANGED
@@ -1,28 +0,0 @@
|
|
1
|
-
import './assets/styles.css';const o = "_wrapper_1ogw2_8", t = "_inputBorderControl_1ogw2_26", _ = "_editable_1ogw2_39", r = "_active_1ogw2_48", n = "_textError_1ogw2_51", e = "_input_1ogw2_3", p = "_button_1ogw2_74", c = "_h_1ogw2_120", w = "_b_1ogw2_74", a = "_d_1ogw2_15", g = "_m_1ogw2_142", i = "_a_1ogw2_48", u = "_prev_1ogw2_144", s = "_orange_1ogw2_158", d = "_current_1ogw2_175", b = "_monthGrid_1ogw2_180", l = {
|
2
|
-
"input-field-group-datePicker": "_input-field-group-datePicker_1ogw2_3",
|
3
|
-
wrapper: o,
|
4
|
-
"date-wrapper": "_date-wrapper_1ogw2_15",
|
5
|
-
"input-wrapper": "_input-wrapper_1ogw2_19",
|
6
|
-
"right-slot": "_right-slot_1ogw2_22",
|
7
|
-
inputBorderControl: t,
|
8
|
-
editable: _,
|
9
|
-
active: r,
|
10
|
-
textError: n,
|
11
|
-
input: e,
|
12
|
-
"button-wrapper": "_button-wrapper_1ogw2_74",
|
13
|
-
button: p,
|
14
|
-
"calendar-block": "_calendar-block_1ogw2_98",
|
15
|
-
h: c,
|
16
|
-
b: w,
|
17
|
-
d: a,
|
18
|
-
m: g,
|
19
|
-
a: i,
|
20
|
-
prev: u,
|
21
|
-
orange: s,
|
22
|
-
current: d,
|
23
|
-
monthGrid: b,
|
24
|
-
"icon-button": "_icon-button_1ogw2_185"
|
25
|
-
};
|
26
|
-
export {
|
27
|
-
l as c
|
28
|
-
};
|