@commercetools-uikit/date-time-input 16.0.0 → 16.1.1
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.
|
@@ -53,7 +53,6 @@ var Downshift__default = /*#__PURE__*/_interopDefault(Downshift);
|
|
|
53
53
|
var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
|
|
54
54
|
|
|
55
55
|
const getInputStyles = () => /*#__PURE__*/react.css("width:100%;text-align:center;border:0;border-top:1px solid ", designSystem.designTokens.colorNeutral90, ";padding:10px 0;outline:0;font-size:", designSystem.designTokens.fontSizeDefault, ";margin-top:", designSystem.designTokens.spacing20, ";color:", designSystem.designTokens.colorSolid, ";:disabled{background-color:", designSystem.designTokens.colorSurface, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRpbWUtaW5wdXQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU1nQyIsImZpbGUiOiJ0aW1lLWlucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8vLyA8cmVmZXJlbmNlIHR5cGVzPVwiQGVtb3Rpb24vcmVhY3QvdHlwZXMvY3NzLXByb3BcIiAvPlxuaW1wb3J0IHR5cGUgeyBLZXlib2FyZEV2ZW50SGFuZGxlciwgUmVmT2JqZWN0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgdHlwZSB7IFREYXRlVGltZUlucHV0UHJvcHMgfSBmcm9tICcuL2RhdGUtdGltZS1pbnB1dCc7XG5cbmNvbnN0IGdldElucHV0U3R5bGVzID0gKCkgPT4gY3NzYFxuICB3aWR0aDogMTAwJTtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICBib3JkZXI6IDA7XG4gIGJvcmRlci10b3A6IDFweCBzb2xpZCAke2Rlc2lnblRva2Vucy5jb2xvck5ldXRyYWw5MH07XG4gIHBhZGRpbmc6IDEwcHggMDtcbiAgb3V0bGluZTogMDtcbiAgZm9udC1zaXplOiAke2Rlc2lnblRva2Vucy5mb250U2l6ZURlZmF1bHR9O1xuICBtYXJnaW4tdG9wOiAke2Rlc2lnblRva2Vucy5zcGFjaW5nMjB9O1xuICBjb2xvcjogJHtkZXNpZ25Ub2tlbnMuY29sb3JTb2xpZH07XG5cbiAgOmRpc2FibGVkIHtcbiAgICAvKiBGaXhlcyBiYWNrZ3JvdW5kIGNvbG9yIGluIEZpcmVmb3ggKi9cbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2Rlc2lnblRva2Vucy5jb2xvclN1cmZhY2V9O1xuICB9XG5gO1xuXG50eXBlIFREYXRlQ2FsZW5kYXJUaW1lSW5wdXRQcm9wcyA9IHtcbiAgdGltZUlucHV0UmVmOiBSZWZPYmplY3Q8SFRNTElucHV0RWxlbWVudD47XG4gIG9uS2V5RG93bjogS2V5Ym9hcmRFdmVudEhhbmRsZXI8SFRNTElucHV0RWxlbWVudD47XG59ICYgUGljazxcbiAgVERhdGVUaW1lSW5wdXRQcm9wcyxcbiAgJ2lzRGlzYWJsZWQnIHwgJ29uQ2hhbmdlJyB8ICd2YWx1ZScgfCAncGxhY2Vob2xkZXInXG4+O1xuXG5jb25zdCBEYXRlQ2FsZW5kYXJUaW1lSW5wdXQgPSAocHJvcHM6IFREYXRlQ2FsZW5kYXJUaW1lSW5wdXRQcm9wcykgPT4gKFxuICA8aW5wdXRcbiAgICBkaXNhYmxlZD17cHJvcHMuaXNEaXNhYmxlZH1cbiAgICByZWY9e3Byb3BzLnRpbWVJbnB1dFJlZn1cbiAgICB0eXBlPVwidGV4dFwiXG4gICAgdmFsdWU9e3Byb3BzLnZhbHVlfVxuICAgIG9uQ2hhbmdlPXtwcm9wcy5vbkNoYW5nZX1cbiAgICBvbktleURvd249e3Byb3BzLm9uS2V5RG93bn1cbiAgICBwbGFjZWhvbGRlcj17cHJvcHMucGxhY2Vob2xkZXJ9XG4gICAgY3NzPXtnZXRJbnB1dFN0eWxlcygpfVxuICAvPlxuKTtcblxuRGF0ZUNhbGVuZGFyVGltZUlucHV0LmRpc3BsYXlOYW1lID0gJ0RhdGVDYWxlbmRhclRpbWVJbnB1dCc7XG5cbmV4cG9ydCBkZWZhdWx0IERhdGVDYWxlbmRhclRpbWVJbnB1dDtcbiJdfQ== */");
|
|
56
|
-
|
|
57
56
|
const DateCalendarTimeInput = props => jsxRuntime.jsx("input", {
|
|
58
57
|
disabled: props.isDisabled,
|
|
59
58
|
ref: props.timeInputRef,
|
|
@@ -64,7 +63,6 @@ const DateCalendarTimeInput = props => jsxRuntime.jsx("input", {
|
|
|
64
63
|
placeholder: props.placeholder,
|
|
65
64
|
css: getInputStyles()
|
|
66
65
|
});
|
|
67
|
-
|
|
68
66
|
DateCalendarTimeInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
69
67
|
timeInputRef: _pt__default["default"].any.isRequired,
|
|
70
68
|
onKeyDown: _pt__default["default"].func.isRequired
|
|
@@ -73,42 +71,31 @@ DateCalendarTimeInput.displayName = 'DateCalendarTimeInput';
|
|
|
73
71
|
var TimeInput = DateCalendarTimeInput;
|
|
74
72
|
|
|
75
73
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
76
|
-
|
|
77
74
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(source))).call(_context4, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
78
|
-
|
|
79
75
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
80
|
-
|
|
81
76
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default["default"]) return false; if (_Reflect$construct__default["default"].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
82
77
|
const activationTypes = [Downshift__default["default"].stateChangeTypes.keyDownEnter, Downshift__default["default"].stateChangeTypes.clickItem];
|
|
83
|
-
|
|
84
78
|
const preventDownshiftDefault = event => {
|
|
85
79
|
event.nativeEvent.preventDownshiftDefault = true;
|
|
86
|
-
};
|
|
87
|
-
// blurring the regular input/toggle button)
|
|
88
|
-
|
|
80
|
+
};
|
|
89
81
|
|
|
82
|
+
// This keeps the menu open when the user focuses the time input (thereby
|
|
83
|
+
// blurring the regular input/toggle button)
|
|
90
84
|
const createBlurHandler = timeInputRef => event => {
|
|
91
85
|
event.persist();
|
|
92
|
-
|
|
93
86
|
if (event.relatedTarget === timeInputRef.current) {
|
|
94
87
|
preventDownshiftDefault(event);
|
|
95
88
|
}
|
|
96
89
|
};
|
|
97
|
-
|
|
98
90
|
let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
99
91
|
_inherits(DateTimeInput, _Component);
|
|
100
|
-
|
|
101
92
|
var _super = _createSuper(DateTimeInput);
|
|
102
|
-
|
|
103
93
|
function DateTimeInput() {
|
|
104
94
|
var _this;
|
|
105
|
-
|
|
106
95
|
_classCallCheck(this, DateTimeInput);
|
|
107
|
-
|
|
108
96
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
109
97
|
args[_key] = arguments[_key];
|
|
110
98
|
}
|
|
111
|
-
|
|
112
99
|
_this = _super.call(this, ...args);
|
|
113
100
|
_this.inputRef = /*#__PURE__*/react$1.createRef();
|
|
114
101
|
_this.timeInputRef = /*#__PURE__*/react$1.createRef();
|
|
@@ -118,10 +105,8 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
118
105
|
highlightedIndex: _this.props.value === '' ? null : calendarTimeUtils.getDateInMonth(_this.props.value, _this.props.timeZone) - 1,
|
|
119
106
|
timeString: ''
|
|
120
107
|
};
|
|
121
|
-
|
|
122
108
|
_this.jumpMonths = function (amount) {
|
|
123
109
|
let dayToHighlight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
124
|
-
|
|
125
110
|
_this.setState(prevState => {
|
|
126
111
|
const nextDate = calendarTimeUtils.changeMonth(prevState.calendarDate, _this.props.timeZone, amount);
|
|
127
112
|
return {
|
|
@@ -130,20 +115,16 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
130
115
|
};
|
|
131
116
|
});
|
|
132
117
|
};
|
|
133
|
-
|
|
134
118
|
_this.showToday = () => {
|
|
135
119
|
const today = calendarTimeUtils.getToday(_this.props.timeZone);
|
|
136
|
-
|
|
137
120
|
_this.setState(prevState => ({
|
|
138
121
|
calendarDate: today,
|
|
139
122
|
highlightedIndex: (prevState.suggestedItems || []).length + calendarTimeUtils.getDateInMonth(today, _this.props.timeZone) - 1
|
|
140
123
|
}), () => {
|
|
141
124
|
var _this$inputRef$curren;
|
|
142
|
-
|
|
143
125
|
return (_this$inputRef$curren = _this.inputRef.current) === null || _this$inputRef$curren === void 0 ? void 0 : _this$inputRef$curren.focus();
|
|
144
126
|
});
|
|
145
127
|
};
|
|
146
|
-
|
|
147
128
|
_this.handleBlur = () => {
|
|
148
129
|
if (_this.props.onBlur) _this.props.onBlur({
|
|
149
130
|
target: {
|
|
@@ -152,28 +133,22 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
152
133
|
}
|
|
153
134
|
});
|
|
154
135
|
};
|
|
155
|
-
|
|
156
136
|
_this.handleTimeChange = event => {
|
|
157
137
|
const parsedTime = utils.parseTime(event.target.value);
|
|
158
|
-
|
|
159
138
|
_this.setState({
|
|
160
139
|
timeString: event.target.value
|
|
161
|
-
});
|
|
162
|
-
|
|
140
|
+
});
|
|
163
141
|
|
|
142
|
+
// We can't update the parent when there is no value
|
|
164
143
|
if (_this.props.value === '') return;
|
|
165
144
|
let date = calendarTimeUtils.getStartOf(_this.props.value, _this.props.timeZone);
|
|
166
|
-
|
|
167
145
|
if (parsedTime) {
|
|
168
146
|
date = calendarTimeUtils.changeTime(date, _this.props.timeZone, parsedTime);
|
|
169
147
|
}
|
|
170
|
-
|
|
171
148
|
_this.emit(date);
|
|
172
149
|
};
|
|
173
|
-
|
|
174
150
|
_this.emit = value => {
|
|
175
151
|
var _this$props$onChange, _this$props;
|
|
176
|
-
|
|
177
152
|
return (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, {
|
|
178
153
|
target: {
|
|
179
154
|
id: _this.props.id,
|
|
@@ -184,22 +159,19 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
184
159
|
}
|
|
185
160
|
});
|
|
186
161
|
};
|
|
187
|
-
|
|
188
162
|
return _this;
|
|
189
163
|
}
|
|
190
|
-
|
|
191
164
|
_createClass(DateTimeInput, [{
|
|
192
165
|
key: "render",
|
|
193
166
|
value: function render() {
|
|
194
167
|
var _context;
|
|
195
|
-
|
|
196
168
|
if (!this.props.isReadOnly) {
|
|
197
169
|
process.env.NODE_ENV !== "production" ? utils.warning(typeof this.props.onChange === 'function', 'DateTimeInput: `onChange` is required when input is not read only.') : void 0;
|
|
198
170
|
}
|
|
199
|
-
|
|
200
171
|
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
201
172
|
max: this.props.horizontalConstraint,
|
|
202
|
-
children: jsxRuntime.jsx(Downshift__default["default"]
|
|
173
|
+
children: jsxRuntime.jsx(Downshift__default["default"]
|
|
174
|
+
// Setting the key to the timeZone conveniently forces a rerender
|
|
203
175
|
// when the time-zone changes. Otherwise we'd need to make
|
|
204
176
|
// inputValue a controlled property so that we can update
|
|
205
177
|
// the displayed value as downshift seems to ignore an updated
|
|
@@ -216,7 +188,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
216
188
|
isOpen: true
|
|
217
189
|
});
|
|
218
190
|
}
|
|
219
|
-
|
|
220
191
|
return changes;
|
|
221
192
|
},
|
|
222
193
|
onStateChange: changes => {
|
|
@@ -228,7 +199,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
228
199
|
timeString: changes.selectedItem ? calendarTimeUtils.formatTime(changes.selectedItem, this.props.intl.locale, this.props.timeZone) : prevState.timeString
|
|
229
200
|
};
|
|
230
201
|
}
|
|
231
|
-
|
|
232
202
|
if (changes.hasOwnProperty('inputValue')) {
|
|
233
203
|
const suggestedItems = calendarTimeUtils.createSuggestedItems(changes.inputValue, this.props.timeZone);
|
|
234
204
|
return {
|
|
@@ -236,7 +206,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
236
206
|
highlightedIndex: suggestedItems.length > 0 ? 0 : null
|
|
237
207
|
};
|
|
238
208
|
}
|
|
239
|
-
|
|
240
209
|
if (changes.hasOwnProperty('isOpen')) {
|
|
241
210
|
return {
|
|
242
211
|
inputValue: changes.inputValue || prevState.inputValue,
|
|
@@ -248,18 +217,15 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
248
217
|
calendarDate: this.props.value === '' ? calendarTimeUtils.getToday(this.props.timeZone) : this.props.value
|
|
249
218
|
};
|
|
250
219
|
}
|
|
251
|
-
|
|
252
220
|
if (changes.hasOwnProperty('highlightedIndex')) {
|
|
253
221
|
return {
|
|
254
222
|
highlightedIndex: changes.highlightedIndex
|
|
255
223
|
};
|
|
256
224
|
}
|
|
257
|
-
|
|
258
225
|
return null;
|
|
259
226
|
}, () => {
|
|
260
227
|
if (_includesInstanceProperty__default["default"](activationTypes).call(activationTypes, changes.type)) {
|
|
261
228
|
var _this$timeInputRef$cu, _this$timeInputRef$cu2;
|
|
262
|
-
|
|
263
229
|
(_this$timeInputRef$cu = this.timeInputRef.current) === null || _this$timeInputRef$cu === void 0 ? void 0 : _this$timeInputRef$cu.focus();
|
|
264
230
|
(_this$timeInputRef$cu2 = this.timeInputRef.current) === null || _this$timeInputRef$cu2 === void 0 ? void 0 : _this$timeInputRef$cu2.setSelectionRange(0, this.state.timeString.length);
|
|
265
231
|
}
|
|
@@ -267,25 +233,22 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
267
233
|
},
|
|
268
234
|
children: _ref => {
|
|
269
235
|
var _context2;
|
|
270
|
-
|
|
271
236
|
let getInputProps = _ref.getInputProps,
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
237
|
+
getMenuProps = _ref.getMenuProps,
|
|
238
|
+
getItemProps = _ref.getItemProps,
|
|
239
|
+
getToggleButtonProps = _ref.getToggleButtonProps,
|
|
240
|
+
clearSelection = _ref.clearSelection,
|
|
241
|
+
highlightedIndex = _ref.highlightedIndex,
|
|
242
|
+
openMenu = _ref.openMenu,
|
|
243
|
+
closeMenu = _ref.closeMenu,
|
|
244
|
+
setHighlightedIndex = _ref.setHighlightedIndex,
|
|
245
|
+
selectedItem = _ref.selectedItem,
|
|
246
|
+
inputValue = _ref.inputValue,
|
|
247
|
+
isOpen = _ref.isOpen;
|
|
283
248
|
const suggestedItems = this.state.suggestedItems;
|
|
284
249
|
const calendarItems = calendarTimeUtils.createCalendarItems(this.state.calendarDate, this.state.timeString, this.props.timeZone);
|
|
285
250
|
const paddingDayCount = calendarTimeUtils.getPaddingDayCount(this.state.calendarDate, this.props.intl.locale, this.props.timeZone);
|
|
286
|
-
|
|
287
251
|
const paddingDays = _fillInstanceProperty__default["default"](_context2 = Array(paddingDayCount)).call(_context2, undefined);
|
|
288
|
-
|
|
289
252
|
const weekdays = calendarTimeUtils.getWeekdayNames(this.props.intl.locale);
|
|
290
253
|
const today = calendarTimeUtils.getToday(this.props.timeZone);
|
|
291
254
|
const isTimeInputVisible = Boolean(this.props.value) && this.props.value !== '';
|
|
@@ -312,38 +275,34 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
312
275
|
if (this.props.isReadOnly) {
|
|
313
276
|
preventDownshiftDefault(event);
|
|
314
277
|
return;
|
|
315
|
-
}
|
|
278
|
+
}
|
|
279
|
+
// parse input when user presses enter on regular input,
|
|
316
280
|
// close menu and notify parent
|
|
317
|
-
|
|
318
|
-
|
|
319
281
|
if (event.key === 'Enter' && highlightedIndex === null) {
|
|
320
282
|
preventDownshiftDefault(event);
|
|
321
283
|
const parsedDate = calendarTimeUtils.parseInputText(inputValue, this.props.intl.locale, this.props.timeZone);
|
|
322
284
|
this.emit(parsedDate);
|
|
323
285
|
closeMenu();
|
|
324
|
-
}
|
|
325
|
-
|
|
326
|
-
|
|
286
|
+
}
|
|
287
|
+
// ArrowDown
|
|
327
288
|
if (event.key === 'ArrowDown') {
|
|
328
289
|
if (Number(highlightedIndex) + 1 >= calendarItems.length) {
|
|
329
290
|
// if it's the end of the month
|
|
330
291
|
// then bypass normal arrow navigation
|
|
331
|
-
preventDownshiftDefault(event);
|
|
332
|
-
|
|
292
|
+
preventDownshiftDefault(event);
|
|
293
|
+
// then jump to start of next month
|
|
333
294
|
this.jumpMonths(1, 0);
|
|
334
295
|
}
|
|
335
|
-
}
|
|
336
|
-
|
|
337
|
-
|
|
296
|
+
}
|
|
297
|
+
// ArrowUp
|
|
338
298
|
if (event.key === 'ArrowUp') {
|
|
339
299
|
const previousDay = calendarTimeUtils.getPreviousDay(calendarItems[Number(highlightedIndex)]);
|
|
340
|
-
|
|
341
300
|
if (Number(highlightedIndex) <= 0) {
|
|
342
301
|
// if it's the start of the month
|
|
343
302
|
// then bypass normal arrow navigation
|
|
344
303
|
preventDownshiftDefault(event);
|
|
345
|
-
const numberOfDaysOfPrevMonth = calendarTimeUtils.getDaysInMonth(previousDay, this.props.timeZone);
|
|
346
|
-
|
|
304
|
+
const numberOfDaysOfPrevMonth = calendarTimeUtils.getDaysInMonth(previousDay, this.props.timeZone);
|
|
305
|
+
// then jump to the last day of the previous month
|
|
347
306
|
this.jumpMonths(-1, numberOfDaysOfPrevMonth - 1);
|
|
348
307
|
}
|
|
349
308
|
}
|
|
@@ -352,7 +311,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
352
311
|
onBlur: createBlurHandler(this.timeInputRef),
|
|
353
312
|
onChange: event => {
|
|
354
313
|
var _event$target$value;
|
|
355
|
-
|
|
356
314
|
// keep timeInput and regular input in sync when user
|
|
357
315
|
// types into regular input
|
|
358
316
|
if (!isOpen) return;
|
|
@@ -364,11 +322,9 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
364
322
|
timeString: ''
|
|
365
323
|
};
|
|
366
324
|
let date = calendarTimeUtils.getToday(this.props.timeZone);
|
|
367
|
-
|
|
368
325
|
if (parsedTime) {
|
|
369
326
|
date = calendarTimeUtils.changeTime(date, this.props.timeZone, parsedTime);
|
|
370
327
|
}
|
|
371
|
-
|
|
372
328
|
return {
|
|
373
329
|
timeString: calendarTimeUtils.formatTime(date, this.props.intl.locale, this.props.timeZone)
|
|
374
330
|
};
|
|
@@ -425,15 +381,12 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
425
381
|
onKeyDown: event => {
|
|
426
382
|
if (event.key === 'ArrowUp') {
|
|
427
383
|
var _this$inputRef$curren2;
|
|
428
|
-
|
|
429
384
|
setHighlightedIndex(-1);
|
|
430
385
|
(_this$inputRef$curren2 = this.inputRef.current) === null || _this$inputRef$curren2 === void 0 ? void 0 : _this$inputRef$curren2.focus();
|
|
431
386
|
return;
|
|
432
387
|
}
|
|
433
|
-
|
|
434
388
|
if (event.key === 'Enter') {
|
|
435
389
|
var _this$inputRef$curren3, _this$inputRef$curren4;
|
|
436
|
-
|
|
437
390
|
setHighlightedIndex(-1);
|
|
438
391
|
(_this$inputRef$curren3 = this.inputRef.current) === null || _this$inputRef$curren3 === void 0 ? void 0 : _this$inputRef$curren3.focus();
|
|
439
392
|
(_this$inputRef$curren4 = this.inputRef.current) === null || _this$inputRef$curren4 === void 0 ? void 0 : _this$inputRef$curren4.setSelectionRange(0, 100);
|
|
@@ -448,10 +401,8 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
448
401
|
});
|
|
449
402
|
}
|
|
450
403
|
}]);
|
|
451
|
-
|
|
452
404
|
return DateTimeInput;
|
|
453
405
|
}(react$1.Component);
|
|
454
|
-
|
|
455
406
|
DateTimeInput.displayName = 'DateTimeInput';
|
|
456
407
|
DateTimeInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
457
408
|
'aria-invalid': _pt__default["default"].bool,
|
|
@@ -473,7 +424,7 @@ DateTimeInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
473
424
|
var dateTimeInput = reactIntl.injectIntl(DateTimeInput);
|
|
474
425
|
|
|
475
426
|
// NOTE: This string will be replaced on build time with the package version.
|
|
476
|
-
var version = "16.
|
|
427
|
+
var version = "16.1.1";
|
|
477
428
|
|
|
478
429
|
exports["default"] = dateTimeInput;
|
|
479
430
|
exports.version = version;
|
|
@@ -52,7 +52,6 @@ var Downshift__default = /*#__PURE__*/_interopDefault(Downshift);
|
|
|
52
52
|
var Constraints__default = /*#__PURE__*/_interopDefault(Constraints);
|
|
53
53
|
|
|
54
54
|
const getInputStyles = () => /*#__PURE__*/react.css("width:100%;text-align:center;border:0;border-top:1px solid ", designSystem.designTokens.colorNeutral90, ";padding:10px 0;outline:0;font-size:", designSystem.designTokens.fontSizeDefault, ";margin-top:", designSystem.designTokens.spacing20, ";color:", designSystem.designTokens.colorSolid, ";:disabled{background-color:", designSystem.designTokens.colorSurface, ";}" + ("" ), "" );
|
|
55
|
-
|
|
56
55
|
const DateCalendarTimeInput = props => jsxRuntime.jsx("input", {
|
|
57
56
|
disabled: props.isDisabled,
|
|
58
57
|
ref: props.timeInputRef,
|
|
@@ -63,48 +62,36 @@ const DateCalendarTimeInput = props => jsxRuntime.jsx("input", {
|
|
|
63
62
|
placeholder: props.placeholder,
|
|
64
63
|
css: getInputStyles()
|
|
65
64
|
});
|
|
66
|
-
|
|
67
65
|
DateCalendarTimeInput.propTypes = {};
|
|
68
66
|
DateCalendarTimeInput.displayName = 'DateCalendarTimeInput';
|
|
69
67
|
var TimeInput = DateCalendarTimeInput;
|
|
70
68
|
|
|
71
69
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
72
|
-
|
|
73
70
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(source))).call(_context4, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
|
|
74
|
-
|
|
75
71
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct__default["default"](Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
76
|
-
|
|
77
72
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct__default["default"]) return false; if (_Reflect$construct__default["default"].sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct__default["default"](Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
78
73
|
const activationTypes = [Downshift__default["default"].stateChangeTypes.keyDownEnter, Downshift__default["default"].stateChangeTypes.clickItem];
|
|
79
|
-
|
|
80
74
|
const preventDownshiftDefault = event => {
|
|
81
75
|
event.nativeEvent.preventDownshiftDefault = true;
|
|
82
|
-
};
|
|
83
|
-
// blurring the regular input/toggle button)
|
|
84
|
-
|
|
76
|
+
};
|
|
85
77
|
|
|
78
|
+
// This keeps the menu open when the user focuses the time input (thereby
|
|
79
|
+
// blurring the regular input/toggle button)
|
|
86
80
|
const createBlurHandler = timeInputRef => event => {
|
|
87
81
|
event.persist();
|
|
88
|
-
|
|
89
82
|
if (event.relatedTarget === timeInputRef.current) {
|
|
90
83
|
preventDownshiftDefault(event);
|
|
91
84
|
}
|
|
92
85
|
};
|
|
93
|
-
|
|
94
86
|
let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
95
87
|
_inherits(DateTimeInput, _Component);
|
|
96
|
-
|
|
97
88
|
var _super = _createSuper(DateTimeInput);
|
|
98
|
-
|
|
99
89
|
function DateTimeInput() {
|
|
100
90
|
var _this;
|
|
101
|
-
|
|
102
91
|
_classCallCheck(this, DateTimeInput);
|
|
103
|
-
|
|
104
92
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
105
93
|
args[_key] = arguments[_key];
|
|
106
94
|
}
|
|
107
|
-
|
|
108
95
|
_this = _super.call(this, ...args);
|
|
109
96
|
_this.inputRef = /*#__PURE__*/react$1.createRef();
|
|
110
97
|
_this.timeInputRef = /*#__PURE__*/react$1.createRef();
|
|
@@ -114,10 +101,8 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
114
101
|
highlightedIndex: _this.props.value === '' ? null : calendarTimeUtils.getDateInMonth(_this.props.value, _this.props.timeZone) - 1,
|
|
115
102
|
timeString: ''
|
|
116
103
|
};
|
|
117
|
-
|
|
118
104
|
_this.jumpMonths = function (amount) {
|
|
119
105
|
let dayToHighlight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
120
|
-
|
|
121
106
|
_this.setState(prevState => {
|
|
122
107
|
const nextDate = calendarTimeUtils.changeMonth(prevState.calendarDate, _this.props.timeZone, amount);
|
|
123
108
|
return {
|
|
@@ -126,20 +111,16 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
126
111
|
};
|
|
127
112
|
});
|
|
128
113
|
};
|
|
129
|
-
|
|
130
114
|
_this.showToday = () => {
|
|
131
115
|
const today = calendarTimeUtils.getToday(_this.props.timeZone);
|
|
132
|
-
|
|
133
116
|
_this.setState(prevState => ({
|
|
134
117
|
calendarDate: today,
|
|
135
118
|
highlightedIndex: (prevState.suggestedItems || []).length + calendarTimeUtils.getDateInMonth(today, _this.props.timeZone) - 1
|
|
136
119
|
}), () => {
|
|
137
120
|
var _this$inputRef$curren;
|
|
138
|
-
|
|
139
121
|
return (_this$inputRef$curren = _this.inputRef.current) === null || _this$inputRef$curren === void 0 ? void 0 : _this$inputRef$curren.focus();
|
|
140
122
|
});
|
|
141
123
|
};
|
|
142
|
-
|
|
143
124
|
_this.handleBlur = () => {
|
|
144
125
|
if (_this.props.onBlur) _this.props.onBlur({
|
|
145
126
|
target: {
|
|
@@ -148,28 +129,22 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
148
129
|
}
|
|
149
130
|
});
|
|
150
131
|
};
|
|
151
|
-
|
|
152
132
|
_this.handleTimeChange = event => {
|
|
153
133
|
const parsedTime = utils.parseTime(event.target.value);
|
|
154
|
-
|
|
155
134
|
_this.setState({
|
|
156
135
|
timeString: event.target.value
|
|
157
|
-
});
|
|
158
|
-
|
|
136
|
+
});
|
|
159
137
|
|
|
138
|
+
// We can't update the parent when there is no value
|
|
160
139
|
if (_this.props.value === '') return;
|
|
161
140
|
let date = calendarTimeUtils.getStartOf(_this.props.value, _this.props.timeZone);
|
|
162
|
-
|
|
163
141
|
if (parsedTime) {
|
|
164
142
|
date = calendarTimeUtils.changeTime(date, _this.props.timeZone, parsedTime);
|
|
165
143
|
}
|
|
166
|
-
|
|
167
144
|
_this.emit(date);
|
|
168
145
|
};
|
|
169
|
-
|
|
170
146
|
_this.emit = value => {
|
|
171
147
|
var _this$props$onChange, _this$props;
|
|
172
|
-
|
|
173
148
|
return (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, {
|
|
174
149
|
target: {
|
|
175
150
|
id: _this.props.id,
|
|
@@ -180,20 +155,17 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
180
155
|
}
|
|
181
156
|
});
|
|
182
157
|
};
|
|
183
|
-
|
|
184
158
|
return _this;
|
|
185
159
|
}
|
|
186
|
-
|
|
187
160
|
_createClass(DateTimeInput, [{
|
|
188
161
|
key: "render",
|
|
189
162
|
value: function render() {
|
|
190
163
|
var _context;
|
|
191
|
-
|
|
192
164
|
if (!this.props.isReadOnly) ;
|
|
193
|
-
|
|
194
165
|
return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
|
|
195
166
|
max: this.props.horizontalConstraint,
|
|
196
|
-
children: jsxRuntime.jsx(Downshift__default["default"]
|
|
167
|
+
children: jsxRuntime.jsx(Downshift__default["default"]
|
|
168
|
+
// Setting the key to the timeZone conveniently forces a rerender
|
|
197
169
|
// when the time-zone changes. Otherwise we'd need to make
|
|
198
170
|
// inputValue a controlled property so that we can update
|
|
199
171
|
// the displayed value as downshift seems to ignore an updated
|
|
@@ -210,7 +182,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
210
182
|
isOpen: true
|
|
211
183
|
});
|
|
212
184
|
}
|
|
213
|
-
|
|
214
185
|
return changes;
|
|
215
186
|
},
|
|
216
187
|
onStateChange: changes => {
|
|
@@ -222,7 +193,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
222
193
|
timeString: changes.selectedItem ? calendarTimeUtils.formatTime(changes.selectedItem, this.props.intl.locale, this.props.timeZone) : prevState.timeString
|
|
223
194
|
};
|
|
224
195
|
}
|
|
225
|
-
|
|
226
196
|
if (changes.hasOwnProperty('inputValue')) {
|
|
227
197
|
const suggestedItems = calendarTimeUtils.createSuggestedItems(changes.inputValue, this.props.timeZone);
|
|
228
198
|
return {
|
|
@@ -230,7 +200,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
230
200
|
highlightedIndex: suggestedItems.length > 0 ? 0 : null
|
|
231
201
|
};
|
|
232
202
|
}
|
|
233
|
-
|
|
234
203
|
if (changes.hasOwnProperty('isOpen')) {
|
|
235
204
|
return {
|
|
236
205
|
inputValue: changes.inputValue || prevState.inputValue,
|
|
@@ -242,18 +211,15 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
242
211
|
calendarDate: this.props.value === '' ? calendarTimeUtils.getToday(this.props.timeZone) : this.props.value
|
|
243
212
|
};
|
|
244
213
|
}
|
|
245
|
-
|
|
246
214
|
if (changes.hasOwnProperty('highlightedIndex')) {
|
|
247
215
|
return {
|
|
248
216
|
highlightedIndex: changes.highlightedIndex
|
|
249
217
|
};
|
|
250
218
|
}
|
|
251
|
-
|
|
252
219
|
return null;
|
|
253
220
|
}, () => {
|
|
254
221
|
if (_includesInstanceProperty__default["default"](activationTypes).call(activationTypes, changes.type)) {
|
|
255
222
|
var _this$timeInputRef$cu, _this$timeInputRef$cu2;
|
|
256
|
-
|
|
257
223
|
(_this$timeInputRef$cu = this.timeInputRef.current) === null || _this$timeInputRef$cu === void 0 ? void 0 : _this$timeInputRef$cu.focus();
|
|
258
224
|
(_this$timeInputRef$cu2 = this.timeInputRef.current) === null || _this$timeInputRef$cu2 === void 0 ? void 0 : _this$timeInputRef$cu2.setSelectionRange(0, this.state.timeString.length);
|
|
259
225
|
}
|
|
@@ -261,25 +227,22 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
261
227
|
},
|
|
262
228
|
children: _ref => {
|
|
263
229
|
var _context2;
|
|
264
|
-
|
|
265
230
|
let getInputProps = _ref.getInputProps,
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
231
|
+
getMenuProps = _ref.getMenuProps,
|
|
232
|
+
getItemProps = _ref.getItemProps,
|
|
233
|
+
getToggleButtonProps = _ref.getToggleButtonProps,
|
|
234
|
+
clearSelection = _ref.clearSelection,
|
|
235
|
+
highlightedIndex = _ref.highlightedIndex,
|
|
236
|
+
openMenu = _ref.openMenu,
|
|
237
|
+
closeMenu = _ref.closeMenu,
|
|
238
|
+
setHighlightedIndex = _ref.setHighlightedIndex,
|
|
239
|
+
selectedItem = _ref.selectedItem,
|
|
240
|
+
inputValue = _ref.inputValue,
|
|
241
|
+
isOpen = _ref.isOpen;
|
|
277
242
|
const suggestedItems = this.state.suggestedItems;
|
|
278
243
|
const calendarItems = calendarTimeUtils.createCalendarItems(this.state.calendarDate, this.state.timeString, this.props.timeZone);
|
|
279
244
|
const paddingDayCount = calendarTimeUtils.getPaddingDayCount(this.state.calendarDate, this.props.intl.locale, this.props.timeZone);
|
|
280
|
-
|
|
281
245
|
const paddingDays = _fillInstanceProperty__default["default"](_context2 = Array(paddingDayCount)).call(_context2, undefined);
|
|
282
|
-
|
|
283
246
|
const weekdays = calendarTimeUtils.getWeekdayNames(this.props.intl.locale);
|
|
284
247
|
const today = calendarTimeUtils.getToday(this.props.timeZone);
|
|
285
248
|
const isTimeInputVisible = Boolean(this.props.value) && this.props.value !== '';
|
|
@@ -306,38 +269,34 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
306
269
|
if (this.props.isReadOnly) {
|
|
307
270
|
preventDownshiftDefault(event);
|
|
308
271
|
return;
|
|
309
|
-
}
|
|
272
|
+
}
|
|
273
|
+
// parse input when user presses enter on regular input,
|
|
310
274
|
// close menu and notify parent
|
|
311
|
-
|
|
312
|
-
|
|
313
275
|
if (event.key === 'Enter' && highlightedIndex === null) {
|
|
314
276
|
preventDownshiftDefault(event);
|
|
315
277
|
const parsedDate = calendarTimeUtils.parseInputText(inputValue, this.props.intl.locale, this.props.timeZone);
|
|
316
278
|
this.emit(parsedDate);
|
|
317
279
|
closeMenu();
|
|
318
|
-
}
|
|
319
|
-
|
|
320
|
-
|
|
280
|
+
}
|
|
281
|
+
// ArrowDown
|
|
321
282
|
if (event.key === 'ArrowDown') {
|
|
322
283
|
if (Number(highlightedIndex) + 1 >= calendarItems.length) {
|
|
323
284
|
// if it's the end of the month
|
|
324
285
|
// then bypass normal arrow navigation
|
|
325
|
-
preventDownshiftDefault(event);
|
|
326
|
-
|
|
286
|
+
preventDownshiftDefault(event);
|
|
287
|
+
// then jump to start of next month
|
|
327
288
|
this.jumpMonths(1, 0);
|
|
328
289
|
}
|
|
329
|
-
}
|
|
330
|
-
|
|
331
|
-
|
|
290
|
+
}
|
|
291
|
+
// ArrowUp
|
|
332
292
|
if (event.key === 'ArrowUp') {
|
|
333
293
|
const previousDay = calendarTimeUtils.getPreviousDay(calendarItems[Number(highlightedIndex)]);
|
|
334
|
-
|
|
335
294
|
if (Number(highlightedIndex) <= 0) {
|
|
336
295
|
// if it's the start of the month
|
|
337
296
|
// then bypass normal arrow navigation
|
|
338
297
|
preventDownshiftDefault(event);
|
|
339
|
-
const numberOfDaysOfPrevMonth = calendarTimeUtils.getDaysInMonth(previousDay, this.props.timeZone);
|
|
340
|
-
|
|
298
|
+
const numberOfDaysOfPrevMonth = calendarTimeUtils.getDaysInMonth(previousDay, this.props.timeZone);
|
|
299
|
+
// then jump to the last day of the previous month
|
|
341
300
|
this.jumpMonths(-1, numberOfDaysOfPrevMonth - 1);
|
|
342
301
|
}
|
|
343
302
|
}
|
|
@@ -346,7 +305,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
346
305
|
onBlur: createBlurHandler(this.timeInputRef),
|
|
347
306
|
onChange: event => {
|
|
348
307
|
var _event$target$value;
|
|
349
|
-
|
|
350
308
|
// keep timeInput and regular input in sync when user
|
|
351
309
|
// types into regular input
|
|
352
310
|
if (!isOpen) return;
|
|
@@ -358,11 +316,9 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
358
316
|
timeString: ''
|
|
359
317
|
};
|
|
360
318
|
let date = calendarTimeUtils.getToday(this.props.timeZone);
|
|
361
|
-
|
|
362
319
|
if (parsedTime) {
|
|
363
320
|
date = calendarTimeUtils.changeTime(date, this.props.timeZone, parsedTime);
|
|
364
321
|
}
|
|
365
|
-
|
|
366
322
|
return {
|
|
367
323
|
timeString: calendarTimeUtils.formatTime(date, this.props.intl.locale, this.props.timeZone)
|
|
368
324
|
};
|
|
@@ -419,15 +375,12 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
419
375
|
onKeyDown: event => {
|
|
420
376
|
if (event.key === 'ArrowUp') {
|
|
421
377
|
var _this$inputRef$curren2;
|
|
422
|
-
|
|
423
378
|
setHighlightedIndex(-1);
|
|
424
379
|
(_this$inputRef$curren2 = this.inputRef.current) === null || _this$inputRef$curren2 === void 0 ? void 0 : _this$inputRef$curren2.focus();
|
|
425
380
|
return;
|
|
426
381
|
}
|
|
427
|
-
|
|
428
382
|
if (event.key === 'Enter') {
|
|
429
383
|
var _this$inputRef$curren3, _this$inputRef$curren4;
|
|
430
|
-
|
|
431
384
|
setHighlightedIndex(-1);
|
|
432
385
|
(_this$inputRef$curren3 = this.inputRef.current) === null || _this$inputRef$curren3 === void 0 ? void 0 : _this$inputRef$curren3.focus();
|
|
433
386
|
(_this$inputRef$curren4 = this.inputRef.current) === null || _this$inputRef$curren4 === void 0 ? void 0 : _this$inputRef$curren4.setSelectionRange(0, 100);
|
|
@@ -442,16 +395,14 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
442
395
|
});
|
|
443
396
|
}
|
|
444
397
|
}]);
|
|
445
|
-
|
|
446
398
|
return DateTimeInput;
|
|
447
399
|
}(react$1.Component);
|
|
448
|
-
|
|
449
400
|
DateTimeInput.displayName = 'DateTimeInput';
|
|
450
401
|
DateTimeInput.propTypes = {};
|
|
451
402
|
var dateTimeInput = reactIntl.injectIntl(DateTimeInput);
|
|
452
403
|
|
|
453
404
|
// NOTE: This string will be replaced on build time with the package version.
|
|
454
|
-
var version = "16.
|
|
405
|
+
var version = "16.1.1";
|
|
455
406
|
|
|
456
407
|
exports["default"] = dateTimeInput;
|
|
457
408
|
exports.version = version;
|
|
@@ -30,7 +30,6 @@ import { designTokens } from '@commercetools-uikit/design-system';
|
|
|
30
30
|
import { jsx, jsxs } from '@emotion/react/jsx-runtime';
|
|
31
31
|
|
|
32
32
|
const getInputStyles = () => /*#__PURE__*/css("width:100%;text-align:center;border:0;border-top:1px solid ", designTokens.colorNeutral90, ";padding:10px 0;outline:0;font-size:", designTokens.fontSizeDefault, ";margin-top:", designTokens.spacing20, ";color:", designTokens.colorSolid, ";:disabled{background-color:", designTokens.colorSurface, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRpbWUtaW5wdXQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU1nQyIsImZpbGUiOiJ0aW1lLWlucHV0LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8vLyA8cmVmZXJlbmNlIHR5cGVzPVwiQGVtb3Rpb24vcmVhY3QvdHlwZXMvY3NzLXByb3BcIiAvPlxuaW1wb3J0IHR5cGUgeyBLZXlib2FyZEV2ZW50SGFuZGxlciwgUmVmT2JqZWN0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgdHlwZSB7IFREYXRlVGltZUlucHV0UHJvcHMgfSBmcm9tICcuL2RhdGUtdGltZS1pbnB1dCc7XG5cbmNvbnN0IGdldElucHV0U3R5bGVzID0gKCkgPT4gY3NzYFxuICB3aWR0aDogMTAwJTtcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xuICBib3JkZXI6IDA7XG4gIGJvcmRlci10b3A6IDFweCBzb2xpZCAke2Rlc2lnblRva2Vucy5jb2xvck5ldXRyYWw5MH07XG4gIHBhZGRpbmc6IDEwcHggMDtcbiAgb3V0bGluZTogMDtcbiAgZm9udC1zaXplOiAke2Rlc2lnblRva2Vucy5mb250U2l6ZURlZmF1bHR9O1xuICBtYXJnaW4tdG9wOiAke2Rlc2lnblRva2Vucy5zcGFjaW5nMjB9O1xuICBjb2xvcjogJHtkZXNpZ25Ub2tlbnMuY29sb3JTb2xpZH07XG5cbiAgOmRpc2FibGVkIHtcbiAgICAvKiBGaXhlcyBiYWNrZ3JvdW5kIGNvbG9yIGluIEZpcmVmb3ggKi9cbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2Rlc2lnblRva2Vucy5jb2xvclN1cmZhY2V9O1xuICB9XG5gO1xuXG50eXBlIFREYXRlQ2FsZW5kYXJUaW1lSW5wdXRQcm9wcyA9IHtcbiAgdGltZUlucHV0UmVmOiBSZWZPYmplY3Q8SFRNTElucHV0RWxlbWVudD47XG4gIG9uS2V5RG93bjogS2V5Ym9hcmRFdmVudEhhbmRsZXI8SFRNTElucHV0RWxlbWVudD47XG59ICYgUGljazxcbiAgVERhdGVUaW1lSW5wdXRQcm9wcyxcbiAgJ2lzRGlzYWJsZWQnIHwgJ29uQ2hhbmdlJyB8ICd2YWx1ZScgfCAncGxhY2Vob2xkZXInXG4+O1xuXG5jb25zdCBEYXRlQ2FsZW5kYXJUaW1lSW5wdXQgPSAocHJvcHM6IFREYXRlQ2FsZW5kYXJUaW1lSW5wdXRQcm9wcykgPT4gKFxuICA8aW5wdXRcbiAgICBkaXNhYmxlZD17cHJvcHMuaXNEaXNhYmxlZH1cbiAgICByZWY9e3Byb3BzLnRpbWVJbnB1dFJlZn1cbiAgICB0eXBlPVwidGV4dFwiXG4gICAgdmFsdWU9e3Byb3BzLnZhbHVlfVxuICAgIG9uQ2hhbmdlPXtwcm9wcy5vbkNoYW5nZX1cbiAgICBvbktleURvd249e3Byb3BzLm9uS2V5RG93bn1cbiAgICBwbGFjZWhvbGRlcj17cHJvcHMucGxhY2Vob2xkZXJ9XG4gICAgY3NzPXtnZXRJbnB1dFN0eWxlcygpfVxuICAvPlxuKTtcblxuRGF0ZUNhbGVuZGFyVGltZUlucHV0LmRpc3BsYXlOYW1lID0gJ0RhdGVDYWxlbmRhclRpbWVJbnB1dCc7XG5cbmV4cG9ydCBkZWZhdWx0IERhdGVDYWxlbmRhclRpbWVJbnB1dDtcbiJdfQ== */");
|
|
33
|
-
|
|
34
33
|
const DateCalendarTimeInput = props => jsx("input", {
|
|
35
34
|
disabled: props.isDisabled,
|
|
36
35
|
ref: props.timeInputRef,
|
|
@@ -41,7 +40,6 @@ const DateCalendarTimeInput = props => jsx("input", {
|
|
|
41
40
|
placeholder: props.placeholder,
|
|
42
41
|
css: getInputStyles()
|
|
43
42
|
});
|
|
44
|
-
|
|
45
43
|
DateCalendarTimeInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
46
44
|
timeInputRef: _pt.any.isRequired,
|
|
47
45
|
onKeyDown: _pt.func.isRequired
|
|
@@ -50,42 +48,31 @@ DateCalendarTimeInput.displayName = 'DateCalendarTimeInput';
|
|
|
50
48
|
var TimeInput = DateCalendarTimeInput;
|
|
51
49
|
|
|
52
50
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
53
|
-
|
|
54
51
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context4 = ownKeys(Object(source))).call(_context4, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
55
|
-
|
|
56
52
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
57
|
-
|
|
58
53
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct) return false; if (_Reflect$construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
59
54
|
const activationTypes = [Downshift.stateChangeTypes.keyDownEnter, Downshift.stateChangeTypes.clickItem];
|
|
60
|
-
|
|
61
55
|
const preventDownshiftDefault = event => {
|
|
62
56
|
event.nativeEvent.preventDownshiftDefault = true;
|
|
63
|
-
};
|
|
64
|
-
// blurring the regular input/toggle button)
|
|
65
|
-
|
|
57
|
+
};
|
|
66
58
|
|
|
59
|
+
// This keeps the menu open when the user focuses the time input (thereby
|
|
60
|
+
// blurring the regular input/toggle button)
|
|
67
61
|
const createBlurHandler = timeInputRef => event => {
|
|
68
62
|
event.persist();
|
|
69
|
-
|
|
70
63
|
if (event.relatedTarget === timeInputRef.current) {
|
|
71
64
|
preventDownshiftDefault(event);
|
|
72
65
|
}
|
|
73
66
|
};
|
|
74
|
-
|
|
75
67
|
let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
76
68
|
_inherits(DateTimeInput, _Component);
|
|
77
|
-
|
|
78
69
|
var _super = _createSuper(DateTimeInput);
|
|
79
|
-
|
|
80
70
|
function DateTimeInput() {
|
|
81
71
|
var _this;
|
|
82
|
-
|
|
83
72
|
_classCallCheck(this, DateTimeInput);
|
|
84
|
-
|
|
85
73
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
86
74
|
args[_key] = arguments[_key];
|
|
87
75
|
}
|
|
88
|
-
|
|
89
76
|
_this = _super.call(this, ...args);
|
|
90
77
|
_this.inputRef = /*#__PURE__*/createRef();
|
|
91
78
|
_this.timeInputRef = /*#__PURE__*/createRef();
|
|
@@ -95,10 +82,8 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
95
82
|
highlightedIndex: _this.props.value === '' ? null : getDateInMonth(_this.props.value, _this.props.timeZone) - 1,
|
|
96
83
|
timeString: ''
|
|
97
84
|
};
|
|
98
|
-
|
|
99
85
|
_this.jumpMonths = function (amount) {
|
|
100
86
|
let dayToHighlight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
101
|
-
|
|
102
87
|
_this.setState(prevState => {
|
|
103
88
|
const nextDate = changeMonth(prevState.calendarDate, _this.props.timeZone, amount);
|
|
104
89
|
return {
|
|
@@ -107,20 +92,16 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
107
92
|
};
|
|
108
93
|
});
|
|
109
94
|
};
|
|
110
|
-
|
|
111
95
|
_this.showToday = () => {
|
|
112
96
|
const today = getToday(_this.props.timeZone);
|
|
113
|
-
|
|
114
97
|
_this.setState(prevState => ({
|
|
115
98
|
calendarDate: today,
|
|
116
99
|
highlightedIndex: (prevState.suggestedItems || []).length + getDateInMonth(today, _this.props.timeZone) - 1
|
|
117
100
|
}), () => {
|
|
118
101
|
var _this$inputRef$curren;
|
|
119
|
-
|
|
120
102
|
return (_this$inputRef$curren = _this.inputRef.current) === null || _this$inputRef$curren === void 0 ? void 0 : _this$inputRef$curren.focus();
|
|
121
103
|
});
|
|
122
104
|
};
|
|
123
|
-
|
|
124
105
|
_this.handleBlur = () => {
|
|
125
106
|
if (_this.props.onBlur) _this.props.onBlur({
|
|
126
107
|
target: {
|
|
@@ -129,28 +110,22 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
129
110
|
}
|
|
130
111
|
});
|
|
131
112
|
};
|
|
132
|
-
|
|
133
113
|
_this.handleTimeChange = event => {
|
|
134
114
|
const parsedTime = parseTime(event.target.value);
|
|
135
|
-
|
|
136
115
|
_this.setState({
|
|
137
116
|
timeString: event.target.value
|
|
138
|
-
});
|
|
139
|
-
|
|
117
|
+
});
|
|
140
118
|
|
|
119
|
+
// We can't update the parent when there is no value
|
|
141
120
|
if (_this.props.value === '') return;
|
|
142
121
|
let date = getStartOf(_this.props.value, _this.props.timeZone);
|
|
143
|
-
|
|
144
122
|
if (parsedTime) {
|
|
145
123
|
date = changeTime(date, _this.props.timeZone, parsedTime);
|
|
146
124
|
}
|
|
147
|
-
|
|
148
125
|
_this.emit(date);
|
|
149
126
|
};
|
|
150
|
-
|
|
151
127
|
_this.emit = value => {
|
|
152
128
|
var _this$props$onChange, _this$props;
|
|
153
|
-
|
|
154
129
|
return (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, {
|
|
155
130
|
target: {
|
|
156
131
|
id: _this.props.id,
|
|
@@ -161,22 +136,19 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
161
136
|
}
|
|
162
137
|
});
|
|
163
138
|
};
|
|
164
|
-
|
|
165
139
|
return _this;
|
|
166
140
|
}
|
|
167
|
-
|
|
168
141
|
_createClass(DateTimeInput, [{
|
|
169
142
|
key: "render",
|
|
170
143
|
value: function render() {
|
|
171
144
|
var _context;
|
|
172
|
-
|
|
173
145
|
if (!this.props.isReadOnly) {
|
|
174
146
|
process.env.NODE_ENV !== "production" ? warning(typeof this.props.onChange === 'function', 'DateTimeInput: `onChange` is required when input is not read only.') : void 0;
|
|
175
147
|
}
|
|
176
|
-
|
|
177
148
|
return jsx(Constraints.Horizontal, {
|
|
178
149
|
max: this.props.horizontalConstraint,
|
|
179
|
-
children: jsx(Downshift
|
|
150
|
+
children: jsx(Downshift
|
|
151
|
+
// Setting the key to the timeZone conveniently forces a rerender
|
|
180
152
|
// when the time-zone changes. Otherwise we'd need to make
|
|
181
153
|
// inputValue a controlled property so that we can update
|
|
182
154
|
// the displayed value as downshift seems to ignore an updated
|
|
@@ -193,7 +165,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
193
165
|
isOpen: true
|
|
194
166
|
});
|
|
195
167
|
}
|
|
196
|
-
|
|
197
168
|
return changes;
|
|
198
169
|
},
|
|
199
170
|
onStateChange: changes => {
|
|
@@ -205,7 +176,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
205
176
|
timeString: changes.selectedItem ? formatTime(changes.selectedItem, this.props.intl.locale, this.props.timeZone) : prevState.timeString
|
|
206
177
|
};
|
|
207
178
|
}
|
|
208
|
-
|
|
209
179
|
if (changes.hasOwnProperty('inputValue')) {
|
|
210
180
|
const suggestedItems = createSuggestedItems(changes.inputValue, this.props.timeZone);
|
|
211
181
|
return {
|
|
@@ -213,7 +183,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
213
183
|
highlightedIndex: suggestedItems.length > 0 ? 0 : null
|
|
214
184
|
};
|
|
215
185
|
}
|
|
216
|
-
|
|
217
186
|
if (changes.hasOwnProperty('isOpen')) {
|
|
218
187
|
return {
|
|
219
188
|
inputValue: changes.inputValue || prevState.inputValue,
|
|
@@ -225,18 +194,15 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
225
194
|
calendarDate: this.props.value === '' ? getToday(this.props.timeZone) : this.props.value
|
|
226
195
|
};
|
|
227
196
|
}
|
|
228
|
-
|
|
229
197
|
if (changes.hasOwnProperty('highlightedIndex')) {
|
|
230
198
|
return {
|
|
231
199
|
highlightedIndex: changes.highlightedIndex
|
|
232
200
|
};
|
|
233
201
|
}
|
|
234
|
-
|
|
235
202
|
return null;
|
|
236
203
|
}, () => {
|
|
237
204
|
if (_includesInstanceProperty(activationTypes).call(activationTypes, changes.type)) {
|
|
238
205
|
var _this$timeInputRef$cu, _this$timeInputRef$cu2;
|
|
239
|
-
|
|
240
206
|
(_this$timeInputRef$cu = this.timeInputRef.current) === null || _this$timeInputRef$cu === void 0 ? void 0 : _this$timeInputRef$cu.focus();
|
|
241
207
|
(_this$timeInputRef$cu2 = this.timeInputRef.current) === null || _this$timeInputRef$cu2 === void 0 ? void 0 : _this$timeInputRef$cu2.setSelectionRange(0, this.state.timeString.length);
|
|
242
208
|
}
|
|
@@ -244,25 +210,22 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
244
210
|
},
|
|
245
211
|
children: _ref => {
|
|
246
212
|
var _context2;
|
|
247
|
-
|
|
248
213
|
let getInputProps = _ref.getInputProps,
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
214
|
+
getMenuProps = _ref.getMenuProps,
|
|
215
|
+
getItemProps = _ref.getItemProps,
|
|
216
|
+
getToggleButtonProps = _ref.getToggleButtonProps,
|
|
217
|
+
clearSelection = _ref.clearSelection,
|
|
218
|
+
highlightedIndex = _ref.highlightedIndex,
|
|
219
|
+
openMenu = _ref.openMenu,
|
|
220
|
+
closeMenu = _ref.closeMenu,
|
|
221
|
+
setHighlightedIndex = _ref.setHighlightedIndex,
|
|
222
|
+
selectedItem = _ref.selectedItem,
|
|
223
|
+
inputValue = _ref.inputValue,
|
|
224
|
+
isOpen = _ref.isOpen;
|
|
260
225
|
const suggestedItems = this.state.suggestedItems;
|
|
261
226
|
const calendarItems = createCalendarItems(this.state.calendarDate, this.state.timeString, this.props.timeZone);
|
|
262
227
|
const paddingDayCount = getPaddingDayCount(this.state.calendarDate, this.props.intl.locale, this.props.timeZone);
|
|
263
|
-
|
|
264
228
|
const paddingDays = _fillInstanceProperty(_context2 = Array(paddingDayCount)).call(_context2, undefined);
|
|
265
|
-
|
|
266
229
|
const weekdays = getWeekdayNames(this.props.intl.locale);
|
|
267
230
|
const today = getToday(this.props.timeZone);
|
|
268
231
|
const isTimeInputVisible = Boolean(this.props.value) && this.props.value !== '';
|
|
@@ -289,38 +252,34 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
289
252
|
if (this.props.isReadOnly) {
|
|
290
253
|
preventDownshiftDefault(event);
|
|
291
254
|
return;
|
|
292
|
-
}
|
|
255
|
+
}
|
|
256
|
+
// parse input when user presses enter on regular input,
|
|
293
257
|
// close menu and notify parent
|
|
294
|
-
|
|
295
|
-
|
|
296
258
|
if (event.key === 'Enter' && highlightedIndex === null) {
|
|
297
259
|
preventDownshiftDefault(event);
|
|
298
260
|
const parsedDate = parseInputText(inputValue, this.props.intl.locale, this.props.timeZone);
|
|
299
261
|
this.emit(parsedDate);
|
|
300
262
|
closeMenu();
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
|
|
263
|
+
}
|
|
264
|
+
// ArrowDown
|
|
304
265
|
if (event.key === 'ArrowDown') {
|
|
305
266
|
if (Number(highlightedIndex) + 1 >= calendarItems.length) {
|
|
306
267
|
// if it's the end of the month
|
|
307
268
|
// then bypass normal arrow navigation
|
|
308
|
-
preventDownshiftDefault(event);
|
|
309
|
-
|
|
269
|
+
preventDownshiftDefault(event);
|
|
270
|
+
// then jump to start of next month
|
|
310
271
|
this.jumpMonths(1, 0);
|
|
311
272
|
}
|
|
312
|
-
}
|
|
313
|
-
|
|
314
|
-
|
|
273
|
+
}
|
|
274
|
+
// ArrowUp
|
|
315
275
|
if (event.key === 'ArrowUp') {
|
|
316
276
|
const previousDay = getPreviousDay(calendarItems[Number(highlightedIndex)]);
|
|
317
|
-
|
|
318
277
|
if (Number(highlightedIndex) <= 0) {
|
|
319
278
|
// if it's the start of the month
|
|
320
279
|
// then bypass normal arrow navigation
|
|
321
280
|
preventDownshiftDefault(event);
|
|
322
|
-
const numberOfDaysOfPrevMonth = getDaysInMonth(previousDay, this.props.timeZone);
|
|
323
|
-
|
|
281
|
+
const numberOfDaysOfPrevMonth = getDaysInMonth(previousDay, this.props.timeZone);
|
|
282
|
+
// then jump to the last day of the previous month
|
|
324
283
|
this.jumpMonths(-1, numberOfDaysOfPrevMonth - 1);
|
|
325
284
|
}
|
|
326
285
|
}
|
|
@@ -329,7 +288,6 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
329
288
|
onBlur: createBlurHandler(this.timeInputRef),
|
|
330
289
|
onChange: event => {
|
|
331
290
|
var _event$target$value;
|
|
332
|
-
|
|
333
291
|
// keep timeInput and regular input in sync when user
|
|
334
292
|
// types into regular input
|
|
335
293
|
if (!isOpen) return;
|
|
@@ -341,11 +299,9 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
341
299
|
timeString: ''
|
|
342
300
|
};
|
|
343
301
|
let date = getToday(this.props.timeZone);
|
|
344
|
-
|
|
345
302
|
if (parsedTime) {
|
|
346
303
|
date = changeTime(date, this.props.timeZone, parsedTime);
|
|
347
304
|
}
|
|
348
|
-
|
|
349
305
|
return {
|
|
350
306
|
timeString: formatTime(date, this.props.intl.locale, this.props.timeZone)
|
|
351
307
|
};
|
|
@@ -402,15 +358,12 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
402
358
|
onKeyDown: event => {
|
|
403
359
|
if (event.key === 'ArrowUp') {
|
|
404
360
|
var _this$inputRef$curren2;
|
|
405
|
-
|
|
406
361
|
setHighlightedIndex(-1);
|
|
407
362
|
(_this$inputRef$curren2 = this.inputRef.current) === null || _this$inputRef$curren2 === void 0 ? void 0 : _this$inputRef$curren2.focus();
|
|
408
363
|
return;
|
|
409
364
|
}
|
|
410
|
-
|
|
411
365
|
if (event.key === 'Enter') {
|
|
412
366
|
var _this$inputRef$curren3, _this$inputRef$curren4;
|
|
413
|
-
|
|
414
367
|
setHighlightedIndex(-1);
|
|
415
368
|
(_this$inputRef$curren3 = this.inputRef.current) === null || _this$inputRef$curren3 === void 0 ? void 0 : _this$inputRef$curren3.focus();
|
|
416
369
|
(_this$inputRef$curren4 = this.inputRef.current) === null || _this$inputRef$curren4 === void 0 ? void 0 : _this$inputRef$curren4.setSelectionRange(0, 100);
|
|
@@ -425,10 +378,8 @@ let DateTimeInput = /*#__PURE__*/function (_Component) {
|
|
|
425
378
|
});
|
|
426
379
|
}
|
|
427
380
|
}]);
|
|
428
|
-
|
|
429
381
|
return DateTimeInput;
|
|
430
382
|
}(Component);
|
|
431
|
-
|
|
432
383
|
DateTimeInput.displayName = 'DateTimeInput';
|
|
433
384
|
DateTimeInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
434
385
|
'aria-invalid': _pt.bool,
|
|
@@ -450,6 +401,6 @@ DateTimeInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
|
450
401
|
var dateTimeInput = injectIntl(DateTimeInput);
|
|
451
402
|
|
|
452
403
|
// NOTE: This string will be replaced on build time with the package version.
|
|
453
|
-
var version = "16.
|
|
404
|
+
var version = "16.1.1";
|
|
454
405
|
|
|
455
406
|
export { dateTimeInput as default, version };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/date-time-input",
|
|
3
3
|
"description": "The `DateTimeInput` component allows the user to select a date. This component also supports multiple date selection.",
|
|
4
|
-
"version": "16.
|
|
4
|
+
"version": "16.1.1",
|
|
5
5
|
"bugs": "https://github.com/commercetools/ui-kit/issues",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -21,19 +21,19 @@
|
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@babel/runtime": "^7.20.13",
|
|
23
23
|
"@babel/runtime-corejs3": "^7.20.13",
|
|
24
|
-
"@commercetools-uikit/accessible-button": "16.
|
|
25
|
-
"@commercetools-uikit/calendar-time-utils": "16.
|
|
26
|
-
"@commercetools-uikit/calendar-utils": "16.
|
|
27
|
-
"@commercetools-uikit/constraints": "16.
|
|
28
|
-
"@commercetools-uikit/design-system": "16.
|
|
29
|
-
"@commercetools-uikit/hooks": "16.
|
|
30
|
-
"@commercetools-uikit/icons": "16.
|
|
31
|
-
"@commercetools-uikit/secondary-icon-button": "16.
|
|
32
|
-
"@commercetools-uikit/select-utils": "16.
|
|
33
|
-
"@commercetools-uikit/spacings-inline": "16.
|
|
34
|
-
"@commercetools-uikit/text": "16.
|
|
35
|
-
"@commercetools-uikit/tooltip": "16.
|
|
36
|
-
"@commercetools-uikit/utils": "16.
|
|
24
|
+
"@commercetools-uikit/accessible-button": "16.1.1",
|
|
25
|
+
"@commercetools-uikit/calendar-time-utils": "16.1.1",
|
|
26
|
+
"@commercetools-uikit/calendar-utils": "16.1.1",
|
|
27
|
+
"@commercetools-uikit/constraints": "16.1.1",
|
|
28
|
+
"@commercetools-uikit/design-system": "16.1.1",
|
|
29
|
+
"@commercetools-uikit/hooks": "16.1.1",
|
|
30
|
+
"@commercetools-uikit/icons": "16.1.1",
|
|
31
|
+
"@commercetools-uikit/secondary-icon-button": "16.1.1",
|
|
32
|
+
"@commercetools-uikit/select-utils": "16.1.1",
|
|
33
|
+
"@commercetools-uikit/spacings-inline": "16.1.1",
|
|
34
|
+
"@commercetools-uikit/text": "16.1.1",
|
|
35
|
+
"@commercetools-uikit/tooltip": "16.1.1",
|
|
36
|
+
"@commercetools-uikit/utils": "16.1.1",
|
|
37
37
|
"@emotion/react": "^11.10.5",
|
|
38
38
|
"@emotion/styled": "^11.10.5",
|
|
39
39
|
"downshift": "6.1.12",
|