@progress/kendo-react-dateinputs 7.2.4-develop.3 → 7.3.0-develop.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.
- package/calendar/components/Calendar.js +12 -0
- package/calendar/components/Calendar.mjs +328 -0
- package/calendar/components/CalendarCell.js +8 -0
- package/calendar/components/CalendarCell.mjs +101 -0
- package/calendar/components/CalendarHeaderTitle.js +8 -0
- package/calendar/components/CalendarHeaderTitle.mjs +23 -0
- package/calendar/components/CalendarNavigationItem.js +8 -0
- package/calendar/components/CalendarNavigationItem.mjs +29 -0
- package/calendar/components/CalendarWeekCell.js +8 -0
- package/calendar/components/CalendarWeekCell.mjs +23 -0
- package/calendar/components/Header.js +8 -0
- package/calendar/components/Header.mjs +78 -0
- package/calendar/components/HorizontalViewList.js +8 -0
- package/calendar/components/HorizontalViewList.mjs +120 -0
- package/calendar/components/MultiViewCalendar.js +8 -0
- package/calendar/components/MultiViewCalendar.mjs +428 -0
- package/calendar/components/Navigation.js +8 -0
- package/calendar/components/Navigation.mjs +117 -0
- package/calendar/components/TodayCommand.js +8 -0
- package/calendar/components/TodayCommand.mjs +74 -0
- package/calendar/components/View.js +8 -0
- package/calendar/components/View.mjs +153 -0
- package/calendar/components/ViewList.js +8 -0
- package/calendar/components/ViewList.mjs +228 -0
- package/calendar/models/CalendarViewEnum.js +8 -0
- package/calendar/models/CalendarViewEnum.mjs +12 -0
- package/calendar/models/NavigationAction.js +8 -0
- package/calendar/models/NavigationAction.mjs +12 -0
- package/calendar/models/SelectionRange.js +8 -0
- package/calendar/models/SelectionRange.mjs +12 -0
- package/calendar/services/BusViewService.js +8 -0
- package/calendar/services/BusViewService.mjs +58 -0
- package/calendar/services/CenturyViewService.js +8 -0
- package/calendar/services/CenturyViewService.mjs +126 -0
- package/calendar/services/DOMService.js +14 -0
- package/calendar/services/DOMService.mjs +124 -0
- package/calendar/services/DecadeViewService.js +8 -0
- package/calendar/services/DecadeViewService.mjs +126 -0
- package/calendar/services/MonthViewService.js +8 -0
- package/calendar/services/MonthViewService.mjs +139 -0
- package/calendar/services/NavigationService.js +8 -0
- package/calendar/services/NavigationService.mjs +36 -0
- package/calendar/services/ScrollSyncService.js +8 -0
- package/calendar/services/ScrollSyncService.mjs +50 -0
- package/calendar/services/WeekNamesService.js +8 -0
- package/calendar/services/WeekNamesService.mjs +24 -0
- package/calendar/services/YearViewService.js +8 -0
- package/calendar/services/YearViewService.mjs +135 -0
- package/common/AdaptiveMode.js +8 -0
- package/common/AdaptiveMode.mjs +73 -0
- package/common/PickerWrap.js +8 -0
- package/common/PickerWrap.mjs +32 -0
- package/common/constants.js +8 -0
- package/common/constants.mjs +12 -0
- package/dateinput/DateInput.js +8 -0
- package/dateinput/DateInput.mjs +503 -0
- package/dateinput/models/kendo-date.js +8 -0
- package/dateinput/models/kendo-date.mjs +233 -0
- package/dateinput/models/mask.js +8 -0
- package/dateinput/models/mask.mjs +16 -0
- package/dateinput/utils.js +8 -0
- package/dateinput/utils.mjs +38 -0
- package/datepicker/DatePicker.js +8 -0
- package/datepicker/DatePicker.mjs +462 -0
- package/datepicker/ToggleButton.js +8 -0
- package/datepicker/ToggleButton.mjs +13 -0
- package/daterangepicker/DateRangePicker.js +8 -0
- package/daterangepicker/DateRangePicker.mjs +426 -0
- package/datetimepicker/DateTimePicker.js +8 -0
- package/datetimepicker/DateTimePicker.mjs +475 -0
- package/datetimepicker/DateTimeSelector.js +8 -0
- package/datetimepicker/DateTimeSelector.mjs +275 -0
- package/dist/cdn/js/kendo-react-dateinputs.js +8 -21
- package/hooks/usePickerFloatingLabel.js +8 -0
- package/hooks/usePickerFloatingLabel.mjs +31 -0
- package/index.d.mts +4528 -5
- package/index.d.ts +4528 -39
- package/index.js +8 -21
- package/index.mjs +114 -6540
- package/messages/index.js +8 -0
- package/messages/index.mjs +59 -0
- package/package-metadata.js +8 -0
- package/package-metadata.mjs +19 -0
- package/package.json +7 -7
- package/timepicker/TimeList.js +14 -0
- package/timepicker/TimeList.mjs +230 -0
- package/timepicker/TimePart.js +8 -0
- package/timepicker/TimePart.mjs +267 -0
- package/timepicker/TimePicker.js +8 -0
- package/timepicker/TimePicker.mjs +479 -0
- package/timepicker/TimeSelector.js +8 -0
- package/timepicker/TimeSelector.mjs +250 -0
- package/timepicker/models/TimePart.js +8 -0
- package/timepicker/models/TimePart.mjs +18 -0
- package/timepicker/services/DOMService.js +8 -0
- package/timepicker/services/DOMService.mjs +34 -0
- package/timepicker/services/DayPeriodService.js +8 -0
- package/timepicker/services/DayPeriodService.mjs +89 -0
- package/timepicker/services/HoursService.js +8 -0
- package/timepicker/services/HoursService.mjs +92 -0
- package/timepicker/services/MinutesService.js +8 -0
- package/timepicker/services/MinutesService.mjs +91 -0
- package/timepicker/services/SecondsService.js +8 -0
- package/timepicker/services/SecondsService.mjs +91 -0
- package/timepicker/utils.js +8 -0
- package/timepicker/utils.mjs +91 -0
- package/utils.js +8 -0
- package/utils.mjs +111 -0
- package/virtualization/Virtualization.js +8 -0
- package/virtualization/Virtualization.mjs +204 -0
- package/virtualization/services/RowHeightService.js +8 -0
- package/virtualization/services/RowHeightService.mjs +50 -0
- package/virtualization/services/ScrollerService.js +8 -0
- package/virtualization/services/ScrollerService.mjs +52 -0
- package/PopupSettings.d.ts +0 -18
- package/calendar/components/Calendar.d.ts +0 -191
- package/calendar/components/CalendarCell.d.ts +0 -39
- package/calendar/components/CalendarHeaderTitle.d.ts +0 -32
- package/calendar/components/CalendarNavigationItem.d.ts +0 -31
- package/calendar/components/CalendarWeekCell.d.ts +0 -29
- package/calendar/components/Header.d.ts +0 -58
- package/calendar/components/HorizontalViewList.d.ts +0 -71
- package/calendar/components/MultiViewCalendar.d.ts +0 -212
- package/calendar/components/Navigation.d.ts +0 -80
- package/calendar/components/TodayCommand.d.ts +0 -35
- package/calendar/components/View.d.ts +0 -89
- package/calendar/components/ViewList.d.ts +0 -115
- package/calendar/models/ActiveView.d.ts +0 -8
- package/calendar/models/CalendarSettings.d.ts +0 -106
- package/calendar/models/CalendarViewEnum.d.ts +0 -13
- package/calendar/models/CellContext.d.ts +0 -23
- package/calendar/models/MultiViewCalendarMode.d.ts +0 -13
- package/calendar/models/MultiViewCalendarSettings.d.ts +0 -115
- package/calendar/models/NavigationAction.d.ts +0 -19
- package/calendar/models/SelectionRange.d.ts +0 -21
- package/calendar/models/SelectionRangeEnd.d.ts +0 -8
- package/calendar/models/ViewService.d.ts +0 -29
- package/calendar/models/index.d.ts +0 -15
- package/calendar/services/BusViewService.d.ts +0 -25
- package/calendar/services/CenturyViewService.d.ts +0 -29
- package/calendar/services/DOMService.d.ts +0 -33
- package/calendar/services/DecadeViewService.d.ts +0 -31
- package/calendar/services/MonthViewService.d.ts +0 -37
- package/calendar/services/NavigationService.d.ts +0 -18
- package/calendar/services/ScrollSyncService.d.ts +0 -25
- package/calendar/services/WeekNamesService.d.ts +0 -13
- package/calendar/services/YearViewService.d.ts +0 -35
- package/calendar/services/index.d.ts +0 -14
- package/common/AdaptiveMode.d.ts +0 -25
- package/common/PickerWrap.d.ts +0 -22
- package/common/constants.d.ts +0 -8
- package/dateinput/DateInput.d.ts +0 -355
- package/dateinput/models/DateInputSettings.d.ts +0 -103
- package/dateinput/models/format-placeholder.d.ts +0 -43
- package/dateinput/models/incremental-steps.d.ts +0 -15
- package/dateinput/models/index.d.ts +0 -11
- package/dateinput/models/kendo-date.d.ts +0 -57
- package/dateinput/models/mask.d.ts +0 -11
- package/dateinput/models/selection.d.ts +0 -11
- package/dateinput/utils.d.ts +0 -34
- package/datepicker/DatePicker.d.ts +0 -358
- package/datepicker/ToggleButton.d.ts +0 -14
- package/datepicker/models/DatePickerSettings.d.ts +0 -141
- package/datepicker/models/index.d.ts +0 -6
- package/daterangepicker/DateRangePicker.d.ts +0 -354
- package/daterangepicker/models/DateRangePickerCalendarSettings.d.ts +0 -10
- package/daterangepicker/models/DateRangePickerDateInputSettings.d.ts +0 -10
- package/daterangepicker/models/DateRangePickerPopupSettings.d.ts +0 -10
- package/daterangepicker/models/DateRangePickerSettings.d.ts +0 -126
- package/daterangepicker/models/index.d.ts +0 -9
- package/datetimepicker/DateTimePicker.d.ts +0 -342
- package/datetimepicker/DateTimeSelector.d.ts +0 -106
- package/datetimepicker/models/DateTimePickerSettings.d.ts +0 -144
- package/datetimepicker/models/index.d.ts +0 -6
- package/hooks/usePickerFloatingLabel.d.ts +0 -24
- package/messages/index.d.ts +0 -124
- package/package-metadata.d.ts +0 -9
- package/timepicker/TimeList.d.ts +0 -91
- package/timepicker/TimePart.d.ts +0 -141
- package/timepicker/TimePicker.d.ts +0 -355
- package/timepicker/TimeSelector.d.ts +0 -144
- package/timepicker/models/IncrementalSteps.d.ts +0 -12
- package/timepicker/models/ListItem.d.ts +0 -11
- package/timepicker/models/ListService.d.ts +0 -19
- package/timepicker/models/ListServiceSettings.d.ts +0 -16
- package/timepicker/models/TimePart.d.ts +0 -14
- package/timepicker/models/TimePickerSettings.d.ts +0 -133
- package/timepicker/models/index.d.ts +0 -11
- package/timepicker/services/DOMService.d.ts +0 -14
- package/timepicker/services/DayPeriodService.d.ts +0 -51
- package/timepicker/services/HoursService.d.ts +0 -37
- package/timepicker/services/MinutesService.d.ts +0 -36
- package/timepicker/services/SecondsService.d.ts +0 -36
- package/timepicker/services/index.d.ts +0 -10
- package/timepicker/utils.d.ts +0 -60
- package/utils.d.ts +0 -100
- package/virtualization/Virtualization.d.ts +0 -120
- package/virtualization/services/RowHeightService.d.ts +0 -22
- package/virtualization/services/ScrollerService.d.ts +0 -53
- package/virtualization/services/index.d.ts +0 -7
|
@@ -0,0 +1,479 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2024 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
"use client";
|
|
9
|
+
import * as a from "react";
|
|
10
|
+
import e from "prop-types";
|
|
11
|
+
import { Popup as q } from "@progress/kendo-react-popup";
|
|
12
|
+
import { cloneDate as f } from "@progress/kendo-date-math";
|
|
13
|
+
import { classNames as v, Keys as d, validatePackage as _, canUseDOM as w, AsyncFocusBlur as K, kendoThemeMaps as b, createPropsContext as U, withIdHOC as j, withPropsContext as H } from "@progress/kendo-react-common";
|
|
14
|
+
import { clockIcon as $ } from "@progress/kendo-svg-icons";
|
|
15
|
+
import { provideLocalizationService as W, registerForLocalization as G } from "@progress/kendo-react-intl";
|
|
16
|
+
import { packageMetadata as X } from "../package-metadata.mjs";
|
|
17
|
+
import { toggleClock as m, messages as u, timePickerCancel as Z, timePickerSet as S, toggleTimeSelector as y } from "../messages/index.mjs";
|
|
18
|
+
import { DateInput as J } from "../dateinput/DateInput.mjs";
|
|
19
|
+
import { TimeSelector as Q } from "./TimeSelector.mjs";
|
|
20
|
+
import { MAX_TIME as Y, MIN_TIME as ee, setTime as I, MIDNIGHT_DATE as te } from "../utils.mjs";
|
|
21
|
+
import { isInRange as ie, isBiggerThanMax as se, isSmallerThanMin as oe } from "./utils.mjs";
|
|
22
|
+
import { PickerFloatingLabel as ne } from "../hooks/usePickerFloatingLabel.mjs";
|
|
23
|
+
import { Button as ae } from "@progress/kendo-react-buttons";
|
|
24
|
+
import { MOBILE_MEDIUM_DEVISE as re } from "../common/constants.mjs";
|
|
25
|
+
import { AdaptiveMode as le } from "../common/AdaptiveMode.mjs";
|
|
26
|
+
import { ActionSheetContent as he } from "@progress/kendo-react-layout";
|
|
27
|
+
const n = class n extends a.Component {
|
|
28
|
+
constructor(i) {
|
|
29
|
+
super(i), this._element = null, this._dateInput = a.createRef(), this._timeSelector = null, this.shouldFocusDateInput = !1, this.prevShow = !1, this.focus = () => {
|
|
30
|
+
this.dateInput && this.dateInput.focus();
|
|
31
|
+
}, this.renderTimeSelector = () => {
|
|
32
|
+
const { smoothScroll: t, cancelButton: s, nowButton: o, disabled: r, format: h, steps: l } = this.props;
|
|
33
|
+
return /* @__PURE__ */ a.createElement(
|
|
34
|
+
Q,
|
|
35
|
+
{
|
|
36
|
+
ref: this.setTimeSelectorRef,
|
|
37
|
+
className: this.mobileMode ? "k-reset k-timeselector-lg" : "",
|
|
38
|
+
mobileMode: this.mobileMode,
|
|
39
|
+
show: this.show,
|
|
40
|
+
cancelButton: s,
|
|
41
|
+
disabled: r,
|
|
42
|
+
nowButton: o,
|
|
43
|
+
format: h,
|
|
44
|
+
min: this.min,
|
|
45
|
+
max: this.max,
|
|
46
|
+
steps: l,
|
|
47
|
+
smoothScroll: t,
|
|
48
|
+
value: this.value,
|
|
49
|
+
footer: !this.mobileMode,
|
|
50
|
+
handleTimeChange: this.mobileMode && this.handleTimeChange,
|
|
51
|
+
onChange: this.handleValueChange,
|
|
52
|
+
onReject: this.handleValueReject
|
|
53
|
+
}
|
|
54
|
+
);
|
|
55
|
+
}, this.renderPopup = () => {
|
|
56
|
+
const { popupClass: t, ...s } = this.popupSettings, o = v(
|
|
57
|
+
"k-group k-reset",
|
|
58
|
+
t
|
|
59
|
+
), r = {
|
|
60
|
+
popupClass: "k-timepicker-popup",
|
|
61
|
+
show: this.show,
|
|
62
|
+
animate: this.element !== null,
|
|
63
|
+
anchor: this.element,
|
|
64
|
+
className: o,
|
|
65
|
+
id: this._popupId,
|
|
66
|
+
anchorAlign: {
|
|
67
|
+
horizontal: "left",
|
|
68
|
+
vertical: "bottom"
|
|
69
|
+
},
|
|
70
|
+
popupAlign: {
|
|
71
|
+
horizontal: "left",
|
|
72
|
+
vertical: "top"
|
|
73
|
+
},
|
|
74
|
+
...s
|
|
75
|
+
};
|
|
76
|
+
return this.props.popup ? /* @__PURE__ */ a.createElement(this.props.popup, { ...r }, this.renderTimeSelector()) : /* @__PURE__ */ a.createElement(q, { ...r }, this.renderTimeSelector());
|
|
77
|
+
}, this.renderAdaptivePopup = () => {
|
|
78
|
+
const { windowWidth: t = 0 } = this.state, s = {
|
|
79
|
+
expand: this.show,
|
|
80
|
+
onClose: this.handleBlur,
|
|
81
|
+
adaptiveTitle: this.props.adaptiveTitle,
|
|
82
|
+
windowWidth: t,
|
|
83
|
+
footer: {
|
|
84
|
+
cancelText: this.localizationService.toLanguageString(m, u[Z]),
|
|
85
|
+
onCancel: this.handleValueReject,
|
|
86
|
+
applyText: this.localizationService.toLanguageString(S, u[S]),
|
|
87
|
+
onApply: (o) => this.handleValueChange(o)
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
return /* @__PURE__ */ a.createElement(le, { ...s }, /* @__PURE__ */ a.createElement(he, { className: "!k-overflow-hidden" }, this.renderTimeSelector()));
|
|
91
|
+
}, this.setTimeSelectorRef = (t) => {
|
|
92
|
+
this._timeSelector = t;
|
|
93
|
+
}, this.nextValue = (t, s) => t.value !== void 0 ? t.value : s.value, this.nextShow = (t, s) => t.show !== void 0 ? t.show : s.show, this.handleInputValueChange = (t) => {
|
|
94
|
+
const s = this.mergeTime(t.value);
|
|
95
|
+
this.handleValueChange({ ...t, value: s });
|
|
96
|
+
}, this.handleTimeChange = (t) => {
|
|
97
|
+
this.setState({ candidate: t.time });
|
|
98
|
+
}, this.handleValueChange = (t) => {
|
|
99
|
+
this.setState({
|
|
100
|
+
value: f(t.value || this.state.candidate)
|
|
101
|
+
}), this.valueDuringOnChange = t.value, this.showDuringOnChange = !1, this.shouldFocusDateInput = !0;
|
|
102
|
+
const { onChange: s } = this.props, o = this.value || this.state.candidate;
|
|
103
|
+
s && s.call(void 0, {
|
|
104
|
+
syntheticEvent: t.syntheticEvent,
|
|
105
|
+
nativeEvent: t.nativeEvent,
|
|
106
|
+
value: o,
|
|
107
|
+
show: this.show,
|
|
108
|
+
target: this
|
|
109
|
+
}), this.valueDuringOnChange = void 0, this.showDuringOnChange = void 0, this.setShow(!1);
|
|
110
|
+
}, this.handleFocus = () => {
|
|
111
|
+
this.setState({ focused: !0 });
|
|
112
|
+
}, this.handleBlur = () => {
|
|
113
|
+
this.setState({ focused: !1 }), this.setShow(!1);
|
|
114
|
+
}, this.handleValueReject = (t) => {
|
|
115
|
+
this.setShow(!1);
|
|
116
|
+
}, this.handleIconClick = (t) => {
|
|
117
|
+
this.props.disabled || (this.shouldFocusDateInput = !0, this.setShow(!this.show));
|
|
118
|
+
}, this.handleIconMouseDown = (t) => {
|
|
119
|
+
t.preventDefault();
|
|
120
|
+
}, this.handleKeyDown = (t) => {
|
|
121
|
+
const { altKey: s, keyCode: o } = t;
|
|
122
|
+
if (o === d.esc) {
|
|
123
|
+
this.shouldFocusDateInput = !0, this.setShow(!1);
|
|
124
|
+
return;
|
|
125
|
+
}
|
|
126
|
+
s && (o === d.up || o === d.down) && (t.preventDefault(), t.stopPropagation(), this.shouldFocusDateInput = o === d.up, this.setShow(o === d.down));
|
|
127
|
+
}, _(X), this.state = {
|
|
128
|
+
value: this.props.defaultValue || n.defaultProps.defaultValue,
|
|
129
|
+
show: this.props.defaultShow || n.defaultProps.defaultShow,
|
|
130
|
+
focused: !1,
|
|
131
|
+
candidate: null
|
|
132
|
+
}, this.normalizeTime = this.normalizeTime.bind(this), this.setShow = this.setShow.bind(this), this.mergeTime = this.mergeTime.bind(this);
|
|
133
|
+
}
|
|
134
|
+
get _popupId() {
|
|
135
|
+
return this.props.id + "-popup-id";
|
|
136
|
+
}
|
|
137
|
+
get document() {
|
|
138
|
+
if (w)
|
|
139
|
+
return this.element && this.element.ownerDocument || document;
|
|
140
|
+
}
|
|
141
|
+
/**
|
|
142
|
+
* Gets the wrapping element of the TimePicker.
|
|
143
|
+
*/
|
|
144
|
+
get element() {
|
|
145
|
+
return this._element;
|
|
146
|
+
}
|
|
147
|
+
/**
|
|
148
|
+
* Gets the DateInput component inside the TimePicker component.
|
|
149
|
+
*/
|
|
150
|
+
get dateInput() {
|
|
151
|
+
return this._dateInput.current;
|
|
152
|
+
}
|
|
153
|
+
/**
|
|
154
|
+
* Gets the TimeSelector component inside the TimePicker component.
|
|
155
|
+
*/
|
|
156
|
+
get timeSelector() {
|
|
157
|
+
return this._timeSelector;
|
|
158
|
+
}
|
|
159
|
+
/**
|
|
160
|
+
* Gets the value of the TimePicker.
|
|
161
|
+
*/
|
|
162
|
+
get value() {
|
|
163
|
+
const i = this.valueDuringOnChange !== void 0 ? this.valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value;
|
|
164
|
+
return i !== null ? f(i) : null;
|
|
165
|
+
}
|
|
166
|
+
/**
|
|
167
|
+
* Gets the popup state of the TimeSelector.
|
|
168
|
+
*/
|
|
169
|
+
get show() {
|
|
170
|
+
return this.showDuringOnChange !== void 0 ? this.showDuringOnChange : this.props.show !== void 0 ? this.props.show : this.state.show;
|
|
171
|
+
}
|
|
172
|
+
/**
|
|
173
|
+
* Gets the `name` property of the TimePicker.
|
|
174
|
+
*/
|
|
175
|
+
get name() {
|
|
176
|
+
return this.props.name;
|
|
177
|
+
}
|
|
178
|
+
/**
|
|
179
|
+
* Represents the validity state into which the TimePicker is set.
|
|
180
|
+
*/
|
|
181
|
+
get validity() {
|
|
182
|
+
const i = this.value && this.normalizeTime(this.value), t = this.normalizeTime(this.min), s = this.normalizeTime(this.max), o = ie(i, t, s), r = this.props.validationMessage !== void 0, h = (!this.required || this.value !== null) && o, l = this.props.valid !== void 0 ? this.props.valid : h;
|
|
183
|
+
return {
|
|
184
|
+
customError: r,
|
|
185
|
+
rangeOverflow: se(i, s),
|
|
186
|
+
rangeUnderflow: oe(i, t),
|
|
187
|
+
valid: l,
|
|
188
|
+
valueMissing: this.value === null
|
|
189
|
+
};
|
|
190
|
+
}
|
|
191
|
+
/**
|
|
192
|
+
* The mobile mode of the ComboBox.
|
|
193
|
+
*/
|
|
194
|
+
get mobileMode() {
|
|
195
|
+
return !!(this.state.windowWidth && this.state.windowWidth <= re && this.props.adaptive);
|
|
196
|
+
}
|
|
197
|
+
/**
|
|
198
|
+
* @hidden
|
|
199
|
+
*/
|
|
200
|
+
get validityStyles() {
|
|
201
|
+
return this.props.validityStyles !== void 0 ? this.props.validityStyles : n.defaultProps.validityStyles;
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* @hidden
|
|
205
|
+
*/
|
|
206
|
+
get required() {
|
|
207
|
+
return this.props.required !== void 0 ? this.props.required : n.defaultProps.required;
|
|
208
|
+
}
|
|
209
|
+
get popupSettings() {
|
|
210
|
+
return this.props.popupSettings || n.defaultProps.popupSettings;
|
|
211
|
+
}
|
|
212
|
+
get min() {
|
|
213
|
+
return this.props.min !== void 0 ? this.props.min : n.defaultProps.min;
|
|
214
|
+
}
|
|
215
|
+
get max() {
|
|
216
|
+
return this.props.max !== void 0 ? this.props.max : n.defaultProps.max;
|
|
217
|
+
}
|
|
218
|
+
get dateInputComp() {
|
|
219
|
+
return this.props.dateInput || n.defaultProps.dateInput;
|
|
220
|
+
}
|
|
221
|
+
get localizationService() {
|
|
222
|
+
return W(this);
|
|
223
|
+
}
|
|
224
|
+
/**
|
|
225
|
+
* @hidden
|
|
226
|
+
*/
|
|
227
|
+
componentDidMount() {
|
|
228
|
+
var i;
|
|
229
|
+
this.observerResize = w && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.show && this.forceUpdate(), (i = this.document) != null && i.body && this.observerResize && this.observerResize.observe(this.document.body);
|
|
230
|
+
}
|
|
231
|
+
/**
|
|
232
|
+
* @hidden
|
|
233
|
+
*/
|
|
234
|
+
componentDidUpdate() {
|
|
235
|
+
this._timeSelector && this.show && !this.prevShow ? this._timeSelector.focusActiveList() : this.dateInput && this.dateInput.element && !this.show && this.shouldFocusDateInput && this.dateInput.element.focus({ preventScroll: !0 }), this.prevShow = this.show, this.shouldFocusDateInput = !1;
|
|
236
|
+
}
|
|
237
|
+
/**
|
|
238
|
+
* @hidden
|
|
239
|
+
*/
|
|
240
|
+
componentWillUnmount() {
|
|
241
|
+
var i;
|
|
242
|
+
(i = this.document) != null && i.body && this.observerResize && this.observerResize.disconnect();
|
|
243
|
+
}
|
|
244
|
+
/**
|
|
245
|
+
* @hidden
|
|
246
|
+
*/
|
|
247
|
+
render() {
|
|
248
|
+
const {
|
|
249
|
+
size: i = n.defaultProps.size,
|
|
250
|
+
rounded: t = n.defaultProps.rounded,
|
|
251
|
+
fillMode: s = n.defaultProps.fillMode,
|
|
252
|
+
disabled: o,
|
|
253
|
+
tabIndex: r,
|
|
254
|
+
title: h,
|
|
255
|
+
id: l,
|
|
256
|
+
className: M,
|
|
257
|
+
format: T,
|
|
258
|
+
formatPlaceholder: C,
|
|
259
|
+
width: D,
|
|
260
|
+
name: O,
|
|
261
|
+
steps: k,
|
|
262
|
+
validationMessage: P,
|
|
263
|
+
required: z,
|
|
264
|
+
validityStyles: x,
|
|
265
|
+
ariaLabelledBy: E,
|
|
266
|
+
ariaDescribedBy: R
|
|
267
|
+
} = this.props, c = !this.validityStyles || this.validity.valid, B = {
|
|
268
|
+
disabled: o,
|
|
269
|
+
format: T,
|
|
270
|
+
formatPlaceholder: C,
|
|
271
|
+
id: l,
|
|
272
|
+
ariaLabelledBy: E,
|
|
273
|
+
ariaDescribedBy: R,
|
|
274
|
+
max: this.normalizeTime(this.max),
|
|
275
|
+
min: this.normalizeTime(this.min),
|
|
276
|
+
name: O,
|
|
277
|
+
onChange: this.handleInputValueChange,
|
|
278
|
+
required: z,
|
|
279
|
+
steps: k,
|
|
280
|
+
tabIndex: this.show ? -1 : r,
|
|
281
|
+
title: h,
|
|
282
|
+
valid: this.validity.valid,
|
|
283
|
+
validationMessage: P,
|
|
284
|
+
validityStyles: x,
|
|
285
|
+
value: this.value && this.normalizeTime(this.value),
|
|
286
|
+
label: void 0,
|
|
287
|
+
placeholder: this.state.focused ? null : this.props.placeholder,
|
|
288
|
+
ariaHasPopup: "dialog",
|
|
289
|
+
ariaExpanded: this.show,
|
|
290
|
+
size: null,
|
|
291
|
+
fillMode: null,
|
|
292
|
+
rounded: null,
|
|
293
|
+
readonly: this.mobileMode
|
|
294
|
+
}, V = this.localizationService.toLanguageString(m, u[m]), F = this.localizationService.toLanguageString(y, u[y]), g = /* @__PURE__ */ a.createElement(
|
|
295
|
+
K,
|
|
296
|
+
{
|
|
297
|
+
onFocus: this.handleFocus,
|
|
298
|
+
onBlur: this.mobileMode ? void 0 : this.handleBlur,
|
|
299
|
+
onSyncBlur: this.props.onBlur,
|
|
300
|
+
onSyncFocus: this.props.onFocus
|
|
301
|
+
},
|
|
302
|
+
({ onFocus: N, onBlur: A }) => /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(
|
|
303
|
+
"div",
|
|
304
|
+
{
|
|
305
|
+
id: this.props.id,
|
|
306
|
+
ref: (L) => {
|
|
307
|
+
this._element = L;
|
|
308
|
+
},
|
|
309
|
+
className: v(
|
|
310
|
+
"k-input",
|
|
311
|
+
"k-timepicker",
|
|
312
|
+
{
|
|
313
|
+
[`k-input-${b.sizeMap[i] || i}`]: i,
|
|
314
|
+
[`k-rounded-${b.roundedMap[t] || t}`]: t,
|
|
315
|
+
[`k-input-${s}`]: s,
|
|
316
|
+
"k-invalid": !c,
|
|
317
|
+
"k-required": this.required,
|
|
318
|
+
"k-disabled": this.props.disabled
|
|
319
|
+
},
|
|
320
|
+
M
|
|
321
|
+
),
|
|
322
|
+
onKeyDown: this.handleKeyDown,
|
|
323
|
+
style: { width: D },
|
|
324
|
+
onFocus: N,
|
|
325
|
+
onBlur: A,
|
|
326
|
+
onClick: this.mobileMode ? this.handleIconClick : void 0
|
|
327
|
+
},
|
|
328
|
+
/* @__PURE__ */ a.createElement(
|
|
329
|
+
this.dateInputComp,
|
|
330
|
+
{
|
|
331
|
+
_ref: this._dateInput,
|
|
332
|
+
ariaRole: "combobox",
|
|
333
|
+
ariaControls: this._popupId,
|
|
334
|
+
...B
|
|
335
|
+
}
|
|
336
|
+
),
|
|
337
|
+
/* @__PURE__ */ a.createElement(
|
|
338
|
+
ae,
|
|
339
|
+
{
|
|
340
|
+
tabIndex: -1,
|
|
341
|
+
type: "button",
|
|
342
|
+
icon: "clock",
|
|
343
|
+
svgIcon: $,
|
|
344
|
+
onMouseDown: this.handleIconMouseDown,
|
|
345
|
+
onClick: this.mobileMode ? void 0 : this.handleIconClick,
|
|
346
|
+
title: F,
|
|
347
|
+
className: "k-input-button",
|
|
348
|
+
rounded: null,
|
|
349
|
+
"aria-label": V
|
|
350
|
+
}
|
|
351
|
+
),
|
|
352
|
+
!this.mobileMode && this.renderPopup()
|
|
353
|
+
), this.mobileMode && this.renderAdaptivePopup())
|
|
354
|
+
);
|
|
355
|
+
return this.props.label ? /* @__PURE__ */ a.createElement(
|
|
356
|
+
ne,
|
|
357
|
+
{
|
|
358
|
+
dateInput: this._dateInput,
|
|
359
|
+
label: this.props.label,
|
|
360
|
+
editorId: l,
|
|
361
|
+
editorValid: c,
|
|
362
|
+
editorDisabled: this.props.disabled,
|
|
363
|
+
children: g,
|
|
364
|
+
style: { width: this.props.width }
|
|
365
|
+
}
|
|
366
|
+
) : g;
|
|
367
|
+
}
|
|
368
|
+
normalizeTime(i) {
|
|
369
|
+
return I(te, i);
|
|
370
|
+
}
|
|
371
|
+
setShow(i) {
|
|
372
|
+
const { onOpen: t, onClose: s } = this.props;
|
|
373
|
+
this.show !== i && (this.setState({ show: i }), i && t && t.call(void 0, {
|
|
374
|
+
target: this
|
|
375
|
+
}), !i && s && s.call(void 0, {
|
|
376
|
+
target: this
|
|
377
|
+
}));
|
|
378
|
+
}
|
|
379
|
+
mergeTime(i) {
|
|
380
|
+
return this.value && i ? I(this.value, i) : i;
|
|
381
|
+
}
|
|
382
|
+
calculateMedia(i) {
|
|
383
|
+
for (let t of i)
|
|
384
|
+
this.setState({ windowWidth: t.target.clientWidth });
|
|
385
|
+
}
|
|
386
|
+
};
|
|
387
|
+
n.displayName = "TimePicker", n.propTypes = {
|
|
388
|
+
className: e.string,
|
|
389
|
+
cancelButton: e.bool,
|
|
390
|
+
nowButton: e.bool,
|
|
391
|
+
defaultShow: e.bool,
|
|
392
|
+
defaultValue: e.instanceOf(Date),
|
|
393
|
+
disabled: e.bool,
|
|
394
|
+
format: e.oneOfType([
|
|
395
|
+
e.string,
|
|
396
|
+
e.shape({
|
|
397
|
+
skeleton: e.string,
|
|
398
|
+
pattern: e.string,
|
|
399
|
+
date: e.oneOf(["short", "medium", "long", "full"]),
|
|
400
|
+
time: e.oneOf(["short", "medium", "long", "full"]),
|
|
401
|
+
datetime: e.oneOf(["short", "medium", "long", "full"]),
|
|
402
|
+
era: e.oneOf(["narrow", "short", "long"]),
|
|
403
|
+
year: e.oneOf(["numeric", "2-digit"]),
|
|
404
|
+
month: e.oneOf(["numeric", "2-digit", "narrow", "short", "long"]),
|
|
405
|
+
day: e.oneOf(["numeric", "2-digit"]),
|
|
406
|
+
weekday: e.oneOf(["narrow", "short", "long"]),
|
|
407
|
+
hour: e.oneOf(["numeric", "2-digit"]),
|
|
408
|
+
hour12: e.bool,
|
|
409
|
+
minute: e.oneOf(["numeric", "2-digit"]),
|
|
410
|
+
second: e.oneOf(["numeric", "2-digit"]),
|
|
411
|
+
timeZoneName: e.oneOf(["short", "long"])
|
|
412
|
+
})
|
|
413
|
+
]),
|
|
414
|
+
formatPlaceholder: e.oneOfType([
|
|
415
|
+
e.oneOf(["wide", "narrow", "short", "formatPattern"]),
|
|
416
|
+
e.shape({
|
|
417
|
+
year: e.string,
|
|
418
|
+
month: e.string,
|
|
419
|
+
day: e.string,
|
|
420
|
+
hour: e.string,
|
|
421
|
+
minute: e.string,
|
|
422
|
+
second: e.string
|
|
423
|
+
})
|
|
424
|
+
]),
|
|
425
|
+
id: e.string,
|
|
426
|
+
ariaLabelledBy: e.string,
|
|
427
|
+
ariaDescribedBy: e.string,
|
|
428
|
+
min: e.instanceOf(Date),
|
|
429
|
+
max: e.instanceOf(Date),
|
|
430
|
+
name: e.string,
|
|
431
|
+
popupSettings: e.shape({
|
|
432
|
+
animate: e.bool,
|
|
433
|
+
appendTo: e.any,
|
|
434
|
+
popupClass: e.string
|
|
435
|
+
}),
|
|
436
|
+
show: e.bool,
|
|
437
|
+
steps: e.shape({
|
|
438
|
+
hour: e.number,
|
|
439
|
+
minute: e.number,
|
|
440
|
+
second: e.number
|
|
441
|
+
}),
|
|
442
|
+
smoothScroll: e.bool,
|
|
443
|
+
tabIndex: e.number,
|
|
444
|
+
title: e.string,
|
|
445
|
+
value: e.instanceOf(Date),
|
|
446
|
+
width: e.oneOfType([e.number, e.string]),
|
|
447
|
+
validationMessage: e.string,
|
|
448
|
+
required: e.bool,
|
|
449
|
+
validate: e.bool,
|
|
450
|
+
valid: e.bool,
|
|
451
|
+
size: e.oneOf([null, "small", "medium", "large"]),
|
|
452
|
+
rounded: e.oneOf([null, "small", "medium", "large", "full"]),
|
|
453
|
+
fillMode: e.oneOf([null, "solid", "flat", "outline"])
|
|
454
|
+
}, n.defaultProps = {
|
|
455
|
+
defaultShow: !1,
|
|
456
|
+
defaultValue: null,
|
|
457
|
+
disabled: !1,
|
|
458
|
+
format: "t",
|
|
459
|
+
max: Y,
|
|
460
|
+
min: ee,
|
|
461
|
+
popupSettings: {},
|
|
462
|
+
tabIndex: 0,
|
|
463
|
+
steps: {},
|
|
464
|
+
required: !1,
|
|
465
|
+
validityStyles: !0,
|
|
466
|
+
dateInput: J,
|
|
467
|
+
size: "medium",
|
|
468
|
+
rounded: "medium",
|
|
469
|
+
fillMode: "solid"
|
|
470
|
+
};
|
|
471
|
+
let p = n;
|
|
472
|
+
const de = U(), ue = j(H(de, p));
|
|
473
|
+
ue.displayName = "KendoReactTimePicker";
|
|
474
|
+
G(p);
|
|
475
|
+
export {
|
|
476
|
+
ue as TimePicker,
|
|
477
|
+
de as TimePickerPropsContext,
|
|
478
|
+
p as TimePickerWithoutContext
|
|
479
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2024 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),e=require("prop-types"),p=require("@progress/kendo-date-math"),a=require("@progress/kendo-react-common"),g=require("@progress/kendo-react-intl"),r=require("../messages/index.js"),b=require("../utils.js"),h=require("./utils.js"),_=require("./TimePart.js"),y=require("@progress/kendo-react-buttons");function E(u){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const t in u)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(u,t);Object.defineProperty(i,t,n.get?n:{enumerable:!0,get:()=>u[t]})}}return i.default=u,Object.freeze(i)}const l=E(T),c=class c extends l.Component{constructor(i){super(i),this._element=null,this._cancelButton=null,this._acceptButton=null,this.timePart=null,this.focusActiveList=()=>{this.timePart&&this.timePart.focus({preventScroll:!0})},this.handleKeyDown=t=>{const{keyCode:n}=t;switch(n){case a.Keys.enter:this.hasActiveButton()||this.handleAccept(t);return;default:return}},this.revertToNowButton=t=>{const{keyCode:n,shiftKey:o}=t;!o&&n===a.Keys.tab&&(t.preventDefault(),this.props.nowButton!==!1?this.timePart&&this.timePart.focus({preventScroll:!0},!0):this.timePart&&this.timePart.focus({preventScroll:!0}))},this.handleNowKeyDown=t=>{var d;const{keyCode:n,shiftKey:o}=t;o&&n===a.Keys.tab?(t.preventDefault(),this._acceptButton&&((d=this._acceptButton.element)==null||d.focus({preventScroll:!0}))):n===a.Keys.enter&&(t.stopPropagation(),this.handleNowClick(t))},this.handleAccept=t=>{const n=this.mergeValue(p.cloneDate(this.value||h.getNow()),this.timePart?this.timePart.value:this.current);this.setState({value:n}),this.valueDuringOnChange=n;const{onChange:o}=this.props;o&&o.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0},this.handleReject=t=>{this.setState({current:this.value});const{onReject:n}=this.props;n&&n.call(void 0,t)},this.handleNowClick=t=>{const n=this.mergeValue(p.cloneDate(this.value||h.getNow()),h.getNow());this.setState({current:n,value:n}),this.valueDuringOnChange=n;const{onChange:o}=this.props;o&&o.call(void 0,{syntheticEvent:t,nativeEvent:t.nativeEvent,value:this.value,target:this}),this.valueDuringOnChange=void 0},this.handleChange=t=>{this.setState({current:t});const{handleTimeChange:n}=this.props;n&&n.call(void 0,{time:t})},this.dateFormatParts=this.intl.splitDateFormat(this.props.format||c.defaultProps.format),this.mergeValue=h.valueMerger(h.generateGetters(this.dateFormatParts)),this.hasActiveButton=this.hasActiveButton.bind(this),this.state={current:this.props.value||b.MIDNIGHT_DATE,value:this.props.value||c.defaultProps.value}}get element(){return this._element}get value(){const i=this.valueDuringOnChange!==void 0?this.valueDuringOnChange:this.props.value!==void 0?this.props.value:this.state.value;return i!==null?p.cloneDate(i):null}get intl(){return g.provideIntlService(this)}get current(){return this.state.current!==null?p.cloneDate(this.state.current):null}componentWillUnmount(){clearTimeout(this.nextTickId)}render(){const{format:i,cancelButton:t,disabled:n,tabIndex:o,className:d,smoothScroll:k,min:D,max:O,boundRange:B,nowButton:C,steps:P,show:N,mobileMode:S}=this.props,w=g.provideLocalizationService(this),f=w.toLanguageString(r.timePickerCancel,r.messages[r.timePickerCancel]),v=w.toLanguageString(r.timePickerSet,r.messages[r.timePickerSet]);return l.createElement("div",{ref:s=>{this._element=s},tabIndex:n?void 0:o||0,className:a.classNames("k-timeselector",d,{"k-disabled":n}),onKeyDown:this.handleKeyDown},l.createElement(_.TimePart,{ref:s=>{this.timePart=s},value:this.current,onChange:this.handleChange,onNowClick:this.handleNowClick,format:i,smoothScroll:k,min:D,max:O,boundRange:B,disabled:n,nowButton:C,steps:P,show:N,mobileMode:S,onNowKeyDown:this.handleNowKeyDown}),this.props.footer&&l.createElement("div",{className:"k-time-footer k-actions k-actions-stretched"},t&&l.createElement(y.Button,{type:"button",ref:s=>{this._cancelButton=s},className:"k-time-cancel",onClick:this.handleReject,title:f,"aria-label":f},f),l.createElement(y.Button,{type:"button",ref:s=>{this._acceptButton=s},className:"k-time-accept",themeColor:"primary",onClick:this.handleAccept,onKeyDown:this.revertToNowButton,title:v,"aria-label":v},v)))}nextTick(i){clearTimeout(this.nextTickId),this.nextTickId=window.setTimeout(()=>i())}hasActiveButton(){if(!this._acceptButton||!this._acceptButton.element)return!1;const i=a.getActiveElement(document);return this._acceptButton&&i===this._acceptButton.element||this._cancelButton&&i===this._cancelButton.element}};c.propTypes={cancelButton:e.bool,className:e.string,disabled:e.bool,format:e.oneOfType([e.string,e.shape({skeleton:e.string,pattern:e.string,date:e.oneOf(["short","medium","long","full"]),time:e.oneOf(["short","medium","long","full"]),datetime:e.oneOf(["short","medium","long","full"]),era:e.oneOf(["narrow","short","long"]),year:e.oneOf(["numeric","2-digit"]),month:e.oneOf(["numeric","2-digit","narrow","short","long"]),day:e.oneOf(["numeric","2-digit"]),weekday:e.oneOf(["narrow","short","long"]),hour:e.oneOf(["numeric","2-digit"]),hour12:e.bool,minute:e.oneOf(["numeric","2-digit"]),second:e.oneOf(["numeric","2-digit"]),timeZoneName:e.oneOf(["short","long"])})]),max:e.instanceOf(Date),min:e.instanceOf(Date),nowButton:e.bool,steps:e.shape({hour:e.number,minute:e.number,second:e.number}),smoothScroll:e.bool,tabIndex:e.number,value:e.instanceOf(Date),show:e.bool},c.defaultProps={value:null,disabled:!1,cancelButton:!0,format:"t",min:b.MIN_TIME,max:b.MAX_TIME,boundRange:!1,footer:!0};let m=c;g.registerForIntl(m);g.registerForLocalization(m);exports.TimeSelector=m;
|