@progress/kendo-vue-dateinputs 3.6.4 → 3.7.0-dev.202210250731
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/cdn/js/kendo-vue-dateinputs.js +1 -1
- package/dist/es/calendar/components/Calendar.js +17 -48
- package/dist/es/calendar/components/CalendarCell.js +16 -25
- package/dist/es/calendar/components/CalendarHeaderTitle.js +2 -4
- package/dist/es/calendar/components/CalendarWeekCell.js +0 -3
- package/dist/es/calendar/components/Header.js +6 -17
- package/dist/es/calendar/components/View.js +8 -19
- package/dist/es/calendar/components/ViewList.js +11 -14
- package/dist/es/common/PickerWrap.js +0 -2
- package/dist/es/dateinput/DateInput.js +33 -78
- package/dist/es/datepicker/DatePicker.js +32 -42
- package/dist/es/datepicker/ToggleButton.js +0 -2
- package/dist/es/datepicker/models/DatePickerSettings.js +2 -1
- package/dist/es/daterangepicker/DateRangePicker.js +10 -43
- package/dist/es/datetimepicker/DateTimePicker.js +39 -53
- package/dist/es/datetimepicker/DateTimeSelector.js +25 -36
- package/dist/es/package-metadata.js +1 -1
- package/dist/es/timepicker/TimeList.js +16 -46
- package/dist/es/timepicker/TimePart.js +7 -23
- package/dist/es/timepicker/TimePicker.js +37 -53
- package/dist/es/timepicker/TimeSelector.js +16 -23
- package/dist/es/virtualization/Virtualization.js +4 -36
- package/dist/esm/calendar/components/Calendar.js +17 -48
- package/dist/esm/calendar/components/CalendarCell.js +16 -25
- package/dist/esm/calendar/components/CalendarHeaderTitle.js +2 -4
- package/dist/esm/calendar/components/CalendarWeekCell.js +0 -3
- package/dist/esm/calendar/components/Header.js +6 -17
- package/dist/esm/calendar/components/View.js +8 -19
- package/dist/esm/calendar/components/ViewList.js +11 -14
- package/dist/esm/common/PickerWrap.js +0 -2
- package/dist/esm/dateinput/DateInput.js +33 -78
- package/dist/esm/datepicker/DatePicker.js +32 -42
- package/dist/esm/datepicker/ToggleButton.js +0 -2
- package/dist/esm/datepicker/models/DatePickerSettings.js +2 -1
- package/dist/esm/daterangepicker/DateRangePicker.js +10 -43
- package/dist/esm/datetimepicker/DateTimePicker.js +39 -53
- package/dist/esm/datetimepicker/DateTimeSelector.js +25 -36
- package/dist/esm/package-metadata.js +1 -1
- package/dist/esm/timepicker/TimeList.js +16 -46
- package/dist/esm/timepicker/TimePart.js +7 -23
- package/dist/esm/timepicker/TimePicker.js +37 -53
- package/dist/esm/timepicker/TimeSelector.js +16 -23
- package/dist/esm/virtualization/Virtualization.js +4 -36
- package/dist/npm/calendar/components/Calendar.js +17 -62
- package/dist/npm/calendar/components/CalendarCell.js +18 -30
- package/dist/npm/calendar/components/CalendarHeaderTitle.js +4 -10
- package/dist/npm/calendar/components/CalendarWeekCell.js +2 -8
- package/dist/npm/calendar/components/Header.js +8 -30
- package/dist/npm/calendar/components/View.js +10 -31
- package/dist/npm/calendar/components/ViewList.js +13 -25
- package/dist/npm/common/PickerWrap.js +2 -7
- package/dist/npm/dateinput/DateInput.js +35 -94
- package/dist/npm/datepicker/DatePicker.js +34 -58
- package/dist/npm/datepicker/ToggleButton.js +0 -4
- package/dist/npm/datepicker/models/DatePickerSettings.js +2 -1
- package/dist/npm/daterangepicker/DateRangePicker.js +10 -56
- package/dist/npm/datetimepicker/DateTimePicker.js +41 -71
- package/dist/npm/datetimepicker/DateTimeSelector.js +27 -50
- package/dist/npm/package-metadata.js +1 -1
- package/dist/npm/timepicker/TimeList.js +16 -55
- package/dist/npm/timepicker/TimePart.js +9 -36
- package/dist/npm/timepicker/TimePicker.js +37 -67
- package/dist/npm/timepicker/TimeSelector.js +18 -35
- package/dist/npm/virtualization/Virtualization.js +4 -40
- package/package.json +7 -7
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
2
|
+
// tslint:enable:max-line-length
|
|
@@ -2,19 +2,15 @@ var __assign = this && this.__assign || function () {
|
|
|
2
2
|
__assign = Object.assign || function (t) {
|
|
3
3
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
4
|
s = arguments[i];
|
|
5
|
-
|
|
6
5
|
for (var p in s) {
|
|
7
6
|
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
8
7
|
}
|
|
9
8
|
}
|
|
10
|
-
|
|
11
9
|
return t;
|
|
12
10
|
};
|
|
13
|
-
|
|
14
11
|
return __assign.apply(this, arguments);
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
|
|
12
|
+
};
|
|
13
|
+
// @ts-ignore
|
|
18
14
|
import * as Vue from 'vue';
|
|
19
15
|
var allVue = Vue;
|
|
20
16
|
var gh = allVue.h;
|
|
@@ -38,7 +34,6 @@ var WRAPPER_STYLES = {
|
|
|
38
34
|
/**
|
|
39
35
|
* @hidden
|
|
40
36
|
*/
|
|
41
|
-
|
|
42
37
|
var DateRangePickerVue2 = {
|
|
43
38
|
name: 'KendoDateRangePicker',
|
|
44
39
|
// @ts-ignore
|
|
@@ -173,7 +168,6 @@ var DateRangePickerVue2 = {
|
|
|
173
168
|
this._calendar = this.v3 ? this.calendarRef : this.$refs.calendar;
|
|
174
169
|
this._startDateInput = this.v3 ? this.startDateInputRef : this.$refs.startDateInput;
|
|
175
170
|
this._endDateInput = this.v3 ? this.endDateInputRef : this.$refs.endDateInput;
|
|
176
|
-
|
|
177
171
|
if (this.computedShow) {
|
|
178
172
|
// If defaultShow is true during the initial render, the popup is not aligned.
|
|
179
173
|
this.$forceUpdate();
|
|
@@ -186,15 +180,12 @@ var DateRangePickerVue2 = {
|
|
|
186
180
|
this._calendar = this.v3 ? this.calendarRef : this.$refs.calendar;
|
|
187
181
|
this._startDateInput = this.v3 ? this.startDateInputRef : this.$refs.startDateInput;
|
|
188
182
|
this._endDateInput = this.v3 ? this.endDateInputRef : this.$refs.endDateInput;
|
|
189
|
-
|
|
190
183
|
if (this.shouldFocusCalendar) {
|
|
191
184
|
this.focusCalendarElement();
|
|
192
185
|
}
|
|
193
|
-
|
|
194
186
|
if (this.shouldFocusDateInput) {
|
|
195
187
|
this.focusDateInputElement();
|
|
196
188
|
}
|
|
197
|
-
|
|
198
189
|
this.shouldFocusCalendar = false;
|
|
199
190
|
this.shouldFocusDateInput = false;
|
|
200
191
|
},
|
|
@@ -210,7 +201,6 @@ var DateRangePickerVue2 = {
|
|
|
210
201
|
computed: {
|
|
211
202
|
rootClassName: function rootClassName() {
|
|
212
203
|
var _a;
|
|
213
|
-
|
|
214
204
|
return _a = {
|
|
215
205
|
'k-daterangepicker': true
|
|
216
206
|
}, _a['k-disabled'] = this.$props.disabled, _a;
|
|
@@ -224,10 +214,9 @@ var DateRangePickerVue2 = {
|
|
|
224
214
|
},
|
|
225
215
|
swapButtonClass: function swapButtonClass() {
|
|
226
216
|
var _a;
|
|
227
|
-
|
|
228
217
|
var _b = this.$props,
|
|
229
|
-
|
|
230
|
-
|
|
218
|
+
size = _b.size,
|
|
219
|
+
rounded = _b.rounded;
|
|
231
220
|
return _a = {
|
|
232
221
|
'k-button': true
|
|
233
222
|
}, _a["k-button-".concat(kendoThemeMaps.sizeMap[size] || size)] = size, _a['k-button-flat'] = true, _a['k-button-flat-base'] = true, _a['k-icon-button'] = true, _a["k-rounded-".concat(kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a;
|
|
@@ -247,13 +236,12 @@ var DateRangePickerVue2 = {
|
|
|
247
236
|
// @ts-ignore
|
|
248
237
|
render: function render(createElement) {
|
|
249
238
|
var _this = this;
|
|
250
|
-
|
|
251
239
|
var h = gh || createElement;
|
|
252
240
|
var value = this.computedValue || EMPTY_SELECTIONRANGE;
|
|
253
241
|
var _a = this.$props,
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
242
|
+
size = _a.size,
|
|
243
|
+
fillMode = _a.fillMode,
|
|
244
|
+
rounded = _a.rounded;
|
|
257
245
|
var startDateInputId = (this.$props.startDateInputSettings || {}).id || this._startInputId;
|
|
258
246
|
var endDateInputId = (this.$props.endDateInputSettings || {}).id || this._endInputId;
|
|
259
247
|
var localizationService = provideLocalizationService(this);
|
|
@@ -261,7 +249,6 @@ var DateRangePickerVue2 = {
|
|
|
261
249
|
var endMessage = localizationService.toLanguageString(end, messages[end]);
|
|
262
250
|
var separatorMessage = localizationService.toLanguageString(separator, messages[separator]);
|
|
263
251
|
var startDateInputRender = this.$props.startDateInput ? templateRendering.call(this, this.$props.startDateInput, getListeners.call(this)) : undefined;
|
|
264
|
-
|
|
265
252
|
var startSettings = __assign({
|
|
266
253
|
label: startMessage,
|
|
267
254
|
format: this.$props.format,
|
|
@@ -279,7 +266,6 @@ var DateRangePickerVue2 = {
|
|
|
279
266
|
ariaRole: 'combobox',
|
|
280
267
|
ariaControls: this._popupId
|
|
281
268
|
}, this.$props.startDateInputSettings);
|
|
282
|
-
|
|
283
269
|
var startDateInputDefaultRendering = h(DateInput, __assign(__assign({
|
|
284
270
|
ref: this.v3 ? function (el) {
|
|
285
271
|
_this.startDateInputRef = el;
|
|
@@ -300,7 +286,6 @@ var DateRangePickerVue2 = {
|
|
|
300
286
|
}
|
|
301
287
|
});
|
|
302
288
|
var endDateInputRender = this.$props.endDateInput ? templateRendering.call(this, this.$props.endDateInput, getListeners.call(this)) : undefined;
|
|
303
|
-
|
|
304
289
|
var endSettings = __assign({
|
|
305
290
|
label: endMessage,
|
|
306
291
|
format: this.$props.format,
|
|
@@ -318,7 +303,6 @@ var DateRangePickerVue2 = {
|
|
|
318
303
|
ariaRole: 'combobox',
|
|
319
304
|
ariaControls: this._popupId
|
|
320
305
|
}, this.$props.endDateInputSettings);
|
|
321
|
-
|
|
322
306
|
var endDateInputDefaultRendering = h(DateInput, __assign(__assign({
|
|
323
307
|
ref: this.v3 ? function (el) {
|
|
324
308
|
_this.endDateInputRef = el;
|
|
@@ -339,7 +323,6 @@ var DateRangePickerVue2 = {
|
|
|
339
323
|
}
|
|
340
324
|
});
|
|
341
325
|
var calendarRender = this.$props.calendar ? templateRendering.call(this, this.$props.calendar, getListeners.call(this)) : undefined;
|
|
342
|
-
|
|
343
326
|
var calendarSettings = __assign({
|
|
344
327
|
id: this._calendarId,
|
|
345
328
|
min: this.min,
|
|
@@ -351,7 +334,6 @@ var DateRangePickerVue2 = {
|
|
|
351
334
|
disabled: this.$props.disabled,
|
|
352
335
|
value: value
|
|
353
336
|
}, this.$props.calendarSettings);
|
|
354
|
-
|
|
355
337
|
var calendarDefaultRendering = h(Calendar, __assign({
|
|
356
338
|
ref: this.v3 ? function (el) {
|
|
357
339
|
_this.calendarRef = el;
|
|
@@ -380,10 +362,9 @@ var DateRangePickerVue2 = {
|
|
|
380
362
|
}
|
|
381
363
|
});
|
|
382
364
|
var _b = this.$props.popupSettings,
|
|
383
|
-
|
|
384
|
-
|
|
365
|
+
popupClass = _b.popupClass,
|
|
366
|
+
animate = _b.animate;
|
|
385
367
|
var popupRender = this.$props.popup ? templateRendering.call(this, this.$props.popup, getListeners.call(this)) : undefined;
|
|
386
|
-
|
|
387
368
|
var popupSettings = __assign({
|
|
388
369
|
show: this.computedShow,
|
|
389
370
|
anchor: this._anchor,
|
|
@@ -398,7 +379,6 @@ var DateRangePickerVue2 = {
|
|
|
398
379
|
},
|
|
399
380
|
animate: this.initialAnimation ? false : animate
|
|
400
381
|
}, this.$props.popupSettings);
|
|
401
|
-
|
|
402
382
|
var popupDefaultRendering = h(Popup, __assign({
|
|
403
383
|
attrs: this.v3 ? undefined : popupSettings,
|
|
404
384
|
'class': popupClass
|
|
@@ -464,14 +444,12 @@ var DateRangePickerVue2 = {
|
|
|
464
444
|
methods: {
|
|
465
445
|
focus: function focus() {
|
|
466
446
|
var startInput = this.getStartInput();
|
|
467
|
-
|
|
468
447
|
if (startInput) {
|
|
469
448
|
startInput.focus();
|
|
470
449
|
}
|
|
471
450
|
},
|
|
472
451
|
focusCalendarElement: function focusCalendarElement() {
|
|
473
452
|
var calendar = this.getCalendar();
|
|
474
|
-
|
|
475
453
|
if (calendar) {
|
|
476
454
|
calendar.focus({
|
|
477
455
|
preventScroll: true
|
|
@@ -481,11 +459,9 @@ var DateRangePickerVue2 = {
|
|
|
481
459
|
focusDateInputElement: function focusDateInputElement() {
|
|
482
460
|
var startInput = this.getStartInput();
|
|
483
461
|
var endInput = this.getEndInput();
|
|
484
|
-
|
|
485
462
|
if (!document || !startInput || !endInput) {
|
|
486
463
|
return;
|
|
487
464
|
}
|
|
488
|
-
|
|
489
465
|
if ((this.computedValue.start === null || this.computedValue.end !== null) && document.activeElement !== endInput) {
|
|
490
466
|
startInput.focus({
|
|
491
467
|
preventScroll: true
|
|
@@ -507,7 +483,6 @@ var DateRangePickerVue2 = {
|
|
|
507
483
|
if (this.currentShow === show) {
|
|
508
484
|
return;
|
|
509
485
|
}
|
|
510
|
-
|
|
511
486
|
this.currentShow = show;
|
|
512
487
|
},
|
|
513
488
|
handleReverseClick: function handleReverseClick(event) {
|
|
@@ -527,7 +502,6 @@ var DateRangePickerVue2 = {
|
|
|
527
502
|
if (!this.shouldFocusDateInput) {
|
|
528
503
|
this.setShow(true);
|
|
529
504
|
}
|
|
530
|
-
|
|
531
505
|
this.$emit('focus', event);
|
|
532
506
|
},
|
|
533
507
|
calendarBlur: function calendarBlur() {
|
|
@@ -541,12 +515,9 @@ var DateRangePickerVue2 = {
|
|
|
541
515
|
},
|
|
542
516
|
createBlurTimeout: function createBlurTimeout() {
|
|
543
517
|
var _this = this;
|
|
544
|
-
|
|
545
518
|
this._blurTimeout = setTimeout(function () {
|
|
546
519
|
var startInput = _this.getStartInput();
|
|
547
|
-
|
|
548
520
|
var endInput = _this.getEndInput();
|
|
549
|
-
|
|
550
521
|
if (startInput && endInput && canUseDOM && startInput && document.activeElement !== endInput) {
|
|
551
522
|
_this.setShow(false);
|
|
552
523
|
}
|
|
@@ -583,7 +554,6 @@ var DateRangePickerVue2 = {
|
|
|
583
554
|
if (!Array.isArray(event.value) && !(event.value instanceof Date)) {
|
|
584
555
|
return event.value || EMPTY_SELECTIONRANGE;
|
|
585
556
|
}
|
|
586
|
-
|
|
587
557
|
var candidate = Array.isArray(event.value) ? event.value[0] : event.value;
|
|
588
558
|
return {
|
|
589
559
|
start: this.computedValue.end !== null ? candidate : this.computedValue.start,
|
|
@@ -596,10 +566,9 @@ var DateRangePickerVue2 = {
|
|
|
596
566
|
},
|
|
597
567
|
handleKeyDown: function handleKeyDown(event) {
|
|
598
568
|
var keyCode = event.keyCode,
|
|
599
|
-
|
|
569
|
+
altKey = event.altKey;
|
|
600
570
|
var endInput = this.getEndInput();
|
|
601
571
|
var calendar = this.getCalendar();
|
|
602
|
-
|
|
603
572
|
if (keyCode === Keys.esc) {
|
|
604
573
|
event.preventDefault();
|
|
605
574
|
this.shouldFocusDateInput = true;
|
|
@@ -612,7 +581,6 @@ var DateRangePickerVue2 = {
|
|
|
612
581
|
event.preventDefault();
|
|
613
582
|
this.focusCalendarElement();
|
|
614
583
|
}
|
|
615
|
-
|
|
616
584
|
this.$emit('keydown', event);
|
|
617
585
|
},
|
|
618
586
|
handleChange: function handleChange(value, event) {
|
|
@@ -639,6 +607,5 @@ var DateRangePickerVue2 = {
|
|
|
639
607
|
/**
|
|
640
608
|
* @hidden
|
|
641
609
|
*/
|
|
642
|
-
|
|
643
610
|
var DateRangePicker = DateRangePickerVue2;
|
|
644
611
|
export { DateRangePicker, DateRangePickerVue2 };
|
|
@@ -22,7 +22,6 @@ import { defaultFormatPlaceholder } from '../dateinput/utils';
|
|
|
22
22
|
/**
|
|
23
23
|
* @hidden
|
|
24
24
|
*/
|
|
25
|
-
|
|
26
25
|
var DateTimePickerVue2 = {
|
|
27
26
|
name: 'KendoDateTimePicker',
|
|
28
27
|
// @ts-ignore
|
|
@@ -235,12 +234,10 @@ var DateTimePickerVue2 = {
|
|
|
235
234
|
// If defaultShow is true during the initial render, the popup is not aligned.
|
|
236
235
|
this.$forceUpdate();
|
|
237
236
|
}
|
|
238
|
-
|
|
239
237
|
var dateInputElement = this.dateInputElement();
|
|
240
238
|
this._dateTimeSelector = this.$refs.dateTimeSelector;
|
|
241
239
|
this._wrapper = this.v3 ? this.kendoAnchorRef : this.$refs[this._anchor];
|
|
242
240
|
this._dateInput = this.v3 ? this.dateInputRef : this.$refs.dateInput;
|
|
243
|
-
|
|
244
241
|
if (dateInputElement) {
|
|
245
242
|
dateInputElement.setAttribute('aria-haspopup', 'true');
|
|
246
243
|
}
|
|
@@ -249,19 +246,16 @@ var DateTimePickerVue2 = {
|
|
|
249
246
|
var dateInputElement = this.dateInputElement();
|
|
250
247
|
this._dateTimeSelector = this.$refs.dateTimeSelector;
|
|
251
248
|
this._wrapper = this.v3 ? this.kendoAnchorRef : this.$refs[this._anchor];
|
|
252
|
-
|
|
253
249
|
if (this._dateTimeSelector && this.computedShow && !this._oldShow) {
|
|
254
250
|
this._dateTimeSelector.focus({
|
|
255
251
|
preventScroll: true
|
|
256
252
|
});
|
|
257
253
|
}
|
|
258
|
-
|
|
259
254
|
if (dateInputElement && !this.computedShow && this.shouldFocusDateInput) {
|
|
260
255
|
this._dateInput.focus({
|
|
261
256
|
preventScroll: true
|
|
262
257
|
});
|
|
263
258
|
}
|
|
264
|
-
|
|
265
259
|
this.shouldFocusDateInput = false;
|
|
266
260
|
},
|
|
267
261
|
// @ts-ignore
|
|
@@ -278,44 +272,43 @@ var DateTimePickerVue2 = {
|
|
|
278
272
|
// @ts-ignore
|
|
279
273
|
render: function render(createElement) {
|
|
280
274
|
var _a;
|
|
281
|
-
|
|
282
275
|
var _this = this;
|
|
283
|
-
|
|
284
276
|
var h = gh || createElement;
|
|
285
277
|
var defaultSlot = getDefaultSlots(this);
|
|
286
278
|
var _b = this.$props,
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
279
|
+
disabled = _b.disabled,
|
|
280
|
+
tabIndex = _b.tabIndex,
|
|
281
|
+
title = _b.title,
|
|
282
|
+
id = _b.id,
|
|
283
|
+
format = _b.format,
|
|
284
|
+
formatPlaceholder = _b.formatPlaceholder,
|
|
285
|
+
min = _b.min,
|
|
286
|
+
max = _b.max,
|
|
287
|
+
weekNumber = _b.weekNumber,
|
|
288
|
+
focusedDate = _b.focusedDate,
|
|
289
|
+
width = _b.width,
|
|
290
|
+
name = _b.name,
|
|
291
|
+
steps = _b.steps,
|
|
292
|
+
placeholder = _b.placeholder,
|
|
293
|
+
validationMessage = _b.validationMessage,
|
|
294
|
+
required = _b.required,
|
|
295
|
+
validityStyles = _b.validityStyles,
|
|
296
|
+
cancelButton = _b.cancelButton,
|
|
297
|
+
minTime = _b.minTime,
|
|
298
|
+
maxTime = _b.maxTime,
|
|
299
|
+
ariaLabelledBy = _b.ariaLabelledBy,
|
|
300
|
+
ariaDescribedBy = _b.ariaDescribedBy,
|
|
301
|
+
size = _b.size,
|
|
302
|
+
fillMode = _b.fillMode,
|
|
303
|
+
rounded = _b.rounded;
|
|
312
304
|
var _c = this.$props.popupSettings,
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
305
|
+
popupClass = _c.popupClass,
|
|
306
|
+
appendTo = _c.appendTo,
|
|
307
|
+
animate = _c.animate;
|
|
316
308
|
var isValid = !this.$props.validityStyles || this.validity().valid;
|
|
317
309
|
var dateInput = this.$props.dateInput ? templateRendering.call(this, this.$props.dateInput, getListeners.call(this)) : undefined;
|
|
318
|
-
var dateInputDefaultRendering =
|
|
310
|
+
var dateInputDefaultRendering =
|
|
311
|
+
// @ts-ignore function children
|
|
319
312
|
h(DateInput, {
|
|
320
313
|
ref: this.v3 ? function (el) {
|
|
321
314
|
_this.dateInputRef = el;
|
|
@@ -389,7 +382,8 @@ var DateTimePickerVue2 = {
|
|
|
389
382
|
defaultRendering: dateInputDefaultRendering
|
|
390
383
|
});
|
|
391
384
|
var calendar = this.$props.calendar ? templateRendering.call(this, this.$props.calendar, getListeners.call(this)) : undefined;
|
|
392
|
-
var dataTimeSelector =
|
|
385
|
+
var dataTimeSelector =
|
|
386
|
+
// @ts-ignore function children
|
|
393
387
|
h(DateTimeSelector, {
|
|
394
388
|
ref: 'dateTimeSelector',
|
|
395
389
|
cancelButton: cancelButton,
|
|
@@ -433,7 +427,8 @@ var DateTimePickerVue2 = {
|
|
|
433
427
|
});
|
|
434
428
|
var popupClassNames = classNames('k-datetime-container k-reset', popupClass);
|
|
435
429
|
var popup = this.$props.popup ? templateRendering.call(this, this.$props.popup, getListeners.call(this)) : undefined;
|
|
436
|
-
var popupDefaultRendering =
|
|
430
|
+
var popupDefaultRendering =
|
|
431
|
+
// @ts-ignore function children
|
|
437
432
|
h(Popup, {
|
|
438
433
|
show: this.computedShow,
|
|
439
434
|
attrs: this.v3 ? undefined : {
|
|
@@ -490,7 +485,8 @@ var DateTimePickerVue2 = {
|
|
|
490
485
|
},
|
|
491
486
|
onFocusin: this.handleFocus,
|
|
492
487
|
onFocusout: this.handleBlur
|
|
493
|
-
}, [dateInputRendering,
|
|
488
|
+
}, [dateInputRendering,
|
|
489
|
+
// @ts-ignore
|
|
494
490
|
h(Button, {
|
|
495
491
|
type: "button",
|
|
496
492
|
attrs: this.v3 ? undefined : {
|
|
@@ -516,7 +512,8 @@ var DateTimePickerVue2 = {
|
|
|
516
512
|
"aria-controls": this._popupId,
|
|
517
513
|
"aria-label": provideLocalizationService(this).toLanguageString(toggleDateTimeSelector, messages[toggleDateTimeSelector])
|
|
518
514
|
}), popupRendering]);
|
|
519
|
-
return this.$props.label ?
|
|
515
|
+
return this.$props.label ?
|
|
516
|
+
// @ts-ignore function children
|
|
520
517
|
h(FloatingLabel, {
|
|
521
518
|
label: this.$props.label,
|
|
522
519
|
attrs: this.v3 ? undefined : {
|
|
@@ -558,7 +555,6 @@ var DateTimePickerVue2 = {
|
|
|
558
555
|
},
|
|
559
556
|
focus: function focus() {
|
|
560
557
|
var dateInputElement = this.dateInputElement();
|
|
561
|
-
|
|
562
558
|
if (dateInputElement) {
|
|
563
559
|
dateInputElement.focus();
|
|
564
560
|
}
|
|
@@ -567,7 +563,6 @@ var DateTimePickerVue2 = {
|
|
|
567
563
|
if (this.computedShow === show) {
|
|
568
564
|
return;
|
|
569
565
|
}
|
|
570
|
-
|
|
571
566
|
this.currentShow = show;
|
|
572
567
|
},
|
|
573
568
|
handleReject: function handleReject() {
|
|
@@ -613,14 +608,11 @@ var DateTimePickerVue2 = {
|
|
|
613
608
|
},
|
|
614
609
|
createBlurTimeout: function createBlurTimeout() {
|
|
615
610
|
var _this = this;
|
|
616
|
-
|
|
617
611
|
var that = this;
|
|
618
612
|
this._blurTimeout = setTimeout(function () {
|
|
619
613
|
_this.isFocused = false;
|
|
620
614
|
var isInPopup = document.activeElement && document.activeElement.closest("#".concat(that._popupId));
|
|
621
|
-
|
|
622
615
|
var isElementActive = that._dateInput && canUseDOM && document.activeElement !== that._dateInput.element();
|
|
623
|
-
|
|
624
616
|
if (isElementActive && !isInPopup) {
|
|
625
617
|
that.setShow(false);
|
|
626
618
|
}
|
|
@@ -630,7 +622,6 @@ var DateTimePickerVue2 = {
|
|
|
630
622
|
if (this.$props.disabled) {
|
|
631
623
|
return;
|
|
632
624
|
}
|
|
633
|
-
|
|
634
625
|
this.shouldFocusDateInput = true;
|
|
635
626
|
this.setShow(!this.computedShow);
|
|
636
627
|
this.$emit('iconclick', event);
|
|
@@ -640,28 +631,24 @@ var DateTimePickerVue2 = {
|
|
|
640
631
|
},
|
|
641
632
|
handleKeyDown: function handleKeyDown(event) {
|
|
642
633
|
var altKey = event.altKey,
|
|
643
|
-
|
|
644
|
-
|
|
634
|
+
keyCode = event.keyCode;
|
|
645
635
|
if (keyCode === Keys.tab && this._dateInput && event.target !== this._dateInput._element) {
|
|
646
636
|
event.preventDefault();
|
|
647
637
|
this.$data.shouldFocusDateInput = true;
|
|
648
638
|
this.setShow(false);
|
|
649
639
|
return;
|
|
650
640
|
}
|
|
651
|
-
|
|
652
641
|
if (keyCode === Keys.esc) {
|
|
653
642
|
this.shouldFocusDateInput = true;
|
|
654
643
|
this.setShow(false);
|
|
655
644
|
return;
|
|
656
645
|
}
|
|
657
|
-
|
|
658
646
|
if (altKey && (keyCode === Keys.up || keyCode === Keys.down)) {
|
|
659
647
|
event.preventDefault();
|
|
660
648
|
event.stopPropagation();
|
|
661
649
|
this.shouldFocusDateInput = keyCode === Keys.up;
|
|
662
650
|
this.setShow(keyCode === Keys.down);
|
|
663
651
|
}
|
|
664
|
-
|
|
665
652
|
this.$emit('keydown', event);
|
|
666
653
|
},
|
|
667
654
|
dateInputElement: function dateInputElement() {
|
|
@@ -672,6 +659,5 @@ var DateTimePickerVue2 = {
|
|
|
672
659
|
/**
|
|
673
660
|
* @hidden
|
|
674
661
|
*/
|
|
675
|
-
|
|
676
662
|
var DateTimePicker = DateTimePickerVue2;
|
|
677
663
|
export { DateTimePicker, DateTimePickerVue2 };
|
|
@@ -18,7 +18,6 @@ import { getNow } from '../timepicker/utils';
|
|
|
18
18
|
/**
|
|
19
19
|
* @hidden
|
|
20
20
|
*/
|
|
21
|
-
|
|
22
21
|
var DateTimeSelectorVue2 = {
|
|
23
22
|
name: 'KendoDateTimeSelector',
|
|
24
23
|
props: {
|
|
@@ -110,7 +109,6 @@ var DateTimeSelectorVue2 = {
|
|
|
110
109
|
preventScroll: true
|
|
111
110
|
});
|
|
112
111
|
}
|
|
113
|
-
|
|
114
112
|
this.shouldFocusPart = false;
|
|
115
113
|
},
|
|
116
114
|
// @ts-ignore
|
|
@@ -127,17 +125,16 @@ var DateTimeSelectorVue2 = {
|
|
|
127
125
|
// @ts-ignore
|
|
128
126
|
render: function render(createElement) {
|
|
129
127
|
var _this2 = this;
|
|
130
|
-
|
|
131
128
|
var h = gh || createElement;
|
|
132
129
|
var _a = this.$props,
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
130
|
+
disabled = _a.disabled,
|
|
131
|
+
cancelButton = _a.cancelButton,
|
|
132
|
+
min = _a.min,
|
|
133
|
+
max = _a.max,
|
|
134
|
+
weekNumber = _a.weekNumber,
|
|
135
|
+
focusedDate = _a.focusedDate,
|
|
136
|
+
format = _a.format,
|
|
137
|
+
steps = _a.steps;
|
|
141
138
|
var rootClassName = classNames({
|
|
142
139
|
'k-date-tab': this.currentTab === 'date',
|
|
143
140
|
'k-time-tab': this.currentTab === 'time',
|
|
@@ -148,7 +145,8 @@ var DateTimeSelectorVue2 = {
|
|
|
148
145
|
var timeMessage = localizationService.toLanguageString(time, messages[time]);
|
|
149
146
|
var cancelMessage = localizationService.toLanguageString(cancel, messages[cancel]);
|
|
150
147
|
var setMessage = localizationService.toLanguageString(set, messages[set]);
|
|
151
|
-
var calendarDefaultRendering =
|
|
148
|
+
var calendarDefaultRendering =
|
|
149
|
+
// @ts-ignore function children
|
|
152
150
|
h(Calendar, {
|
|
153
151
|
ref: 'calendar',
|
|
154
152
|
min: min,
|
|
@@ -191,14 +189,16 @@ var DateTimeSelectorVue2 = {
|
|
|
191
189
|
}
|
|
192
190
|
}, [h("div", {
|
|
193
191
|
"class": "k-datetime-buttongroup"
|
|
194
|
-
}, [
|
|
192
|
+
}, [
|
|
193
|
+
// @ts-ignore function children
|
|
195
194
|
h(ButtonGroup, {
|
|
196
195
|
width: "100%",
|
|
197
196
|
attrs: this.v3 ? undefined : {
|
|
198
197
|
width: "100%"
|
|
199
198
|
}
|
|
200
199
|
}, this.v3 ? function () {
|
|
201
|
-
return [
|
|
200
|
+
return [
|
|
201
|
+
// @ts-ignore function children
|
|
202
202
|
h(Button, {
|
|
203
203
|
type: "button",
|
|
204
204
|
attrs: _this2.v3 ? undefined : {
|
|
@@ -214,7 +214,8 @@ var DateTimeSelectorVue2 = {
|
|
|
214
214
|
}
|
|
215
215
|
}, _this2.v3 ? function () {
|
|
216
216
|
return [dateMessage];
|
|
217
|
-
} : [dateMessage]),
|
|
217
|
+
} : [dateMessage]),
|
|
218
|
+
// @ts-ignore function children
|
|
218
219
|
h(Button, {
|
|
219
220
|
type: "button",
|
|
220
221
|
attrs: _this2.v3 ? undefined : {
|
|
@@ -268,7 +269,8 @@ var DateTimeSelectorVue2 = {
|
|
|
268
269
|
ref: 'calendarWrap'
|
|
269
270
|
}, [calendar]), h("div", {
|
|
270
271
|
"class": "k-datetime-time-wrap"
|
|
271
|
-
}, [
|
|
272
|
+
}, [
|
|
273
|
+
// @ts-ignore function children
|
|
272
274
|
h(TimePart, {
|
|
273
275
|
key: 1,
|
|
274
276
|
onNowclick: this.handleNowClick,
|
|
@@ -300,7 +302,8 @@ var DateTimeSelectorVue2 = {
|
|
|
300
302
|
onBlur: this.handleBlur
|
|
301
303
|
})])]), h("div", {
|
|
302
304
|
"class": "k-datetime-footer k-actions k-actions-stretched"
|
|
303
|
-
}, [cancelButton &&
|
|
305
|
+
}, [cancelButton &&
|
|
306
|
+
// @ts-ignore function children
|
|
304
307
|
h(Button, {
|
|
305
308
|
type: "button",
|
|
306
309
|
attrs: this.v3 ? undefined : {
|
|
@@ -318,7 +321,8 @@ var DateTimeSelectorVue2 = {
|
|
|
318
321
|
"aria-label": cancelMessage
|
|
319
322
|
}, this.v3 ? function () {
|
|
320
323
|
return [cancelMessage];
|
|
321
|
-
} : [cancelMessage]),
|
|
324
|
+
} : [cancelMessage]),
|
|
325
|
+
// @ts-ignore function children
|
|
322
326
|
h(Button, {
|
|
323
327
|
type: "button",
|
|
324
328
|
attrs: this.v3 ? undefined : {
|
|
@@ -351,14 +355,11 @@ var DateTimeSelectorVue2 = {
|
|
|
351
355
|
},
|
|
352
356
|
focus: function focus(args) {
|
|
353
357
|
var _this = this;
|
|
354
|
-
|
|
355
358
|
this.$nextTick(function () {
|
|
356
359
|
if (_this.currentTab === 'time' && _this._timePart) {
|
|
357
360
|
_this._timePart.focus(args);
|
|
358
361
|
}
|
|
359
|
-
|
|
360
362
|
var calendarElement = _this.calendarElement();
|
|
361
|
-
|
|
362
363
|
if (_this.currentTab === 'date' && calendarElement) {
|
|
363
364
|
calendarElement.focus(args);
|
|
364
365
|
}
|
|
@@ -374,7 +375,6 @@ var DateTimeSelectorVue2 = {
|
|
|
374
375
|
if (!this._acceptButton) {
|
|
375
376
|
return false;
|
|
376
377
|
}
|
|
377
|
-
|
|
378
378
|
return canUseDOM && (document.activeElement === this._acceptButton.$el || document.activeElement === this._cancelButton.$el);
|
|
379
379
|
},
|
|
380
380
|
mergeTime: function mergeTime(current, candidate) {
|
|
@@ -387,11 +387,9 @@ var DateTimeSelectorVue2 = {
|
|
|
387
387
|
if (direction === 'right' && this.currentTab === 'time') {
|
|
388
388
|
return;
|
|
389
389
|
}
|
|
390
|
-
|
|
391
390
|
if (direction === 'left' && this.currentTab === 'date') {
|
|
392
391
|
return;
|
|
393
392
|
}
|
|
394
|
-
|
|
395
393
|
var nextPart = direction === 'left' ? 'date' : 'time';
|
|
396
394
|
this.shouldFocusPart = true;
|
|
397
395
|
this.currentTab = nextPart;
|
|
@@ -411,7 +409,6 @@ var DateTimeSelectorVue2 = {
|
|
|
411
409
|
if (!this.dateValue || !this.timeValue || !this.hasDateValue) {
|
|
412
410
|
return;
|
|
413
411
|
}
|
|
414
|
-
|
|
415
412
|
var value = this.mergeDate(this.dateValue, timeOverride || this.timeValue);
|
|
416
413
|
this.$emit('change', {
|
|
417
414
|
event: event,
|
|
@@ -424,8 +421,8 @@ var DateTimeSelectorVue2 = {
|
|
|
424
421
|
this.handleAccept(event, getNow());
|
|
425
422
|
},
|
|
426
423
|
handleCalendarValueChange: function handleCalendarValueChange(event) {
|
|
427
|
-
event.event.stopPropagation();
|
|
428
|
-
|
|
424
|
+
event.event.stopPropagation();
|
|
425
|
+
// @ts-ignore
|
|
429
426
|
this.dateValue = event.value;
|
|
430
427
|
this.currentTab = 'time';
|
|
431
428
|
this.shouldFocusPart = true;
|
|
@@ -443,33 +440,26 @@ var DateTimeSelectorVue2 = {
|
|
|
443
440
|
},
|
|
444
441
|
handleKeyDown: function handleKeyDown(event) {
|
|
445
442
|
var keyCode = event.keyCode,
|
|
446
|
-
|
|
443
|
+
altKey = event.altKey;
|
|
447
444
|
this.$emit('keydown', event);
|
|
448
|
-
|
|
449
445
|
switch (keyCode) {
|
|
450
446
|
case Keys.enter:
|
|
451
447
|
if (!this.hasActiveButton() && this.hasDateValue) {
|
|
452
448
|
this.handleAccept(event);
|
|
453
449
|
}
|
|
454
|
-
|
|
455
450
|
return;
|
|
456
|
-
|
|
457
451
|
case Keys.left:
|
|
458
452
|
if (!altKey) {
|
|
459
453
|
return;
|
|
460
454
|
}
|
|
461
|
-
|
|
462
455
|
this.move('left');
|
|
463
456
|
return;
|
|
464
|
-
|
|
465
457
|
case Keys.right:
|
|
466
458
|
if (!altKey) {
|
|
467
459
|
return;
|
|
468
460
|
}
|
|
469
|
-
|
|
470
461
|
this.move('right');
|
|
471
462
|
return;
|
|
472
|
-
|
|
473
463
|
default:
|
|
474
464
|
return;
|
|
475
465
|
}
|
|
@@ -482,6 +472,5 @@ var DateTimeSelectorVue2 = {
|
|
|
482
472
|
/**
|
|
483
473
|
* @hidden
|
|
484
474
|
*/
|
|
485
|
-
|
|
486
475
|
var DateTimeSelector = DateTimeSelectorVue2;
|
|
487
476
|
export { DateTimeSelector, DateTimeSelectorVue2 };
|