@gravity-ui/date-components 1.1.1 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/Calendar/Calendar.css +37 -37
- package/dist/cjs/components/Calendar/Calendar.js +2 -4
- package/dist/cjs/components/Calendar/CalendarBase.js +2 -4
- package/dist/cjs/components/Calendar/RangeCalendar.js +2 -4
- package/dist/cjs/components/Calendar/hooks/useCalendarCellProps.js +2 -4
- package/dist/cjs/components/Calendar/hooks/useCalendarGridProps.js +11 -0
- package/dist/cjs/components/Calendar/hooks/useCalendarProps.js +2 -4
- package/dist/cjs/components/Calendar/hooks/useCalendarState.js +2 -4
- package/dist/cjs/components/Calendar/hooks/useRangeCalendarState.js +3 -16
- package/dist/cjs/components/Calendar/i18n/index.js +3 -5
- package/dist/cjs/components/Calendar/index.js +8 -21
- package/dist/cjs/components/DateField/DateField.js +3 -16
- package/dist/cjs/components/DateField/hooks/useDateFieldProps.js +4 -6
- package/dist/cjs/components/DateField/hooks/useDateFieldState.js +7 -7
- package/dist/cjs/components/DateField/i18n/index.js +3 -5
- package/dist/cjs/components/DateField/index.js +4 -17
- package/dist/cjs/components/DateField/utils.d.ts +1 -2
- package/dist/cjs/components/DateField/utils.js +5 -3
- package/dist/cjs/components/DatePicker/DatePicker.js +3 -16
- package/dist/cjs/components/DatePicker/hooks/useDatePickerProps.js +3 -16
- package/dist/cjs/components/DatePicker/hooks/useDatePickerState.js +2 -4
- package/dist/cjs/components/DatePicker/i18n/index.js +3 -5
- package/dist/cjs/components/DatePicker/index.js +4 -17
- package/dist/cjs/components/RelativeDateField/RelativeDateField.js +2 -4
- package/dist/cjs/components/RelativeDateField/hooks/useRelativeDateFieldProps.js +2 -4
- package/dist/cjs/components/RelativeDateField/hooks/useRelativeDateFieldState.js +2 -4
- package/dist/cjs/components/RelativeDateField/index.js +4 -17
- package/dist/cjs/components/RelativeDatePicker/RelativeDatePicker.js +2 -4
- package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js +3 -16
- package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerState.js +2 -4
- package/dist/cjs/components/RelativeDatePicker/i18n/index.js +3 -5
- package/dist/cjs/components/RelativeDatePicker/index.js +4 -17
- package/dist/cjs/components/hooks/useControlledState.js +2 -4
- package/dist/cjs/components/index.js +6 -19
- package/dist/cjs/index.js +2 -15
- package/dist/esm/components/Calendar/Calendar.css +37 -37
- package/dist/esm/components/Calendar/hooks/useCalendarGridProps.js +11 -0
- package/dist/esm/components/Calendar/hooks/useRangeCalendarState.js +1 -11
- package/dist/esm/components/DateField/DateField.js +1 -11
- package/dist/esm/components/DateField/hooks/useDateFieldProps.js +3 -3
- package/dist/esm/components/DateField/hooks/useDateFieldState.js +5 -3
- package/dist/esm/components/DateField/utils.d.ts +1 -2
- package/dist/esm/components/DateField/utils.js +3 -2
- package/dist/esm/components/DatePicker/DatePicker.js +1 -11
- package/dist/esm/components/DatePicker/hooks/useDatePickerProps.js +1 -11
- package/dist/esm/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js +1 -11
- package/package.json +37 -34
|
@@ -50,43 +50,6 @@
|
|
|
50
50
|
height: 100%;
|
|
51
51
|
padding: 0 var(--_--calendar-padding) var(--_--calendar-padding);
|
|
52
52
|
}
|
|
53
|
-
.g-date-calendar__content_animation_forward {
|
|
54
|
-
transform: translateX(-100%);
|
|
55
|
-
animation: calendar-forward 0.25s ease forwards;
|
|
56
|
-
}
|
|
57
|
-
.g-date-calendar__content_animation_forward.g-date-calendar__current-state {
|
|
58
|
-
left: -100%;
|
|
59
|
-
}
|
|
60
|
-
.g-date-calendar__content_animation_backward {
|
|
61
|
-
transform: translateX(0);
|
|
62
|
-
animation: calendar-backward 0.25s ease forwards;
|
|
63
|
-
}
|
|
64
|
-
.g-date-calendar__content_animation_backward.g-date-calendar__current-state {
|
|
65
|
-
left: 100%;
|
|
66
|
-
}
|
|
67
|
-
.g-date-calendar__content_animation_zoom-in {
|
|
68
|
-
transform: scale();
|
|
69
|
-
}
|
|
70
|
-
.g-date-calendar__content_animation_zoom-in.g-date-calendar__previous-state {
|
|
71
|
-
animation: calendar-zoom-in-hiding 0.25s ease forwards;
|
|
72
|
-
}
|
|
73
|
-
.g-date-calendar__content_animation_zoom-in.g-date-calendar__current-state {
|
|
74
|
-
animation: calendar-zoom-in-showing 0.25s ease forwards;
|
|
75
|
-
}
|
|
76
|
-
.g-date-calendar__content_animation_zoom-out {
|
|
77
|
-
transform: scale();
|
|
78
|
-
}
|
|
79
|
-
.g-date-calendar__content_animation_zoom-out.g-date-calendar__current-state {
|
|
80
|
-
animation: calendar-zoom-out-showing 0.25s ease forwards;
|
|
81
|
-
}
|
|
82
|
-
.g-date-calendar__content_animation_zoom-out.g-date-calendar__previous-state {
|
|
83
|
-
animation: calendar-zoom-out-hiding 0.25s ease forwards;
|
|
84
|
-
}
|
|
85
|
-
@media screen and (prefers-reduced-motion: reduce), (update: slow) {
|
|
86
|
-
.g-date-calendar__content[class] {
|
|
87
|
-
animation-duration: 0.001ms;
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
53
|
@keyframes calendar-forward {
|
|
91
54
|
from {
|
|
92
55
|
transform: translateX(0);
|
|
@@ -143,6 +106,43 @@
|
|
|
143
106
|
transform: scale(2);
|
|
144
107
|
}
|
|
145
108
|
}
|
|
109
|
+
.g-date-calendar__content_animation_forward {
|
|
110
|
+
transform: translateX(-100%);
|
|
111
|
+
animation: calendar-forward 0.25s ease forwards;
|
|
112
|
+
}
|
|
113
|
+
.g-date-calendar__content_animation_forward.g-date-calendar__current-state {
|
|
114
|
+
left: -100%;
|
|
115
|
+
}
|
|
116
|
+
.g-date-calendar__content_animation_backward {
|
|
117
|
+
transform: translateX(0);
|
|
118
|
+
animation: calendar-backward 0.25s ease forwards;
|
|
119
|
+
}
|
|
120
|
+
.g-date-calendar__content_animation_backward.g-date-calendar__current-state {
|
|
121
|
+
left: 100%;
|
|
122
|
+
}
|
|
123
|
+
.g-date-calendar__content_animation_zoom-in {
|
|
124
|
+
transform: scale();
|
|
125
|
+
}
|
|
126
|
+
.g-date-calendar__content_animation_zoom-in.g-date-calendar__previous-state {
|
|
127
|
+
animation: calendar-zoom-in-hiding 0.25s ease forwards;
|
|
128
|
+
}
|
|
129
|
+
.g-date-calendar__content_animation_zoom-in.g-date-calendar__current-state {
|
|
130
|
+
animation: calendar-zoom-in-showing 0.25s ease forwards;
|
|
131
|
+
}
|
|
132
|
+
.g-date-calendar__content_animation_zoom-out {
|
|
133
|
+
transform: scale();
|
|
134
|
+
}
|
|
135
|
+
.g-date-calendar__content_animation_zoom-out.g-date-calendar__current-state {
|
|
136
|
+
animation: calendar-zoom-out-showing 0.25s ease forwards;
|
|
137
|
+
}
|
|
138
|
+
.g-date-calendar__content_animation_zoom-out.g-date-calendar__previous-state {
|
|
139
|
+
animation: calendar-zoom-out-hiding 0.25s ease forwards;
|
|
140
|
+
}
|
|
141
|
+
@media screen and (prefers-reduced-motion: reduce), (update: slow) {
|
|
142
|
+
.g-date-calendar__content[class] {
|
|
143
|
+
animation-duration: 0.001ms;
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
146
|
.g-date-calendar__grid-rowgroup {
|
|
147
147
|
display: grid;
|
|
148
148
|
gap: var(--_--calendar-days-gap);
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.Calendar = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
6
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
9
7
|
const CalendarBase_1 = require("./CalendarBase");
|
|
10
8
|
const useCalendarState_1 = require("./hooks/useCalendarState");
|
|
11
9
|
require("./Calendar.css");
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.CalendarBase = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
6
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
9
7
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
10
8
|
const cn_1 = require("../../utils/cn");
|
|
11
9
|
const useCalendarCellProps_1 = require("./hooks/useCalendarCellProps");
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.RangeCalendar = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
6
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
9
7
|
const CalendarBase_1 = require("./CalendarBase");
|
|
10
8
|
const useRangeCalendarState_1 = require("./hooks/useRangeCalendarState");
|
|
11
9
|
require("./Calendar.css");
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useCalendarCellProps = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
const date_utils_1 = require("@gravity-ui/date-utils");
|
|
9
7
|
function useCalendarCellProps(date, state) {
|
|
10
8
|
const ref = react_1.default.useRef(null);
|
|
@@ -12,36 +12,47 @@ function useCalendarGridProps(state) {
|
|
|
12
12
|
? `${state.startDate.year()} — ${state.endDate.year()}`
|
|
13
13
|
: state.focusedDate.format(state.mode === 'days' ? 'MMMM YYYY' : 'YYYY'), 'aria-disabled': state.disabled ? 'true' : undefined, 'aria-readonly': state.readOnly ? 'true' : undefined }, focusWithinProps), { onKeyDown: (e) => {
|
|
14
14
|
if (e.key === 'ArrowRight') {
|
|
15
|
+
e.preventDefault();
|
|
15
16
|
state.focusNextCell();
|
|
16
17
|
}
|
|
17
18
|
else if (e.key === 'ArrowLeft') {
|
|
19
|
+
e.preventDefault();
|
|
18
20
|
state.focusPreviousCell();
|
|
19
21
|
}
|
|
20
22
|
else if (e.key === 'ArrowDown') {
|
|
23
|
+
e.preventDefault();
|
|
21
24
|
state.focusNextRow();
|
|
22
25
|
}
|
|
23
26
|
else if (e.key === 'ArrowUp') {
|
|
27
|
+
e.preventDefault();
|
|
24
28
|
state.focusPreviousRow();
|
|
25
29
|
}
|
|
26
30
|
else if (e.key === 'PageDown') {
|
|
31
|
+
e.preventDefault();
|
|
27
32
|
state.focusNextPage(e.shiftKey);
|
|
28
33
|
}
|
|
29
34
|
else if (e.key === 'PageUp') {
|
|
35
|
+
e.preventDefault();
|
|
30
36
|
state.focusPreviousPage(e.shiftKey);
|
|
31
37
|
}
|
|
32
38
|
else if (e.key === 'End') {
|
|
39
|
+
e.preventDefault();
|
|
33
40
|
state.focusSectionEnd();
|
|
34
41
|
}
|
|
35
42
|
else if (e.key === 'Home') {
|
|
43
|
+
e.preventDefault();
|
|
36
44
|
state.focusSectionStart();
|
|
37
45
|
}
|
|
38
46
|
else if (e.code === 'Minus') {
|
|
47
|
+
e.preventDefault();
|
|
39
48
|
state.zoomOut();
|
|
40
49
|
}
|
|
41
50
|
else if (e.code === 'Equal') {
|
|
51
|
+
e.preventDefault();
|
|
42
52
|
state.zoomIn();
|
|
43
53
|
}
|
|
44
54
|
else if (e.key === 'Enter' || e.key === ' ') {
|
|
55
|
+
e.preventDefault();
|
|
45
56
|
state.selectDate(state.focusedDate);
|
|
46
57
|
}
|
|
47
58
|
} });
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useCalendarProps = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
9
7
|
const i18n_1 = require("../i18n");
|
|
10
8
|
const buttonDisabledClassName = 'yc-button_disabled g-button_disabled';
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useCalendarState = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
const useControlledState_1 = require("../../hooks/useControlledState");
|
|
9
7
|
const dates_1 = require("../../utils/dates");
|
|
10
8
|
const utils_1 = require("../utils");
|
|
@@ -1,27 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
3
|
exports.useRangeCalendarState = void 0;
|
|
18
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
19
6
|
const useControlledState_1 = require("../../hooks/useControlledState");
|
|
20
7
|
const utils_1 = require("../utils");
|
|
21
8
|
const useCalendarState_1 = require("./useCalendarState");
|
|
22
9
|
function useRangeCalendarState(props) {
|
|
23
10
|
var _a, _b;
|
|
24
|
-
const { value: valueProp, defaultValue, onUpdate } = props, calendarProps = __rest(props, ["value", "defaultValue", "onUpdate"]);
|
|
11
|
+
const { value: valueProp, defaultValue, onUpdate } = props, calendarProps = tslib_1.__rest(props, ["value", "defaultValue", "onUpdate"]);
|
|
25
12
|
const [value, setValue] = (0, useControlledState_1.useControlledState)(valueProp, defaultValue, onUpdate);
|
|
26
13
|
const [anchorDate, setAnchorDateState] = react_1.default.useState();
|
|
27
14
|
const calendar = (0, useCalendarState_1.useCalendarState)(Object.assign(Object.assign({}, calendarProps), { value: (_a = value === null || value === void 0 ? void 0 : value.start) !== null && _a !== void 0 ? _a : null }));
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.i18n = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const i18n_1 = require("@gravity-ui/uikit/i18n");
|
|
8
6
|
const cn_1 = require("../../../utils/cn");
|
|
9
|
-
const en_json_1 = __importDefault(require("./en.json"));
|
|
10
|
-
const ru_json_1 = __importDefault(require("./ru.json"));
|
|
7
|
+
const en_json_1 = tslib_1.__importDefault(require("./en.json"));
|
|
8
|
+
const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
|
|
11
9
|
exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}calendar`);
|
|
@@ -1,23 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
__exportStar(require("./
|
|
19
|
-
__exportStar(require("./
|
|
20
|
-
__exportStar(require("./hooks/
|
|
21
|
-
__exportStar(require("./hooks/
|
|
22
|
-
__exportStar(require("./hooks/
|
|
23
|
-
__exportStar(require("./hooks/
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
tslib_1.__exportStar(require("./Calendar"), exports);
|
|
5
|
+
tslib_1.__exportStar(require("./RangeCalendar"), exports);
|
|
6
|
+
tslib_1.__exportStar(require("./hooks/useCalendarState"), exports);
|
|
7
|
+
tslib_1.__exportStar(require("./hooks/useRangeCalendarState"), exports);
|
|
8
|
+
tslib_1.__exportStar(require("./hooks/useCalendarProps"), exports);
|
|
9
|
+
tslib_1.__exportStar(require("./hooks/useCalendarGridProps"), exports);
|
|
10
|
+
tslib_1.__exportStar(require("./hooks/useCalendarCellProps"), exports);
|
|
@@ -1,22 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
3
|
exports.DateField = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
18
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
19
|
-
const react_1 = __importDefault(require("react"));
|
|
6
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
20
7
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
21
8
|
const cn_1 = require("../../utils/cn");
|
|
22
9
|
const useDateFieldProps_1 = require("./hooks/useDateFieldProps");
|
|
@@ -24,7 +11,7 @@ const useDateFieldState_1 = require("./hooks/useDateFieldState");
|
|
|
24
11
|
require("./DateField.css");
|
|
25
12
|
const b = (0, cn_1.block)('date-field');
|
|
26
13
|
function DateField(_a) {
|
|
27
|
-
var { className } = _a, props = __rest(_a, ["className"]);
|
|
14
|
+
var { className } = _a, props = tslib_1.__rest(_a, ["className"]);
|
|
28
15
|
const state = (0, useDateFieldState_1.useDateFieldState)(props);
|
|
29
16
|
const { inputProps } = (0, useDateFieldProps_1.useDateFieldProps)(state, props);
|
|
30
17
|
const [isActive, setActive] = react_1.default.useState(false);
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useDateFieldProps = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
const utils_1 = require("../utils");
|
|
9
7
|
function useDateFieldProps(state, props) {
|
|
10
8
|
const inputRef = react_1.default.useRef(null);
|
|
@@ -151,7 +149,7 @@ function useDateFieldProps(state, props) {
|
|
|
151
149
|
e.preventDefault();
|
|
152
150
|
state.clearSection();
|
|
153
151
|
}
|
|
154
|
-
else if (e.key === 'a' && e[
|
|
152
|
+
else if (e.key === 'a' && (e['ctrlKey'] || e['metaKey'])) {
|
|
155
153
|
e.preventDefault();
|
|
156
154
|
setSelectedSections('all');
|
|
157
155
|
}
|
|
@@ -183,7 +181,7 @@ function useDateFieldProps(state, props) {
|
|
|
183
181
|
if (state.readOnly) {
|
|
184
182
|
return;
|
|
185
183
|
}
|
|
186
|
-
const pastedValue = e.clipboardData.getData('text');
|
|
184
|
+
const pastedValue = (0, utils_1.cleanString)(e.clipboardData.getData('text'));
|
|
187
185
|
if (state.selectedSectionIndexes &&
|
|
188
186
|
state.selectedSectionIndexes.startIndex ===
|
|
189
187
|
state.selectedSectionIndexes.endIndex) {
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useDateFieldState = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
const date_utils_1 = require("@gravity-ui/date-utils");
|
|
9
7
|
const useControlledState_1 = require("../../hooks/useControlledState");
|
|
10
8
|
const dates_1 = require("../../utils/dates");
|
|
@@ -135,7 +133,8 @@ function useDateFieldState(props) {
|
|
|
135
133
|
isEmpty: Object.keys(validSegments).length === 0,
|
|
136
134
|
displayValue,
|
|
137
135
|
setValue,
|
|
138
|
-
|
|
136
|
+
// use ltr direction context to get predictable navigation inside input
|
|
137
|
+
text: '\u2066' + sectionsState.editableSections.map((s) => s.textValue).join('') + '\u2069',
|
|
139
138
|
readOnly: props.readOnly,
|
|
140
139
|
disabled: props.disabled,
|
|
141
140
|
sections: sectionsState.editableSections,
|
|
@@ -302,7 +301,6 @@ function useDateFieldState(props) {
|
|
|
302
301
|
timeZone: props.timeZone,
|
|
303
302
|
}));
|
|
304
303
|
},
|
|
305
|
-
// eslint-disable-next-line complexity
|
|
306
304
|
onInput(key) {
|
|
307
305
|
if (this.readOnly || this.disabled) {
|
|
308
306
|
return;
|
|
@@ -476,7 +474,7 @@ function useSectionsState(sections, value, validSegments) {
|
|
|
476
474
|
return state;
|
|
477
475
|
}
|
|
478
476
|
function getEditableSections(sections, value, validSegments) {
|
|
479
|
-
let position =
|
|
477
|
+
let position = 1;
|
|
480
478
|
const newSections = [];
|
|
481
479
|
let previousEditableSection = -1;
|
|
482
480
|
for (let i = 0; i < sections.length; i++) {
|
|
@@ -490,6 +488,8 @@ function getEditableSections(sections, value, validSegments) {
|
|
|
490
488
|
renderedValue = renderedValue.padStart(section.placeholder.length, '0');
|
|
491
489
|
}
|
|
492
490
|
}
|
|
491
|
+
// use bidirectional context to allow the browser autodetect text direction
|
|
492
|
+
renderedValue = '\u2068' + renderedValue + '\u2069';
|
|
493
493
|
const sectionLength = renderedValue.length;
|
|
494
494
|
const newSection = Object.assign(Object.assign(Object.assign({}, section), { value: (0, utils_1.getSectionValue)(section, value), textValue: renderedValue, start: position, end: position + sectionLength, modified: false, previousEditableSection, nextEditableSection: previousEditableSection }), (0, utils_1.getSectionLimits)(section, value));
|
|
495
495
|
newSections.push(newSection);
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.i18n = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const i18n_1 = require("@gravity-ui/uikit/i18n");
|
|
8
6
|
const cn_1 = require("../../../utils/cn");
|
|
9
|
-
const en_json_1 = __importDefault(require("./en.json"));
|
|
10
|
-
const ru_json_1 = __importDefault(require("./ru.json"));
|
|
7
|
+
const en_json_1 = tslib_1.__importDefault(require("./en.json"));
|
|
8
|
+
const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
|
|
11
9
|
exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}date-field`);
|
|
@@ -1,19 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
__exportStar(require("./
|
|
19
|
-
__exportStar(require("./hooks/
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
tslib_1.__exportStar(require("./DateField"), exports);
|
|
5
|
+
tslib_1.__exportStar(require("./hooks/useDateFieldState"), exports);
|
|
6
|
+
tslib_1.__exportStar(require("./hooks/useDateFieldProps"), exports);
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import type { DateTime } from '@gravity-ui/date-utils';
|
|
2
2
|
import type { DateFieldSection, DateFieldSectionType, DateFieldSectionWithoutPosition } from './types';
|
|
3
|
-
export declare const isMac: boolean;
|
|
4
|
-
export declare const CtrlCmd: string;
|
|
5
3
|
export declare function expandFormat(format: string): string;
|
|
6
4
|
export declare function getSectionLimits(section: DateFieldSectionWithoutPosition, date: DateTime): {
|
|
7
5
|
minValue: number;
|
|
@@ -15,3 +13,4 @@ export declare function getDurationUnitFromSectionType(type: DateFieldSectionTyp
|
|
|
15
13
|
export declare function addSegment(section: DateFieldSection, date: DateTime, amount: number): DateTime;
|
|
16
14
|
export declare function setSegment(section: DateFieldSection, date: DateTime, amount: number): DateTime;
|
|
17
15
|
export declare function splitFormatIntoSections(format: string): DateFieldSectionWithoutPosition[];
|
|
16
|
+
export declare function cleanString(dirtyString: string): string;
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.splitFormatIntoSections = exports.setSegment = exports.addSegment = exports.getDurationUnitFromSectionType = exports.getSectionValue = exports.getSectionLimits = exports.expandFormat =
|
|
3
|
+
exports.cleanString = exports.splitFormatIntoSections = exports.setSegment = exports.addSegment = exports.getDurationUnitFromSectionType = exports.getSectionValue = exports.getSectionLimits = exports.expandFormat = void 0;
|
|
4
4
|
const date_utils_1 = require("@gravity-ui/date-utils");
|
|
5
5
|
const i18n_1 = require("./i18n");
|
|
6
|
-
exports.isMac = window.navigator.userAgent.indexOf('Macintosh') >= 0;
|
|
7
|
-
exports.CtrlCmd = exports.isMac ? 'metaKey' : 'ctrlKey';
|
|
8
6
|
function expandFormat(format) {
|
|
9
7
|
const localeFormats = date_utils_1.settings.getLocaleData().formats;
|
|
10
8
|
const getShortLocalizedFormatFromLongLocalizedFormat = (formatBis) => formatBis.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g, (_, escapeSequence, localizedFormat) => escapeSequence || localizedFormat.slice(1));
|
|
@@ -417,3 +415,7 @@ function getSectionOptions(section, token) {
|
|
|
417
415
|
}
|
|
418
416
|
return undefined;
|
|
419
417
|
}
|
|
418
|
+
function cleanString(dirtyString) {
|
|
419
|
+
return dirtyString.replace(/[\u2066\u2067\u2068\u2069]/g, '');
|
|
420
|
+
}
|
|
421
|
+
exports.cleanString = cleanString;
|
|
@@ -1,22 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
3
|
exports.DatePicker = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
18
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
19
|
-
const react_1 = __importDefault(require("react"));
|
|
6
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
20
7
|
const icons_1 = require("@gravity-ui/icons");
|
|
21
8
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
22
9
|
const Calendar_1 = require("../Calendar");
|
|
@@ -27,7 +14,7 @@ const useDatePickerState_1 = require("./hooks/useDatePickerState");
|
|
|
27
14
|
const utils_1 = require("./utils");
|
|
28
15
|
require("./DatePicker.css");
|
|
29
16
|
function DatePicker(_a) {
|
|
30
|
-
var { value, defaultValue, onUpdate, className } = _a, props = __rest(_a, ["value", "defaultValue", "onUpdate", "className"]);
|
|
17
|
+
var { value, defaultValue, onUpdate, className } = _a, props = tslib_1.__rest(_a, ["value", "defaultValue", "onUpdate", "className"]);
|
|
31
18
|
const anchorRef = react_1.default.useRef(null);
|
|
32
19
|
const state = (0, useDatePickerState_1.useDatePickerState)(Object.assign(Object.assign({}, props), { value,
|
|
33
20
|
defaultValue,
|
|
@@ -1,21 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
3
|
exports.useDatePickerProps = void 0;
|
|
18
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
19
6
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
20
7
|
const DateField_1 = require("../../DateField");
|
|
21
8
|
const getButtonSizeForInput_1 = require("../../utils/getButtonSizeForInput");
|
|
@@ -23,7 +10,7 @@ const mergeProps_1 = require("../../utils/mergeProps");
|
|
|
23
10
|
const i18n_1 = require("../i18n");
|
|
24
11
|
function useDatePickerProps(state, _a) {
|
|
25
12
|
var _b;
|
|
26
|
-
var { onFocus, onBlur } = _a, props = __rest(_a, ["onFocus", "onBlur"]);
|
|
13
|
+
var { onFocus, onBlur } = _a, props = tslib_1.__rest(_a, ["onFocus", "onBlur"]);
|
|
27
14
|
const [isActive, setActive] = react_1.default.useState(false);
|
|
28
15
|
const { focusWithinProps } = (0, uikit_1.useFocusWithin)({
|
|
29
16
|
onFocusWithin: onFocus,
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useDatePickerState = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
const DateField_1 = require("../../DateField");
|
|
9
7
|
const utils_1 = require("../../DateField/utils");
|
|
10
8
|
const useControlledState_1 = require("../../hooks/useControlledState");
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.i18n = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const i18n_1 = require("@gravity-ui/uikit/i18n");
|
|
8
6
|
const cn_1 = require("../../../utils/cn");
|
|
9
|
-
const en_json_1 = __importDefault(require("./en.json"));
|
|
10
|
-
const ru_json_1 = __importDefault(require("./ru.json"));
|
|
7
|
+
const en_json_1 = tslib_1.__importDefault(require("./en.json"));
|
|
8
|
+
const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
|
|
11
9
|
exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}date-picker`);
|
|
@@ -1,19 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
|
|
18
|
-
__exportStar(require("./
|
|
19
|
-
__exportStar(require("./hooks/
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
tslib_1.__exportStar(require("./DatePicker"), exports);
|
|
5
|
+
tslib_1.__exportStar(require("./hooks/useDatePickerState"), exports);
|
|
6
|
+
tslib_1.__exportStar(require("./hooks/useDatePickerProps"), exports);
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.RelativeDateField = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
7
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
6
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
9
7
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
10
8
|
const cn_1 = require("../../utils/cn");
|
|
11
9
|
const Calendar_1 = require("../Calendar");
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
3
|
exports.useRelativeDateFieldProps = void 0;
|
|
7
|
-
const
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
8
6
|
function useRelativeDateFieldProps(state, props) {
|
|
9
7
|
const [prevCorrectDate, setPrevCorrectDate] = react_1.default.useState(state.lastCorrectDate);
|
|
10
8
|
const [focusedDate, setFocusedDate] = react_1.default.useState(state.lastCorrectDate);
|