mimir-ui-kit 1.21.3 → 1.21.4
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/assets/Drawer.css +1 -1
- package/dist/assets/styles.css +1 -0
- package/dist/components/DatePicker/DatePicker.d.ts +12 -0
- package/dist/components/DatePicker/DatePicker.js +87 -18
- package/dist/components/DatePicker/DatePickerModal.d.ts +2 -1
- package/dist/components/DatePicker/DatePickerModal.js +182 -7
- package/dist/components/DatePicker/MonthPickerModal.d.ts +9 -0
- package/dist/components/DatePicker/MonthPickerModal.js +123 -0
- package/dist/components/DatePicker/YearPickerModal.d.ts +9 -0
- package/dist/components/DatePicker/YearPickerModal.js +120 -0
- package/dist/components/DatePicker/constants.d.ts +1 -0
- package/dist/components/DatePicker/constants.js +15 -0
- package/dist/components/Drawer/Drawer.js +19 -19
- package/dist/components/Steps/Steps.js +2 -2
- package/dist/components/Steps/constants.d.ts +11 -1
- package/dist/components/Steps/constants.js +44 -0
- package/dist/components/Uploader/Uploader.js +1 -1
- package/dist/icons/Icon.js +1 -1
- package/dist/icons/components/StepXL.d.ts +4 -0
- package/dist/icons/components/StepXL.js +32 -0
- package/dist/icons/components/index.d.ts +1 -0
- package/dist/icons/components/index.js +2 -1
- package/dist/{index-Cxiikb7g.js → index-VvtoJisa.js} +3 -0
- package/dist/styles.module-BZXDqssF.js +36 -0
- package/package.json +1 -1
- package/dist/DatePickerModal-BM0BgzTb.js +0 -204
- package/dist/assets/DatePickerModal.css +0 -1
package/dist/assets/Drawer.css
CHANGED
@@ -1 +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}
|
@@ -0,0 +1 @@
|
|
1
|
+
._input_3fxwe_2{padding-right:var(--space-3xl)}._input-wrapper_3fxwe_6{flex:1}._date-wrapper_3fxwe_10{position:relative;width:100%}._date-wrapper_3fxwe_10:hover ._input-wrapper_3fxwe_6{background-color:var(--input-bg-color-hover)}._date-wrapper_3fxwe_10:before{position:absolute;top:0;right:60px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}[data-disabled=true] ._date-wrapper_3fxwe_10:before{cursor:auto}[data-disabled=true] ._date-wrapper_3fxwe_10 ._input-wrapper_3fxwe_6{background:var(--black-20)}[data-disabled=true] ._date-wrapper_3fxwe_10 ._input-wrapper_3fxwe_6 label,[data-disabled=true] ._date-wrapper_3fxwe_10 ._input-wrapper_3fxwe_6 input{color:var(--white)}[data-disabled=true] ._button-wrapper_3fxwe_35 svg{color:var(--white);fill:var(--white);cursor:default}._wrapper_3fxwe_41{position:relative;display:flex;align-items:center;border-radius:var(--control-radius-s)}._wrapper_3fxwe_41._active_3fxwe_47{border-bottom:1px solid var(--citrine-100)}._button-wrapper_3fxwe_35{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_3fxwe_35{align-self:center;background-color:transparent;border-radius:var(--control-radius-s)}._field-overlow_3fxwe_68{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3}._calendar-block_3fxwe_74{position:absolute;z-index:3;display:flex;flex-direction:column;width:368px;max-height:none;padding:16px;font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-2xs);text-align:center;text-overflow:ellipsis;background:var(--white);border-radius:var(--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_3fxwe_74 ._h_3fxwe_97{display:flex;width:100%;color:var(--black-100)}._calendar-block_3fxwe_74 ._b_3fxwe_35{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_3fxwe_74 ._d_3fxwe_10{display:flex;flex:1;align-items:center;justify-content:center;color:var(--black-100);cursor:pointer;gap:4px}._calendar-block_3fxwe_74 ._m_3fxwe_118,._calendar-block_3fxwe_74 ._a_3fxwe_47,._calendar-block_3fxwe_74 ._prev_3fxwe_120{width:auto;height:48px;overflow:hidden}._calendar-block_3fxwe_74 ._m_3fxwe_118{display:flex;align-items:center;justify-content:center;color:var(--disabled)}._calendar-block_3fxwe_74 ._m_3fxwe_118 b{font-weight:var(--font-weight-text-regular)}._calendar-block_3fxwe_74 ._orange_3fxwe_136{color:var(--citrine-100)}._calendar-block_3fxwe_74 ._a_3fxwe_47{color:var(--black-100);border-radius:var(--control-radius-s)}._calendar-block_3fxwe_74 ._a_3fxwe_47 b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:var(--font-weight-text-regular);cursor:pointer}._calendar-block_3fxwe_74 ._a_3fxwe_47 b:hover{background:var(--black-10)}._calendar-block_3fxwe_74 ._a_3fxwe_47 b:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_3fxwe_74 ._current_3fxwe_161{background:var(--sapphire-10);border-radius:var(--control-radius-s)}._calendar-block_3fxwe_74 ._monthGrid_3fxwe_166{display:grid;grid-template-columns:repeat(3,1fr)}
|
@@ -14,6 +14,12 @@ export type DatePicker = {
|
|
14
14
|
* значение из стейта (data)
|
15
15
|
*/
|
16
16
|
value?: string;
|
17
|
+
/**
|
18
|
+
* значение типа модально окна календаря
|
19
|
+
*/
|
20
|
+
type?: 'days' | 'months' | 'years';
|
21
|
+
disabled?: boolean;
|
22
|
+
error?: boolean;
|
17
23
|
} & TInputProps;
|
18
24
|
export type TDatePickerValue = {
|
19
25
|
value?: Date;
|
@@ -33,4 +39,10 @@ export declare const DatePicker: import('react').MemoExoticComponent<import('rea
|
|
33
39
|
* значение из стейта (data)
|
34
40
|
*/
|
35
41
|
value?: string;
|
42
|
+
/**
|
43
|
+
* значение типа модально окна календаря
|
44
|
+
*/
|
45
|
+
type?: "days" | "months" | "years";
|
46
|
+
disabled?: boolean;
|
47
|
+
error?: boolean;
|
36
48
|
} & import('../Input/types').TInputProps & import('../Input').TAdditionalProps & import('react').RefAttributes<HTMLInputElement>>>;
|
@@ -1,44 +1,92 @@
|
|
1
1
|
import { jsxs, jsx } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
|
-
import { memo, forwardRef, useState } from "react";
|
4
|
-
import {
|
3
|
+
import { memo, forwardRef, useState, useEffect } from "react";
|
4
|
+
import { DatePickerModal } from "./DatePickerModal.js";
|
5
|
+
import { MonthPickerModal } from "./MonthPickerModal.js";
|
6
|
+
import { c as cls } from "../../styles.module-BZXDqssF.js";
|
7
|
+
import { YearPickerModal } from "./YearPickerModal.js";
|
5
8
|
import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
|
6
9
|
import { formating } from "../../utils/index.js";
|
7
10
|
import { Button } from "../Button/Button.js";
|
8
11
|
import { I as Input } from "../../Input-6mudFqTb.js";
|
12
|
+
import { EInputVariant } from "../Input/constants.js";
|
9
13
|
const DatePicker = memo(
|
10
14
|
forwardRef(
|
11
|
-
({
|
15
|
+
({
|
16
|
+
size,
|
17
|
+
value,
|
18
|
+
onChangeValue,
|
19
|
+
name,
|
20
|
+
before,
|
21
|
+
type = "days",
|
22
|
+
error,
|
23
|
+
variant,
|
24
|
+
disabled = false,
|
25
|
+
...props
|
26
|
+
}, ref) => {
|
12
27
|
const [isActive, setActive] = useState(false);
|
28
|
+
const [pickerType, setType] = useState(type);
|
13
29
|
const [date, setDate] = useState(
|
14
30
|
value ? new Date(value) : /* @__PURE__ */ new Date()
|
15
31
|
);
|
32
|
+
const [isError, setError] = useState(error);
|
33
|
+
useEffect(() => {
|
34
|
+
setError(error);
|
35
|
+
}, [error]);
|
16
36
|
useClickOutside({
|
17
37
|
isActive,
|
18
|
-
setActive
|
38
|
+
setActive: (e) => {
|
39
|
+
setActive(e);
|
40
|
+
setType(type);
|
41
|
+
},
|
19
42
|
className: cls["calendar-block"]
|
20
43
|
});
|
21
44
|
const onOpen = () => {
|
22
|
-
setActive(true);
|
45
|
+
if (!disabled) setActive(true);
|
23
46
|
};
|
24
47
|
const onDate = (d) => {
|
48
|
+
if (pickerType === "years") {
|
49
|
+
if (type === "years") {
|
50
|
+
setActive(false);
|
51
|
+
setType(type);
|
52
|
+
} else {
|
53
|
+
setType("months");
|
54
|
+
}
|
55
|
+
}
|
56
|
+
if (pickerType === "months") {
|
57
|
+
if (type === "months") {
|
58
|
+
setActive(false);
|
59
|
+
setType(type);
|
60
|
+
} else {
|
61
|
+
setType("days");
|
62
|
+
}
|
63
|
+
}
|
25
64
|
setDate(d);
|
26
65
|
onChangeValue == null ? void 0 : onChangeValue({ value: d, name });
|
27
66
|
};
|
28
67
|
const wrapperClassNames = classNames(cls.wrapper, isActive && cls.active);
|
29
|
-
return /* @__PURE__ */ jsxs("div", { className: wrapperClassNames, children: [
|
30
|
-
/* @__PURE__ */ jsx(
|
31
|
-
|
68
|
+
return /* @__PURE__ */ jsxs("div", { className: wrapperClassNames, "data-disabled": disabled, children: [
|
69
|
+
/* @__PURE__ */ jsx(
|
70
|
+
"div",
|
32
71
|
{
|
33
|
-
|
34
|
-
className: cls
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
72
|
+
"data-error": isError,
|
73
|
+
className: cls["date-wrapper"],
|
74
|
+
onClick: onOpen,
|
75
|
+
children: /* @__PURE__ */ jsx(
|
76
|
+
Input,
|
77
|
+
{
|
78
|
+
ref,
|
79
|
+
className: cls.input,
|
80
|
+
wrapperClassName: cls["input-wrapper"],
|
81
|
+
size,
|
82
|
+
type: "text",
|
83
|
+
variant: isError ? EInputVariant.Error : variant,
|
84
|
+
value: formating.Date(date, "dd.mm.yy"),
|
85
|
+
...props
|
86
|
+
}
|
87
|
+
)
|
40
88
|
}
|
41
|
-
)
|
89
|
+
),
|
42
90
|
/* @__PURE__ */ jsx("div", { className: cls["button-wrapper"], children: /* @__PURE__ */ jsx(
|
43
91
|
Button,
|
44
92
|
{
|
@@ -50,13 +98,34 @@ const DatePicker = memo(
|
|
50
98
|
iconName: isActive ? "DropdownArrowUp16px" : "DropdownArrowBottom16px"
|
51
99
|
}
|
52
100
|
) }),
|
53
|
-
isActive && /* @__PURE__ */ jsx(
|
101
|
+
pickerType === "days" && isActive && /* @__PURE__ */ jsx(
|
54
102
|
DatePickerModal,
|
55
103
|
{
|
56
104
|
onChangeValue: onDate,
|
57
105
|
date,
|
58
106
|
setActive,
|
59
|
-
before: typeof before === "string" ? new Date(before) : before
|
107
|
+
before: typeof before === "string" ? new Date(before) : before,
|
108
|
+
onType: setType
|
109
|
+
}
|
110
|
+
),
|
111
|
+
pickerType === "months" && isActive && /* @__PURE__ */ jsx(
|
112
|
+
MonthPickerModal,
|
113
|
+
{
|
114
|
+
onChangeValue: onDate,
|
115
|
+
date,
|
116
|
+
setActive,
|
117
|
+
before: typeof before === "string" ? new Date(before) : before,
|
118
|
+
onType: setType
|
119
|
+
}
|
120
|
+
),
|
121
|
+
pickerType === "years" && isActive && /* @__PURE__ */ jsx(
|
122
|
+
YearPickerModal,
|
123
|
+
{
|
124
|
+
onChangeValue: onDate,
|
125
|
+
date,
|
126
|
+
setActive,
|
127
|
+
before: typeof before === "string" ? new Date(before) : before,
|
128
|
+
onType: setType
|
60
129
|
}
|
61
130
|
)
|
62
131
|
] });
|
@@ -3,6 +3,7 @@ type DatePickerModal = {
|
|
3
3
|
onChangeValue: (d: Date) => void;
|
4
4
|
setActive: (s: boolean) => void;
|
5
5
|
before?: Date;
|
6
|
+
onType?: (s: 'days' | 'months' | 'years') => void;
|
6
7
|
};
|
7
|
-
export declare function DatePickerModal({ date, onChangeValue, setActive, before }: DatePickerModal): import("react/jsx-runtime").JSX.Element;
|
8
|
+
export declare function DatePickerModal({ date, onChangeValue, setActive, before, onType }: DatePickerModal): import("react/jsx-runtime").JSX.Element;
|
8
9
|
export {};
|
@@ -1,9 +1,184 @@
|
|
1
|
-
import "react/jsx-runtime";
|
2
|
-
import "react";
|
3
|
-
import "./constants.js";
|
4
|
-
import {
|
5
|
-
import "../../
|
6
|
-
import "
|
1
|
+
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
2
|
+
import { useRef, useState, useEffect } from "react";
|
3
|
+
import { week } from "./constants.js";
|
4
|
+
import { c as cls } from "../../styles.module-BZXDqssF.js";
|
5
|
+
import { Icon } from "../../icons/Icon.js";
|
6
|
+
import { formating } from "../../utils/index.js";
|
7
|
+
import { Button } from "../Button/Button.js";
|
8
|
+
function DatePickerModal({
|
9
|
+
date,
|
10
|
+
onChangeValue,
|
11
|
+
setActive,
|
12
|
+
before,
|
13
|
+
onType
|
14
|
+
}) {
|
15
|
+
const field = useRef(null);
|
16
|
+
const _current = new Date(date);
|
17
|
+
const _selecte = new Date(date);
|
18
|
+
const current = {
|
19
|
+
y: _current.getFullYear(),
|
20
|
+
d: _current.getDate(),
|
21
|
+
m: _current.getMonth() + 1
|
22
|
+
};
|
23
|
+
const selecte = {
|
24
|
+
y: _selecte.getFullYear(),
|
25
|
+
d: _selecte.getDate(),
|
26
|
+
m: _selecte.getMonth() + 1
|
27
|
+
};
|
28
|
+
const countWorkDays = 4;
|
29
|
+
const [month, setMonth] = useState({ y: selecte.y, m: selecte.m });
|
30
|
+
const blockWidth = 368;
|
31
|
+
useEffect(() => {
|
32
|
+
var _a, _b, _c, _d;
|
33
|
+
const windowHeight = window.innerHeight;
|
34
|
+
const windowWidth = window.innerWidth;
|
35
|
+
if (field.current !== null) {
|
36
|
+
const inputWidth = ((_b = (_a = field == null ? void 0 : field.current) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.offsetWidth) || 0;
|
37
|
+
const inputHeight = (_d = (_c = field == null ? void 0 : field.current) == null ? void 0 : _c.parentElement) == null ? void 0 : _d.offsetHeight;
|
38
|
+
const inputPosition = field.current.getBoundingClientRect();
|
39
|
+
const calendarSize = field.current.offsetHeight;
|
40
|
+
if (windowHeight < inputPosition.y + calendarSize) {
|
41
|
+
field.current.style.top = -calendarSize + "px";
|
42
|
+
} else {
|
43
|
+
field.current.style.top = inputHeight + "px";
|
44
|
+
}
|
45
|
+
if (windowWidth < inputPosition.x + blockWidth) {
|
46
|
+
field.current.style.left = inputWidth - blockWidth + "px";
|
47
|
+
}
|
48
|
+
field.current.style.opacity = "1";
|
49
|
+
}
|
50
|
+
}, [month]);
|
51
|
+
const countPrevDays = (e) => {
|
52
|
+
let dayOfWeek = e.getDay();
|
53
|
+
if (dayOfWeek === 0) dayOfWeek = 7;
|
54
|
+
return dayOfWeek - 1;
|
55
|
+
};
|
56
|
+
const currentMonthIndex = month.m - 1;
|
57
|
+
const currentMonthFull = new Date(month.y, currentMonthIndex);
|
58
|
+
const days = [];
|
59
|
+
const prevDays = () => {
|
60
|
+
const prevMonth = new Date(currentMonthFull);
|
61
|
+
prevMonth.setDate(prevMonth.getDate() - 1);
|
62
|
+
const lastDayPrevMohth = prevMonth.getDate();
|
63
|
+
const prevList = [];
|
64
|
+
for (let i = 0; i < countPrevDays(currentMonthFull); i++) {
|
65
|
+
prevList.push(lastDayPrevMohth - i);
|
66
|
+
}
|
67
|
+
prevList.reverse();
|
68
|
+
return prevList;
|
69
|
+
};
|
70
|
+
const prevDaysArray = prevDays();
|
71
|
+
while (currentMonthFull.getMonth() === currentMonthIndex) {
|
72
|
+
days.push(currentMonthFull.getDate());
|
73
|
+
currentMonthFull.setDate(currentMonthFull.getDate() + 1);
|
74
|
+
}
|
75
|
+
const nextDays = () => {
|
76
|
+
const totalViewDays = 42;
|
77
|
+
const daysCount = totalViewDays - (prevDaysArray.length + days.length);
|
78
|
+
const nextList = [];
|
79
|
+
for (let i = 1; i <= daysCount; i++) {
|
80
|
+
nextList.push(i);
|
81
|
+
}
|
82
|
+
return nextList;
|
83
|
+
};
|
84
|
+
const nextDaysArray = nextDays();
|
85
|
+
const update = (m, y) => {
|
86
|
+
y = m > 12 ? y + 1 : m < 1 ? y - 1 : y;
|
87
|
+
m = m > 12 ? 1 : m < 1 ? 12 : m;
|
88
|
+
return { y, m };
|
89
|
+
};
|
90
|
+
const onExit = () => {
|
91
|
+
setActive(false);
|
92
|
+
};
|
93
|
+
const next = () => {
|
94
|
+
setMonth(update(month.m + 1, month.y));
|
95
|
+
};
|
96
|
+
const prev = () => {
|
97
|
+
setMonth(update(month.m - 1, month.y));
|
98
|
+
};
|
99
|
+
const isBefore = (activeDate) => {
|
100
|
+
if (before) {
|
101
|
+
const beforeDate = before.getTime();
|
102
|
+
if (beforeDate > activeDate) return true;
|
103
|
+
}
|
104
|
+
return false;
|
105
|
+
};
|
106
|
+
const send = (searchDate) => {
|
107
|
+
if (isBefore(
|
108
|
+
(/* @__PURE__ */ new Date(
|
109
|
+
`${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
|
110
|
+
)).getTime()
|
111
|
+
))
|
112
|
+
return;
|
113
|
+
onChangeValue(
|
114
|
+
/* @__PURE__ */ new Date(
|
115
|
+
`${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
|
116
|
+
)
|
117
|
+
);
|
118
|
+
onExit();
|
119
|
+
};
|
120
|
+
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
|
121
|
+
/* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
|
122
|
+
/* @__PURE__ */ jsx(
|
123
|
+
Button,
|
124
|
+
{
|
125
|
+
isIconButton: true,
|
126
|
+
iconName: "DropdownArrowLeft16px",
|
127
|
+
onClick: prev,
|
128
|
+
variant: "secondary-gray",
|
129
|
+
size: "l"
|
130
|
+
}
|
131
|
+
),
|
132
|
+
/* @__PURE__ */ jsxs("div", { className: cls["d"], onClick: () => onType == null ? void 0 : onType("months"), children: [
|
133
|
+
formating.Month(month.m).name,
|
134
|
+
"’",
|
135
|
+
month.y.toString().slice(-2),
|
136
|
+
/* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
|
137
|
+
] }),
|
138
|
+
/* @__PURE__ */ jsx(
|
139
|
+
Button,
|
140
|
+
{
|
141
|
+
isIconButton: true,
|
142
|
+
iconName: "DropdownArrowRight16px",
|
143
|
+
onClick: next,
|
144
|
+
variant: "secondary-gray",
|
145
|
+
size: "l"
|
146
|
+
}
|
147
|
+
)
|
148
|
+
] }),
|
149
|
+
/* @__PURE__ */ jsxs("div", { className: cls["b"], children: [
|
150
|
+
week.map((i, s) => /* @__PURE__ */ jsx(
|
151
|
+
"div",
|
152
|
+
{
|
153
|
+
className: `${s > countWorkDays ? [cls["m"], cls["orange"]].join(" ") : cls["m"]}`,
|
154
|
+
children: i
|
155
|
+
},
|
156
|
+
`v${s}`
|
157
|
+
)),
|
158
|
+
prevDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key)),
|
159
|
+
days.map((i, s) => /* @__PURE__ */ jsx(
|
160
|
+
"div",
|
161
|
+
{
|
162
|
+
className: isBefore(
|
163
|
+
(/* @__PURE__ */ new Date(
|
164
|
+
`${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, i)}`
|
165
|
+
)).getTime()
|
166
|
+
) ? cls["m"] : cls["a"],
|
167
|
+
children: i !== 0 ? /* @__PURE__ */ jsx(
|
168
|
+
"b",
|
169
|
+
{
|
170
|
+
className: current.y === month.y && current.m === month.m && current.d === i ? cls["current"] : "",
|
171
|
+
onClick: () => send(i),
|
172
|
+
children: i
|
173
|
+
}
|
174
|
+
) : /* @__PURE__ */ jsx("p", {})
|
175
|
+
},
|
176
|
+
s
|
177
|
+
)),
|
178
|
+
nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
|
179
|
+
] })
|
180
|
+
] }) });
|
181
|
+
}
|
7
182
|
export {
|
8
|
-
|
183
|
+
DatePickerModal
|
9
184
|
};
|
@@ -0,0 +1,9 @@
|
|
1
|
+
type MonthPickerModal = {
|
2
|
+
date: Date;
|
3
|
+
onChangeValue: (d: Date) => void;
|
4
|
+
setActive: (s: boolean) => void;
|
5
|
+
before?: Date;
|
6
|
+
onType?: (s: 'years') => void;
|
7
|
+
};
|
8
|
+
export declare function MonthPickerModal({ date, onChangeValue, before, onType }: MonthPickerModal): import("react/jsx-runtime").JSX.Element;
|
9
|
+
export {};
|
@@ -0,0 +1,123 @@
|
|
1
|
+
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
2
|
+
import { useRef, useState, useEffect } from "react";
|
3
|
+
import { months } from "./constants.js";
|
4
|
+
import { c as cls } from "../../styles.module-BZXDqssF.js";
|
5
|
+
import { Icon } from "../../icons/Icon.js";
|
6
|
+
import { formating } from "../../utils/index.js";
|
7
|
+
import { Button } from "../Button/Button.js";
|
8
|
+
function MonthPickerModal({
|
9
|
+
date,
|
10
|
+
onChangeValue,
|
11
|
+
before,
|
12
|
+
onType
|
13
|
+
}) {
|
14
|
+
const field = useRef(null);
|
15
|
+
const _current = new Date(date);
|
16
|
+
const _selecte = new Date(date);
|
17
|
+
const current = {
|
18
|
+
y: _current.getFullYear(),
|
19
|
+
d: _current.getDate(),
|
20
|
+
m: _current.getMonth() + 1
|
21
|
+
};
|
22
|
+
const selecte = {
|
23
|
+
y: _selecte.getFullYear(),
|
24
|
+
d: _selecte.getDate(),
|
25
|
+
m: _selecte.getMonth() + 1
|
26
|
+
};
|
27
|
+
const [year, setYear] = useState(selecte.y);
|
28
|
+
const blockWidth = 368;
|
29
|
+
useEffect(() => {
|
30
|
+
var _a, _b, _c, _d;
|
31
|
+
const windowHeight = window.innerHeight;
|
32
|
+
const windowWidth = window.innerWidth;
|
33
|
+
if (field.current !== null) {
|
34
|
+
const inputWidth = ((_b = (_a = field == null ? void 0 : field.current) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.offsetWidth) || 0;
|
35
|
+
const inputHeight = (_d = (_c = field == null ? void 0 : field.current) == null ? void 0 : _c.parentElement) == null ? void 0 : _d.offsetHeight;
|
36
|
+
const inputPosition = field.current.getBoundingClientRect();
|
37
|
+
const calendarSize = field.current.offsetHeight;
|
38
|
+
if (windowHeight < inputPosition.y + calendarSize) {
|
39
|
+
field.current.style.top = -calendarSize + "px";
|
40
|
+
} else {
|
41
|
+
field.current.style.top = inputHeight + "px";
|
42
|
+
}
|
43
|
+
if (windowWidth < inputPosition.x + blockWidth) {
|
44
|
+
field.current.style.left = inputWidth - blockWidth + "px";
|
45
|
+
}
|
46
|
+
field.current.style.opacity = "1";
|
47
|
+
}
|
48
|
+
}, []);
|
49
|
+
const next = () => {
|
50
|
+
setYear(year + 1);
|
51
|
+
};
|
52
|
+
const prev = () => {
|
53
|
+
setYear(year - 1);
|
54
|
+
};
|
55
|
+
const isBefore = (activeDate) => {
|
56
|
+
if (before) {
|
57
|
+
const beforeDate = before.getTime();
|
58
|
+
if (beforeDate > activeDate) return true;
|
59
|
+
}
|
60
|
+
return false;
|
61
|
+
};
|
62
|
+
const send = (searchDate) => {
|
63
|
+
if (isBefore(
|
64
|
+
(/* @__PURE__ */ new Date(
|
65
|
+
`${year}-${formating.Number(2, searchDate)}-${formating.Number(2, selecte.d)}`
|
66
|
+
)).getTime()
|
67
|
+
))
|
68
|
+
return;
|
69
|
+
onChangeValue(
|
70
|
+
/* @__PURE__ */ new Date(
|
71
|
+
`${year}-${formating.Number(2, searchDate)}-${formating.Number(2, selecte.d)}`
|
72
|
+
)
|
73
|
+
);
|
74
|
+
};
|
75
|
+
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
|
76
|
+
/* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
|
77
|
+
/* @__PURE__ */ jsx(
|
78
|
+
Button,
|
79
|
+
{
|
80
|
+
isIconButton: true,
|
81
|
+
iconName: "DropdownArrowLeft16px",
|
82
|
+
onClick: prev,
|
83
|
+
variant: "secondary-gray",
|
84
|
+
size: "l"
|
85
|
+
}
|
86
|
+
),
|
87
|
+
/* @__PURE__ */ jsxs("div", { onClick: () => onType == null ? void 0 : onType("years"), className: cls["d"], children: [
|
88
|
+
year.toString(),
|
89
|
+
/* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
|
90
|
+
] }),
|
91
|
+
/* @__PURE__ */ jsx(
|
92
|
+
Button,
|
93
|
+
{
|
94
|
+
isIconButton: true,
|
95
|
+
iconName: "DropdownArrowRight16px",
|
96
|
+
onClick: next,
|
97
|
+
variant: "secondary-gray",
|
98
|
+
size: "l"
|
99
|
+
}
|
100
|
+
)
|
101
|
+
] }),
|
102
|
+
/* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: months.map((i, s) => /* @__PURE__ */ jsx(
|
103
|
+
"div",
|
104
|
+
{
|
105
|
+
className: isBefore(
|
106
|
+
(/* @__PURE__ */ new Date(`${year}-${formating.Number(2, s + 1)}`)).getTime()
|
107
|
+
) ? cls["m"] : cls["a"],
|
108
|
+
children: /* @__PURE__ */ jsx(
|
109
|
+
"b",
|
110
|
+
{
|
111
|
+
className: current.y === year && current.m === s + 1 ? cls["current"] : "",
|
112
|
+
onClick: () => send(s + 1),
|
113
|
+
children: i
|
114
|
+
}
|
115
|
+
)
|
116
|
+
},
|
117
|
+
s
|
118
|
+
)) })
|
119
|
+
] }) });
|
120
|
+
}
|
121
|
+
export {
|
122
|
+
MonthPickerModal
|
123
|
+
};
|
@@ -0,0 +1,9 @@
|
|
1
|
+
type YearPickerModal = {
|
2
|
+
date: Date;
|
3
|
+
onChangeValue: (d: Date) => void;
|
4
|
+
setActive: (s: boolean) => void;
|
5
|
+
before?: Date;
|
6
|
+
onType?: (s: 'years') => void;
|
7
|
+
};
|
8
|
+
export declare function YearPickerModal({ date, onChangeValue, before, onType }: YearPickerModal): import("react/jsx-runtime").JSX.Element;
|
9
|
+
export {};
|
@@ -0,0 +1,120 @@
|
|
1
|
+
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
2
|
+
import { useRef, useState, useEffect } from "react";
|
3
|
+
import { c as cls } from "../../styles.module-BZXDqssF.js";
|
4
|
+
import { formating } from "../../utils/index.js";
|
5
|
+
import { Button } from "../Button/Button.js";
|
6
|
+
function YearPickerModal({
|
7
|
+
date,
|
8
|
+
onChangeValue,
|
9
|
+
before,
|
10
|
+
onType
|
11
|
+
}) {
|
12
|
+
const field = useRef(null);
|
13
|
+
const _current = new Date(date);
|
14
|
+
const _selecte = new Date(date);
|
15
|
+
const current = {
|
16
|
+
y: _current.getFullYear(),
|
17
|
+
d: _current.getDate(),
|
18
|
+
m: _current.getMonth() + 1
|
19
|
+
};
|
20
|
+
const selecte = {
|
21
|
+
y: _selecte.getFullYear(),
|
22
|
+
d: _selecte.getDate(),
|
23
|
+
m: _selecte.getMonth() + 1
|
24
|
+
};
|
25
|
+
const [year, setYear] = useState(selecte.y);
|
26
|
+
const blockWidth = 368;
|
27
|
+
const firstYears = year - 7;
|
28
|
+
const years = Array.from(Array(15).keys()).map((i) => i + firstYears);
|
29
|
+
useEffect(() => {
|
30
|
+
var _a, _b, _c, _d;
|
31
|
+
const windowHeight = window.innerHeight;
|
32
|
+
const windowWidth = window.innerWidth;
|
33
|
+
if (field.current !== null) {
|
34
|
+
const inputWidth = ((_b = (_a = field == null ? void 0 : field.current) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.offsetWidth) || 0;
|
35
|
+
const inputHeight = (_d = (_c = field == null ? void 0 : field.current) == null ? void 0 : _c.parentElement) == null ? void 0 : _d.offsetHeight;
|
36
|
+
const inputPosition = field.current.getBoundingClientRect();
|
37
|
+
const calendarSize = field.current.offsetHeight;
|
38
|
+
if (windowHeight < inputPosition.y + calendarSize) {
|
39
|
+
field.current.style.top = -calendarSize + "px";
|
40
|
+
} else {
|
41
|
+
field.current.style.top = inputHeight + "px";
|
42
|
+
}
|
43
|
+
if (windowWidth < inputPosition.x + blockWidth) {
|
44
|
+
field.current.style.left = inputWidth - blockWidth + "px";
|
45
|
+
}
|
46
|
+
field.current.style.opacity = "1";
|
47
|
+
}
|
48
|
+
}, []);
|
49
|
+
const next = () => {
|
50
|
+
setYear(year + 15);
|
51
|
+
};
|
52
|
+
const prev = () => {
|
53
|
+
setYear(year - 15);
|
54
|
+
};
|
55
|
+
const isBefore = (activeDate) => {
|
56
|
+
if (before) {
|
57
|
+
const beforeDate = before.getTime();
|
58
|
+
if (beforeDate > activeDate) return true;
|
59
|
+
}
|
60
|
+
return false;
|
61
|
+
};
|
62
|
+
const send = (searchDate) => {
|
63
|
+
if (isBefore(
|
64
|
+
(/* @__PURE__ */ new Date(
|
65
|
+
`${searchDate}-${formating.Number(2, selecte.m)}-${formating.Number(2, selecte.d)}`
|
66
|
+
)).getTime()
|
67
|
+
))
|
68
|
+
return;
|
69
|
+
onChangeValue(
|
70
|
+
/* @__PURE__ */ new Date(
|
71
|
+
`${searchDate}-${formating.Number(2, selecte.m)}-${formating.Number(2, selecte.d)}`
|
72
|
+
)
|
73
|
+
);
|
74
|
+
};
|
75
|
+
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
|
76
|
+
/* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
|
77
|
+
/* @__PURE__ */ jsx(
|
78
|
+
Button,
|
79
|
+
{
|
80
|
+
isIconButton: true,
|
81
|
+
iconName: "DropdownArrowLeft16px",
|
82
|
+
onClick: prev,
|
83
|
+
variant: "secondary-gray",
|
84
|
+
size: "l"
|
85
|
+
}
|
86
|
+
),
|
87
|
+
/* @__PURE__ */ jsx("div", { onClick: () => onType == null ? void 0 : onType("years"), className: cls["d"] }),
|
88
|
+
/* @__PURE__ */ jsx(
|
89
|
+
Button,
|
90
|
+
{
|
91
|
+
isIconButton: true,
|
92
|
+
iconName: "DropdownArrowRight16px",
|
93
|
+
onClick: next,
|
94
|
+
variant: "secondary-gray",
|
95
|
+
size: "l"
|
96
|
+
}
|
97
|
+
)
|
98
|
+
] }),
|
99
|
+
/* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: years.map((i, s) => /* @__PURE__ */ jsx(
|
100
|
+
"div",
|
101
|
+
{
|
102
|
+
className: isBefore(
|
103
|
+
(/* @__PURE__ */ new Date(`${i}-${formating.Number(2, current.m)}`)).getTime()
|
104
|
+
) ? cls["m"] : cls["a"],
|
105
|
+
children: /* @__PURE__ */ jsx(
|
106
|
+
"b",
|
107
|
+
{
|
108
|
+
className: current.y === i ? cls["current"] : "",
|
109
|
+
onClick: () => send(i),
|
110
|
+
children: i
|
111
|
+
}
|
112
|
+
)
|
113
|
+
},
|
114
|
+
s
|
115
|
+
)) })
|
116
|
+
] }) });
|
117
|
+
}
|
118
|
+
export {
|
119
|
+
YearPickerModal
|
120
|
+
};
|
@@ -5,7 +5,22 @@ var EDatePickerBeforeDate = /* @__PURE__ */ ((EDatePickerBeforeDate2) => {
|
|
5
5
|
return EDatePickerBeforeDate2;
|
6
6
|
})(EDatePickerBeforeDate || {});
|
7
7
|
const week = ["пн", "вт", "ср", "чт", "пт", "сб", "вс"];
|
8
|
+
const months = [
|
9
|
+
"Январь",
|
10
|
+
"Февраль",
|
11
|
+
"Март",
|
12
|
+
"Апрель",
|
13
|
+
"Май",
|
14
|
+
"Июнь",
|
15
|
+
"Июль",
|
16
|
+
"Август",
|
17
|
+
"Сентябрь",
|
18
|
+
"Октябрь",
|
19
|
+
"Ноябрь",
|
20
|
+
"Декабрь"
|
21
|
+
];
|
8
22
|
export {
|
9
23
|
EDatePickerBeforeDate,
|
24
|
+
months,
|
10
25
|
week
|
11
26
|
};
|
@@ -10,39 +10,39 @@ 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 = "
|
14
|
-
const content = "
|
15
|
-
const header = "
|
16
|
-
const title = "
|
17
|
-
const space = "
|
18
|
-
const inner = "
|
19
|
-
const button = "
|
20
|
-
const footer = "
|
21
|
-
const left = "
|
22
|
-
const right = "
|
23
|
-
const full = "
|
24
|
-
const bottom = "
|
25
|
-
const opened = "
|
26
|
-
const overlay = "
|
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";
|
27
27
|
const cls = {
|
28
28
|
drawer,
|
29
29
|
content,
|
30
|
-
"is-loading": "_is-
|
30
|
+
"is-loading": "_is-loading_1atax_41",
|
31
31
|
header,
|
32
|
-
"sticky-header": "_sticky-
|
32
|
+
"sticky-header": "_sticky-header_1atax_53",
|
33
33
|
title,
|
34
34
|
space,
|
35
35
|
inner,
|
36
36
|
button,
|
37
37
|
footer,
|
38
|
-
"footer-button": "_footer-
|
38
|
+
"footer-button": "_footer-button_1atax_101",
|
39
39
|
left,
|
40
40
|
right,
|
41
41
|
full,
|
42
42
|
bottom,
|
43
|
-
"full-bottom-height": "_full-bottom-
|
43
|
+
"full-bottom-height": "_full-bottom-height_1atax_134",
|
44
44
|
opened,
|
45
|
-
"is-closing": "_is-
|
45
|
+
"is-closing": "_is-closing_1atax_159",
|
46
46
|
overlay
|
47
47
|
};
|
48
48
|
const ANIMATION_DELAY = 300;
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
3
|
import { forwardRef, useId, useState, useRef, useEffect } from "react";
|
4
|
-
import { ZERO_STEP, EStepsSize, ID_SEPARATOR, StepSize, DIFF_BETWEEN_STEP_AND_INDEX } from "./constants.js";
|
4
|
+
import { ZERO_STEP, EStepsSize, ID_SEPARATOR, STEP_ICONS_MAP, StepSize, DIFF_BETWEEN_STEP_AND_INDEX } from "./constants.js";
|
5
5
|
import { Icon } from "../../icons/Icon.js";
|
6
6
|
import '../../assets/Steps.css';const container = "_container_1qg9i_2";
|
7
7
|
const step = "_step_1qg9i_6";
|
@@ -69,7 +69,7 @@ const Steps = forwardRef(
|
|
69
69
|
onMouseEnter: handleMouseEnter,
|
70
70
|
onMouseLeave: handleMouseLeave,
|
71
71
|
style: { color },
|
72
|
-
children: /* @__PURE__ */ jsx(Icon, { iconName:
|
72
|
+
children: /* @__PURE__ */ jsx(Icon, { iconName: STEP_ICONS_MAP[size].icon, ...StepSize[size] })
|
73
73
|
},
|
74
74
|
idx
|
75
75
|
);
|
@@ -1,3 +1,5 @@
|
|
1
|
+
import { TIcon } from '../../icons';
|
2
|
+
|
1
3
|
export declare const ZERO_STEP = 0;
|
2
4
|
export declare const DIFF_BETWEEN_STEP_AND_INDEX = 1;
|
3
5
|
export declare const ID_SEPARATOR = "-//-";
|
@@ -6,7 +8,8 @@ export declare enum EStepsSize {
|
|
6
8
|
XS1 = "XS1",
|
7
9
|
S = "S",
|
8
10
|
M = "M",
|
9
|
-
L = "L"
|
11
|
+
L = "L",
|
12
|
+
XL = "XL"
|
10
13
|
}
|
11
14
|
export declare const StepSize: {
|
12
15
|
XS: {
|
@@ -29,7 +32,14 @@ export declare const StepSize: {
|
|
29
32
|
width: number;
|
30
33
|
height: number;
|
31
34
|
};
|
35
|
+
XL: {
|
36
|
+
width: number;
|
37
|
+
height: number;
|
38
|
+
};
|
32
39
|
};
|
40
|
+
export declare const STEP_ICONS_MAP: Record<EStepsSize, {
|
41
|
+
icon: TIcon;
|
42
|
+
}>;
|
33
43
|
export declare enum EStepColor {
|
34
44
|
ASPHALT = "#333333",
|
35
45
|
CITRINE = "#ff7900",
|
@@ -7,6 +7,7 @@ var EStepsSize = /* @__PURE__ */ ((EStepsSize2) => {
|
|
7
7
|
EStepsSize2["S"] = "S";
|
8
8
|
EStepsSize2["M"] = "M";
|
9
9
|
EStepsSize2["L"] = "L";
|
10
|
+
EStepsSize2["XL"] = "XL";
|
10
11
|
return EStepsSize2;
|
11
12
|
})(EStepsSize || {});
|
12
13
|
const StepSize = {
|
@@ -29,6 +30,48 @@ const StepSize = {
|
|
29
30
|
L: {
|
30
31
|
width: 64,
|
31
32
|
height: 28
|
33
|
+
},
|
34
|
+
XL: {
|
35
|
+
width: 72,
|
36
|
+
height: 12
|
37
|
+
}
|
38
|
+
};
|
39
|
+
const STEP_ICONS_MAP = {
|
40
|
+
[
|
41
|
+
"XS"
|
42
|
+
/* XS */
|
43
|
+
]: {
|
44
|
+
icon: "Step"
|
45
|
+
},
|
46
|
+
[
|
47
|
+
"XS1"
|
48
|
+
/* XS1 */
|
49
|
+
]: {
|
50
|
+
icon: "Step"
|
51
|
+
},
|
52
|
+
[
|
53
|
+
"S"
|
54
|
+
/* S */
|
55
|
+
]: {
|
56
|
+
icon: "Step"
|
57
|
+
},
|
58
|
+
[
|
59
|
+
"M"
|
60
|
+
/* M */
|
61
|
+
]: {
|
62
|
+
icon: "Step"
|
63
|
+
},
|
64
|
+
[
|
65
|
+
"L"
|
66
|
+
/* L */
|
67
|
+
]: {
|
68
|
+
icon: "Step"
|
69
|
+
},
|
70
|
+
[
|
71
|
+
"XL"
|
72
|
+
/* XL */
|
73
|
+
]: {
|
74
|
+
icon: "StepXL"
|
32
75
|
}
|
33
76
|
};
|
34
77
|
var EStepColor = /* @__PURE__ */ ((EStepColor2) => {
|
@@ -44,6 +87,7 @@ export {
|
|
44
87
|
EStepColor,
|
45
88
|
EStepsSize,
|
46
89
|
ID_SEPARATOR,
|
90
|
+
STEP_ICONS_MAP,
|
47
91
|
StepSize,
|
48
92
|
ZERO_STEP
|
49
93
|
};
|
@@ -23,7 +23,7 @@ const MIME = {
|
|
23
23
|
};
|
24
24
|
const filesTyps = ["jpeg", "jpg", "png", "tiff", "gif"];
|
25
25
|
const generateId = (min, max) => {
|
26
|
-
return Math.random() * (max - min) + min;
|
26
|
+
return Math.round(Math.random() * (max - min) + min);
|
27
27
|
};
|
28
28
|
const Uploader = forwardRef(
|
29
29
|
(props, ref) => {
|
package/dist/icons/Icon.js
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
2
2
|
import { Suspense } from "react";
|
3
|
-
import { i as icons } from "../index-
|
3
|
+
import { i as icons } from "../index-VvtoJisa.js";
|
4
4
|
const Icon = ({ iconName, ...props }) => {
|
5
5
|
const Component = icons[iconName];
|
6
6
|
if (!Component) {
|
@@ -0,0 +1,32 @@
|
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
2
|
+
const StepXL = ({ ...props }) => /* @__PURE__ */ jsxs(
|
3
|
+
"svg",
|
4
|
+
{
|
5
|
+
...props,
|
6
|
+
viewBox: "0 0 71.1113 12",
|
7
|
+
fill: "none",
|
8
|
+
xmlns: "http://www.w3.org/2000/svg",
|
9
|
+
children: [
|
10
|
+
/* @__PURE__ */ jsx(
|
11
|
+
"path",
|
12
|
+
{
|
13
|
+
d: "M0 11.99L3.78 3.51C4.73 1.37 6.89 0 9.25 0L10 0L10 11.99L0 11.99L0 11.99Z",
|
14
|
+
fill: "currentColor",
|
15
|
+
fillRule: "evenodd"
|
16
|
+
}
|
17
|
+
),
|
18
|
+
/* @__PURE__ */ jsx("path", { d: "M10,0H61.11V12H10Z", fill: "currentColor" }),
|
19
|
+
/* @__PURE__ */ jsx(
|
20
|
+
"path",
|
21
|
+
{
|
22
|
+
d: "M71.11 0L67.32 8.48C66.37 10.62 64.22 11.99 61.86 11.99L61.11 11.99L61.11 0L71.11 0L71.11 0Z",
|
23
|
+
fill: "currentColor",
|
24
|
+
fillRule: "evenodd"
|
25
|
+
}
|
26
|
+
)
|
27
|
+
]
|
28
|
+
}
|
29
|
+
);
|
30
|
+
export {
|
31
|
+
StepXL as default
|
32
|
+
};
|
@@ -574,3 +574,4 @@ export declare const Car: import('react').LazyExoticComponent<(props: import('re
|
|
574
574
|
export declare const Bike: import('react').LazyExoticComponent<(props: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
|
575
575
|
export declare const Mans: import('react').LazyExoticComponent<(props: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
|
576
576
|
export declare const Step: import('react').LazyExoticComponent<(props: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
|
577
|
+
export declare const StepXL: import('react').LazyExoticComponent<({ ...props }: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import "react";
|
2
|
-
import { i5, A, b4, cZ, eQ, a, b, b5, b6, c_, c, d, b7, b8, c$, d0, e, f, b9, ba, d1, g, bb, d2, eT, hK, hJ, eU, eS, h, bc, d3, k, bd, d4, l, be, d5, m, bf, d6, j, bg, d7, n, hI, o, bh, d8, eR, hH, hG, gk, gl, hF, B, p, bi, bj, d9, da, i4, i9, i3, i2, i1, hE, hD, hC, hB, hA, hz, i0, q, bk, db, r, s, bm, dc, dd, bl, t, bn, de, u, bo, df, i8, v, w, bp, bq, dg, dh, h$, h_, hZ, hy, hx, hw, hv, hu, ht, hs, hr, hq, hp, ho, hn, hm, hl, hk, hj, hi, gj, x, br, di, y, z, bs, bt, dj, dk, fz, fy, D, bu, dl, E, F, bv, bw, dm, dn, G, bx, dp, eV, fK, h3, C, H, by, dq, I, bz, dr, J, bA, ds, K, L, bB, bC, dt, du, hh, hg, hf, he, M, N, bD, bE, dv, dw, O, bF, dx, hd, hY, gi, gh, gg, gf, hX, P, bG, dy, ge, Q, bH, dz, R, bI, dA, S, bJ, dB, T, bK, dC, hc, U, bL, dD, V, bM, dE, W, bN, dF, X, bO, dG, gd, hb, Y, bP, dH, hW, i7, Z, bQ, dI, ha, gc, _, bR, dJ, $, bS, dK, a0, a1, bT, bU, dL, dM, gb, ga, g9, a2, bV, dN, a3, bW, dO, a4, bX, dP, g8, h9, h8, g7, h7, hV, a5, bY, dQ, g6, a6, bZ, dR, g5, a7, b_, dS, hU, g4, g3, a8, b$, dT, g2, g1, g0, f$, h6, f_, fZ, a9, c0, dU, fY, aa, ab, c1, c2, dV, dW, fX, fW, fV, ac, c3, dX, fU, fT, h5, c4, c5, fS, h4, fR, fQ, fO, fP, fN, fI, fM, fL, fJ, ad, c6, dY, fH, fG, fE, fF, fD, h2, hT, ae, c7, dZ, fC, hS, af, c8, d_, fB, fA, fs, fx, ia, ag, c9, d$, fw, ah, ca, e0, ai, cb, e1, fv, fu, h1, h0, g$, g_, gZ, aj, cc, e2, ft, gY, gW, gX, ak, cd, e3, fr, al, am, ce, cf, e4, e5, an, cg, e6, hR, hQ, fq, gV, fp, gU, gT, gS, ao, ch, e7, ap, ci, e8, aq, ar, cj, ck, e9, ea, gR, gQ, fm, as, cl, eb, fo, at, au, cm, cn, ec, ed, fn, av, co, ee, gP, gO, gN, aw, cp, ef, ax, cq, eg, ay, cr, eh, az, cs, ei, aA, ct, ej, gM, gL, gK, aB, aC, cu, cv, ek, el, fl, fk, fj, fi, aD, cw, em, fh, aE, cx, en, fg, ff, gJ, aF, cy, eo, gI, fe, fd, aG, cz, ep, eq, aH, cA, fc, fb, gH, fa, f9, f8, aI, cB, er, aJ, aK, cC, cD, es, et, aL, cE, eu, ib, gG, aM, cF, ev, aN, cG, ew, gF, gE, aO, cH, ex, f7, f6, gD, f5, gC, gB, hP, gA, gz, gy, gx, gw, gv, gu, gt, gs, gr, gq, aP, cI, ey, f4, i6, gp, aQ, cJ, ez, aR, cK, eA, f3, aS, cL, eB, f2, aT, aU, cM, cN, eC, eD, aV, cO, eE, go, hO, f1, aW, aX, cP, cQ, eF, eG, aY, aZ, cR, cS, eH, eI, f0, a_, cT, eJ, e$, gn, e_, eZ, a$, cU, eK, hN, b0, cV, eL, hM, hL, eY, b1, cW, eM, eX, gm, b2, cX, eN, b3, cY, eO, eW, eP } from "../../index-
|
2
|
+
import { i5, A, b4, cZ, eQ, a, b, b5, b6, c_, c, d, b7, b8, c$, d0, e, f, b9, ba, d1, g, bb, d2, eT, hK, hJ, eU, eS, h, bc, d3, k, bd, d4, l, be, d5, m, bf, d6, j, bg, d7, n, hI, o, bh, d8, eR, hH, hG, gk, gl, hF, B, p, bi, bj, d9, da, i4, i9, i3, i2, i1, hE, hD, hC, hB, hA, hz, i0, q, bk, db, r, s, bm, dc, dd, bl, t, bn, de, u, bo, df, i8, v, w, bp, bq, dg, dh, h$, h_, hZ, hy, hx, hw, hv, hu, ht, hs, hr, hq, hp, ho, hn, hm, hl, hk, hj, hi, gj, x, br, di, y, z, bs, bt, dj, dk, fz, fy, D, bu, dl, E, F, bv, bw, dm, dn, G, bx, dp, eV, fK, h3, C, H, by, dq, I, bz, dr, J, bA, ds, K, L, bB, bC, dt, du, hh, hg, hf, he, M, N, bD, bE, dv, dw, O, bF, dx, hd, hY, gi, gh, gg, gf, hX, P, bG, dy, ge, Q, bH, dz, R, bI, dA, S, bJ, dB, T, bK, dC, hc, U, bL, dD, V, bM, dE, W, bN, dF, X, bO, dG, gd, hb, Y, bP, dH, hW, i7, Z, bQ, dI, ha, gc, _, bR, dJ, $, bS, dK, a0, a1, bT, bU, dL, dM, gb, ga, g9, a2, bV, dN, a3, bW, dO, a4, bX, dP, g8, h9, h8, g7, h7, hV, a5, bY, dQ, g6, a6, bZ, dR, g5, a7, b_, dS, hU, g4, g3, a8, b$, dT, g2, g1, g0, f$, h6, f_, fZ, a9, c0, dU, fY, aa, ab, c1, c2, dV, dW, fX, fW, fV, ac, c3, dX, fU, fT, h5, c4, c5, fS, h4, fR, fQ, fO, fP, fN, fI, fM, fL, fJ, ad, c6, dY, fH, fG, fE, fF, fD, h2, hT, ae, c7, dZ, fC, hS, af, c8, d_, fB, fA, fs, fx, ia, ag, c9, d$, fw, ah, ca, e0, ai, cb, e1, fv, fu, h1, h0, g$, g_, gZ, aj, cc, e2, ft, gY, gW, gX, ak, cd, e3, fr, al, am, ce, cf, e4, e5, an, cg, e6, hR, hQ, fq, gV, fp, gU, gT, gS, ao, ch, e7, ap, ci, e8, aq, ar, cj, ck, e9, ea, gR, gQ, fm, as, cl, eb, fo, at, au, cm, cn, ec, ed, fn, av, co, ee, gP, gO, gN, aw, cp, ef, ax, cq, eg, ay, cr, eh, az, cs, ei, aA, ct, ej, gM, gL, gK, aB, aC, cu, cv, ek, el, fl, fk, fj, fi, aD, cw, em, fh, aE, cx, en, fg, ff, gJ, aF, cy, eo, gI, fe, fd, aG, cz, ep, eq, aH, cA, fc, fb, gH, fa, f9, f8, aI, cB, er, aJ, aK, cC, cD, es, et, aL, cE, eu, ib, ic, gG, aM, cF, ev, aN, cG, ew, gF, gE, aO, cH, ex, f7, f6, gD, f5, gC, gB, hP, gA, gz, gy, gx, gw, gv, gu, gt, gs, gr, gq, aP, cI, ey, f4, i6, gp, aQ, cJ, ez, aR, cK, eA, f3, aS, cL, eB, f2, aT, aU, cM, cN, eC, eD, aV, cO, eE, go, hO, f1, aW, aX, cP, cQ, eF, eG, aY, aZ, cR, cS, eH, eI, f0, a_, cT, eJ, e$, gn, e_, eZ, a$, cU, eK, hN, b0, cV, eL, hM, hL, eY, b1, cW, eM, eX, gm, b2, cX, eN, b3, cY, eO, eW, eP } from "../../index-VvtoJisa.js";
|
3
3
|
export {
|
4
4
|
i5 as Acceleration,
|
5
5
|
A as Accept16px,
|
@@ -475,6 +475,7 @@ export {
|
|
475
475
|
cE as StarHalf24pxF,
|
476
476
|
eu as StarHalf32pxF,
|
477
477
|
ib as Step,
|
478
|
+
ic as StepXL,
|
478
479
|
gG as TankerTruck,
|
479
480
|
aM as Telegram16pxF,
|
480
481
|
cF as Telegram24pxF,
|
@@ -839,6 +839,7 @@ const Car = lazy(() => import("./icons/components/cars-stubus/Car.js"));
|
|
839
839
|
const Bike = lazy(() => import("./icons/components/cars-stubus/Bike.js"));
|
840
840
|
const Mans = lazy(() => import("./icons/components/Mans.js"));
|
841
841
|
const Step = lazy(() => import("./icons/components/Step.js"));
|
842
|
+
const StepXL = lazy(() => import("./icons/components/StepXL.js"));
|
842
843
|
const icons = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
843
844
|
__proto__: null,
|
844
845
|
Acceleration,
|
@@ -1315,6 +1316,7 @@ const icons = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert
|
|
1315
1316
|
StarHalf24pxF,
|
1316
1317
|
StarHalf32pxF,
|
1317
1318
|
Step,
|
1319
|
+
StepXL,
|
1318
1320
|
TankerTruck,
|
1319
1321
|
Telegram16pxF,
|
1320
1322
|
Telegram24pxF,
|
@@ -1979,6 +1981,7 @@ export {
|
|
1979
1981
|
Bike as i9,
|
1980
1982
|
Mans as ia,
|
1981
1983
|
Step as ib,
|
1984
|
+
StepXL as ic,
|
1982
1985
|
ArrowUpRight16px as j,
|
1983
1986
|
ArrowLeft16px as k,
|
1984
1987
|
ArrowRight16px as l,
|
@@ -0,0 +1,36 @@
|
|
1
|
+
import './assets/styles.css';const input = "_input_3fxwe_2";
|
2
|
+
const wrapper = "_wrapper_3fxwe_41";
|
3
|
+
const active = "_active_3fxwe_47";
|
4
|
+
const button = "_button_3fxwe_35";
|
5
|
+
const h = "_h_3fxwe_97";
|
6
|
+
const b = "_b_3fxwe_35";
|
7
|
+
const d = "_d_3fxwe_10";
|
8
|
+
const m = "_m_3fxwe_118";
|
9
|
+
const a = "_a_3fxwe_47";
|
10
|
+
const prev = "_prev_3fxwe_120";
|
11
|
+
const orange = "_orange_3fxwe_136";
|
12
|
+
const current = "_current_3fxwe_161";
|
13
|
+
const monthGrid = "_monthGrid_3fxwe_166";
|
14
|
+
const cls = {
|
15
|
+
input,
|
16
|
+
"input-wrapper": "_input-wrapper_3fxwe_6",
|
17
|
+
"date-wrapper": "_date-wrapper_3fxwe_10",
|
18
|
+
"button-wrapper": "_button-wrapper_3fxwe_35",
|
19
|
+
wrapper,
|
20
|
+
active,
|
21
|
+
button,
|
22
|
+
"field-overlow": "_field-overlow_3fxwe_68",
|
23
|
+
"calendar-block": "_calendar-block_3fxwe_74",
|
24
|
+
h,
|
25
|
+
b,
|
26
|
+
d,
|
27
|
+
m,
|
28
|
+
a,
|
29
|
+
prev,
|
30
|
+
orange,
|
31
|
+
current,
|
32
|
+
monthGrid
|
33
|
+
};
|
34
|
+
export {
|
35
|
+
cls as c
|
36
|
+
};
|
package/package.json
CHANGED
@@ -1,204 +0,0 @@
|
|
1
|
-
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
2
|
-
import { useRef, useState, useEffect } from "react";
|
3
|
-
import { week } from "./components/DatePicker/constants.js";
|
4
|
-
import { formating } from "./utils/index.js";
|
5
|
-
import { Button } from "./components/Button/Button.js";
|
6
|
-
import './assets/DatePickerModal.css';const input = "_input_1ndkx_2";
|
7
|
-
const wrapper = "_wrapper_1ndkx_21";
|
8
|
-
const active = "_active_1ndkx_27";
|
9
|
-
const button = "_button_1ndkx_35";
|
10
|
-
const h = "_h_1ndkx_81";
|
11
|
-
const b = "_b_1ndkx_35";
|
12
|
-
const d = "_d_1ndkx_6";
|
13
|
-
const m = "_m_1ndkx_100";
|
14
|
-
const a = "_a_1ndkx_27";
|
15
|
-
const prev = "_prev_1ndkx_102";
|
16
|
-
const orange = "_orange_1ndkx_118";
|
17
|
-
const current = "_current_1ndkx_143";
|
18
|
-
const cls = {
|
19
|
-
input,
|
20
|
-
"date-wrapper": "_date-wrapper_1ndkx_6",
|
21
|
-
wrapper,
|
22
|
-
active,
|
23
|
-
"input-wrapper": "_input-wrapper_1ndkx_31",
|
24
|
-
"button-wrapper": "_button-wrapper_1ndkx_35",
|
25
|
-
button,
|
26
|
-
"field-overlow": "_field-overlow_1ndkx_52",
|
27
|
-
"calendar-block": "_calendar-block_1ndkx_58",
|
28
|
-
h,
|
29
|
-
b,
|
30
|
-
d,
|
31
|
-
m,
|
32
|
-
a,
|
33
|
-
prev,
|
34
|
-
orange,
|
35
|
-
current
|
36
|
-
};
|
37
|
-
function DatePickerModal({
|
38
|
-
date,
|
39
|
-
onChangeValue,
|
40
|
-
setActive,
|
41
|
-
before
|
42
|
-
}) {
|
43
|
-
const field = useRef(null);
|
44
|
-
const _current = new Date(date);
|
45
|
-
const _selecte = new Date(date);
|
46
|
-
const current2 = {
|
47
|
-
y: _current.getFullYear(),
|
48
|
-
d: _current.getDate(),
|
49
|
-
m: _current.getMonth() + 1
|
50
|
-
};
|
51
|
-
const selecte = {
|
52
|
-
y: _selecte.getFullYear(),
|
53
|
-
d: _selecte.getDate(),
|
54
|
-
m: _selecte.getMonth() + 1
|
55
|
-
};
|
56
|
-
const countWorkDays = 4;
|
57
|
-
const [month, setMonth] = useState({ y: selecte.y, m: selecte.m });
|
58
|
-
useEffect(() => {
|
59
|
-
const windowHeight = window.innerHeight;
|
60
|
-
if (field.current !== null) {
|
61
|
-
const inputPosition = field.current.getBoundingClientRect();
|
62
|
-
const calendarSize = field.current.offsetHeight;
|
63
|
-
if (windowHeight < inputPosition.y + calendarSize) {
|
64
|
-
field.current.style.top = -calendarSize + "px";
|
65
|
-
} else {
|
66
|
-
field.current.style.top = "65px";
|
67
|
-
}
|
68
|
-
field.current.style.opacity = "1";
|
69
|
-
}
|
70
|
-
}, [month]);
|
71
|
-
const countPrevDays = (e) => {
|
72
|
-
let dayOfWeek = e.getDay();
|
73
|
-
if (dayOfWeek === 0) dayOfWeek = 7;
|
74
|
-
return dayOfWeek - 1;
|
75
|
-
};
|
76
|
-
const currentMonthIndex = month.m - 1;
|
77
|
-
const currentMonthFull = new Date(month.y, currentMonthIndex);
|
78
|
-
const days = [];
|
79
|
-
const prevDays = () => {
|
80
|
-
const prevMonth = new Date(currentMonthFull);
|
81
|
-
prevMonth.setDate(prevMonth.getDate() - 1);
|
82
|
-
const lastDayPrevMohth = prevMonth.getDate();
|
83
|
-
const prevList = [];
|
84
|
-
for (let i = 0; i < countPrevDays(currentMonthFull); i++) {
|
85
|
-
prevList.push(lastDayPrevMohth - i);
|
86
|
-
}
|
87
|
-
prevList.reverse();
|
88
|
-
return prevList;
|
89
|
-
};
|
90
|
-
const prevDaysArray = prevDays();
|
91
|
-
while (currentMonthFull.getMonth() === currentMonthIndex) {
|
92
|
-
days.push(currentMonthFull.getDate());
|
93
|
-
currentMonthFull.setDate(currentMonthFull.getDate() + 1);
|
94
|
-
}
|
95
|
-
const nextDays = () => {
|
96
|
-
const totalViewDays = 42;
|
97
|
-
const daysCount = totalViewDays - (prevDaysArray.length + days.length);
|
98
|
-
const nextList = [];
|
99
|
-
for (let i = 1; i <= daysCount; i++) {
|
100
|
-
nextList.push(i);
|
101
|
-
}
|
102
|
-
return nextList;
|
103
|
-
};
|
104
|
-
const nextDaysArray = nextDays();
|
105
|
-
const update = (m2, y) => {
|
106
|
-
y = m2 > 12 ? y + 1 : m2 < 1 ? y - 1 : y;
|
107
|
-
m2 = m2 > 12 ? 1 : m2 < 1 ? 12 : m2;
|
108
|
-
return { y, m: m2 };
|
109
|
-
};
|
110
|
-
const onExit = () => {
|
111
|
-
setActive(false);
|
112
|
-
};
|
113
|
-
const next = () => {
|
114
|
-
setMonth(update(month.m + 1, month.y));
|
115
|
-
};
|
116
|
-
const prev2 = () => {
|
117
|
-
setMonth(update(month.m - 1, month.y));
|
118
|
-
};
|
119
|
-
const isBefore = (activeDate) => {
|
120
|
-
if (before) {
|
121
|
-
const beforeDate = before.getTime();
|
122
|
-
if (beforeDate > activeDate) return true;
|
123
|
-
}
|
124
|
-
return false;
|
125
|
-
};
|
126
|
-
const send = (searchDate) => {
|
127
|
-
if (isBefore(
|
128
|
-
(/* @__PURE__ */ new Date(
|
129
|
-
`${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
|
130
|
-
)).getTime()
|
131
|
-
))
|
132
|
-
return;
|
133
|
-
onChangeValue(
|
134
|
-
/* @__PURE__ */ new Date(
|
135
|
-
`${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
|
136
|
-
)
|
137
|
-
);
|
138
|
-
onExit();
|
139
|
-
};
|
140
|
-
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
|
141
|
-
/* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
|
142
|
-
/* @__PURE__ */ jsx(
|
143
|
-
Button,
|
144
|
-
{
|
145
|
-
isIconButton: true,
|
146
|
-
iconName: "DropdownArrowLeft16px",
|
147
|
-
onClick: prev2,
|
148
|
-
variant: "secondary-gray",
|
149
|
-
size: "l"
|
150
|
-
}
|
151
|
-
),
|
152
|
-
/* @__PURE__ */ jsxs("div", { className: cls["d"], children: [
|
153
|
-
formating.Month(month.m).name,
|
154
|
-
"’",
|
155
|
-
month.y.toString().slice(-2)
|
156
|
-
] }),
|
157
|
-
/* @__PURE__ */ jsx(
|
158
|
-
Button,
|
159
|
-
{
|
160
|
-
isIconButton: true,
|
161
|
-
iconName: "DropdownArrowRight16px",
|
162
|
-
onClick: next,
|
163
|
-
variant: "secondary-gray",
|
164
|
-
size: "l"
|
165
|
-
}
|
166
|
-
)
|
167
|
-
] }),
|
168
|
-
/* @__PURE__ */ jsxs("div", { className: cls["b"], children: [
|
169
|
-
week.map((i, s) => /* @__PURE__ */ jsx(
|
170
|
-
"div",
|
171
|
-
{
|
172
|
-
className: `${s > countWorkDays ? [cls["m"], cls["orange"]].join(" ") : cls["m"]}`,
|
173
|
-
children: i
|
174
|
-
},
|
175
|
-
`v${s}`
|
176
|
-
)),
|
177
|
-
prevDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key)),
|
178
|
-
days.map((i, s) => /* @__PURE__ */ jsx(
|
179
|
-
"div",
|
180
|
-
{
|
181
|
-
className: isBefore(
|
182
|
-
(/* @__PURE__ */ new Date(
|
183
|
-
`${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, i)}`
|
184
|
-
)).getTime()
|
185
|
-
) ? cls["m"] : cls["a"],
|
186
|
-
children: i !== 0 ? /* @__PURE__ */ jsx(
|
187
|
-
"b",
|
188
|
-
{
|
189
|
-
className: current2.y === month.y && current2.m === month.m && current2.d === i ? cls["current"] : "",
|
190
|
-
onClick: () => send(i),
|
191
|
-
children: i
|
192
|
-
}
|
193
|
-
) : /* @__PURE__ */ jsx("p", {})
|
194
|
-
},
|
195
|
-
s
|
196
|
-
)),
|
197
|
-
nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
|
198
|
-
] })
|
199
|
-
] }) });
|
200
|
-
}
|
201
|
-
export {
|
202
|
-
DatePickerModal as D,
|
203
|
-
cls as c
|
204
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
._input_1ndkx_2{padding-right:var(--space-3xl)}._date-wrapper_1ndkx_6{position:relative;width:100%}._date-wrapper_1ndkx_6:hover input{background:var(--input-bg-color-hover)}._date-wrapper_1ndkx_6:before{position:absolute;top:0;right:60px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}._wrapper_1ndkx_21{position:relative;display:flex;align-items:center;border-radius:var(--control-radius-s)}._wrapper_1ndkx_21._active_1ndkx_27{border-bottom:1px solid var(--citrine-100)}._input-wrapper_1ndkx_31{flex:1}._button-wrapper_1ndkx_35{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_1ndkx_35{align-self:center;background-color:transparent;border-radius:var(--control-radius-s)}._field-overlow_1ndkx_52{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3}._calendar-block_1ndkx_58{position:absolute;z-index:3;display:flex;flex-direction:column;width:368px;max-height:none;padding:16px;font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-2xs);text-align:center;text-overflow:ellipsis;background:#fff;border-radius:var(--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_1ndkx_58 ._h_1ndkx_81{display:flex;width:100%;color:var(--black-100)}._calendar-block_1ndkx_58 ._b_1ndkx_35{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_1ndkx_58 ._d_1ndkx_6{display:flex;flex:1;align-items:center;justify-content:center;color:var(--black-100)}._calendar-block_1ndkx_58 ._m_1ndkx_100,._calendar-block_1ndkx_58 ._a_1ndkx_27,._calendar-block_1ndkx_58 ._prev_1ndkx_102{width:48px;height:48px;overflow:hidden}._calendar-block_1ndkx_58 ._m_1ndkx_100{display:flex;align-items:center;justify-content:center;color:var(--disabled)}._calendar-block_1ndkx_58 ._m_1ndkx_100 b{font-weight:var(--font-weight-text-regular)}._calendar-block_1ndkx_58 ._orange_1ndkx_118{color:var(--citrine-100)}._calendar-block_1ndkx_58 ._a_1ndkx_27{color:var(--black-100);border-radius:var(--control-radius-s)}._calendar-block_1ndkx_58 ._a_1ndkx_27 b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:var(--font-weight-text-regular);cursor:pointer}._calendar-block_1ndkx_58 ._a_1ndkx_27 b:hover{background:var(--black-10)}._calendar-block_1ndkx_58 ._a_1ndkx_27 b:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_1ndkx_58 ._current_1ndkx_143{background:var(--sapphire-10);border-radius:var(--control-radius-s)}
|