@alfalab/core-components-calendar-range 7.0.5 → 7.0.6
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/Component.js +5 -11
- package/cssm/Component.js +5 -11
- package/cssm/hooks.js +23 -34
- package/cssm/index.js +5 -7
- package/cssm/{tslib.es6-9682e485.d.ts → tslib.es6-bbd6cd2a.d.ts} +0 -0
- package/cssm/{tslib.es6-9682e485.js → tslib.es6-bbd6cd2a.js} +0 -0
- package/cssm/utils.js +0 -2
- package/cssm/views/popover.js +8 -17
- package/cssm/views/static.js +18 -31
- package/esm/Component.js +4 -4
- package/esm/hooks.js +1 -1
- package/esm/index.js +5 -5
- package/esm/{index.module-24b91874.d.ts → index.module-bf0c7948.d.ts} +0 -0
- package/esm/{index.module-24b91874.js → index.module-bf0c7948.js} +1 -1
- package/esm/views/index.css +8 -8
- package/esm/views/popover.js +2 -2
- package/esm/views/static.js +8 -8
- package/hooks.js +23 -34
- package/index.js +5 -7
- package/{index.module-2b983411.d.ts → index.module-3391f602.d.ts} +0 -0
- package/{index.module-2b983411.js → index.module-3391f602.js} +1 -1
- package/modern/Component.js +4 -4
- package/modern/hooks.js +1 -1
- package/modern/index.js +5 -5
- package/modern/index.module-5493f8ee.js +4 -0
- package/modern/views/index.css +8 -8
- package/modern/views/popover.js +2 -2
- package/modern/views/static.js +8 -8
- package/package.json +3 -3
- package/utils.js +0 -2
- package/views/index.css +8 -8
- package/views/popover.js +7 -15
- package/views/static.js +17 -29
- package/modern/index.module-4b4e51e6.js +0 -4
package/Component.js
CHANGED
|
@@ -1,33 +1,27 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var index_module = require('./index.module-2b983411.js');
|
|
3
|
+
var index_module = require('./index.module-3391f602.js');
|
|
6
4
|
var React = require('react');
|
|
5
|
+
var views_popover = require('./views/popover.js');
|
|
6
|
+
var views_static = require('./views/static.js');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('date-fns/startOfMonth');
|
|
9
9
|
require('@alfalab/core-components-calendar-input');
|
|
10
10
|
require('@alfalab/core-components-date-input');
|
|
11
|
+
require('./hooks.js');
|
|
11
12
|
require('date-fns/addMonths');
|
|
12
13
|
require('date-fns/isEqual');
|
|
13
14
|
require('date-fns/max');
|
|
14
15
|
require('date-fns/min');
|
|
15
16
|
require('date-fns/subMonths');
|
|
16
|
-
require('./hooks.js');
|
|
17
|
-
var views_popover = require('./views/popover.js');
|
|
18
17
|
require('date-fns/endOfMonth');
|
|
19
18
|
require('@alfalab/core-components-calendar');
|
|
20
19
|
require('./utils.js');
|
|
21
|
-
var views_static = require('./views/static.js');
|
|
22
|
-
|
|
23
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
24
|
-
|
|
25
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
26
20
|
|
|
27
21
|
var CalendarRange = function (_a) {
|
|
28
22
|
var _b = _a.calendarPosition, calendarPosition = _b === void 0 ? 'static' : _b, restProps = index_module.__rest(_a, ["calendarPosition"]);
|
|
29
23
|
var View = calendarPosition === 'popover' ? views_popover.CalendarRangePopover : views_static.CalendarRangeStatic;
|
|
30
|
-
return
|
|
24
|
+
return React.createElement(View, index_module.__assign({}, restProps));
|
|
31
25
|
};
|
|
32
26
|
|
|
33
27
|
exports.CalendarRange = CalendarRange;
|
package/cssm/Component.js
CHANGED
|
@@ -1,34 +1,28 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('./tslib.es6-9682e485.js');
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-bbd6cd2a.js');
|
|
6
4
|
var React = require('react');
|
|
5
|
+
var views_popover = require('./views/popover.js');
|
|
6
|
+
var views_static = require('./views/static.js');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('date-fns/startOfMonth');
|
|
9
9
|
require('@alfalab/core-components-calendar-input/cssm');
|
|
10
10
|
require('@alfalab/core-components-date-input/cssm');
|
|
11
|
+
require('./hooks.js');
|
|
11
12
|
require('date-fns/addMonths');
|
|
12
13
|
require('date-fns/isEqual');
|
|
13
14
|
require('date-fns/max');
|
|
14
15
|
require('date-fns/min');
|
|
15
16
|
require('date-fns/subMonths');
|
|
16
|
-
require('./hooks.js');
|
|
17
17
|
require('./views/index.module.css');
|
|
18
|
-
var views_popover = require('./views/popover.js');
|
|
19
18
|
require('date-fns/endOfMonth');
|
|
20
19
|
require('@alfalab/core-components-calendar/cssm');
|
|
21
20
|
require('./utils.js');
|
|
22
|
-
var views_static = require('./views/static.js');
|
|
23
|
-
|
|
24
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
|
-
|
|
26
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
27
21
|
|
|
28
22
|
var CalendarRange = function (_a) {
|
|
29
23
|
var _b = _a.calendarPosition, calendarPosition = _b === void 0 ? 'static' : _b, restProps = tslib_es6.__rest(_a, ["calendarPosition"]);
|
|
30
24
|
var View = calendarPosition === 'popover' ? views_popover.CalendarRangePopover : views_static.CalendarRangeStatic;
|
|
31
|
-
return
|
|
25
|
+
return React.createElement(View, tslib_es6.__assign({}, restProps));
|
|
32
26
|
};
|
|
33
27
|
|
|
34
28
|
exports.CalendarRange = CalendarRange;
|
package/cssm/hooks.js
CHANGED
|
@@ -1,24 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
|
-
var startOfMonth = require('date-fns/startOfMonth');
|
|
7
4
|
var addMonths = require('date-fns/addMonths');
|
|
8
5
|
var isEqual = require('date-fns/isEqual');
|
|
9
6
|
var max = require('date-fns/max');
|
|
10
7
|
var min = require('date-fns/min');
|
|
8
|
+
var startOfMonth = require('date-fns/startOfMonth');
|
|
11
9
|
var subMonths = require('date-fns/subMonths');
|
|
12
10
|
|
|
13
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
|
-
|
|
15
|
-
var startOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(startOfMonth);
|
|
16
|
-
var addMonths__default = /*#__PURE__*/_interopDefaultLegacy(addMonths);
|
|
17
|
-
var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
|
|
18
|
-
var max__default = /*#__PURE__*/_interopDefaultLegacy(max);
|
|
19
|
-
var min__default = /*#__PURE__*/_interopDefaultLegacy(min);
|
|
20
|
-
var subMonths__default = /*#__PURE__*/_interopDefaultLegacy(subMonths);
|
|
21
|
-
|
|
22
11
|
function usePopoverViewMonthes(_a) {
|
|
23
12
|
var dateFrom = _a.dateFrom, dateTo = _a.dateTo, defaultMonth = _a.defaultMonth, resetKey = _a.resetKey;
|
|
24
13
|
var _b = React.useState(), monthFrom = _b[0], setMonthFrom = _b[1];
|
|
@@ -36,10 +25,10 @@ function usePopoverViewMonthes(_a) {
|
|
|
36
25
|
}
|
|
37
26
|
}, [dateFrom]);
|
|
38
27
|
React.useEffect(function () {
|
|
39
|
-
setMonthFrom(dateFrom ?
|
|
28
|
+
setMonthFrom(dateFrom ? startOfMonth(dateFrom).getTime() : defaultMonth);
|
|
40
29
|
}, [defaultMonth, dateFrom, resetKey]);
|
|
41
30
|
React.useEffect(function () {
|
|
42
|
-
setMonthTo(dateTo ?
|
|
31
|
+
setMonthTo(dateTo ? startOfMonth(dateTo).getTime() : monthFrom);
|
|
43
32
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
44
33
|
}, [dateTo, resetKey]);
|
|
45
34
|
return {
|
|
@@ -55,44 +44,44 @@ function useStaticViewMonthes(_a) {
|
|
|
55
44
|
* Если указана начальная дата — левый месяц равен ей, иначе используется дата конца.
|
|
56
45
|
* Если обе даты не указаны, то используется дефолтный месяц
|
|
57
46
|
*/
|
|
58
|
-
var initialMonthFrom = React.useMemo(function () { return
|
|
47
|
+
var initialMonthFrom = React.useMemo(function () { return startOfMonth(selectedFrom || selectedTo || defaultMonth).getTime(); },
|
|
59
48
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
60
49
|
[]);
|
|
61
50
|
/**
|
|
62
51
|
* Правый месяц должен быть как минимум на 1 месяц больше левого
|
|
63
52
|
*/
|
|
64
53
|
var initialMonthTo = React.useMemo(function () {
|
|
65
|
-
return
|
|
66
|
-
selectedTo ?
|
|
67
|
-
|
|
54
|
+
return max([
|
|
55
|
+
selectedTo ? startOfMonth(selectedTo) : 0,
|
|
56
|
+
addMonths(initialMonthFrom, 1),
|
|
68
57
|
]).getTime();
|
|
69
58
|
},
|
|
70
59
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
71
60
|
[]);
|
|
72
61
|
if (defaultMonthPosition === 'right') {
|
|
73
62
|
initialMonthTo = initialMonthFrom;
|
|
74
|
-
initialMonthFrom =
|
|
63
|
+
initialMonthFrom = subMonths(initialMonthFrom, 1).getTime();
|
|
75
64
|
}
|
|
76
65
|
var _b = React.useState(initialMonthFrom), monthFrom = _b[0], setMonthFrom = _b[1];
|
|
77
66
|
var _c = React.useState(initialMonthTo), monthTo = _c[0], setMonthTo = _c[1];
|
|
78
67
|
var handleMonthFromChange = React.useCallback(function (newMonthFrom) {
|
|
79
68
|
setMonthFrom(newMonthFrom);
|
|
80
|
-
if (monthTo &&
|
|
81
|
-
var nextMonth =
|
|
69
|
+
if (monthTo && isEqual(newMonthFrom, monthTo)) {
|
|
70
|
+
var nextMonth = addMonths(newMonthFrom, 1).getTime();
|
|
82
71
|
setMonthTo(nextMonth);
|
|
83
72
|
}
|
|
84
73
|
}, [monthTo]);
|
|
85
74
|
var handleMonthToChange = React.useCallback(function (newMonthTo) {
|
|
86
75
|
setMonthTo(newMonthTo);
|
|
87
|
-
if (monthFrom &&
|
|
88
|
-
var prevMonth =
|
|
76
|
+
if (monthFrom && isEqual(newMonthTo, monthFrom)) {
|
|
77
|
+
var prevMonth = subMonths(newMonthTo, 1).getTime();
|
|
89
78
|
setMonthFrom(prevMonth);
|
|
90
79
|
}
|
|
91
80
|
}, [monthFrom]);
|
|
92
81
|
// eslint-disable-next-line complexity
|
|
93
82
|
React.useEffect(function () {
|
|
94
|
-
var selectedFromMonth = selectedFrom ?
|
|
95
|
-
var selectedToMonth = selectedTo ?
|
|
83
|
+
var selectedFromMonth = selectedFrom ? startOfMonth(selectedFrom).getTime() : undefined;
|
|
84
|
+
var selectedToMonth = selectedTo ? startOfMonth(selectedTo).getTime() : undefined;
|
|
96
85
|
// Проверяем, показываются ли выбранные месяцы в левой или правой части компонента
|
|
97
86
|
var fromMonthOnLeft = selectedFromMonth && selectedFromMonth === monthFrom;
|
|
98
87
|
var fromMonthOnRight = selectedFromMonth && selectedFromMonth === monthTo;
|
|
@@ -101,25 +90,25 @@ function useStaticViewMonthes(_a) {
|
|
|
101
90
|
var fromMonthOnScreen = fromMonthOnLeft || fromMonthOnRight;
|
|
102
91
|
var toMonthOnScreen = toMonthOnLeft || toMonthOnRight;
|
|
103
92
|
if (fromMonthOnLeft && toMonthOnLeft) {
|
|
104
|
-
setMonthTo(
|
|
93
|
+
setMonthTo(max([addMonths(selectedFromMonth, 1), monthTo]).getTime());
|
|
105
94
|
return;
|
|
106
95
|
}
|
|
107
96
|
if (fromMonthOnRight && toMonthOnRight) {
|
|
108
|
-
setMonthFrom(
|
|
97
|
+
setMonthFrom(min([subMonths(selectedToMonth, 1), monthFrom]).getTime());
|
|
109
98
|
return;
|
|
110
99
|
}
|
|
111
100
|
if (selectedFromMonth && selectedToMonth) {
|
|
112
101
|
setMonthFrom(selectedFromMonth);
|
|
113
|
-
setMonthTo(
|
|
102
|
+
setMonthTo(max([addMonths(selectedFromMonth, 1), selectedToMonth]).getTime());
|
|
114
103
|
return;
|
|
115
104
|
}
|
|
116
105
|
if (selectedFromMonth && !selectedToMonth && !fromMonthOnScreen) {
|
|
117
106
|
setMonthFrom(selectedFromMonth);
|
|
118
|
-
setMonthTo(
|
|
107
|
+
setMonthTo(max([addMonths(selectedFromMonth, 1), monthTo]).getTime());
|
|
119
108
|
}
|
|
120
109
|
if (selectedToMonth && !selectedFromMonth && !toMonthOnScreen) {
|
|
121
110
|
setMonthTo(selectedToMonth);
|
|
122
|
-
setMonthFrom(
|
|
111
|
+
setMonthFrom(min([subMonths(selectedToMonth, 1), monthFrom]).getTime());
|
|
123
112
|
}
|
|
124
113
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
125
114
|
}, [selectedFrom, selectedTo]);
|
|
@@ -135,15 +124,15 @@ function useSelectionProps(from, to, highlighted) {
|
|
|
135
124
|
if (from && to) {
|
|
136
125
|
return {
|
|
137
126
|
rangeComplete: true,
|
|
138
|
-
selectedFrom:
|
|
139
|
-
selectedTo:
|
|
127
|
+
selectedFrom: min([from, to]).getTime(),
|
|
128
|
+
selectedTo: max([from, to]).getTime(),
|
|
140
129
|
};
|
|
141
130
|
}
|
|
142
131
|
var dates = [from, to, highlighted].filter(function (date) { return date !== undefined; });
|
|
143
132
|
return {
|
|
144
133
|
rangeComplete: false,
|
|
145
|
-
selectedFrom: from || dates.length === 2 ?
|
|
146
|
-
selectedTo: to || dates.length === 2 ?
|
|
134
|
+
selectedFrom: from || dates.length === 2 ? min(dates).getTime() : undefined,
|
|
135
|
+
selectedTo: to || dates.length === 2 ? max(dates).getTime() : undefined,
|
|
147
136
|
};
|
|
148
137
|
}, [from, highlighted, to]);
|
|
149
138
|
}
|
package/cssm/index.js
CHANGED
|
@@ -1,26 +1,24 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('./tslib.es6-9682e485.js');
|
|
3
|
+
var Component = require('./Component.js');
|
|
4
|
+
require('./tslib.es6-bbd6cd2a.js');
|
|
6
5
|
require('react');
|
|
6
|
+
require('./views/popover.js');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('date-fns/startOfMonth');
|
|
9
9
|
require('@alfalab/core-components-calendar-input/cssm');
|
|
10
10
|
require('@alfalab/core-components-date-input/cssm');
|
|
11
|
+
require('./hooks.js');
|
|
11
12
|
require('date-fns/addMonths');
|
|
12
13
|
require('date-fns/isEqual');
|
|
13
14
|
require('date-fns/max');
|
|
14
15
|
require('date-fns/min');
|
|
15
16
|
require('date-fns/subMonths');
|
|
16
|
-
require('./hooks.js');
|
|
17
17
|
require('./views/index.module.css');
|
|
18
|
-
require('./views/
|
|
18
|
+
require('./views/static.js');
|
|
19
19
|
require('date-fns/endOfMonth');
|
|
20
20
|
require('@alfalab/core-components-calendar/cssm');
|
|
21
21
|
require('./utils.js');
|
|
22
|
-
require('./views/static.js');
|
|
23
|
-
var Component = require('./Component.js');
|
|
24
22
|
|
|
25
23
|
|
|
26
24
|
|
|
File without changes
|
|
File without changes
|
package/cssm/utils.js
CHANGED
package/cssm/views/popover.js
CHANGED
|
@@ -1,30 +1,21 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-9682e485.js');
|
|
3
|
+
var tslib_es6 = require('../tslib.es6-bbd6cd2a.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var cn = require('classnames');
|
|
8
6
|
var startOfMonth = require('date-fns/startOfMonth');
|
|
9
7
|
var coreComponentsCalendarInput = require('@alfalab/core-components-calendar-input/cssm');
|
|
10
8
|
var coreComponentsDateInput = require('@alfalab/core-components-date-input/cssm');
|
|
9
|
+
var hooks = require('../hooks.js');
|
|
10
|
+
var styles = require('./index.module.css');
|
|
11
11
|
require('date-fns/addMonths');
|
|
12
12
|
require('date-fns/isEqual');
|
|
13
13
|
require('date-fns/max');
|
|
14
14
|
require('date-fns/min');
|
|
15
15
|
require('date-fns/subMonths');
|
|
16
|
-
var hooks = require('../hooks.js');
|
|
17
|
-
var styles = require('./index.module.css');
|
|
18
|
-
|
|
19
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
20
|
-
|
|
21
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
22
|
-
var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
|
|
23
|
-
var startOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(startOfMonth);
|
|
24
|
-
var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
|
|
25
16
|
|
|
26
17
|
var CalendarRangePopover = function (_a) {
|
|
27
|
-
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ?
|
|
18
|
+
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth(new Date()).getTime() : _b, minDate = _a.minDate, maxDate = _a.maxDate, _c = _a.valueFrom, valueFrom = _c === void 0 ? '' : _c, _d = _a.valueTo, valueTo = _d === void 0 ? '' : _d, _e = _a.onDateFromChange, onDateFromChange = _e === void 0 ? function () { return null; } : _e, _f = _a.onDateToChange, onDateToChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onChange, onChange = _g === void 0 ? function () { return null; } : _g, onError = _a.onError, _h = _a.inputFromProps, inputFromProps = _h === void 0 ? {} : _h, _j = _a.inputToProps, inputToProps = _j === void 0 ? {} : _j, offDays = _a.offDays, events = _a.events, dataTestId = _a.dataTestId;
|
|
28
19
|
var _k = React.useState(valueFrom), inputFromValue = _k[0], setInputFromValue = _k[1];
|
|
29
20
|
var _l = React.useState(valueTo), inputToValue = _l[0], setInputToValue = _l[1];
|
|
30
21
|
/**
|
|
@@ -116,10 +107,10 @@ var CalendarRangePopover = function (_a) {
|
|
|
116
107
|
}
|
|
117
108
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
118
109
|
}, [hasValidateError]);
|
|
119
|
-
return (
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
110
|
+
return (React.createElement("div", { className: cn(styles.component, className), "data-test-id": dataTestId },
|
|
111
|
+
React.createElement(coreComponentsCalendarInput.CalendarInput, tslib_es6.__assign({}, inputFromProps, { useAnchorWidth: false, calendarPosition: 'popover', popoverPosition: 'bottom-start', error: inputFromInvalid || bothInvalid || inputFromProps.error, onChange: handleFromChange, onInputChange: handleInputFromChange, onBlur: handleInputFromBlur, value: inputFromValue, minDate: minDate, maxDate: maxDate, offDays: offDays, events: events, calendarProps: tslib_es6.__assign(tslib_es6.__assign({}, inputFromProps.calendarProps), { month: monthFrom, onMonthChange: handleMonthFromChange, selectorView: 'full' }) })),
|
|
112
|
+
React.createElement("span", { className: styles.divider }),
|
|
113
|
+
React.createElement(coreComponentsCalendarInput.CalendarInput, tslib_es6.__assign({}, inputToProps, { useAnchorWidth: false, calendarPosition: 'popover', popoverPosition: 'bottom-end', error: inputToInvalid || bothInvalid || inputToProps.error, onChange: handleToChange, onInputChange: handleInputToChange, onBlur: handleInputToBlur, value: inputToValue, minDate: dateFrom || minDate, maxDate: maxDate, offDays: offDays, events: events, calendarProps: tslib_es6.__assign(tslib_es6.__assign({}, inputToProps.calendarProps), { month: monthTo, onMonthChange: handleMonthToChange, selectorView: 'full' }) }))));
|
|
123
114
|
};
|
|
124
115
|
|
|
125
116
|
exports.CalendarRangePopover = CalendarRangePopover;
|
package/cssm/views/static.js
CHANGED
|
@@ -1,37 +1,24 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-9682e485.js');
|
|
3
|
+
var tslib_es6 = require('../tslib.es6-bbd6cd2a.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var cn = require('classnames');
|
|
8
|
-
var startOfMonth = require('date-fns/startOfMonth');
|
|
9
|
-
var coreComponentsCalendarInput = require('@alfalab/core-components-calendar-input/cssm');
|
|
10
|
-
var coreComponentsDateInput = require('@alfalab/core-components-date-input/cssm');
|
|
11
6
|
var addMonths = require('date-fns/addMonths');
|
|
12
|
-
require('date-fns/
|
|
7
|
+
var endOfMonth = require('date-fns/endOfMonth');
|
|
13
8
|
var max = require('date-fns/max');
|
|
14
|
-
require('date-fns/
|
|
9
|
+
var startOfMonth = require('date-fns/startOfMonth');
|
|
15
10
|
var subMonths = require('date-fns/subMonths');
|
|
16
|
-
var hooks = require('../hooks.js');
|
|
17
|
-
var styles = require('./index.module.css');
|
|
18
|
-
var endOfMonth = require('date-fns/endOfMonth');
|
|
19
11
|
var coreComponentsCalendar = require('@alfalab/core-components-calendar/cssm');
|
|
12
|
+
var coreComponentsCalendarInput = require('@alfalab/core-components-calendar-input/cssm');
|
|
13
|
+
var coreComponentsDateInput = require('@alfalab/core-components-date-input/cssm');
|
|
14
|
+
var hooks = require('../hooks.js');
|
|
20
15
|
var utils = require('../utils.js');
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
25
|
-
var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
|
|
26
|
-
var startOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(startOfMonth);
|
|
27
|
-
var addMonths__default = /*#__PURE__*/_interopDefaultLegacy(addMonths);
|
|
28
|
-
var max__default = /*#__PURE__*/_interopDefaultLegacy(max);
|
|
29
|
-
var subMonths__default = /*#__PURE__*/_interopDefaultLegacy(subMonths);
|
|
30
|
-
var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
|
|
31
|
-
var endOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(endOfMonth);
|
|
16
|
+
var styles = require('./index.module.css');
|
|
17
|
+
require('date-fns/isEqual');
|
|
18
|
+
require('date-fns/min');
|
|
32
19
|
|
|
33
20
|
var CalendarRangeStatic = function (_a) {
|
|
34
|
-
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ?
|
|
21
|
+
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth(new Date()).getTime() : _b, _c = _a.defaultMonthPosition, defaultMonthPosition = _c === void 0 ? 'left' : _c, minDate = _a.minDate, maxDate = _a.maxDate, _d = _a.valueFrom, valueFrom = _d === void 0 ? '' : _d, _e = _a.valueTo, valueTo = _e === void 0 ? '' : _e, _f = _a.onDateFromChange, onDateFromChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onDateToChange, onDateToChange = _g === void 0 ? function () { return null; } : _g, _h = _a.onChange, onChange = _h === void 0 ? function () { return null; } : _h, onError = _a.onError, _j = _a.inputFromProps, inputFromProps = _j === void 0 ? {} : _j, _k = _a.inputToProps, inputToProps = _k === void 0 ? {} : _k, offDays = _a.offDays, events = _a.events, dataTestId = _a.dataTestId;
|
|
35
22
|
var _l = React.useState(valueFrom), inputFromValue = _l[0], setInputFromValue = _l[1];
|
|
36
23
|
var _m = React.useState(valueTo), inputToValue = _m[0], setInputToValue = _m[1];
|
|
37
24
|
var dateFrom = coreComponentsCalendarInput.isValidInputValue(inputFromValue, minDate, maxDate, offDays)
|
|
@@ -161,18 +148,18 @@ var CalendarRangeStatic = function (_a) {
|
|
|
161
148
|
var CalendarToComponent = dateInputToProps.Calendar || coreComponentsCalendar.Calendar;
|
|
162
149
|
return (
|
|
163
150
|
// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
151
|
+
React.createElement("div", { className: cn(styles.component, styles.static, className), onMouseOver: handleMouseOver, "data-test-id": dataTestId },
|
|
152
|
+
React.createElement("div", null,
|
|
153
|
+
React.createElement(coreComponentsDateInput.DateInput, tslib_es6.__assign({}, dateInputFromProps, { mobileMode: dateInputFromProps.mobileMode === 'popover'
|
|
167
154
|
? 'input'
|
|
168
155
|
: dateInputFromProps.mobileMode, value: inputFromValue, onChange: handleInputFromChange, onClear: handleClearFrom, onBlur: handleValidInputFrom, error: bothInvalid || inputFromInvalid || dateInputFromProps.error, clear: true, block: true })),
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
156
|
+
React.createElement(CalendarFromComponent, tslib_es6.__assign({}, calendarFromProps, { className: cn(styles.calendar, calendarFromProps === null || calendarFromProps === void 0 ? void 0 : calendarFromProps.className), month: monthFrom, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthFromChange, minDate: minDate, maxDate: maxDate && max([maxDate, endOfMonth(subMonths(maxDate, 1))]).getTime() }, rangeProps))),
|
|
157
|
+
React.createElement("span", { className: styles.divider }),
|
|
158
|
+
React.createElement("div", null,
|
|
159
|
+
React.createElement(coreComponentsDateInput.DateInput, tslib_es6.__assign({}, dateInputToProps, { mobileMode: dateInputToProps.mobileMode === 'popover'
|
|
173
160
|
? 'input'
|
|
174
161
|
: dateInputToProps.mobileMode, value: inputToValue, onChange: handleInputToChange, onClear: handleClearTo, onBlur: handleValidInputTo, error: bothInvalid || inputToInvalid, clear: true, block: true })),
|
|
175
|
-
|
|
162
|
+
React.createElement(CalendarToComponent, tslib_es6.__assign({}, calendarToProps, { className: cn(styles.calendar, calendarToProps === null || calendarToProps === void 0 ? void 0 : calendarToProps.className), month: monthTo, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthToChange, minDate: minDate && startOfMonth(addMonths(minDate, 1)).getTime(), maxDate: maxDate }, rangeProps)))));
|
|
176
163
|
};
|
|
177
164
|
|
|
178
165
|
exports.CalendarRangeStatic = CalendarRangeStatic;
|
package/esm/Component.js
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign } from './index.module-
|
|
1
|
+
import { _ as __rest, a as __assign } from './index.module-bf0c7948.js';
|
|
2
2
|
import React from 'react';
|
|
3
|
+
import { CalendarRangePopover } from './views/popover.js';
|
|
4
|
+
import { CalendarRangeStatic } from './views/static.js';
|
|
3
5
|
import 'classnames';
|
|
4
6
|
import 'date-fns/startOfMonth';
|
|
5
7
|
import '@alfalab/core-components-calendar-input/esm';
|
|
6
8
|
import '@alfalab/core-components-date-input/esm';
|
|
9
|
+
import './hooks.js';
|
|
7
10
|
import 'date-fns/addMonths';
|
|
8
11
|
import 'date-fns/isEqual';
|
|
9
12
|
import 'date-fns/max';
|
|
10
13
|
import 'date-fns/min';
|
|
11
14
|
import 'date-fns/subMonths';
|
|
12
|
-
import './hooks.js';
|
|
13
|
-
import { CalendarRangePopover } from './views/popover.js';
|
|
14
15
|
import 'date-fns/endOfMonth';
|
|
15
16
|
import '@alfalab/core-components-calendar/esm';
|
|
16
17
|
import './utils.js';
|
|
17
|
-
import { CalendarRangeStatic } from './views/static.js';
|
|
18
18
|
|
|
19
19
|
var CalendarRange = function (_a) {
|
|
20
20
|
var _b = _a.calendarPosition, calendarPosition = _b === void 0 ? 'static' : _b, restProps = __rest(_a, ["calendarPosition"]);
|
package/esm/hooks.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { useState, useCallback, useEffect, useMemo } from 'react';
|
|
2
|
-
import startOfMonth from 'date-fns/startOfMonth';
|
|
3
2
|
import addMonths from 'date-fns/addMonths';
|
|
4
3
|
import isEqual from 'date-fns/isEqual';
|
|
5
4
|
import max from 'date-fns/max';
|
|
6
5
|
import min from 'date-fns/min';
|
|
6
|
+
import startOfMonth from 'date-fns/startOfMonth';
|
|
7
7
|
import subMonths from 'date-fns/subMonths';
|
|
8
8
|
|
|
9
9
|
function usePopoverViewMonthes(_a) {
|
package/esm/index.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
export { CalendarRange } from './Component.js';
|
|
2
|
+
import './index.module-bf0c7948.js';
|
|
2
3
|
import 'react';
|
|
4
|
+
import './views/popover.js';
|
|
3
5
|
import 'classnames';
|
|
4
6
|
import 'date-fns/startOfMonth';
|
|
5
7
|
import '@alfalab/core-components-calendar-input/esm';
|
|
6
8
|
import '@alfalab/core-components-date-input/esm';
|
|
9
|
+
import './hooks.js';
|
|
7
10
|
import 'date-fns/addMonths';
|
|
8
11
|
import 'date-fns/isEqual';
|
|
9
12
|
import 'date-fns/max';
|
|
10
13
|
import 'date-fns/min';
|
|
11
14
|
import 'date-fns/subMonths';
|
|
12
|
-
import './
|
|
13
|
-
import './views/popover.js';
|
|
15
|
+
import './views/static.js';
|
|
14
16
|
import 'date-fns/endOfMonth';
|
|
15
17
|
import '@alfalab/core-components-calendar/esm';
|
|
16
18
|
import './utils.js';
|
|
17
|
-
import './views/static.js';
|
|
18
|
-
export { CalendarRange } from './Component.js';
|
|
File without changes
|
|
@@ -37,7 +37,7 @@ function __rest(s, e) {
|
|
|
37
37
|
return t;
|
|
38
38
|
}
|
|
39
39
|
|
|
40
|
-
var styles = {"component":"calendar-
|
|
40
|
+
var styles = {"component":"calendar-range__component_17yx8","divider":"calendar-range__divider_17yx8","static":"calendar-range__static_17yx8","calendar":"calendar-range__calendar_17yx8"};
|
|
41
41
|
require('./views/index.css')
|
|
42
42
|
|
|
43
43
|
export { __rest as _, __assign as a, styles as s };
|
package/esm/views/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: z4zdr */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-graphic-primary: #0b1f35;
|
|
4
4
|
}
|
|
@@ -36,19 +36,19 @@
|
|
|
36
36
|
|
|
37
37
|
/* marker */
|
|
38
38
|
}
|
|
39
|
-
.calendar-
|
|
39
|
+
.calendar-range__component_17yx8 {
|
|
40
40
|
display: flex
|
|
41
41
|
}
|
|
42
|
-
.calendar-
|
|
42
|
+
.calendar-range__component_17yx8 button[aria-selected='true'] {
|
|
43
43
|
cursor: pointer;
|
|
44
44
|
}
|
|
45
|
-
.calendar-
|
|
45
|
+
.calendar-range__component_17yx8 *[class*='errorIcon_'] {
|
|
46
46
|
display: none;
|
|
47
47
|
}
|
|
48
|
-
.calendar-
|
|
48
|
+
.calendar-range__component_17yx8 *[class*='calendarIcon_'] {
|
|
49
49
|
margin-right: 0;
|
|
50
50
|
}
|
|
51
|
-
.calendar-
|
|
51
|
+
.calendar-range__divider_17yx8 {
|
|
52
52
|
height: 48px;
|
|
53
53
|
display: flex;
|
|
54
54
|
align-items: center;
|
|
@@ -56,13 +56,13 @@
|
|
|
56
56
|
width: 16px;
|
|
57
57
|
margin: 0 var(--gap-xs)
|
|
58
58
|
}
|
|
59
|
-
.calendar-
|
|
59
|
+
.calendar-range__divider_17yx8:after {
|
|
60
60
|
content: '';
|
|
61
61
|
display: block;
|
|
62
62
|
width: 100%;
|
|
63
63
|
height: 1px;
|
|
64
64
|
background-color: var(--color-light-graphic-primary);
|
|
65
65
|
}
|
|
66
|
-
.calendar-
|
|
66
|
+
.calendar-range__static_17yx8 .calendar-range__calendar_17yx8 {
|
|
67
67
|
width: var(--calendar-inner-width);
|
|
68
68
|
}
|
package/esm/views/popover.js
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { s as styles, a as __assign } from '../index.module-
|
|
1
|
+
import { s as styles, a as __assign } from '../index.module-bf0c7948.js';
|
|
2
2
|
import React, { useState, useCallback, useEffect } from 'react';
|
|
3
3
|
import cn from 'classnames';
|
|
4
4
|
import startOfMonth from 'date-fns/startOfMonth';
|
|
5
5
|
import { isValidInputValue, parseDateString, CalendarInput } from '@alfalab/core-components-calendar-input/esm';
|
|
6
6
|
import { isCompleteDateInput } from '@alfalab/core-components-date-input/esm';
|
|
7
|
+
import { usePopoverViewMonthes } from '../hooks.js';
|
|
7
8
|
import 'date-fns/addMonths';
|
|
8
9
|
import 'date-fns/isEqual';
|
|
9
10
|
import 'date-fns/max';
|
|
10
11
|
import 'date-fns/min';
|
|
11
12
|
import 'date-fns/subMonths';
|
|
12
|
-
import { usePopoverViewMonthes } from '../hooks.js';
|
|
13
13
|
|
|
14
14
|
var CalendarRangePopover = function (_a) {
|
|
15
15
|
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth(new Date()).getTime() : _b, minDate = _a.minDate, maxDate = _a.maxDate, _c = _a.valueFrom, valueFrom = _c === void 0 ? '' : _c, _d = _a.valueTo, valueTo = _d === void 0 ? '' : _d, _e = _a.onDateFromChange, onDateFromChange = _e === void 0 ? function () { return null; } : _e, _f = _a.onDateToChange, onDateToChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onChange, onChange = _g === void 0 ? function () { return null; } : _g, onError = _a.onError, _h = _a.inputFromProps, inputFromProps = _h === void 0 ? {} : _h, _j = _a.inputToProps, inputToProps = _j === void 0 ? {} : _j, offDays = _a.offDays, events = _a.events, dataTestId = _a.dataTestId;
|
package/esm/views/static.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { _ as __rest, s as styles, a as __assign } from '../index.module-
|
|
1
|
+
import { _ as __rest, s as styles, a as __assign } from '../index.module-bf0c7948.js';
|
|
2
2
|
import React, { useState, useCallback, useEffect } from 'react';
|
|
3
3
|
import cn from 'classnames';
|
|
4
|
-
import startOfMonth from 'date-fns/startOfMonth';
|
|
5
|
-
import { isValidInputValue, parseDateString, formatDate } from '@alfalab/core-components-calendar-input/esm';
|
|
6
|
-
import { isCompleteDateInput, DateInput } from '@alfalab/core-components-date-input/esm';
|
|
7
4
|
import addMonths from 'date-fns/addMonths';
|
|
8
|
-
import 'date-fns/
|
|
5
|
+
import endOfMonth from 'date-fns/endOfMonth';
|
|
9
6
|
import max from 'date-fns/max';
|
|
10
|
-
import 'date-fns/
|
|
7
|
+
import startOfMonth from 'date-fns/startOfMonth';
|
|
11
8
|
import subMonths from 'date-fns/subMonths';
|
|
12
|
-
import { useStaticViewMonthes, useSelectionProps } from '../hooks.js';
|
|
13
|
-
import endOfMonth from 'date-fns/endOfMonth';
|
|
14
9
|
import { usePeriodWithReset, Calendar } from '@alfalab/core-components-calendar/esm';
|
|
10
|
+
import { isValidInputValue, parseDateString, formatDate } from '@alfalab/core-components-calendar-input/esm';
|
|
11
|
+
import { isCompleteDateInput, DateInput } from '@alfalab/core-components-date-input/esm';
|
|
12
|
+
import { useStaticViewMonthes, useSelectionProps } from '../hooks.js';
|
|
15
13
|
import { isDayButton } from '../utils.js';
|
|
14
|
+
import 'date-fns/isEqual';
|
|
15
|
+
import 'date-fns/min';
|
|
16
16
|
|
|
17
17
|
var CalendarRangeStatic = function (_a) {
|
|
18
18
|
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth(new Date()).getTime() : _b, _c = _a.defaultMonthPosition, defaultMonthPosition = _c === void 0 ? 'left' : _c, minDate = _a.minDate, maxDate = _a.maxDate, _d = _a.valueFrom, valueFrom = _d === void 0 ? '' : _d, _e = _a.valueTo, valueTo = _e === void 0 ? '' : _e, _f = _a.onDateFromChange, onDateFromChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onDateToChange, onDateToChange = _g === void 0 ? function () { return null; } : _g, _h = _a.onChange, onChange = _h === void 0 ? function () { return null; } : _h, onError = _a.onError, _j = _a.inputFromProps, inputFromProps = _j === void 0 ? {} : _j, _k = _a.inputToProps, inputToProps = _k === void 0 ? {} : _k, offDays = _a.offDays, events = _a.events, dataTestId = _a.dataTestId;
|
package/hooks.js
CHANGED
|
@@ -1,24 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
3
|
var React = require('react');
|
|
6
|
-
var startOfMonth = require('date-fns/startOfMonth');
|
|
7
4
|
var addMonths = require('date-fns/addMonths');
|
|
8
5
|
var isEqual = require('date-fns/isEqual');
|
|
9
6
|
var max = require('date-fns/max');
|
|
10
7
|
var min = require('date-fns/min');
|
|
8
|
+
var startOfMonth = require('date-fns/startOfMonth');
|
|
11
9
|
var subMonths = require('date-fns/subMonths');
|
|
12
10
|
|
|
13
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
|
-
|
|
15
|
-
var startOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(startOfMonth);
|
|
16
|
-
var addMonths__default = /*#__PURE__*/_interopDefaultLegacy(addMonths);
|
|
17
|
-
var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
|
|
18
|
-
var max__default = /*#__PURE__*/_interopDefaultLegacy(max);
|
|
19
|
-
var min__default = /*#__PURE__*/_interopDefaultLegacy(min);
|
|
20
|
-
var subMonths__default = /*#__PURE__*/_interopDefaultLegacy(subMonths);
|
|
21
|
-
|
|
22
11
|
function usePopoverViewMonthes(_a) {
|
|
23
12
|
var dateFrom = _a.dateFrom, dateTo = _a.dateTo, defaultMonth = _a.defaultMonth, resetKey = _a.resetKey;
|
|
24
13
|
var _b = React.useState(), monthFrom = _b[0], setMonthFrom = _b[1];
|
|
@@ -36,10 +25,10 @@ function usePopoverViewMonthes(_a) {
|
|
|
36
25
|
}
|
|
37
26
|
}, [dateFrom]);
|
|
38
27
|
React.useEffect(function () {
|
|
39
|
-
setMonthFrom(dateFrom ?
|
|
28
|
+
setMonthFrom(dateFrom ? startOfMonth(dateFrom).getTime() : defaultMonth);
|
|
40
29
|
}, [defaultMonth, dateFrom, resetKey]);
|
|
41
30
|
React.useEffect(function () {
|
|
42
|
-
setMonthTo(dateTo ?
|
|
31
|
+
setMonthTo(dateTo ? startOfMonth(dateTo).getTime() : monthFrom);
|
|
43
32
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
44
33
|
}, [dateTo, resetKey]);
|
|
45
34
|
return {
|
|
@@ -55,44 +44,44 @@ function useStaticViewMonthes(_a) {
|
|
|
55
44
|
* Если указана начальная дата — левый месяц равен ей, иначе используется дата конца.
|
|
56
45
|
* Если обе даты не указаны, то используется дефолтный месяц
|
|
57
46
|
*/
|
|
58
|
-
var initialMonthFrom = React.useMemo(function () { return
|
|
47
|
+
var initialMonthFrom = React.useMemo(function () { return startOfMonth(selectedFrom || selectedTo || defaultMonth).getTime(); },
|
|
59
48
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
60
49
|
[]);
|
|
61
50
|
/**
|
|
62
51
|
* Правый месяц должен быть как минимум на 1 месяц больше левого
|
|
63
52
|
*/
|
|
64
53
|
var initialMonthTo = React.useMemo(function () {
|
|
65
|
-
return
|
|
66
|
-
selectedTo ?
|
|
67
|
-
|
|
54
|
+
return max([
|
|
55
|
+
selectedTo ? startOfMonth(selectedTo) : 0,
|
|
56
|
+
addMonths(initialMonthFrom, 1),
|
|
68
57
|
]).getTime();
|
|
69
58
|
},
|
|
70
59
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
71
60
|
[]);
|
|
72
61
|
if (defaultMonthPosition === 'right') {
|
|
73
62
|
initialMonthTo = initialMonthFrom;
|
|
74
|
-
initialMonthFrom =
|
|
63
|
+
initialMonthFrom = subMonths(initialMonthFrom, 1).getTime();
|
|
75
64
|
}
|
|
76
65
|
var _b = React.useState(initialMonthFrom), monthFrom = _b[0], setMonthFrom = _b[1];
|
|
77
66
|
var _c = React.useState(initialMonthTo), monthTo = _c[0], setMonthTo = _c[1];
|
|
78
67
|
var handleMonthFromChange = React.useCallback(function (newMonthFrom) {
|
|
79
68
|
setMonthFrom(newMonthFrom);
|
|
80
|
-
if (monthTo &&
|
|
81
|
-
var nextMonth =
|
|
69
|
+
if (monthTo && isEqual(newMonthFrom, monthTo)) {
|
|
70
|
+
var nextMonth = addMonths(newMonthFrom, 1).getTime();
|
|
82
71
|
setMonthTo(nextMonth);
|
|
83
72
|
}
|
|
84
73
|
}, [monthTo]);
|
|
85
74
|
var handleMonthToChange = React.useCallback(function (newMonthTo) {
|
|
86
75
|
setMonthTo(newMonthTo);
|
|
87
|
-
if (monthFrom &&
|
|
88
|
-
var prevMonth =
|
|
76
|
+
if (monthFrom && isEqual(newMonthTo, monthFrom)) {
|
|
77
|
+
var prevMonth = subMonths(newMonthTo, 1).getTime();
|
|
89
78
|
setMonthFrom(prevMonth);
|
|
90
79
|
}
|
|
91
80
|
}, [monthFrom]);
|
|
92
81
|
// eslint-disable-next-line complexity
|
|
93
82
|
React.useEffect(function () {
|
|
94
|
-
var selectedFromMonth = selectedFrom ?
|
|
95
|
-
var selectedToMonth = selectedTo ?
|
|
83
|
+
var selectedFromMonth = selectedFrom ? startOfMonth(selectedFrom).getTime() : undefined;
|
|
84
|
+
var selectedToMonth = selectedTo ? startOfMonth(selectedTo).getTime() : undefined;
|
|
96
85
|
// Проверяем, показываются ли выбранные месяцы в левой или правой части компонента
|
|
97
86
|
var fromMonthOnLeft = selectedFromMonth && selectedFromMonth === monthFrom;
|
|
98
87
|
var fromMonthOnRight = selectedFromMonth && selectedFromMonth === monthTo;
|
|
@@ -101,25 +90,25 @@ function useStaticViewMonthes(_a) {
|
|
|
101
90
|
var fromMonthOnScreen = fromMonthOnLeft || fromMonthOnRight;
|
|
102
91
|
var toMonthOnScreen = toMonthOnLeft || toMonthOnRight;
|
|
103
92
|
if (fromMonthOnLeft && toMonthOnLeft) {
|
|
104
|
-
setMonthTo(
|
|
93
|
+
setMonthTo(max([addMonths(selectedFromMonth, 1), monthTo]).getTime());
|
|
105
94
|
return;
|
|
106
95
|
}
|
|
107
96
|
if (fromMonthOnRight && toMonthOnRight) {
|
|
108
|
-
setMonthFrom(
|
|
97
|
+
setMonthFrom(min([subMonths(selectedToMonth, 1), monthFrom]).getTime());
|
|
109
98
|
return;
|
|
110
99
|
}
|
|
111
100
|
if (selectedFromMonth && selectedToMonth) {
|
|
112
101
|
setMonthFrom(selectedFromMonth);
|
|
113
|
-
setMonthTo(
|
|
102
|
+
setMonthTo(max([addMonths(selectedFromMonth, 1), selectedToMonth]).getTime());
|
|
114
103
|
return;
|
|
115
104
|
}
|
|
116
105
|
if (selectedFromMonth && !selectedToMonth && !fromMonthOnScreen) {
|
|
117
106
|
setMonthFrom(selectedFromMonth);
|
|
118
|
-
setMonthTo(
|
|
107
|
+
setMonthTo(max([addMonths(selectedFromMonth, 1), monthTo]).getTime());
|
|
119
108
|
}
|
|
120
109
|
if (selectedToMonth && !selectedFromMonth && !toMonthOnScreen) {
|
|
121
110
|
setMonthTo(selectedToMonth);
|
|
122
|
-
setMonthFrom(
|
|
111
|
+
setMonthFrom(min([subMonths(selectedToMonth, 1), monthFrom]).getTime());
|
|
123
112
|
}
|
|
124
113
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
125
114
|
}, [selectedFrom, selectedTo]);
|
|
@@ -135,15 +124,15 @@ function useSelectionProps(from, to, highlighted) {
|
|
|
135
124
|
if (from && to) {
|
|
136
125
|
return {
|
|
137
126
|
rangeComplete: true,
|
|
138
|
-
selectedFrom:
|
|
139
|
-
selectedTo:
|
|
127
|
+
selectedFrom: min([from, to]).getTime(),
|
|
128
|
+
selectedTo: max([from, to]).getTime(),
|
|
140
129
|
};
|
|
141
130
|
}
|
|
142
131
|
var dates = [from, to, highlighted].filter(function (date) { return date !== undefined; });
|
|
143
132
|
return {
|
|
144
133
|
rangeComplete: false,
|
|
145
|
-
selectedFrom: from || dates.length === 2 ?
|
|
146
|
-
selectedTo: to || dates.length === 2 ?
|
|
134
|
+
selectedFrom: from || dates.length === 2 ? min(dates).getTime() : undefined,
|
|
135
|
+
selectedTo: to || dates.length === 2 ? max(dates).getTime() : undefined,
|
|
147
136
|
};
|
|
148
137
|
}, [from, highlighted, to]);
|
|
149
138
|
}
|
package/index.js
CHANGED
|
@@ -1,25 +1,23 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('./index.module-2b983411.js');
|
|
3
|
+
var Component = require('./Component.js');
|
|
4
|
+
require('./index.module-3391f602.js');
|
|
6
5
|
require('react');
|
|
6
|
+
require('./views/popover.js');
|
|
7
7
|
require('classnames');
|
|
8
8
|
require('date-fns/startOfMonth');
|
|
9
9
|
require('@alfalab/core-components-calendar-input');
|
|
10
10
|
require('@alfalab/core-components-date-input');
|
|
11
|
+
require('./hooks.js');
|
|
11
12
|
require('date-fns/addMonths');
|
|
12
13
|
require('date-fns/isEqual');
|
|
13
14
|
require('date-fns/max');
|
|
14
15
|
require('date-fns/min');
|
|
15
16
|
require('date-fns/subMonths');
|
|
16
|
-
require('./
|
|
17
|
-
require('./views/popover.js');
|
|
17
|
+
require('./views/static.js');
|
|
18
18
|
require('date-fns/endOfMonth');
|
|
19
19
|
require('@alfalab/core-components-calendar');
|
|
20
20
|
require('./utils.js');
|
|
21
|
-
require('./views/static.js');
|
|
22
|
-
var Component = require('./Component.js');
|
|
23
21
|
|
|
24
22
|
|
|
25
23
|
|
|
File without changes
|
|
@@ -39,7 +39,7 @@ function __rest(s, e) {
|
|
|
39
39
|
return t;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
-
var styles = {"component":"calendar-
|
|
42
|
+
var styles = {"component":"calendar-range__component_17yx8","divider":"calendar-range__divider_17yx8","static":"calendar-range__static_17yx8","calendar":"calendar-range__calendar_17yx8"};
|
|
43
43
|
require('./views/index.css')
|
|
44
44
|
|
|
45
45
|
exports.__rest = __rest;
|
package/modern/Component.js
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { CalendarRangePopover } from './views/popover.js';
|
|
3
|
+
import { CalendarRangeStatic } from './views/static.js';
|
|
2
4
|
import 'classnames';
|
|
3
5
|
import 'date-fns/startOfMonth';
|
|
4
6
|
import '@alfalab/core-components-calendar-input/modern';
|
|
5
7
|
import '@alfalab/core-components-date-input/modern';
|
|
8
|
+
import './hooks.js';
|
|
6
9
|
import 'date-fns/addMonths';
|
|
7
10
|
import 'date-fns/isEqual';
|
|
8
11
|
import 'date-fns/max';
|
|
9
12
|
import 'date-fns/min';
|
|
10
13
|
import 'date-fns/subMonths';
|
|
11
|
-
import './
|
|
12
|
-
import './index.module-4b4e51e6.js';
|
|
13
|
-
import { CalendarRangePopover } from './views/popover.js';
|
|
14
|
+
import './index.module-5493f8ee.js';
|
|
14
15
|
import 'date-fns/endOfMonth';
|
|
15
16
|
import '@alfalab/core-components-calendar/modern';
|
|
16
17
|
import './utils.js';
|
|
17
|
-
import { CalendarRangeStatic } from './views/static.js';
|
|
18
18
|
|
|
19
19
|
const CalendarRange = ({ calendarPosition = 'static', ...restProps }) => {
|
|
20
20
|
const View = calendarPosition === 'popover' ? CalendarRangePopover : CalendarRangeStatic;
|
package/modern/hooks.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { useState, useCallback, useEffect, useMemo } from 'react';
|
|
2
|
-
import startOfMonth from 'date-fns/startOfMonth';
|
|
3
2
|
import addMonths from 'date-fns/addMonths';
|
|
4
3
|
import isEqual from 'date-fns/isEqual';
|
|
5
4
|
import max from 'date-fns/max';
|
|
6
5
|
import min from 'date-fns/min';
|
|
6
|
+
import startOfMonth from 'date-fns/startOfMonth';
|
|
7
7
|
import subMonths from 'date-fns/subMonths';
|
|
8
8
|
|
|
9
9
|
function usePopoverViewMonthes({ dateFrom, dateTo, defaultMonth, resetKey, }) {
|
package/modern/index.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
+
export { CalendarRange } from './Component.js';
|
|
1
2
|
import 'react';
|
|
3
|
+
import './views/popover.js';
|
|
2
4
|
import 'classnames';
|
|
3
5
|
import 'date-fns/startOfMonth';
|
|
4
6
|
import '@alfalab/core-components-calendar-input/modern';
|
|
5
7
|
import '@alfalab/core-components-date-input/modern';
|
|
8
|
+
import './hooks.js';
|
|
6
9
|
import 'date-fns/addMonths';
|
|
7
10
|
import 'date-fns/isEqual';
|
|
8
11
|
import 'date-fns/max';
|
|
9
12
|
import 'date-fns/min';
|
|
10
13
|
import 'date-fns/subMonths';
|
|
11
|
-
import './
|
|
12
|
-
import './
|
|
13
|
-
import './views/popover.js';
|
|
14
|
+
import './index.module-5493f8ee.js';
|
|
15
|
+
import './views/static.js';
|
|
14
16
|
import 'date-fns/endOfMonth';
|
|
15
17
|
import '@alfalab/core-components-calendar/modern';
|
|
16
18
|
import './utils.js';
|
|
17
|
-
import './views/static.js';
|
|
18
|
-
export { CalendarRange } from './Component.js';
|
package/modern/views/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: z4zdr */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-graphic-primary: #0b1f35;
|
|
4
4
|
}
|
|
@@ -36,19 +36,19 @@
|
|
|
36
36
|
|
|
37
37
|
/* marker */
|
|
38
38
|
}
|
|
39
|
-
.calendar-
|
|
39
|
+
.calendar-range__component_17yx8 {
|
|
40
40
|
display: flex
|
|
41
41
|
}
|
|
42
|
-
.calendar-
|
|
42
|
+
.calendar-range__component_17yx8 button[aria-selected='true'] {
|
|
43
43
|
cursor: pointer;
|
|
44
44
|
}
|
|
45
|
-
.calendar-
|
|
45
|
+
.calendar-range__component_17yx8 *[class*='errorIcon_'] {
|
|
46
46
|
display: none;
|
|
47
47
|
}
|
|
48
|
-
.calendar-
|
|
48
|
+
.calendar-range__component_17yx8 *[class*='calendarIcon_'] {
|
|
49
49
|
margin-right: 0;
|
|
50
50
|
}
|
|
51
|
-
.calendar-
|
|
51
|
+
.calendar-range__divider_17yx8 {
|
|
52
52
|
height: 48px;
|
|
53
53
|
display: flex;
|
|
54
54
|
align-items: center;
|
|
@@ -56,13 +56,13 @@
|
|
|
56
56
|
width: 16px;
|
|
57
57
|
margin: 0 var(--gap-xs)
|
|
58
58
|
}
|
|
59
|
-
.calendar-
|
|
59
|
+
.calendar-range__divider_17yx8:after {
|
|
60
60
|
content: '';
|
|
61
61
|
display: block;
|
|
62
62
|
width: 100%;
|
|
63
63
|
height: 1px;
|
|
64
64
|
background-color: var(--color-light-graphic-primary);
|
|
65
65
|
}
|
|
66
|
-
.calendar-
|
|
66
|
+
.calendar-range__static_17yx8 .calendar-range__calendar_17yx8 {
|
|
67
67
|
width: var(--calendar-inner-width);
|
|
68
68
|
}
|
package/modern/views/popover.js
CHANGED
|
@@ -3,13 +3,13 @@ import cn from 'classnames';
|
|
|
3
3
|
import startOfMonth from 'date-fns/startOfMonth';
|
|
4
4
|
import { isValidInputValue, parseDateString, CalendarInput } from '@alfalab/core-components-calendar-input/modern';
|
|
5
5
|
import { isCompleteDateInput } from '@alfalab/core-components-date-input/modern';
|
|
6
|
+
import { usePopoverViewMonthes } from '../hooks.js';
|
|
7
|
+
import { s as styles } from '../index.module-5493f8ee.js';
|
|
6
8
|
import 'date-fns/addMonths';
|
|
7
9
|
import 'date-fns/isEqual';
|
|
8
10
|
import 'date-fns/max';
|
|
9
11
|
import 'date-fns/min';
|
|
10
12
|
import 'date-fns/subMonths';
|
|
11
|
-
import { usePopoverViewMonthes } from '../hooks.js';
|
|
12
|
-
import { s as styles } from '../index.module-4b4e51e6.js';
|
|
13
13
|
|
|
14
14
|
const CalendarRangePopover = ({ className, defaultMonth = startOfMonth(new Date()).getTime(), minDate, maxDate, valueFrom = '', valueTo = '', onDateFromChange = () => null, onDateToChange = () => null, onChange = () => null, onError, inputFromProps = {}, inputToProps = {}, offDays, events, dataTestId, }) => {
|
|
15
15
|
const [inputFromValue, setInputFromValue] = useState(valueFrom);
|
package/modern/views/static.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import React, { useState, useCallback, useEffect } from 'react';
|
|
2
2
|
import cn from 'classnames';
|
|
3
|
-
import startOfMonth from 'date-fns/startOfMonth';
|
|
4
|
-
import { isValidInputValue, parseDateString, formatDate } from '@alfalab/core-components-calendar-input/modern';
|
|
5
|
-
import { isCompleteDateInput, DateInput } from '@alfalab/core-components-date-input/modern';
|
|
6
3
|
import addMonths from 'date-fns/addMonths';
|
|
7
|
-
import 'date-fns/
|
|
4
|
+
import endOfMonth from 'date-fns/endOfMonth';
|
|
8
5
|
import max from 'date-fns/max';
|
|
9
|
-
import 'date-fns/
|
|
6
|
+
import startOfMonth from 'date-fns/startOfMonth';
|
|
10
7
|
import subMonths from 'date-fns/subMonths';
|
|
11
|
-
import { useStaticViewMonthes, useSelectionProps } from '../hooks.js';
|
|
12
|
-
import { s as styles } from '../index.module-4b4e51e6.js';
|
|
13
|
-
import endOfMonth from 'date-fns/endOfMonth';
|
|
14
8
|
import { usePeriodWithReset, Calendar } from '@alfalab/core-components-calendar/modern';
|
|
9
|
+
import { isValidInputValue, parseDateString, formatDate } from '@alfalab/core-components-calendar-input/modern';
|
|
10
|
+
import { isCompleteDateInput, DateInput } from '@alfalab/core-components-date-input/modern';
|
|
11
|
+
import { useStaticViewMonthes, useSelectionProps } from '../hooks.js';
|
|
15
12
|
import { isDayButton } from '../utils.js';
|
|
13
|
+
import { s as styles } from '../index.module-5493f8ee.js';
|
|
14
|
+
import 'date-fns/isEqual';
|
|
15
|
+
import 'date-fns/min';
|
|
16
16
|
|
|
17
17
|
/* eslint-disable complexity */
|
|
18
18
|
const CalendarRangeStatic = ({ className, defaultMonth = startOfMonth(new Date()).getTime(), defaultMonthPosition = 'left', minDate, maxDate, valueFrom = '', valueTo = '', onDateFromChange = () => null, onDateToChange = () => null, onChange = () => null, onError, inputFromProps = {}, inputToProps = {}, offDays, events, dataTestId, }) => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alfalab/core-components-calendar-range",
|
|
3
|
-
"version": "7.0.
|
|
3
|
+
"version": "7.0.6",
|
|
4
4
|
"description": "Calendar range component",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
"react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@alfalab/core-components-calendar": "^6.1.
|
|
22
|
-
"@alfalab/core-components-calendar-input": "^8.1.
|
|
21
|
+
"@alfalab/core-components-calendar": "^6.1.15",
|
|
22
|
+
"@alfalab/core-components-calendar-input": "^8.1.3",
|
|
23
23
|
"@alfalab/core-components-date-input": "^4.1.0",
|
|
24
24
|
"classnames": "^2.3.1",
|
|
25
25
|
"date-fns": "^2.16.1"
|
package/utils.js
CHANGED
package/views/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: z4zdr */
|
|
2
2
|
:root {
|
|
3
3
|
--color-light-graphic-primary: #0b1f35;
|
|
4
4
|
}
|
|
@@ -36,19 +36,19 @@
|
|
|
36
36
|
|
|
37
37
|
/* marker */
|
|
38
38
|
}
|
|
39
|
-
.calendar-
|
|
39
|
+
.calendar-range__component_17yx8 {
|
|
40
40
|
display: flex
|
|
41
41
|
}
|
|
42
|
-
.calendar-
|
|
42
|
+
.calendar-range__component_17yx8 button[aria-selected='true'] {
|
|
43
43
|
cursor: pointer;
|
|
44
44
|
}
|
|
45
|
-
.calendar-
|
|
45
|
+
.calendar-range__component_17yx8 *[class*='errorIcon_'] {
|
|
46
46
|
display: none;
|
|
47
47
|
}
|
|
48
|
-
.calendar-
|
|
48
|
+
.calendar-range__component_17yx8 *[class*='calendarIcon_'] {
|
|
49
49
|
margin-right: 0;
|
|
50
50
|
}
|
|
51
|
-
.calendar-
|
|
51
|
+
.calendar-range__divider_17yx8 {
|
|
52
52
|
height: 48px;
|
|
53
53
|
display: flex;
|
|
54
54
|
align-items: center;
|
|
@@ -56,13 +56,13 @@
|
|
|
56
56
|
width: 16px;
|
|
57
57
|
margin: 0 var(--gap-xs)
|
|
58
58
|
}
|
|
59
|
-
.calendar-
|
|
59
|
+
.calendar-range__divider_17yx8:after {
|
|
60
60
|
content: '';
|
|
61
61
|
display: block;
|
|
62
62
|
width: 100%;
|
|
63
63
|
height: 1px;
|
|
64
64
|
background-color: var(--color-light-graphic-primary);
|
|
65
65
|
}
|
|
66
|
-
.calendar-
|
|
66
|
+
.calendar-range__static_17yx8 .calendar-range__calendar_17yx8 {
|
|
67
67
|
width: var(--calendar-inner-width);
|
|
68
68
|
}
|
package/views/popover.js
CHANGED
|
@@ -1,28 +1,20 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var index_module = require('../index.module-2b983411.js');
|
|
3
|
+
var index_module = require('../index.module-3391f602.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var cn = require('classnames');
|
|
8
6
|
var startOfMonth = require('date-fns/startOfMonth');
|
|
9
7
|
var coreComponentsCalendarInput = require('@alfalab/core-components-calendar-input');
|
|
10
8
|
var coreComponentsDateInput = require('@alfalab/core-components-date-input');
|
|
9
|
+
var hooks = require('../hooks.js');
|
|
11
10
|
require('date-fns/addMonths');
|
|
12
11
|
require('date-fns/isEqual');
|
|
13
12
|
require('date-fns/max');
|
|
14
13
|
require('date-fns/min');
|
|
15
14
|
require('date-fns/subMonths');
|
|
16
|
-
var hooks = require('../hooks.js');
|
|
17
|
-
|
|
18
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
19
|
-
|
|
20
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
21
|
-
var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
|
|
22
|
-
var startOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(startOfMonth);
|
|
23
15
|
|
|
24
16
|
var CalendarRangePopover = function (_a) {
|
|
25
|
-
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ?
|
|
17
|
+
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth(new Date()).getTime() : _b, minDate = _a.minDate, maxDate = _a.maxDate, _c = _a.valueFrom, valueFrom = _c === void 0 ? '' : _c, _d = _a.valueTo, valueTo = _d === void 0 ? '' : _d, _e = _a.onDateFromChange, onDateFromChange = _e === void 0 ? function () { return null; } : _e, _f = _a.onDateToChange, onDateToChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onChange, onChange = _g === void 0 ? function () { return null; } : _g, onError = _a.onError, _h = _a.inputFromProps, inputFromProps = _h === void 0 ? {} : _h, _j = _a.inputToProps, inputToProps = _j === void 0 ? {} : _j, offDays = _a.offDays, events = _a.events, dataTestId = _a.dataTestId;
|
|
26
18
|
var _k = React.useState(valueFrom), inputFromValue = _k[0], setInputFromValue = _k[1];
|
|
27
19
|
var _l = React.useState(valueTo), inputToValue = _l[0], setInputToValue = _l[1];
|
|
28
20
|
/**
|
|
@@ -114,10 +106,10 @@ var CalendarRangePopover = function (_a) {
|
|
|
114
106
|
}
|
|
115
107
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
116
108
|
}, [hasValidateError]);
|
|
117
|
-
return (
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
109
|
+
return (React.createElement("div", { className: cn(index_module.styles.component, className), "data-test-id": dataTestId },
|
|
110
|
+
React.createElement(coreComponentsCalendarInput.CalendarInput, index_module.__assign({}, inputFromProps, { useAnchorWidth: false, calendarPosition: 'popover', popoverPosition: 'bottom-start', error: inputFromInvalid || bothInvalid || inputFromProps.error, onChange: handleFromChange, onInputChange: handleInputFromChange, onBlur: handleInputFromBlur, value: inputFromValue, minDate: minDate, maxDate: maxDate, offDays: offDays, events: events, calendarProps: index_module.__assign(index_module.__assign({}, inputFromProps.calendarProps), { month: monthFrom, onMonthChange: handleMonthFromChange, selectorView: 'full' }) })),
|
|
111
|
+
React.createElement("span", { className: index_module.styles.divider }),
|
|
112
|
+
React.createElement(coreComponentsCalendarInput.CalendarInput, index_module.__assign({}, inputToProps, { useAnchorWidth: false, calendarPosition: 'popover', popoverPosition: 'bottom-end', error: inputToInvalid || bothInvalid || inputToProps.error, onChange: handleToChange, onInputChange: handleInputToChange, onBlur: handleInputToBlur, value: inputToValue, minDate: dateFrom || minDate, maxDate: maxDate, offDays: offDays, events: events, calendarProps: index_module.__assign(index_module.__assign({}, inputToProps.calendarProps), { month: monthTo, onMonthChange: handleMonthToChange, selectorView: 'full' }) }))));
|
|
121
113
|
};
|
|
122
114
|
|
|
123
115
|
exports.CalendarRangePopover = CalendarRangePopover;
|
package/views/static.js
CHANGED
|
@@ -1,35 +1,23 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var index_module = require('../index.module-2b983411.js');
|
|
3
|
+
var index_module = require('../index.module-3391f602.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var cn = require('classnames');
|
|
8
|
-
var startOfMonth = require('date-fns/startOfMonth');
|
|
9
|
-
var coreComponentsCalendarInput = require('@alfalab/core-components-calendar-input');
|
|
10
|
-
var coreComponentsDateInput = require('@alfalab/core-components-date-input');
|
|
11
6
|
var addMonths = require('date-fns/addMonths');
|
|
12
|
-
require('date-fns/
|
|
7
|
+
var endOfMonth = require('date-fns/endOfMonth');
|
|
13
8
|
var max = require('date-fns/max');
|
|
14
|
-
require('date-fns/
|
|
9
|
+
var startOfMonth = require('date-fns/startOfMonth');
|
|
15
10
|
var subMonths = require('date-fns/subMonths');
|
|
16
|
-
var hooks = require('../hooks.js');
|
|
17
|
-
var endOfMonth = require('date-fns/endOfMonth');
|
|
18
11
|
var coreComponentsCalendar = require('@alfalab/core-components-calendar');
|
|
12
|
+
var coreComponentsCalendarInput = require('@alfalab/core-components-calendar-input');
|
|
13
|
+
var coreComponentsDateInput = require('@alfalab/core-components-date-input');
|
|
14
|
+
var hooks = require('../hooks.js');
|
|
19
15
|
var utils = require('../utils.js');
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
24
|
-
var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
|
|
25
|
-
var startOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(startOfMonth);
|
|
26
|
-
var addMonths__default = /*#__PURE__*/_interopDefaultLegacy(addMonths);
|
|
27
|
-
var max__default = /*#__PURE__*/_interopDefaultLegacy(max);
|
|
28
|
-
var subMonths__default = /*#__PURE__*/_interopDefaultLegacy(subMonths);
|
|
29
|
-
var endOfMonth__default = /*#__PURE__*/_interopDefaultLegacy(endOfMonth);
|
|
16
|
+
require('date-fns/isEqual');
|
|
17
|
+
require('date-fns/min');
|
|
30
18
|
|
|
31
19
|
var CalendarRangeStatic = function (_a) {
|
|
32
|
-
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ?
|
|
20
|
+
var className = _a.className, _b = _a.defaultMonth, defaultMonth = _b === void 0 ? startOfMonth(new Date()).getTime() : _b, _c = _a.defaultMonthPosition, defaultMonthPosition = _c === void 0 ? 'left' : _c, minDate = _a.minDate, maxDate = _a.maxDate, _d = _a.valueFrom, valueFrom = _d === void 0 ? '' : _d, _e = _a.valueTo, valueTo = _e === void 0 ? '' : _e, _f = _a.onDateFromChange, onDateFromChange = _f === void 0 ? function () { return null; } : _f, _g = _a.onDateToChange, onDateToChange = _g === void 0 ? function () { return null; } : _g, _h = _a.onChange, onChange = _h === void 0 ? function () { return null; } : _h, onError = _a.onError, _j = _a.inputFromProps, inputFromProps = _j === void 0 ? {} : _j, _k = _a.inputToProps, inputToProps = _k === void 0 ? {} : _k, offDays = _a.offDays, events = _a.events, dataTestId = _a.dataTestId;
|
|
33
21
|
var _l = React.useState(valueFrom), inputFromValue = _l[0], setInputFromValue = _l[1];
|
|
34
22
|
var _m = React.useState(valueTo), inputToValue = _m[0], setInputToValue = _m[1];
|
|
35
23
|
var dateFrom = coreComponentsCalendarInput.isValidInputValue(inputFromValue, minDate, maxDate, offDays)
|
|
@@ -159,18 +147,18 @@ var CalendarRangeStatic = function (_a) {
|
|
|
159
147
|
var CalendarToComponent = dateInputToProps.Calendar || coreComponentsCalendar.Calendar;
|
|
160
148
|
return (
|
|
161
149
|
// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
150
|
+
React.createElement("div", { className: cn(index_module.styles.component, index_module.styles.static, className), onMouseOver: handleMouseOver, "data-test-id": dataTestId },
|
|
151
|
+
React.createElement("div", null,
|
|
152
|
+
React.createElement(coreComponentsDateInput.DateInput, index_module.__assign({}, dateInputFromProps, { mobileMode: dateInputFromProps.mobileMode === 'popover'
|
|
165
153
|
? 'input'
|
|
166
154
|
: dateInputFromProps.mobileMode, value: inputFromValue, onChange: handleInputFromChange, onClear: handleClearFrom, onBlur: handleValidInputFrom, error: bothInvalid || inputFromInvalid || dateInputFromProps.error, clear: true, block: true })),
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
155
|
+
React.createElement(CalendarFromComponent, index_module.__assign({}, calendarFromProps, { className: cn(index_module.styles.calendar, calendarFromProps === null || calendarFromProps === void 0 ? void 0 : calendarFromProps.className), month: monthFrom, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthFromChange, minDate: minDate, maxDate: maxDate && max([maxDate, endOfMonth(subMonths(maxDate, 1))]).getTime() }, rangeProps))),
|
|
156
|
+
React.createElement("span", { className: index_module.styles.divider }),
|
|
157
|
+
React.createElement("div", null,
|
|
158
|
+
React.createElement(coreComponentsDateInput.DateInput, index_module.__assign({}, dateInputToProps, { mobileMode: dateInputToProps.mobileMode === 'popover'
|
|
171
159
|
? 'input'
|
|
172
160
|
: dateInputToProps.mobileMode, value: inputToValue, onChange: handleInputToChange, onClear: handleClearTo, onBlur: handleValidInputTo, error: bothInvalid || inputToInvalid, clear: true, block: true })),
|
|
173
|
-
|
|
161
|
+
React.createElement(CalendarToComponent, index_module.__assign({}, calendarToProps, { className: cn(index_module.styles.calendar, calendarToProps === null || calendarToProps === void 0 ? void 0 : calendarToProps.className), month: monthTo, selectorView: 'month-only', offDays: offDays, events: events, onChange: period.updatePeriod, onMonthChange: handleMonthToChange, minDate: minDate && startOfMonth(addMonths(minDate, 1)).getTime(), maxDate: maxDate }, rangeProps)))));
|
|
174
162
|
};
|
|
175
163
|
|
|
176
164
|
exports.CalendarRangeStatic = CalendarRangeStatic;
|