@elliemae/ds-date-time-picker 1.61.0 → 2.0.0-alpha.12
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/cjs/DSDateTimePicker.js +79 -103
- package/cjs/components/DateTimePickerImpl.js +158 -214
- package/cjs/index.js +1 -16
- package/cjs/lang/english.js +0 -1
- package/cjs/utils.js +2 -3
- package/esm/DSDateTimePicker.js +72 -96
- package/esm/components/DateTimePickerImpl.js +154 -209
- package/esm/index.js +0 -15
- package/esm/lang/english.js +0 -1
- package/esm/utils.js +2 -3
- package/package.json +58 -17
- package/types/DSDateTimePicker.d.ts +238 -0
- package/types/components/DateTimePickerImpl.d.ts +75 -0
- package/types/index.d.ts +1 -0
- package/types/lang/english.d.ts +6 -0
- package/types/tests/DateTimePicker-events.test.d.ts +1 -0
- package/types/tests/DateTimePickerSelectedDate.test.d.ts +1 -0
- package/types/tests/utils.d.ts +1 -0
- package/types/utils.d.ts +2 -0
- package/DSDateTimePicker/package.json +0 -10
- package/cjs/DSDateTimePicker.js.map +0 -1
- package/cjs/components/DateTimePickerImpl.js.map +0 -1
- package/cjs/index.js.map +0 -1
- package/cjs/lang/english.js.map +0 -1
- package/cjs/tests/utils.js +0 -22
- package/cjs/tests/utils.js.map +0 -1
- package/cjs/utils.js.map +0 -1
- package/components/DateTimePickerImpl/package.json +0 -10
- package/esm/DSDateTimePicker.js.map +0 -1
- package/esm/components/DateTimePickerImpl.js.map +0 -1
- package/esm/index.js.map +0 -1
- package/esm/lang/english.js.map +0 -1
- package/esm/tests/utils.js +0 -14
- package/esm/tests/utils.js.map +0 -1
- package/esm/utils.js.map +0 -1
- package/lang/english/package.json +0 -10
- package/tests/utils/package.json +0 -10
- package/utils/package.json +0 -10
|
@@ -1,7 +1,13 @@
|
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
1
6
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
7
|
+
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
8
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
9
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
10
|
+
import { useState, useRef, useEffect, useMemo } from 'react';
|
|
5
11
|
import moment from 'moment';
|
|
6
12
|
import { aggregatedClasses } from '@elliemae/ds-classnames';
|
|
7
13
|
import { DatePickerDropdown, DSDatePickerController, SingleDatePickerPhrases } from '@elliemae/ds-date-picker';
|
|
@@ -9,135 +15,78 @@ import { DSInputGroup, DSInput, DateInputsV2Impl, TimeInputImpl } from '@elliema
|
|
|
9
15
|
import { getVisibleTimeByFormat } from '@elliemae/ds-utilities';
|
|
10
16
|
import { DSTimePickerMenu, convertTimeString } from '@elliemae/ds-time-picker';
|
|
11
17
|
import { updateDateAndTime } from '../utils.js';
|
|
18
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
12
19
|
|
|
13
|
-
|
|
14
|
-
var blockName = 'date-time-picker';
|
|
15
|
-
var DateTimePickerWrapper = aggregatedClasses('div')(blockName, 'wrapper');
|
|
16
|
-
var TimePicker = aggregatedClasses(DSTimePickerMenu)(blockName, 'time-picker');
|
|
17
|
-
var TimePickerWrapper = aggregatedClasses('div')(blockName, 'time-picker-wrapper'); // const DateInput = aggregatedClasses(DateInputsV2Impl)(blockName, 'date-input');
|
|
20
|
+
const _excluded = ["onChange"];
|
|
18
21
|
|
|
19
|
-
var
|
|
22
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
20
23
|
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
placeholder = _ref.placeholder,
|
|
27
|
-
date = _ref.date,
|
|
28
|
-
clearable = _ref.clearable,
|
|
29
|
-
_ref$datePickerProps = _ref.datePickerProps,
|
|
30
|
-
_ref$datePickerProps$ = _ref$datePickerProps.disabled,
|
|
31
|
-
disabled = _ref$datePickerProps$ === void 0 ? false : _ref$datePickerProps$,
|
|
32
|
-
_ref$datePickerProps$2 = _ref$datePickerProps.numberOfMonths,
|
|
33
|
-
numberOfMonths = _ref$datePickerProps$2 === void 0 ? 1 : _ref$datePickerProps$2,
|
|
34
|
-
_ref$datePickerProps$3 = _ref$datePickerProps.readOnly,
|
|
35
|
-
readOnly = _ref$datePickerProps$3 === void 0 ? false : _ref$datePickerProps$3,
|
|
36
|
-
_ref$datePickerProps$4 = _ref$datePickerProps.enableOutsideDays,
|
|
37
|
-
enableOutsideDays = _ref$datePickerProps$4 === void 0 ? false : _ref$datePickerProps$4,
|
|
38
|
-
_ref$datePickerProps$5 = _ref$datePickerProps.transitionDuration,
|
|
39
|
-
transitionDuration = _ref$datePickerProps$5 === void 0 ? 0 : _ref$datePickerProps$5,
|
|
40
|
-
_ref$datePickerProps$6 = _ref$datePickerProps.firstDayOfWeek,
|
|
41
|
-
firstDayOfWeek = _ref$datePickerProps$6 === void 0 ? 0 : _ref$datePickerProps$6,
|
|
42
|
-
_ref$datePickerProps$7 = _ref$datePickerProps.keepOpenOnDateSelect,
|
|
43
|
-
keepOpenOnDateSelect = _ref$datePickerProps$7 === void 0 ? true : _ref$datePickerProps$7,
|
|
44
|
-
_ref$datePickerProps$8 = _ref$datePickerProps.hideKeyboardShortcutsPanel,
|
|
45
|
-
hideKeyboardShortcutsPanel = _ref$datePickerProps$8 === void 0 ? true : _ref$datePickerProps$8,
|
|
46
|
-
_ref$datePickerProps$9 = _ref$datePickerProps.onPrevMonthClick,
|
|
47
|
-
onPrevMonthClick = _ref$datePickerProps$9 === void 0 ? function () {
|
|
48
|
-
return null;
|
|
49
|
-
} : _ref$datePickerProps$9,
|
|
50
|
-
_ref$datePickerProps$10 = _ref$datePickerProps.onNextMonthClick,
|
|
51
|
-
onNextMonthClick = _ref$datePickerProps$10 === void 0 ? function () {
|
|
52
|
-
return null;
|
|
53
|
-
} : _ref$datePickerProps$10,
|
|
54
|
-
_ref$datePickerProps$11 = _ref$datePickerProps.onClose,
|
|
55
|
-
onClose = _ref$datePickerProps$11 === void 0 ? function () {
|
|
56
|
-
return null;
|
|
57
|
-
} : _ref$datePickerProps$11,
|
|
58
|
-
_ref$datePickerProps$12 = _ref$datePickerProps.onChange,
|
|
59
|
-
onDatePickerChange = _ref$datePickerProps$12 === void 0 ? function () {
|
|
60
|
-
return null;
|
|
61
|
-
} : _ref$datePickerProps$12,
|
|
62
|
-
_ref$datePickerProps$13 = _ref$datePickerProps.onDateChange,
|
|
63
|
-
onDateChange = _ref$datePickerProps$13 === void 0 ? function () {
|
|
64
|
-
return null;
|
|
65
|
-
} : _ref$datePickerProps$13,
|
|
66
|
-
_ref$datePickerProps$14 = _ref$datePickerProps.onError,
|
|
67
|
-
onErrorDate = _ref$datePickerProps$14 === void 0 ? function () {
|
|
68
|
-
return null;
|
|
69
|
-
} : _ref$datePickerProps$14,
|
|
70
|
-
_ref$datePickerProps$15 = _ref$datePickerProps.phrases,
|
|
71
|
-
phrases = _ref$datePickerProps$15 === void 0 ? SingleDatePickerPhrases : _ref$datePickerProps$15,
|
|
72
|
-
_ref$datePickerProps$16 = _ref$datePickerProps.displayFormatDay,
|
|
73
|
-
displayFormatDay = _ref$datePickerProps$16 === void 0 ? 'D' : _ref$datePickerProps$16,
|
|
74
|
-
_ref$datePickerProps$17 = _ref$datePickerProps.isDayBlocked,
|
|
75
|
-
isDayBlocked = _ref$datePickerProps$17 === void 0 ? function () {
|
|
76
|
-
return false;
|
|
77
|
-
} : _ref$datePickerProps$17,
|
|
78
|
-
_ref$datePickerProps$18 = _ref$datePickerProps.isOutsideRange,
|
|
79
|
-
isOutsideRange = _ref$datePickerProps$18 === void 0 ? function () {
|
|
80
|
-
return false;
|
|
81
|
-
} : _ref$datePickerProps$18,
|
|
82
|
-
_ref$datePickerProps$19 = _ref$datePickerProps.isDayHighlighted,
|
|
83
|
-
isDayHighlighted = _ref$datePickerProps$19 === void 0 ? function () {
|
|
84
|
-
return false;
|
|
85
|
-
} : _ref$datePickerProps$19,
|
|
86
|
-
_ref$datePickerProps$20 = _ref$datePickerProps.zIndex,
|
|
87
|
-
zIndex = _ref$datePickerProps$20 === void 0 ? 11 : _ref$datePickerProps$20,
|
|
88
|
-
_ref$timePickerProps = _ref.timePickerProps,
|
|
89
|
-
_ref$timePickerProps$ = _ref$timePickerProps.format,
|
|
90
|
-
format = _ref$timePickerProps$ === void 0 ? 'hh:mm A' : _ref$timePickerProps$,
|
|
91
|
-
_ref$timePickerProps$2 = _ref$timePickerProps.onChange,
|
|
92
|
-
onChangeTimePicker = _ref$timePickerProps$2 === void 0 ? function () {
|
|
93
|
-
return null;
|
|
94
|
-
} : _ref$timePickerProps$2,
|
|
95
|
-
_ref$timePickerProps$3 = _ref$timePickerProps.disabledTimes,
|
|
96
|
-
disabledTimes = _ref$timePickerProps$3 === void 0 ? undefined : _ref$timePickerProps$3,
|
|
97
|
-
_ref$timePickerProps$4 = _ref$timePickerProps.onError,
|
|
98
|
-
onErrorTime = _ref$timePickerProps$4 === void 0 ? function () {
|
|
99
|
-
return null;
|
|
100
|
-
} : _ref$timePickerProps$4,
|
|
101
|
-
_ref$timePickerProps$5 = _ref$timePickerProps.minutesInterval,
|
|
102
|
-
minutesInterval = _ref$timePickerProps$5 === void 0 ? 1 : _ref$timePickerProps$5,
|
|
103
|
-
_ref$dateInputProps$o = _ref.dateInputProps.onDateInputDateChange,
|
|
104
|
-
onDateInputDateChange = _ref$dateInputProps$o === void 0 ? function () {
|
|
105
|
-
return null;
|
|
106
|
-
} : _ref$dateInputProps$o;
|
|
24
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
25
|
+
const blockName = 'date-time-picker';
|
|
26
|
+
const DateTimePickerWrapper = aggregatedClasses('div')(blockName, 'wrapper');
|
|
27
|
+
const TimePicker = aggregatedClasses(DSTimePickerMenu)(blockName, 'time-picker');
|
|
28
|
+
const TimePickerWrapper = aggregatedClasses('div')(blockName, 'time-picker-wrapper'); // const DateInput = aggregatedClasses(DateInputsV2Impl)(blockName, 'date-input');
|
|
107
29
|
|
|
108
|
-
|
|
109
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
110
|
-
selectedDate = _useState2[0],
|
|
111
|
-
setSelectedDate = _useState2[1];
|
|
30
|
+
const formatDate = 'MMDDYYYY';
|
|
112
31
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
32
|
+
const DSDateTimePickerImpl = _ref => {
|
|
33
|
+
let {
|
|
34
|
+
onBlur = () => null,
|
|
35
|
+
placeholder,
|
|
36
|
+
date,
|
|
37
|
+
clearable,
|
|
38
|
+
datePickerProps: {
|
|
39
|
+
disabled = false,
|
|
40
|
+
numberOfMonths = 1,
|
|
41
|
+
readOnly = false,
|
|
42
|
+
enableOutsideDays = false,
|
|
43
|
+
transitionDuration = 0,
|
|
44
|
+
firstDayOfWeek = 0,
|
|
45
|
+
keepOpenOnDateSelect = true,
|
|
46
|
+
hideKeyboardShortcutsPanel = true,
|
|
47
|
+
onPrevMonthClick = () => null,
|
|
48
|
+
onNextMonthClick = () => null,
|
|
49
|
+
onClose = () => null,
|
|
50
|
+
onChange: onDatePickerChange = () => null,
|
|
51
|
+
onDateChange = () => null,
|
|
52
|
+
onError: onErrorDate = () => null,
|
|
53
|
+
phrases = SingleDatePickerPhrases,
|
|
54
|
+
displayFormatDay = 'D',
|
|
55
|
+
isDayBlocked = () => false,
|
|
56
|
+
isOutsideRange = () => false,
|
|
57
|
+
isDayHighlighted = () => false,
|
|
58
|
+
zIndex = 11
|
|
59
|
+
},
|
|
60
|
+
timePickerProps: {
|
|
61
|
+
format = 'hh:mm A',
|
|
62
|
+
onChange: onChangeTimePicker = () => null,
|
|
63
|
+
disabledTimes = undefined,
|
|
64
|
+
onError: onErrorTime = () => null,
|
|
65
|
+
minutesInterval = 1
|
|
66
|
+
},
|
|
67
|
+
dateInputProps: {
|
|
68
|
+
onDateInputDateChange = () => null
|
|
69
|
+
}
|
|
70
|
+
} = _ref;
|
|
71
|
+
const [selectedDate, setSelectedDate] = useState(undefined);
|
|
72
|
+
const [incompleteInput, setIncompleteInput] = useState(undefined);
|
|
73
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
74
|
+
const disabledTimeRange = disabledTimes && {
|
|
124
75
|
from: convertTimeString(disabledTimes.from),
|
|
125
76
|
to: convertTimeString(disabledTimes.to)
|
|
126
77
|
};
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
useEffect(
|
|
78
|
+
const dateTimePickerWrapperRef = useRef();
|
|
79
|
+
const fullFormat = "".concat(formatDate, " ").concat(format);
|
|
80
|
+
useEffect(() => {
|
|
130
81
|
if (date) {
|
|
131
82
|
setSelectedDate(moment(date));
|
|
132
83
|
} else if (date === null) setSelectedDate(undefined);
|
|
133
84
|
}, [date]);
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
}, []);
|
|
137
|
-
var currentYear = moment().year();
|
|
85
|
+
const visiblePanels = useMemo(() => getVisibleTimeByFormat(format), []);
|
|
86
|
+
const currentYear = moment().year();
|
|
138
87
|
|
|
139
|
-
|
|
140
|
-
|
|
88
|
+
const handleDatePickerChange = dateSelected => {
|
|
89
|
+
const splittedDate = updateDateAndTime(dateSelected, selectedDate);
|
|
141
90
|
|
|
142
91
|
if (!readOnly) {
|
|
143
92
|
setSelectedDate(splittedDate);
|
|
@@ -145,25 +94,25 @@ var DSDateTimePickerImpl = function DSDateTimePickerImpl(_ref) {
|
|
|
145
94
|
}
|
|
146
95
|
};
|
|
147
96
|
|
|
148
|
-
|
|
149
|
-
|
|
97
|
+
const onTimeChange = pickerTime => {
|
|
98
|
+
const splittedDate = updateDateAndTime(selectedDate, pickerTime);
|
|
150
99
|
onChangeTimePicker(splittedDate);
|
|
151
100
|
setSelectedDate(splittedDate);
|
|
152
101
|
};
|
|
153
102
|
|
|
154
|
-
|
|
103
|
+
const handleInputChange = (inputValue, type) => {
|
|
155
104
|
onDatePickerChange(inputValue);
|
|
156
|
-
|
|
157
|
-
|
|
105
|
+
let timeBlocked = false;
|
|
106
|
+
const inputMoment = moment(inputValue, fullFormat);
|
|
158
107
|
setIncompleteInput(inputValue);
|
|
159
108
|
|
|
160
109
|
if (type === 'date') {
|
|
161
|
-
|
|
110
|
+
const splittedDate = updateDateAndTime(inputMoment, selectedDate);
|
|
162
111
|
|
|
163
112
|
if (inputValue.length < 8) {
|
|
164
113
|
onErrorDate({
|
|
165
114
|
message: 'date incomplete',
|
|
166
|
-
inputValue
|
|
115
|
+
inputValue
|
|
167
116
|
});
|
|
168
117
|
if (clearable) onDateChange('error');
|
|
169
118
|
return;
|
|
@@ -179,10 +128,12 @@ var DSDateTimePickerImpl = function DSDateTimePickerImpl(_ref) {
|
|
|
179
128
|
}
|
|
180
129
|
|
|
181
130
|
if (disabledTimeRange) {
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
131
|
+
const hour = inputValue.hour();
|
|
132
|
+
const min = inputValue.minutes();
|
|
133
|
+
const {
|
|
134
|
+
from,
|
|
135
|
+
to
|
|
136
|
+
} = disabledTimeRange;
|
|
186
137
|
|
|
187
138
|
if (hour > from.hour && hour < to.hour || hour === to.hour && min < to.min) {
|
|
188
139
|
timeBlocked = true;
|
|
@@ -191,12 +142,12 @@ var DSDateTimePickerImpl = function DSDateTimePickerImpl(_ref) {
|
|
|
191
142
|
|
|
192
143
|
if (timeBlocked) onErrorTime({
|
|
193
144
|
message: 'time blocked',
|
|
194
|
-
inputValue
|
|
145
|
+
inputValue
|
|
195
146
|
});
|
|
196
|
-
|
|
147
|
+
const dateBlocked = isDayBlocked(inputMoment);
|
|
197
148
|
if (dateBlocked) onErrorDate({
|
|
198
149
|
message: 'date blocked',
|
|
199
|
-
inputValue
|
|
150
|
+
inputValue
|
|
200
151
|
});
|
|
201
152
|
|
|
202
153
|
if (!timeBlocked && !dateBlocked) {
|
|
@@ -204,21 +155,17 @@ var DSDateTimePickerImpl = function DSDateTimePickerImpl(_ref) {
|
|
|
204
155
|
}
|
|
205
156
|
};
|
|
206
157
|
|
|
207
|
-
|
|
158
|
+
const handleOutsideClick = event => {
|
|
208
159
|
if (!dateTimePickerWrapperRef.current.contains(event.target)) {
|
|
209
160
|
setIsOpen(false);
|
|
210
161
|
}
|
|
211
162
|
};
|
|
212
163
|
|
|
213
|
-
|
|
214
|
-
return setIsOpen(false);
|
|
215
|
-
};
|
|
164
|
+
const handleClickEscape = () => setIsOpen(false);
|
|
216
165
|
|
|
217
|
-
|
|
218
|
-
return setIsOpen(true);
|
|
219
|
-
};
|
|
166
|
+
const handleOpen = () => setIsOpen(true);
|
|
220
167
|
|
|
221
|
-
|
|
168
|
+
const handleContainerBlur = event => {
|
|
222
169
|
if (!isOpen && !event.currentTarget.contains(event.relatedTarget)) {
|
|
223
170
|
onBlur(event, selectedDate !== null && selectedDate !== void 0 && selectedDate.isValid() ? selectedDate : {
|
|
224
171
|
error: true,
|
|
@@ -227,97 +174,96 @@ var DSDateTimePickerImpl = function DSDateTimePickerImpl(_ref) {
|
|
|
227
174
|
});
|
|
228
175
|
|
|
229
176
|
if (clearable && !selectedDate && !!incompleteInput) {
|
|
230
|
-
|
|
231
|
-
|
|
177
|
+
const inputMoment = moment(incompleteInput, fullFormat);
|
|
178
|
+
const splittedDate = updateDateAndTime(inputMoment, selectedDate);
|
|
232
179
|
setSelectedDate(splittedDate);
|
|
233
180
|
onDateChange(splittedDate);
|
|
234
181
|
}
|
|
235
182
|
}
|
|
236
183
|
};
|
|
237
184
|
|
|
238
|
-
useEffect(
|
|
185
|
+
useEffect(() => {
|
|
239
186
|
if (!isOpen) onBlur({}, selectedDate !== null && selectedDate !== void 0 && selectedDate.isValid() ? selectedDate : {
|
|
240
187
|
error: true,
|
|
241
188
|
message: 'incomplete input',
|
|
242
189
|
input: incompleteInput
|
|
243
190
|
});
|
|
244
191
|
}, [isOpen]);
|
|
245
|
-
|
|
246
|
-
return /*#__PURE__*/
|
|
192
|
+
const hasSelectedDate = !!selectedDate;
|
|
193
|
+
return /*#__PURE__*/_jsx(DSInputGroup, {
|
|
247
194
|
containerProps: {
|
|
248
195
|
onBlur: handleContainerBlur
|
|
249
196
|
},
|
|
250
|
-
rightAddon: /*#__PURE__*/
|
|
197
|
+
rightAddon: /*#__PURE__*/_jsx(DatePickerDropdown, {
|
|
251
198
|
disabled: disabled,
|
|
252
199
|
isOpen: isOpen,
|
|
253
200
|
zIndex: zIndex,
|
|
254
|
-
menu: /*#__PURE__*/
|
|
201
|
+
menu: /*#__PURE__*/jsxs(DateTimePickerWrapper, {
|
|
255
202
|
ref: dateTimePickerWrapperRef,
|
|
256
|
-
"data-testid": "date-time-picker"
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
}, visiblePanels)))),
|
|
203
|
+
"data-testid": "date-time-picker",
|
|
204
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
205
|
+
className: hasSelectedDate ? 'has-selected-date' : 'without-selected-date',
|
|
206
|
+
"data-testid": "date-time-picker-portal-wrapper"
|
|
207
|
+
}, void 0, /*#__PURE__*/_jsx(DSDatePickerController, {
|
|
208
|
+
date: selectedDate,
|
|
209
|
+
displayFormatDay: displayFormatDay,
|
|
210
|
+
enableOutsideDays: enableOutsideDays,
|
|
211
|
+
firstDayOfWeek: firstDayOfWeek,
|
|
212
|
+
hideKeyboardShortcutsPanel: hideKeyboardShortcutsPanel,
|
|
213
|
+
isDayBlocked: isDayBlocked,
|
|
214
|
+
isDayHighlighted: isDayHighlighted,
|
|
215
|
+
isOutsideRange: isOutsideRange,
|
|
216
|
+
keepOpenOnDateSelect: keepOpenOnDateSelect,
|
|
217
|
+
numberOfMonths: numberOfMonths,
|
|
218
|
+
onClickEscape: handleClickEscape,
|
|
219
|
+
onClose: onClose,
|
|
220
|
+
onDateChange: handleDatePickerChange,
|
|
221
|
+
onNextMonthClick: onNextMonthClick,
|
|
222
|
+
onOutsideClick: event => handleOutsideClick(event),
|
|
223
|
+
onPrevMonthClick: onPrevMonthClick,
|
|
224
|
+
phrases: phrases,
|
|
225
|
+
transitionDuration: transitionDuration
|
|
226
|
+
})), /*#__PURE__*/_jsx(TimePickerWrapper, {}, void 0, /*#__PURE__*/jsx(TimePicker, _objectSpread({
|
|
227
|
+
disabled: disabled,
|
|
228
|
+
disabledTimes: disabledTimeRange,
|
|
229
|
+
format: format,
|
|
230
|
+
hasHeader: true,
|
|
231
|
+
hasHeaderDisplay: true,
|
|
232
|
+
onTimeChange: onTimeChange,
|
|
233
|
+
showSeconds: false,
|
|
234
|
+
minutesInterval: minutesInterval,
|
|
235
|
+
time: selectedDate
|
|
236
|
+
}, visiblePanels)))]
|
|
237
|
+
}),
|
|
292
238
|
onClick: handleOpen,
|
|
293
239
|
readOnly: readOnly
|
|
294
240
|
})
|
|
295
|
-
}, /*#__PURE__*/
|
|
296
|
-
customInputType:
|
|
297
|
-
|
|
241
|
+
}, void 0, /*#__PURE__*/_jsx(DSInput, {
|
|
242
|
+
customInputType: _ref2 => {
|
|
243
|
+
let {
|
|
244
|
+
onChange: handleChange
|
|
245
|
+
} = _ref2,
|
|
298
246
|
restInputProps = _objectWithoutProperties(_ref2, _excluded);
|
|
299
247
|
|
|
300
|
-
return /*#__PURE__*/
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
}
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
}
|
|
320
|
-
}, restInputProps)));
|
|
248
|
+
return /*#__PURE__*/jsxs(Fragment, {
|
|
249
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
250
|
+
style: {
|
|
251
|
+
display: 'flex'
|
|
252
|
+
}
|
|
253
|
+
}, void 0, /*#__PURE__*/jsx(DateInputsV2Impl, _objectSpread(_objectSpread({
|
|
254
|
+
disabled: disabled,
|
|
255
|
+
onChange: input => handleChange(input, 'date')
|
|
256
|
+
}, restInputProps), {}, {
|
|
257
|
+
onDateChange: onDateInputDateChange,
|
|
258
|
+
yearMaxRange: currentYear + 100,
|
|
259
|
+
yearMinRange: currentYear - 100,
|
|
260
|
+
time: restInputProps.value && restInputProps.value.hour && restInputProps.value.isValid() ? restInputProps.value.format(formatDate) : restInputProps.value
|
|
261
|
+
}))), /*#__PURE__*/jsx(TimeInputImpl, _objectSpread({
|
|
262
|
+
disabled: disabled,
|
|
263
|
+
format: format,
|
|
264
|
+
onChange: time => handleChange(time, 'time')
|
|
265
|
+
}, restInputProps))]
|
|
266
|
+
});
|
|
321
267
|
},
|
|
322
268
|
isShowElipsisActive: false,
|
|
323
269
|
disabled: disabled,
|
|
@@ -328,4 +274,3 @@ var DSDateTimePickerImpl = function DSDateTimePickerImpl(_ref) {
|
|
|
328
274
|
};
|
|
329
275
|
|
|
330
276
|
export { DSDateTimePickerImpl as default };
|
|
331
|
-
//# sourceMappingURL=DateTimePickerImpl.js.map
|
package/esm/index.js
CHANGED
|
@@ -1,16 +1 @@
|
|
|
1
1
|
export { DateTimePickerWithSchema, default } from './DSDateTimePicker.js';
|
|
2
|
-
import '@babel/runtime/helpers/esm/extends';
|
|
3
|
-
import 'react';
|
|
4
|
-
import 'react-desc';
|
|
5
|
-
import 'moment';
|
|
6
|
-
import '@elliemae/ds-classnames';
|
|
7
|
-
import '@elliemae/ds-date-picker';
|
|
8
|
-
import './components/DateTimePickerImpl.js';
|
|
9
|
-
import '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
10
|
-
import '@babel/runtime/helpers/esm/slicedToArray';
|
|
11
|
-
import '@elliemae/ds-form';
|
|
12
|
-
import '@elliemae/ds-utilities';
|
|
13
|
-
import '@elliemae/ds-time-picker';
|
|
14
|
-
import './utils.js';
|
|
15
|
-
import './lang/english.js';
|
|
16
|
-
//# sourceMappingURL=index.js.map
|
package/esm/lang/english.js
CHANGED
package/esm/utils.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import moment from 'moment';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
const updateDateAndTime = (date, time) => {
|
|
4
|
+
const splittedDate = moment();
|
|
5
5
|
splittedDate.month(date === null || date === void 0 ? void 0 : date.get('month'));
|
|
6
6
|
splittedDate.year(date === null || date === void 0 ? void 0 : date.get('year'));
|
|
7
7
|
splittedDate.date(date === null || date === void 0 ? void 0 : date.get('date'));
|
|
@@ -12,4 +12,3 @@ var updateDateAndTime = function updateDateAndTime(date, time) {
|
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
export { updateDateAndTime };
|
|
15
|
-
//# sourceMappingURL=utils.js.map
|
package/package.json
CHANGED
|
@@ -1,14 +1,50 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-date-time-picker",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0-alpha.12",
|
|
4
4
|
"license": "MIT",
|
|
5
|
-
"description": "
|
|
6
|
-
"
|
|
7
|
-
"
|
|
5
|
+
"description": "ICE MT - Dimsum - Date Time Picker",
|
|
6
|
+
"module": "./esm/index.js",
|
|
7
|
+
"main": "./cjs/index.js",
|
|
8
|
+
"types": "./types/index.d.ts",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"import": "./esm/index.js",
|
|
12
|
+
"require": "./cjs/index.js"
|
|
13
|
+
},
|
|
14
|
+
"./utils": {
|
|
15
|
+
"import": "./esm/utils.js",
|
|
16
|
+
"require": "./cjs/utils.js"
|
|
17
|
+
},
|
|
18
|
+
"./tests/utils": {
|
|
19
|
+
"import": "./esm/tests/utils.js",
|
|
20
|
+
"require": "./cjs/tests/utils.js"
|
|
21
|
+
},
|
|
22
|
+
"./lang/english": {
|
|
23
|
+
"import": "./esm/lang/english.js",
|
|
24
|
+
"require": "./cjs/lang/english.js"
|
|
25
|
+
},
|
|
26
|
+
"./DSDateTimePicker": {
|
|
27
|
+
"import": "./esm/DSDateTimePicker.js",
|
|
28
|
+
"require": "./cjs/DSDateTimePicker.js"
|
|
29
|
+
},
|
|
30
|
+
"./components/DateTimePickerImpl": {
|
|
31
|
+
"import": "./esm/components/DateTimePickerImpl.js",
|
|
32
|
+
"require": "./cjs/components/DateTimePickerImpl.js"
|
|
33
|
+
}
|
|
34
|
+
},
|
|
8
35
|
"sideEffects": [
|
|
9
36
|
"*.css",
|
|
10
37
|
"*.scss"
|
|
11
38
|
],
|
|
39
|
+
"repository": {
|
|
40
|
+
"type": "git",
|
|
41
|
+
"url": "https://git.elliemae.io/platform-ui/dimsum.git"
|
|
42
|
+
},
|
|
43
|
+
"engines": {
|
|
44
|
+
"npm": ">=7",
|
|
45
|
+
"node": ">=14"
|
|
46
|
+
},
|
|
47
|
+
"author": "ICE MT",
|
|
12
48
|
"scripts": {
|
|
13
49
|
"dev": "cross-env NODE_ENV=development && node ../../scripts/build/build.js -w",
|
|
14
50
|
"prebuild": "exit 0",
|
|
@@ -16,27 +52,32 @@
|
|
|
16
52
|
"build": "node ../../scripts/build/build.js"
|
|
17
53
|
},
|
|
18
54
|
"dependencies": {
|
|
19
|
-
"@elliemae/ds-
|
|
20
|
-
"@elliemae/ds-
|
|
21
|
-
"@elliemae/ds-
|
|
22
|
-
"@elliemae/ds-system": "
|
|
23
|
-
"@elliemae/ds-
|
|
24
|
-
"
|
|
55
|
+
"@elliemae/ds-classnames": "2.0.0-alpha.12",
|
|
56
|
+
"@elliemae/ds-date-picker": "2.0.0-alpha.12",
|
|
57
|
+
"@elliemae/ds-form": "2.0.0-alpha.12",
|
|
58
|
+
"@elliemae/ds-system": "2.0.0-alpha.12",
|
|
59
|
+
"@elliemae/ds-time-picker": "2.0.0-alpha.12",
|
|
60
|
+
"@elliemae/ds-utilities": "2.0.0-alpha.12",
|
|
61
|
+
"lodash": "~4.17.21",
|
|
25
62
|
"moment": "~2.29.1",
|
|
26
63
|
"prop-types": "~15.7.2",
|
|
27
|
-
"react-desc": "^4.1.
|
|
64
|
+
"react-desc": "^4.1.3"
|
|
28
65
|
},
|
|
29
66
|
"devDependencies": {
|
|
30
|
-
"
|
|
67
|
+
"@testing-library/jest-dom": "~5.15.0",
|
|
68
|
+
"@testing-library/react": "~12.1.2",
|
|
69
|
+
"@testing-library/user-event": "~13.5.0",
|
|
70
|
+
"styled-components": "~5.3.3"
|
|
31
71
|
},
|
|
32
72
|
"peerDependencies": {
|
|
33
|
-
"lodash": "^4.17.
|
|
34
|
-
"react": "~17.0.
|
|
35
|
-
"react-dom": "^17.0.
|
|
36
|
-
"styled-components": "^5.3.
|
|
73
|
+
"lodash": "^4.17.21",
|
|
74
|
+
"react": "~17.0.2",
|
|
75
|
+
"react-dom": "^17.0.2",
|
|
76
|
+
"styled-components": "^5.3.3"
|
|
37
77
|
},
|
|
38
78
|
"publishConfig": {
|
|
39
79
|
"access": "public",
|
|
40
|
-
"directory": "dist"
|
|
80
|
+
"directory": "dist",
|
|
81
|
+
"generateSubmodules": true
|
|
41
82
|
}
|
|
42
83
|
}
|