@progress/kendo-react-dateinputs 9.0.0-develop.2 → 9.0.0-develop.4
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/README.md +47 -46
- package/calendar/components/Calendar.mjs +57 -60
- package/calendar/components/CalendarNavigationItem.mjs +10 -12
- package/calendar/components/CalendarWeekCell.mjs +9 -1
- package/calendar/components/HorizontalViewList.mjs +8 -11
- package/calendar/components/MultiViewCalendar.mjs +13 -8
- package/calendar/components/Navigation.mjs +11 -11
- package/calendar/components/View.mjs +8 -25
- package/common/PickerWrap.mjs +2 -15
- package/dateinput/models/kendo-date.js +1 -1
- package/dateinput/models/kendo-date.mjs +8 -7
- package/datepicker/DatePicker.mjs +14 -6
- package/daterangepicker/DateRangePicker.mjs +14 -3
- package/datetimepicker/DateTimePicker.mjs +22 -15
- package/dist/cdn/js/kendo-react-dateinputs.js +1 -1
- package/hooks/usePickerFloatingLabel.mjs +1 -7
- package/index.d.mts +4 -1
- package/index.d.ts +4 -1
- package/package-metadata.mjs +1 -1
- package/package.json +7 -7
- package/timepicker/TimeList.mjs +27 -12
- package/timepicker/TimePart.mjs +55 -75
- package/timepicker/TimePicker.mjs +11 -5
- package/timepicker/services/DOMService.mjs +7 -4
- package/timepicker/services/DayPeriodService.mjs +1 -4
- package/timepicker/utils.mjs +3 -15
- package/virtualization/Virtualization.js +1 -1
- package/virtualization/Virtualization.mjs +3 -13
package/README.md
CHANGED
|
@@ -5,26 +5,27 @@
|
|
|
5
5
|
# KendoReact Date Inputs Library for React
|
|
6
6
|
|
|
7
7
|
> **Important**
|
|
8
|
-
>
|
|
9
|
-
>
|
|
10
|
-
>
|
|
11
|
-
>
|
|
8
|
+
>
|
|
9
|
+
> - This package is а part of [KendoReact](https://www.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)—a commercial UI library.
|
|
10
|
+
> - You will need to install a license key when adding the package to your project. For more information, please refer to the [KendoReact My License page](https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs).
|
|
11
|
+
> - To receive a license key, you need to either [purchase a license](https://www.telerik.com/kendo-react-ui/pricing?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs) or register for a [free trial](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs). Doing so indicates that you [accept the KendoReact License Agreement](https://www.telerik.com/purchase/license-agreement/progress-kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs).
|
|
12
|
+
> - The 30-day free trial gives you access to all the KendoReact components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the KendoReact dev team!
|
|
12
13
|
>
|
|
13
14
|
> [Start using KendoReact](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs) and speed up your development process!
|
|
14
15
|
|
|
15
16
|
What's in this package (ToC):
|
|
16
17
|
|
|
17
|
-
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
18
|
+
- [KendoReact Date Inputs Library for React](#kendoreact-date-inputs-library-for-react)
|
|
19
|
+
- [React Calendar Component](#react-calendar-component)
|
|
20
|
+
- [React DateInput Component](#react-dateinput-component)
|
|
21
|
+
- [React DatePicker Component](#react-datepicker-component)
|
|
22
|
+
- [React Date Range Picker Component](#react-date-range-picker-component)
|
|
23
|
+
- [React DateTimePicker Component](#react-datetimepicker-component)
|
|
24
|
+
- [React MultiViewCalendar Component](#react-multiviewcalendar-component)
|
|
25
|
+
- [React Time Picker Component](#react-time-picker-component)
|
|
26
|
+
- [React Date Inputs Components Library Features](#react-date-inputs-components-library-features)
|
|
27
|
+
- [Support Options](#support-options)
|
|
28
|
+
- [Resources](#resources)
|
|
28
29
|
|
|
29
30
|
The React Date Inputs, part of KendoReact, offer a highly customizable interface for users to navigate between dates and date ranges, to enter and pick time and date slots, and more. All KendoReact Date Inputs support different locales.
|
|
30
31
|
|
|
@@ -60,47 +61,47 @@ The React Date Inputs, part of KendoReact, offer a highly customizable interface
|
|
|
60
61
|
|
|
61
62
|
Among the many features which the KendoReact Date Inputs deliver are:
|
|
62
63
|
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
64
|
+
- **Setting the default value**—Easily configure the initial value that the Date Inputs render.
|
|
65
|
+
- **Form validation**—Validate input values, set validation requirements (such as minimum and maximum date or time) and prevent the submission of forms which are in an invalid state.
|
|
66
|
+
- **Formats and placeholders**—Control the date and time format and implement placeholders for the input field, including custom formats.
|
|
67
|
+
- **Controlled state**—Control the date and time value and popup state of the Date Inputs.
|
|
68
|
+
- **Disabled state**—To disable user input, just change a single property.
|
|
69
|
+
- **JSON integration**—You can also bind the Date Inputs to dates or times which are serialized as strings.
|
|
70
|
+
- **Custom rendering**—You can replace the input field, calendar and popup child components with custom ones.
|
|
71
|
+
- **Date limits**—Enable the user to pick a date or time within a predefined min and max date or time range.
|
|
72
|
+
- **Focused dates and times**—Configure the initial date or time value the Date Inputs display.
|
|
73
|
+
- **Accessibility support**—The Date Inputs are compliant with WAI-ARIA and Section 508.
|
|
74
|
+
- [Theme support](https://www.telerik.com/kendo-react-ui/components/styling/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)—The KendoReact Date Inputs, as well as all 100+ components in the KendoReact suite, are styled in three polished themes (Bootstrap, Material, and Default) and can be further customized to match your specific design guidelines.
|
|
74
75
|
|
|
75
76
|
## Support Options
|
|
76
77
|
|
|
77
78
|
For any issues you might encounter while working with the KendoReact Date Inputs, use any of the available support channels:
|
|
78
79
|
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
80
|
+
- Industry-leading technical support—KendoReact paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use [the dedicated KendoReact support system](https://www.telerik.com/account/support-tickets?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs).
|
|
81
|
+
- Product forums—The [KendoReact forums](https://www.telerik.com/forums/kendo-ui-react?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs) are part of the free support you can get from the community and from the KendoReact team.
|
|
82
|
+
- Feedback portal—The [KendoReact feedback portal](https://feedback.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs) is where you can request and vote for new features to be added.
|
|
82
83
|
|
|
83
84
|
## Resources
|
|
84
85
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
86
|
+
- [Getting Started with KendoReact](https://www.telerik.com/kendo-react-ui/components/getting-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
87
|
+
- [Getting Started with the KendoReact Date Inputs](https://www.telerik.com/kendo-react-ui/components/dateinputs/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
88
|
+
- [API Reference of the KendoReact Date Inputs](https://www.telerik.com/kendo-react-ui/components/dateinputs/api/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
89
|
+
- [KendoReact Roadmap](https://www.telerik.com/support/whats-new/kendo-react-ui/roadmap?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
90
|
+
- [Blogs](https://www.telerik.com/blogs/tag/kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
91
|
+
- [Demos, documentation, and component reference](https://www.telerik.com/kendo-react-ui/components/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
92
|
+
- [KendoReact pricing and licensing](https://www.telerik.com/kendo-react-ui/pricing?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
93
|
+
- [Changelog](https://www.telerik.com/kendo-react-ui/components/changelogs/ui-for-react/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-dateinputs)
|
|
93
94
|
|
|
94
95
|
High-level component overview pages
|
|
95
96
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
97
|
+
- [React Calendar Component](https://www.telerik.com/kendo-react-ui/calendar)
|
|
98
|
+
- [React DateInput Component](https://www.telerik.com/kendo-react-ui/dateinput)
|
|
99
|
+
- [React DataPicker Component](https://www.telerik.com/kendo-react-ui/datepicker)
|
|
100
|
+
- [React DateRangePicker Component](https://www.telerik.com/kendo-react-ui/daterangepicker)
|
|
101
|
+
- [React DateTimePicker Component](https://www.telerik.com/kendo-react-ui/datetimepicker)
|
|
102
|
+
- [React MultiViewCalendar Component](https://www.telerik.com/kendo-react-ui/multiviewcalendar)
|
|
103
|
+
- [React TimePicker Component](https://www.telerik.com/kendo-react-ui/timepicker)
|
|
103
104
|
|
|
104
|
-
|
|
105
|
+
_Copyright © 2024 Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved._
|
|
105
106
|
|
|
106
|
-
|
|
107
|
+
_Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries._
|
|
@@ -131,11 +131,7 @@ const S = (u) => u ? u.virtualization : null, k = (u = d.defaultProps.min, a = d
|
|
|
131
131
|
this.bottomView,
|
|
132
132
|
this.topView
|
|
133
133
|
),
|
|
134
|
-
focusedDate: V(
|
|
135
|
-
a.focusedDate || e || x(),
|
|
136
|
-
this.min,
|
|
137
|
-
this.max
|
|
138
|
-
)
|
|
134
|
+
focusedDate: V(a.focusedDate || e || x(), this.min, this.max)
|
|
139
135
|
}, this.dom = new G(), this.bus = new j(this.handleViewChange), this.navigation = new J(this.bus), this.oldValue = e;
|
|
140
136
|
}
|
|
141
137
|
get cellUID() {
|
|
@@ -194,11 +190,9 @@ const S = (u) => u ? u.virtualization : null, k = (u = d.defaultProps.min, a = d
|
|
|
194
190
|
r[t !== void 0 ? t : n.defaultProps.bottomView],
|
|
195
191
|
r[i !== void 0 ? i : n.defaultProps.topView]
|
|
196
192
|
), w = k(this.min, this.max, this.value, this.value), O = w ? c(w) : null;
|
|
197
|
-
this.focusedDate = c(
|
|
198
|
-
b && w !== null ? w : this.state.focusedDate,
|
|
199
|
-
|
|
200
|
-
this.max
|
|
201
|
-
)), this.intl = R(this), this.bus.configure(this.bottomView, this.topView), this.service = this.bus.service(E, this.intl);
|
|
193
|
+
this.focusedDate = c(
|
|
194
|
+
V(b && w !== null ? w : this.state.focusedDate, this.min, this.max)
|
|
195
|
+
), this.intl = R(this), this.bus.configure(this.bottomView, this.topView), this.service = this.bus.service(E, this.intl);
|
|
202
196
|
const { smoothScroll: P = Number.parseFloat(f.version) < 18 } = this.props, A = B(
|
|
203
197
|
T.wrapper({
|
|
204
198
|
c: v,
|
|
@@ -207,56 +201,59 @@ const S = (u) => u ? u.virtualization : null, k = (u = d.defaultProps.min, a = d
|
|
|
207
201
|
mobileMode: h
|
|
208
202
|
}),
|
|
209
203
|
l
|
|
210
|
-
), M = [
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
204
|
+
), M = [
|
|
205
|
+
this.props.navigation && /* @__PURE__ */ f.createElement(
|
|
206
|
+
H,
|
|
207
|
+
{
|
|
208
|
+
key: 0,
|
|
209
|
+
ref: (m) => {
|
|
210
|
+
this.Navigation = m;
|
|
211
|
+
},
|
|
212
|
+
activeView: this.state.activeView,
|
|
213
|
+
focusedDate: this.focusedDate,
|
|
214
|
+
min: this.min,
|
|
215
|
+
max: this.max,
|
|
216
|
+
onScroll: this.handleScroll,
|
|
217
|
+
onChange: this.handleNavigationChange,
|
|
218
|
+
service: this.service,
|
|
219
|
+
dom: this.dom,
|
|
220
|
+
navigationItem: this.props.navigationItem,
|
|
221
|
+
tabIndex: this.props.tabIndex,
|
|
222
|
+
unstyled: e
|
|
223
|
+
}
|
|
224
|
+
),
|
|
225
|
+
/* @__PURE__ */ f.createElement(
|
|
226
|
+
z,
|
|
227
|
+
{
|
|
228
|
+
key: 1,
|
|
229
|
+
ref: (m) => {
|
|
230
|
+
this.calendarViewList = m;
|
|
231
|
+
},
|
|
232
|
+
activeView: this.state.activeView,
|
|
233
|
+
focusedDate: this.focusedDate,
|
|
234
|
+
min: this.min,
|
|
235
|
+
max: this.max,
|
|
236
|
+
bus: this.bus,
|
|
237
|
+
shouldScroll: this.shouldScroll,
|
|
238
|
+
onScroll: this.handleScroll,
|
|
239
|
+
service: this.service,
|
|
240
|
+
cell: this.props.cell,
|
|
241
|
+
weekCell: this.props.weekCell,
|
|
242
|
+
dom: this.dom,
|
|
243
|
+
smoothScroll: P,
|
|
244
|
+
showWeekNumbers: this.props.weekNumber,
|
|
245
|
+
onChange: this.handleDateChange,
|
|
246
|
+
value: O,
|
|
247
|
+
cellUID: this.cellUID,
|
|
248
|
+
headerTitle: this.props.headerTitle,
|
|
249
|
+
header: this.props.header,
|
|
250
|
+
tabIndex: this.props.tabIndex,
|
|
251
|
+
weekDaysFormat: this.props.weekDaysFormat,
|
|
252
|
+
showOtherMonthDays: this.props.showOtherMonthDays,
|
|
253
|
+
unstyled: e
|
|
254
|
+
}
|
|
255
|
+
)
|
|
256
|
+
];
|
|
260
257
|
return /* @__PURE__ */ f.createElement(
|
|
261
258
|
"div",
|
|
262
259
|
{
|
|
@@ -13,20 +13,18 @@ const N = (e) => {
|
|
|
13
13
|
const { onClick: n } = e;
|
|
14
14
|
n && n.call(void 0, o, d);
|
|
15
15
|
};
|
|
16
|
-
return /* @__PURE__ */ l.createElement(
|
|
17
|
-
"
|
|
16
|
+
return /* @__PURE__ */ l.createElement("li", { ...r, onClick: m, className: c(s.li({ c: t })) }, /* @__PURE__ */ l.createElement(
|
|
17
|
+
"span",
|
|
18
18
|
{
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
className: c(
|
|
20
|
+
s.navigationMarker({
|
|
21
|
+
c: t,
|
|
22
|
+
isRangeStart: i
|
|
23
|
+
})
|
|
24
|
+
)
|
|
22
25
|
},
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
c: t,
|
|
26
|
-
isRangeStart: i
|
|
27
|
-
})
|
|
28
|
-
) }, e.children)
|
|
29
|
-
);
|
|
26
|
+
e.children
|
|
27
|
+
));
|
|
30
28
|
};
|
|
31
29
|
export {
|
|
32
30
|
N as CalendarNavigationItem
|
|
@@ -13,7 +13,15 @@ const f = (e) => {
|
|
|
13
13
|
const { onClick: a } = e;
|
|
14
14
|
a && t && a.call(void 0, c, n || [], t);
|
|
15
15
|
}, s = m(), i = s && s.uCalendar;
|
|
16
|
-
return /* @__PURE__ */ d.createElement(
|
|
16
|
+
return /* @__PURE__ */ d.createElement(
|
|
17
|
+
"td",
|
|
18
|
+
{
|
|
19
|
+
className: C(u.td({ c: i, isWeek: !0 }), l),
|
|
20
|
+
...o,
|
|
21
|
+
onClick: r
|
|
22
|
+
},
|
|
23
|
+
e.children
|
|
24
|
+
);
|
|
17
25
|
};
|
|
18
26
|
export {
|
|
19
27
|
f as CalendarWeekCell
|
|
@@ -65,17 +65,14 @@ const n = 2, r = class r extends o.Component {
|
|
|
65
65
|
this.isActive && this.focusActiveDate();
|
|
66
66
|
}
|
|
67
67
|
render() {
|
|
68
|
-
const l = this.props.allowReverse ? this.rotateSelectionRange(this.props.selectionRange) : this.props.selectionRange, e = p(
|
|
69
|
-
"k-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
"k-calendar-centuryview": this.props.activeView === i.century
|
|
77
|
-
}
|
|
78
|
-
);
|
|
68
|
+
const l = this.props.allowReverse ? this.rotateSelectionRange(this.props.selectionRange) : this.props.selectionRange, e = p("k-calendar-view k-align-items-start k-justify-content-center", {
|
|
69
|
+
"k-vstack": this.props.verticalView,
|
|
70
|
+
"k-hstack": !this.props.verticalView,
|
|
71
|
+
"k-calendar-monthview": this.props.activeView === i.month,
|
|
72
|
+
"k-calendar-yearview": this.props.activeView === i.year,
|
|
73
|
+
"k-calendar-decadeview": this.props.activeView === i.decade,
|
|
74
|
+
"k-calendar-centuryview": this.props.activeView === i.century
|
|
75
|
+
});
|
|
79
76
|
return /* @__PURE__ */ o.createElement(
|
|
80
77
|
"div",
|
|
81
78
|
{
|
|
@@ -184,11 +184,7 @@ const S = (r = v.defaultProps.min, i = v.defaultProps.max, a) => a instanceof Da
|
|
|
184
184
|
M[i.defaultActiveView],
|
|
185
185
|
this.bottomView,
|
|
186
186
|
this.topView
|
|
187
|
-
), b = F(
|
|
188
|
-
i.focusedDate || I || k(),
|
|
189
|
-
this.min,
|
|
190
|
-
this.max
|
|
191
|
-
);
|
|
187
|
+
), b = F(i.focusedDate || I || k(), this.min, this.max);
|
|
192
188
|
this.state = {
|
|
193
189
|
value: a,
|
|
194
190
|
activeView: V,
|
|
@@ -221,10 +217,14 @@ const S = (r = v.defaultProps.min, i = v.defaultProps.max, a) => a instanceof Da
|
|
|
221
217
|
return m(this._focusedDate);
|
|
222
218
|
}
|
|
223
219
|
get min() {
|
|
224
|
-
return g(
|
|
220
|
+
return g(
|
|
221
|
+
this.props.min !== void 0 ? this.props.min : d.defaultProps.min
|
|
222
|
+
);
|
|
225
223
|
}
|
|
226
224
|
get max() {
|
|
227
|
-
return g(
|
|
225
|
+
return g(
|
|
226
|
+
this.props.max !== void 0 ? this.props.max : d.defaultProps.max
|
|
227
|
+
);
|
|
228
228
|
}
|
|
229
229
|
get bottomView() {
|
|
230
230
|
return M[this.props.bottomView !== void 0 ? this.props.bottomView : d.defaultProps.bottomView];
|
|
@@ -447,7 +447,12 @@ d.displayName = "MultiViewCalendar", d.propTypes = {
|
|
|
447
447
|
showOtherMonthDays: !1
|
|
448
448
|
};
|
|
449
449
|
let v = d;
|
|
450
|
-
const ce = Q(), de = Z(
|
|
450
|
+
const ce = Q(), de = Z(
|
|
451
|
+
ee(
|
|
452
|
+
ce,
|
|
453
|
+
v
|
|
454
|
+
)
|
|
455
|
+
);
|
|
451
456
|
de.displayName = "KendoReactMultiViewCalendar";
|
|
452
457
|
X(v);
|
|
453
458
|
q(v);
|
|
@@ -86,18 +86,18 @@ const I = 30, p = class p extends n.Component {
|
|
|
86
86
|
tabIndex: this.props.tabIndex,
|
|
87
87
|
unstyled: i
|
|
88
88
|
},
|
|
89
|
-
/* @__PURE__ */ n.createElement(
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
this.props.dom.didCalculate ? w : null
|
|
89
|
+
/* @__PURE__ */ n.createElement(
|
|
90
|
+
"ul",
|
|
91
|
+
{
|
|
92
|
+
ref: (l) => {
|
|
93
|
+
this.list = l;
|
|
94
|
+
},
|
|
95
|
+
className: d(u.ul({ c: s }))
|
|
96
|
+
},
|
|
97
|
+
D.map((l) => this.buildNavigationItem(l))
|
|
98
|
+
)
|
|
100
99
|
);
|
|
100
|
+
return /* @__PURE__ */ n.createElement("div", { className: d(u.navigation({ c: s })) }, /* @__PURE__ */ n.createElement("span", { className: d(u.navigationHighlight({ c: s })) }), this.props.dom.didCalculate ? w : null);
|
|
101
101
|
}
|
|
102
102
|
getTake(o, e) {
|
|
103
103
|
return Math.min(e - o, this.take);
|
|
@@ -111,30 +111,15 @@ const y = (g, t) => {
|
|
|
111
111
|
selectionRange: m,
|
|
112
112
|
viewDate: W
|
|
113
113
|
});
|
|
114
|
-
return /* @__PURE__ */ i.createElement(i.Fragment, null, this.isMonthView && this.isHorizontal && /* @__PURE__ */ i.createElement(
|
|
115
|
-
"
|
|
114
|
+
return /* @__PURE__ */ i.createElement(i.Fragment, null, this.isMonthView && this.isHorizontal && /* @__PURE__ */ i.createElement("thead", { role: "rowgroup", className: l(c.thead({ c: h })) }, /* @__PURE__ */ i.createElement("tr", { role: "row", className: l(c.tr({ c: h })) }, C.map((p, d) => /* @__PURE__ */ i.createElement("th", { key: d, className: l(c.th({ c: h })) }, p)))), /* @__PURE__ */ i.createElement("tbody", { role: "rowgroup", className: l(c.tbody({ c: h })) }, !this.isHorizontal && /* @__PURE__ */ i.createElement("tr", { role: "presentation", className: l(c.tr({ c: h })) }, /* @__PURE__ */ i.createElement(
|
|
115
|
+
"th",
|
|
116
116
|
{
|
|
117
|
-
|
|
118
|
-
|
|
117
|
+
scope: "col",
|
|
118
|
+
colSpan: N,
|
|
119
|
+
className: l(c.caption({ c: h }))
|
|
119
120
|
},
|
|
120
|
-
|
|
121
|
-
), /* @__PURE__ */ i.createElement(
|
|
122
|
-
"tbody",
|
|
123
|
-
{
|
|
124
|
-
role: "rowgroup",
|
|
125
|
-
className: l(c.tbody({ c: h }))
|
|
126
|
-
},
|
|
127
|
-
!this.isHorizontal && /* @__PURE__ */ i.createElement("tr", { role: "presentation", className: l(c.tr({ c: h })) }, /* @__PURE__ */ i.createElement(
|
|
128
|
-
"th",
|
|
129
|
-
{
|
|
130
|
-
scope: "col",
|
|
131
|
-
colSpan: N,
|
|
132
|
-
className: l(c.caption({ c: h }))
|
|
133
|
-
},
|
|
134
|
-
b
|
|
135
|
-
)),
|
|
136
|
-
O.map((p, d) => /* @__PURE__ */ i.createElement("tr", { role: "row", className: l(c.tr({ c: h })), key: d }, this.weekNumber && this.buildWeekNumber(p, d), this.buildRow(p)))
|
|
137
|
-
));
|
|
121
|
+
b
|
|
122
|
+
)), O.map((p, d) => /* @__PURE__ */ i.createElement("tr", { role: "row", className: l(c.tr({ c: h })), key: d }, this.weekNumber && this.buildWeekNumber(p, d), this.buildRow(p)))));
|
|
138
123
|
}
|
|
139
124
|
getWeekNumber(t) {
|
|
140
125
|
return !this.weekNumber || !this.intl ? null : R(t, this.intl.firstDay());
|
|
@@ -149,9 +134,7 @@ u.propTypes = {
|
|
|
149
134
|
max: s.instanceOf(Date).isRequired,
|
|
150
135
|
min: s.instanceOf(Date).isRequired,
|
|
151
136
|
onChange: s.func,
|
|
152
|
-
selectedDate: s.oneOfType(
|
|
153
|
-
[s.instanceOf(Date), s.arrayOf(s.instanceOf(Date))]
|
|
154
|
-
),
|
|
137
|
+
selectedDate: s.oneOfType([s.instanceOf(Date), s.arrayOf(s.instanceOf(Date))]),
|
|
155
138
|
showWeekNumbers: s.bool,
|
|
156
139
|
showOtherMonthDays: s.bool,
|
|
157
140
|
viewDate: s.instanceOf(Date).isRequired
|
package/common/PickerWrap.mjs
CHANGED
|
@@ -11,21 +11,8 @@ import { classNames as s } from "@progress/kendo-react-common";
|
|
|
11
11
|
const m = a.forwardRef((e, n) => {
|
|
12
12
|
const { _ref: r } = e, t = a.useRef(null);
|
|
13
13
|
a.useImperativeHandle(n, () => t.current), a.useImperativeHandle(r, () => t.current);
|
|
14
|
-
const c = a.useMemo(
|
|
15
|
-
|
|
16
|
-
[e.className]
|
|
17
|
-
);
|
|
18
|
-
return /* @__PURE__ */ a.createElement(
|
|
19
|
-
"span",
|
|
20
|
-
{
|
|
21
|
-
ref: t,
|
|
22
|
-
id: e.id,
|
|
23
|
-
style: e.style,
|
|
24
|
-
className: c,
|
|
25
|
-
tabIndex: e.tabIndex
|
|
26
|
-
},
|
|
27
|
-
e.children
|
|
28
|
-
);
|
|
14
|
+
const c = a.useMemo(() => s(e.className, "k-picker-wrap"), [e.className]);
|
|
15
|
+
return /* @__PURE__ */ a.createElement("span", { ref: t, id: e.id, style: e.style, className: c, tabIndex: e.tabIndex }, e.children);
|
|
29
16
|
});
|
|
30
17
|
export {
|
|
31
18
|
m as PickerWrap
|
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@progress/kendo-date-math"),p=require("./mask.js"),M=require("../utils.js");class y{constructor(t,e,s){this.year=!0,this.month=!0,this.date=!0,this.hours=!0,this.minutes=!0,this.seconds=!0,this.milliseconds=!0,this.leadingZero=null,this.typedMonthPart="",this.knownParts="adHhmMsEy",this.symbols={E:"E",H:"H",M:"M",a:"a",d:"d",h:"h",m:"m",s:"s",y:"y"},this._value=r.getDate(new Date),this.intlProvider=t,this.formatPlaceholder=e,this.format=s,this.monthNames=this.allFormatedMonths()}get intl(){return this.intlProvider()}get value(){return this._value}setValue(t){t?r.isEqual(t,this._value)||(this._value=r.cloneDate(t),this.modifyExisting(!0)):(this._value=r.getDate(new Date),this.modifyExisting(!1))}hasValue(){const t=(e,s)=>e||s.type!=="literal"&&s.type!=="dayperiod"&&this.getExisting(s.pattern[0]);return this.intl.splitDateFormat(this.format).reduce(t,!1)}getDateObject(){for(let t=0;t<this.knownParts.length;t++)if(!this.getExisting(this.knownParts[t]))return null;return r.cloneDate(this.value)}getTextAndFormat(){return this.merge(this.intl.formatDate(this.value,this.format),this.dateFormatString(this.value,this.format))}modifyExisting(t){const e=this.dateFormatString(this.value,this.format).symbols;for(let s=0;s<e.length;s++)this.setExisting(e[s],t)}getExisting(t){switch(t){case"y":return this.year;case"M":case"L":return this.month;case"d":return this.date;case"E":return this.date&&this.month&&this.year;case"h":case"H":return this.hours;case"m":return this.minutes;case"s":return this.seconds;default:return!0}}setExisting(t,e){switch(t){case"y":this.year=e,e===!1&&this._value.setFullYear(2e3);break;case"M":this.month=e,e===!1&&this._value.setMonth(0);break;case"d":this.date=e;break;case"h":case"H":this.hours=e;break;case"m":this.minutes=e;break;case"s":this.seconds=e;break;default:return}}modifyPart(t,e){let s=r.cloneDate(this.value);switch(t){case"y":s.setFullYear(s.getFullYear()+e);break;case"M":s=r.addMonths(this.value,e);break;case"d":case"E":s.setDate(s.getDate()+e);break;case"h":case"H":s.setHours(s.getHours()+e);break;case"m":s.setMinutes(s.getMinutes()+e);break;case"s":s.setSeconds(s.getSeconds()+e);break;case"a":s.setHours(s.getHours()+12*e);break}this.setExisting(t,!0),this._value=s}parsePart(t,e){if(this.resetLeadingZero(),!e)return this.setExisting(t,!1),{value:null};const s=this.intl.formatDate(this.value,this.format),n=this.dateFormatString(this.value,this.format),h=n.symbols;let i=!1,l="",o="",m="";for(let u=0;u<s.length;u++)h[u]===t?(o+=this.getExisting(t)?s[u]:"0",i=!0):i?m+=s[u]:l+=s[u];let a=null;const c=this.matchMonth(e);for(;o.length>0&&o.charAt(0)==="0";)o=o.slice(1);o.length>=4&&(o="");for(let u=0;u<2;u++){
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@progress/kendo-date-math"),p=require("./mask.js"),M=require("../utils.js");class y{constructor(t,e,s){this.year=!0,this.month=!0,this.date=!0,this.hours=!0,this.minutes=!0,this.seconds=!0,this.milliseconds=!0,this.leadingZero=null,this.typedMonthPart="",this.knownParts="adHhmMsEy",this.symbols={E:"E",H:"H",M:"M",a:"a",d:"d",h:"h",m:"m",s:"s",y:"y"},this._value=r.getDate(new Date),this.intlProvider=t,this.formatPlaceholder=e,this.format=s,this.monthNames=this.allFormatedMonths()}get intl(){return this.intlProvider()}get value(){return this._value}setValue(t){t?r.isEqual(t,this._value)||(this._value=r.cloneDate(t),this.modifyExisting(!0)):(this._value=r.getDate(new Date),this.modifyExisting(!1))}hasValue(){const t=(e,s)=>e||s.type!=="literal"&&s.type!=="dayperiod"&&this.getExisting(s.pattern[0]);return this.intl.splitDateFormat(this.format).reduce(t,!1)}getDateObject(){for(let t=0;t<this.knownParts.length;t++)if(!this.getExisting(this.knownParts[t]))return null;return r.cloneDate(this.value)}getTextAndFormat(){return this.merge(this.intl.formatDate(this.value,this.format),this.dateFormatString(this.value,this.format))}modifyExisting(t){const e=this.dateFormatString(this.value,this.format).symbols;for(let s=0;s<e.length;s++)this.setExisting(e[s],t)}getExisting(t){switch(t){case"y":return this.year;case"M":case"L":return this.month;case"d":return this.date;case"E":return this.date&&this.month&&this.year;case"h":case"H":return this.hours;case"m":return this.minutes;case"s":return this.seconds;default:return!0}}setExisting(t,e){switch(t){case"y":this.year=e,e===!1&&this._value.setFullYear(2e3);break;case"M":this.month=e,e===!1&&this._value.setMonth(0);break;case"d":this.date=e;break;case"h":case"H":this.hours=e;break;case"m":this.minutes=e;break;case"s":this.seconds=e;break;default:return}}modifyPart(t,e){let s=r.cloneDate(this.value);switch(t){case"y":s.setFullYear(s.getFullYear()+e);break;case"M":s=r.addMonths(this.value,e);break;case"d":case"E":s.setDate(s.getDate()+e);break;case"h":case"H":s.setHours(s.getHours()+e);break;case"m":s.setMinutes(s.getMinutes()+e);break;case"s":s.setSeconds(s.getSeconds()+e);break;case"a":s.setHours(s.getHours()+12*e);break}this.setExisting(t,!0),this._value=s}parsePart(t,e){if(this.resetLeadingZero(),!e)return this.setExisting(t,!1),{value:null};const s=this.intl.formatDate(this.value,this.format),n=this.dateFormatString(this.value,this.format),h=n.symbols;let i=!1,l="",o="",m="";for(let u=0;u<s.length;u++)h[u]===t?(o+=this.getExisting(t)?s[u]:"0",i=!0):i?m+=s[u]:l+=s[u];let a=null;const c=this.matchMonth(e);for(;o.length>0&&o.charAt(0)==="0";)o=o.slice(1);o.length>=4&&(o="");for(let u=0;u<2;u++){const g=o+e,f=parseInt(g,10);if(a=this.intl.parseDate(l+g+m,this.format),!a&&!isNaN(f)&&!isNaN(parseInt(e,10))){if(t==="M"&&!c){const d=f-1;d>-1&&d<12&&(a=r.cloneDate(this.value),a.setMonth(d),a.getMonth()!==d&&(a=r.lastDayOfMonth(r.addMonths(a,-1))))}t==="y"&&(a=r.createDate(parseInt(g,10),this.month?this.value.getMonth():0,this.date?this.value.getDate():1,this.hours?this.value.getHours():0,this.minutes?this.value.getMinutes():0,this.seconds?this.value.getSeconds():0,this.milliseconds?this.value.getMilliseconds():0),this.date&&a.getDate()!==this.value.getDate()&&(a=r.lastDayOfMonth(r.addMonths(a,-1))))}if(a)return this._value=a,this.setExisting(t,!0),{value:this.value};o=""}return c&&(a=this.intl.parseDate(l+c+m,this.format),a)?(this._value=a,this.setExisting(t,!0),{value:this.value}):(e==="0"&&(this.leadingZero=this.isAbbrMonth(n.partMap,t)?null:{[t]:!0},this.setExisting(t,!1)),{value:null})}symbolMap(t){return this.intl.splitDateFormat(this.format).reduce(M.dateSymbolMap,{})[t]}resetLeadingZero(){const t=this.leadingZero!==null;return this.leadingZero=null,t}isAbbrMonth(t,e){const s=this.partPattern(t,e);return s.type==="month"&&s.names}partPattern(t,e){return t.filter(s=>s.pattern.indexOf(e)!==-1)[0]}matchMonth(t){if(this.typedMonthPart+=t.toLowerCase(),this.monthNames.length===0)return"";for(;this.typedMonthPart.length>0;){for(let s=0;s<this.monthNames.length;s++)if(this.monthNames[s].toLowerCase().indexOf(this.typedMonthPart)===0)return this.monthNames[s];const e=parseInt(this.typedMonthPart,10);if(e>=1&&e<=12&&e.toString()===this.typedMonthPart)return this.monthNames[e-1];this.typedMonthPart=this.typedMonthPart.substring(1,this.typedMonthPart.length)}return""}allFormatedMonths(){const t=this.intl.splitDateFormat(this.format);for(let e=0;e<t.length;e++)if(t[e].type==="month"&&t[e].names)return this.intl.dateFormatNames(t[e].names);return[]}dateFormatString(t,e){const s=this.intl.splitDateFormat(e),n=[],h=[];for(let l=0;l<s.length;l++){let o=this.intl.formatDate(t,{pattern:s[l].pattern}).length;for(;o>0;)n.push(this.symbols[s[l].pattern[0]]||"_"),h.push(s[l]),o--}const i=new p.Mask;return i.symbols=n.join(""),i.partMap=h,i}merge(t,e){let s="",n="";const h=e.symbols;for(let i=h.length-1;i>=0;i--)if(this.knownParts.indexOf(h[i])===-1||this.getExisting(h[i]))s=t[i]+s,n=h[i]+n;else{const l=h[i];for(;i>=0&&l===h[i];)i--;for(i++,this.leadingZero&&this.leadingZero[l]?s="0"+s:s=this.dateFieldName(e.partMap[i])+s;n.length<s.length;)n=h[i]+n}return{text:s,format:n}}dateFieldName(t){const e=this.formatPlaceholder||"wide";return e[t.type]?e[t.type]:e==="formatPattern"?t.pattern:this.intl.dateFieldName(Object.assign(t,{nameType:e}))}}exports.KendoDate=y;
|
|
@@ -137,19 +137,19 @@ class k {
|
|
|
137
137
|
for (let o = 0; o < s.length; o++)
|
|
138
138
|
n[o] === t ? (l += this.getExisting(t) ? s[o] : "0", i = !0) : i ? d += s[o] : h += s[o];
|
|
139
139
|
let a = null;
|
|
140
|
-
const
|
|
140
|
+
const c = this.matchMonth(e);
|
|
141
141
|
for (; l.length > 0 && l.charAt(0) === "0"; )
|
|
142
142
|
l = l.slice(1);
|
|
143
143
|
l.length >= 4 && (l = "");
|
|
144
144
|
for (let o = 0; o < 2; o++) {
|
|
145
|
-
|
|
146
|
-
if (a = this.intl.parseDate(h +
|
|
147
|
-
if (t === "M" && !
|
|
145
|
+
const g = l + e, p = parseInt(g, 10);
|
|
146
|
+
if (a = this.intl.parseDate(h + g + d, this.format), !a && !isNaN(p) && !isNaN(parseInt(e, 10))) {
|
|
147
|
+
if (t === "M" && !c) {
|
|
148
148
|
const u = p - 1;
|
|
149
149
|
u > -1 && u < 12 && (a = m(this.value), a.setMonth(u), a.getMonth() !== u && (a = y(f(a, -1))));
|
|
150
150
|
}
|
|
151
151
|
t === "y" && (a = P(
|
|
152
|
-
parseInt(
|
|
152
|
+
parseInt(g, 10),
|
|
153
153
|
this.month ? this.value.getMonth() : 0,
|
|
154
154
|
this.date ? this.value.getDate() : 1,
|
|
155
155
|
this.hours ? this.value.getHours() : 0,
|
|
@@ -162,7 +162,7 @@ class k {
|
|
|
162
162
|
return this._value = a, this.setExisting(t, !0), { value: this.value };
|
|
163
163
|
l = "";
|
|
164
164
|
}
|
|
165
|
-
return
|
|
165
|
+
return c && (a = this.intl.parseDate(h + c + d, this.format), a) ? (this._value = a, this.setExisting(t, !0), { value: this.value }) : (e === "0" && (this.leadingZero = this.isAbbrMonth(r.partMap, t) ? null : { [t]: !0 }, this.setExisting(t, !1)), { value: null });
|
|
166
166
|
}
|
|
167
167
|
symbolMap(t) {
|
|
168
168
|
return this.intl.splitDateFormat(this.format).reduce(D, {})[t];
|
|
@@ -210,7 +210,8 @@ class k {
|
|
|
210
210
|
return i.symbols = r.join(""), i.partMap = n, i;
|
|
211
211
|
}
|
|
212
212
|
merge(t, e) {
|
|
213
|
-
let s = "", r = ""
|
|
213
|
+
let s = "", r = "";
|
|
214
|
+
const n = e.symbols;
|
|
214
215
|
for (let i = n.length - 1; i >= 0; i--)
|
|
215
216
|
if (this.knownParts.indexOf(n[i]) === -1 || this.getExisting(n[i]))
|
|
216
217
|
s = t[i] + s, r = n[i] + r;
|
|
@@ -31,9 +31,7 @@ const o = class o extends n.Component {
|
|
|
31
31
|
}, this.setCalendarRef = (t) => {
|
|
32
32
|
this._calendar = t;
|
|
33
33
|
}, 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.renderPopup = () => {
|
|
34
|
-
const { disabled: t, min: s, max: a, weekNumber: c, focusedDate: m, popupSettings: l } = this.props, { popupClass: f, ...g } = l, v = this.show, d = this.value, w = d && _(d), u = k(
|
|
35
|
-
f
|
|
36
|
-
), b = {
|
|
34
|
+
const { disabled: t, min: s, max: a, weekNumber: c, focusedDate: m, popupSettings: l } = this.props, { popupClass: f, ...g } = l, v = this.show, d = this.value, w = d && _(d), u = k(f), b = {
|
|
37
35
|
popupClass: "k-datepicker-popup",
|
|
38
36
|
show: v,
|
|
39
37
|
anchor: this._element,
|
|
@@ -304,7 +302,10 @@ const o = class o extends n.Component {
|
|
|
304
302
|
size: null,
|
|
305
303
|
fillMode: null,
|
|
306
304
|
rounded: null
|
|
307
|
-
}, D = se(this).toLanguageString(
|
|
305
|
+
}, D = se(this).toLanguageString(
|
|
306
|
+
E,
|
|
307
|
+
ie[E]
|
|
308
|
+
), O = /* @__PURE__ */ n.createElement(
|
|
308
309
|
U,
|
|
309
310
|
{
|
|
310
311
|
onFocus: this.handleFocus,
|
|
@@ -428,7 +429,12 @@ o.displayName = "DatePicker", o.propTypes = {
|
|
|
428
429
|
})
|
|
429
430
|
]),
|
|
430
431
|
formatPlaceholder: e.oneOfType([
|
|
431
|
-
e.oneOf([
|
|
432
|
+
e.oneOf([
|
|
433
|
+
"wide",
|
|
434
|
+
"narrow",
|
|
435
|
+
"short",
|
|
436
|
+
"formatPattern"
|
|
437
|
+
]),
|
|
432
438
|
e.shape({
|
|
433
439
|
year: e.string,
|
|
434
440
|
month: e.string,
|
|
@@ -488,7 +494,9 @@ o.displayName = "DatePicker", o.propTypes = {
|
|
|
488
494
|
autoFocus: !1
|
|
489
495
|
};
|
|
490
496
|
let p = o;
|
|
491
|
-
const he = $(), pe = H(
|
|
497
|
+
const he = $(), pe = H(
|
|
498
|
+
X(he, p)
|
|
499
|
+
);
|
|
492
500
|
pe.displayName = "KendoReactDatePicker";
|
|
493
501
|
oe(p);
|
|
494
502
|
export {
|