@progress/kendo-themes-html 5.8.2-dev.6 → 5.9.1-dev.0

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.
Files changed (73) hide show
  1. package/dist/action-sheet/tests/action-sheet-data-table.js +945 -0
  2. package/dist/action-sheet/tests/action-sheet-data-table.js.map +7 -0
  3. package/dist/action-sheet/tests/action-sheet-date-time-selector.js +112 -80
  4. package/dist/action-sheet/tests/action-sheet-date-time-selector.js.map +4 -4
  5. package/dist/action-sheet/tests/action-sheet-time-selector.js +121 -81
  6. package/dist/action-sheet/tests/action-sheet-time-selector.js.map +4 -4
  7. package/dist/calendar/tests/calendar-classic-jquery.js +5 -5
  8. package/dist/calendar/tests/calendar-classic-jquery.js.map +1 -1
  9. package/dist/calendar/tests/calendar-infinite-rtl.js +7 -7
  10. package/dist/calendar/tests/calendar-infinite-rtl.js.map +2 -2
  11. package/dist/calendar/tests/calendar-infinite.js +7 -7
  12. package/dist/calendar/tests/calendar-infinite.js.map +1 -1
  13. package/dist/calendar/tests/calendar-modern-size.js +895 -0
  14. package/dist/calendar/tests/calendar-modern-size.js.map +7 -0
  15. package/dist/coloreditor/tests/coloreditor-focused-colorgradient.js +684 -0
  16. package/dist/coloreditor/tests/coloreditor-focused-colorgradient.js.map +7 -0
  17. package/dist/datetime-selector/tests/datetime-selector.js +142 -138
  18. package/dist/datetime-selector/tests/datetime-selector.js.map +4 -4
  19. package/dist/form/tests/form-field-dateinputs-angular.js.map +2 -2
  20. package/dist/form/tests/form-field-dateinputs-react.js.map +2 -2
  21. package/dist/grid/tests/grid-editing-custom-editor.js.map +2 -2
  22. package/dist/grid/tests/grid-filter-row.js.map +2 -2
  23. package/dist/icon/tests/icons.js +1 -0
  24. package/dist/icon/tests/icons.js.map +2 -2
  25. package/dist/index.js +218 -172
  26. package/dist/index.js.map +4 -4
  27. package/dist/scheduler/tests/scheduler-edit-dialog.js.map +2 -2
  28. package/dist/time-selector/tests/time-selector.js +200 -397
  29. package/dist/time-selector/tests/time-selector.js.map +4 -4
  30. package/dist/time-selector/time-selector-column.js +108 -0
  31. package/dist/time-selector/time-selector-column.js.map +7 -0
  32. package/dist/time-selector/time-selector-fast-selection.js +255 -0
  33. package/dist/time-selector/time-selector-fast-selection.js.map +7 -0
  34. package/dist/time-selector/time-selector-header.js +65 -0
  35. package/dist/time-selector/time-selector-header.js.map +7 -0
  36. package/dist/time-selector/time-selector.js +138 -99
  37. package/dist/time-selector/time-selector.js.map +4 -4
  38. package/dist/timedurationpicker/tests/timedurationpicker-expanded.js +718 -0
  39. package/dist/timedurationpicker/tests/timedurationpicker-expanded.js.map +7 -0
  40. package/dist/timedurationpicker/tests/timedurationpicker.js +576 -0
  41. package/dist/timedurationpicker/tests/timedurationpicker.js.map +7 -0
  42. package/dist/timedurationpicker/timedurationpicker.js +494 -0
  43. package/dist/timedurationpicker/timedurationpicker.js.map +7 -0
  44. package/dist/timepicker/tests/timepicker-adaptive.js +128 -83
  45. package/dist/timepicker/tests/timepicker-adaptive.js.map +4 -4
  46. package/dist/timepicker/tests/timepicker-flat.js.map +2 -2
  47. package/dist/timepicker/tests/timepicker-outline.js.map +2 -2
  48. package/dist/timepicker/tests/timepicker.js.map +2 -2
  49. package/dist/timepicker/timepicker.js.map +2 -2
  50. package/package.json +2 -2
  51. package/src/action-sheet/tests/action-sheet-data-table.tsx +203 -0
  52. package/src/action-sheet/tests/action-sheet-date-time-selector.tsx +7 -3
  53. package/src/action-sheet/tests/action-sheet-time-selector.tsx +12 -3
  54. package/src/calendar/tests/calendar-classic-jquery.tsx +5 -5
  55. package/src/calendar/tests/calendar-infinite-rtl.tsx +7 -7
  56. package/src/calendar/tests/calendar-infinite.tsx +7 -7
  57. package/src/calendar/tests/calendar-modern-size.tsx +39 -0
  58. package/src/coloreditor/tests/coloreditor-focused-colorgradient.tsx +107 -0
  59. package/src/datetime-selector/tests/datetime-selector.tsx +6 -150
  60. package/src/icon/tests/icons.tsx +1 -0
  61. package/src/index.ts +1 -0
  62. package/src/time-selector/index.ts +3 -0
  63. package/src/time-selector/tests/time-selector.tsx +30 -407
  64. package/src/time-selector/time-selector-column.tsx +82 -0
  65. package/src/time-selector/time-selector-fast-selection.tsx +36 -0
  66. package/src/time-selector/time-selector-header.tsx +40 -0
  67. package/src/time-selector/time-selector.tsx +41 -63
  68. package/src/timedurationpicker/index.ts +1 -0
  69. package/src/timedurationpicker/tests/timedurationpicker-expanded.tsx +59 -0
  70. package/src/timedurationpicker/tests/timedurationpicker.tsx +81 -0
  71. package/src/timedurationpicker/timedurationpicker.tsx +83 -0
  72. package/src/timepicker/tests/timepicker-adaptive.tsx +19 -10
  73. package/src/timepicker/timepicker.tsx +0 -1
@@ -0,0 +1,895 @@
1
+ (() => {
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __defProps = Object.defineProperties;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
7
+ var __getOwnPropNames = Object.getOwnPropertyNames;
8
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
9
+ var __getProtoOf = Object.getPrototypeOf;
10
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
11
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
12
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
13
+ var __spreadValues = (a, b) => {
14
+ for (var prop in b ||= {})
15
+ if (__hasOwnProp.call(b, prop))
16
+ __defNormalProp(a, prop, b[prop]);
17
+ if (__getOwnPropSymbols)
18
+ for (var prop of __getOwnPropSymbols(b)) {
19
+ if (__propIsEnum.call(b, prop))
20
+ __defNormalProp(a, prop, b[prop]);
21
+ }
22
+ return a;
23
+ };
24
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
+ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
26
+ get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
27
+ }) : x)(function(x) {
28
+ if (typeof require !== "undefined")
29
+ return require.apply(this, arguments);
30
+ throw new Error('Dynamic require of "' + x + '" is not supported');
31
+ });
32
+ var __objRest = (source, exclude) => {
33
+ var target = {};
34
+ for (var prop in source)
35
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
36
+ target[prop] = source[prop];
37
+ if (source != null && __getOwnPropSymbols)
38
+ for (var prop of __getOwnPropSymbols(source)) {
39
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
40
+ target[prop] = source[prop];
41
+ }
42
+ return target;
43
+ };
44
+ var __copyProps = (to, from, except, desc) => {
45
+ if (from && typeof from === "object" || typeof from === "function") {
46
+ for (let key of __getOwnPropNames(from))
47
+ if (!__hasOwnProp.call(to, key) && key !== except)
48
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
49
+ }
50
+ return to;
51
+ };
52
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
53
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
54
+ mod
55
+ ));
56
+
57
+ // src/calendar/tests/calendar-modern-size.tsx
58
+ var import_react = __toESM(__require("react"));
59
+ var import_client = __toESM(__require("react-dom/client"));
60
+
61
+ // src/calendar/calendar.tsx
62
+ var React = __toESM(__require("react"));
63
+
64
+ // src/utils/classNames.ts
65
+ var classNames = (...args) => {
66
+ const result = {};
67
+ const addLeafKeys = (arg) => {
68
+ typeof arg === "object" ? Object.keys(arg).forEach((key) => {
69
+ result[key] = arg[key];
70
+ }) : result[arg] = true;
71
+ };
72
+ const addKeys = (list) => list.filter((arg) => arg !== true && Boolean(arg)).map(
73
+ (arg) => Array.isArray(arg) ? addKeys(arg) : addLeafKeys(arg)
74
+ );
75
+ addKeys(args);
76
+ return Object.keys(result).map((key) => result[key] && key || null).filter((el) => el !== null).join(" ");
77
+ };
78
+
79
+ // src/utils/theme.ts
80
+ var kendoThemeMaps = {
81
+ sizeMap: {
82
+ small: "sm",
83
+ medium: "md",
84
+ large: "lg"
85
+ },
86
+ roundedMap: {
87
+ small: "sm",
88
+ medium: "md",
89
+ large: "lg"
90
+ },
91
+ calloutMap: {
92
+ top: "n",
93
+ bottom: "s",
94
+ left: "w",
95
+ right: "e"
96
+ },
97
+ orientationMap: {
98
+ vertical: "vstack",
99
+ horizontal: "hstack"
100
+ }
101
+ };
102
+
103
+ // src/calendar/calendar.tsx
104
+ var Calendar = class extends React.Component {
105
+ render() {
106
+ const _a = this.props, {
107
+ className,
108
+ size,
109
+ orientation,
110
+ calendarView,
111
+ calendarHeaderText,
112
+ viewsCount,
113
+ showWeek,
114
+ showOtherMonth,
115
+ showCalendarCaption,
116
+ showCalendarFooter,
117
+ selectedRange
118
+ } = _a, htmlAttributes = __objRest(_a, [
119
+ "className",
120
+ "size",
121
+ "orientation",
122
+ "calendarView",
123
+ "calendarHeaderText",
124
+ "viewsCount",
125
+ "showWeek",
126
+ "showOtherMonth",
127
+ "showCalendarCaption",
128
+ "showCalendarFooter",
129
+ "selectedRange"
130
+ ]);
131
+ return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, htmlAttributes), {
132
+ className: classNames(
133
+ className,
134
+ "k-calendar",
135
+ {
136
+ [`k-calendar-${kendoThemeMaps.sizeMap[size] || size}`]: size,
137
+ "k-week-number": showWeek
138
+ }
139
+ )
140
+ }), /* @__PURE__ */ React.createElement(CalendarHeader, {
141
+ showToday: showCalendarFooter ? false : true,
142
+ calendarHeaderText,
143
+ orientation,
144
+ size
145
+ }), /* @__PURE__ */ React.createElement(CalendarView, {
146
+ calendarView,
147
+ viewsCount,
148
+ orientation,
149
+ showWeek,
150
+ showOtherMonth,
151
+ showCalendarCaption,
152
+ selectedRange
153
+ }), showCalendarFooter && /* @__PURE__ */ React.createElement(CalendarFooter, null));
154
+ }
155
+ };
156
+ Calendar.defaultProps = {
157
+ size: "medium",
158
+ viewsCount: "1",
159
+ orientation: "horizontal",
160
+ calendarView: "month",
161
+ calendarHeaderText: "October 2021"
162
+ };
163
+
164
+ // src/calendar/calendar-cell.tsx
165
+ var React2 = __toESM(__require("react"));
166
+ var CalendarCell = class extends React2.Component {
167
+ render() {
168
+ const _a = this.props, {
169
+ className,
170
+ text,
171
+ headerCell,
172
+ today,
173
+ weekend,
174
+ otherMonth,
175
+ showOtherMonth,
176
+ weekCell,
177
+ hover,
178
+ focus,
179
+ active,
180
+ selected,
181
+ disabled,
182
+ rangeStart,
183
+ rangeMid,
184
+ rangeEnd
185
+ } = _a, htmlAttributes = __objRest(_a, [
186
+ "className",
187
+ "text",
188
+ "headerCell",
189
+ "today",
190
+ "weekend",
191
+ "otherMonth",
192
+ "showOtherMonth",
193
+ "weekCell",
194
+ "hover",
195
+ "focus",
196
+ "active",
197
+ "selected",
198
+ "disabled",
199
+ "rangeStart",
200
+ "rangeMid",
201
+ "rangeEnd"
202
+ ]);
203
+ const cellType = headerCell ? "th" : "td";
204
+ const calendarCellClasses = [
205
+ className,
206
+ `k-calendar-${cellType}`,
207
+ {
208
+ "k-hover": hover,
209
+ "k-focus": focus,
210
+ "k-active": active,
211
+ "k-selected": selected,
212
+ "k-disabled": disabled,
213
+ "k-today": today,
214
+ "k-weekend": weekend,
215
+ "k-other-month": otherMonth,
216
+ "k-alt": weekCell,
217
+ "k-range-start": rangeStart,
218
+ "k-range-mid": rangeMid,
219
+ "k-range-end": rangeEnd
220
+ }
221
+ ];
222
+ if (headerCell) {
223
+ return /* @__PURE__ */ React2.createElement("th", __spreadProps(__spreadValues({}, htmlAttributes), {
224
+ className: classNames(calendarCellClasses)
225
+ }), text);
226
+ }
227
+ if (weekCell) {
228
+ return /* @__PURE__ */ React2.createElement("td", __spreadProps(__spreadValues({}, htmlAttributes), {
229
+ className: classNames(calendarCellClasses)
230
+ }), text);
231
+ }
232
+ return /* @__PURE__ */ React2.createElement("td", __spreadProps(__spreadValues({}, htmlAttributes), {
233
+ className: classNames(calendarCellClasses)
234
+ }), otherMonth && !showOtherMonth ? "" : /* @__PURE__ */ React2.createElement("span", {
235
+ className: "k-link"
236
+ }, text));
237
+ }
238
+ };
239
+
240
+ // src/calendar/calendar-header.tsx
241
+ var React5 = __toESM(__require("react"));
242
+
243
+ // src/button/button.tsx
244
+ var React4 = __toESM(__require("react"));
245
+
246
+ // src/icon/icon.tsx
247
+ var React3 = __toESM(__require("react"));
248
+ var Icon = class extends React3.Component {
249
+ render() {
250
+ const {
251
+ className,
252
+ style,
253
+ name
254
+ } = this.props;
255
+ return /* @__PURE__ */ React3.createElement(React3.Fragment, null, name && /* @__PURE__ */ React3.createElement("span", {
256
+ className: classNames(
257
+ className,
258
+ "k-icon",
259
+ {
260
+ [`k-i-${name}`]: name
261
+ }
262
+ ),
263
+ style
264
+ }));
265
+ }
266
+ };
267
+
268
+ // src/button/button.tsx
269
+ var Button = class extends React4.Component {
270
+ render() {
271
+ const _a = this.props, {
272
+ children,
273
+ className,
274
+ iconClassName,
275
+ text,
276
+ icon,
277
+ size,
278
+ rounded,
279
+ fillMode,
280
+ themeColor,
281
+ hover,
282
+ focus,
283
+ active,
284
+ selected,
285
+ disabled,
286
+ showArrow,
287
+ arrowIconName
288
+ } = _a, htmlAttributes = __objRest(_a, [
289
+ "children",
290
+ "className",
291
+ "iconClassName",
292
+ "text",
293
+ "icon",
294
+ "size",
295
+ "rounded",
296
+ "fillMode",
297
+ "themeColor",
298
+ "hover",
299
+ "focus",
300
+ "active",
301
+ "selected",
302
+ "disabled",
303
+ "showArrow",
304
+ "arrowIconName"
305
+ ]);
306
+ const hasIcon = icon !== void 0;
307
+ const hasChildren = children !== void 0;
308
+ return /* @__PURE__ */ React4.createElement("button", __spreadProps(__spreadValues({
309
+ style: this.props.style
310
+ }, htmlAttributes), {
311
+ dir: this.props.dir,
312
+ className: classNames(
313
+ className,
314
+ "k-button",
315
+ {
316
+ [`k-button-${kendoThemeMaps.sizeMap[size] || size}`]: size,
317
+ [`k-button-${fillMode}`]: fillMode,
318
+ [`k-button-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
319
+ [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
320
+ "k-icon-button": !text && !hasChildren && hasIcon,
321
+ "k-hover": hover,
322
+ "k-focus": focus,
323
+ "k-active": active,
324
+ "k-selected": selected,
325
+ "k-disabled": disabled
326
+ }
327
+ )
328
+ }), icon && /* @__PURE__ */ React4.createElement(Icon, {
329
+ className: classNames(iconClassName, "k-button-icon"),
330
+ name: icon
331
+ }), text ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, text && /* @__PURE__ */ React4.createElement("span", {
332
+ className: "k-button-text"
333
+ }, text), children) : children && /* @__PURE__ */ React4.createElement("span", {
334
+ className: "k-button-text"
335
+ }, children), showArrow && /* @__PURE__ */ React4.createElement("span", {
336
+ className: "k-menu-button-arrow k-button-arrow"
337
+ }, /* @__PURE__ */ React4.createElement(Icon, {
338
+ name: arrowIconName
339
+ })));
340
+ }
341
+ };
342
+ Button.defaultProps = {
343
+ size: "medium",
344
+ rounded: "medium",
345
+ fillMode: "solid",
346
+ themeColor: "base",
347
+ showArrow: false,
348
+ arrowIconName: "arrow-s"
349
+ };
350
+
351
+ // src/calendar/calendar-header.tsx
352
+ var CalendarHeader = class extends React5.Component {
353
+ render() {
354
+ const _a = this.props, {
355
+ className,
356
+ calendarHeaderText,
357
+ showToday,
358
+ orientation,
359
+ size
360
+ } = _a, htmlAttributes = __objRest(_a, [
361
+ "className",
362
+ "calendarHeaderText",
363
+ "showToday",
364
+ "orientation",
365
+ "size"
366
+ ]);
367
+ return /* @__PURE__ */ React5.createElement("div", __spreadProps(__spreadValues({}, htmlAttributes), {
368
+ className: classNames(
369
+ className,
370
+ "k-calendar-header",
371
+ {
372
+ "k-vstack": orientation === "vertical"
373
+ }
374
+ )
375
+ }), /* @__PURE__ */ React5.createElement(Button, {
376
+ className: "k-calendar-title",
377
+ text: calendarHeaderText,
378
+ size,
379
+ fillMode: "flat"
380
+ }), /* @__PURE__ */ React5.createElement("span", {
381
+ className: "k-spacer"
382
+ }), /* @__PURE__ */ React5.createElement("span", {
383
+ className: "k-calendar-nav"
384
+ }, /* @__PURE__ */ React5.createElement(Button, {
385
+ className: "k-calendar-nav-prev",
386
+ icon: "arrow-chevron-left",
387
+ size,
388
+ fillMode: "flat"
389
+ }), showToday && /* @__PURE__ */ React5.createElement("span", {
390
+ className: "k-calendar-nav-today"
391
+ }, "Today"), /* @__PURE__ */ React5.createElement(Button, {
392
+ className: "k-calendar-nav-next",
393
+ icon: "arrow-chevron-right",
394
+ size,
395
+ fillMode: "flat"
396
+ })));
397
+ }
398
+ };
399
+ CalendarHeader.defaultProps = {
400
+ calendarHeaderText: "October 2021",
401
+ showToday: true,
402
+ orientation: "horizontal",
403
+ size: "medium"
404
+ };
405
+
406
+ // src/calendar/calendar-footer.tsx
407
+ var React6 = __toESM(__require("react"));
408
+ var CalendarFooter = class extends React6.Component {
409
+ render() {
410
+ const _a = this.props, {
411
+ className
412
+ } = _a, htmlAttributes = __objRest(_a, [
413
+ "className"
414
+ ]);
415
+ return /* @__PURE__ */ React6.createElement("div", __spreadProps(__spreadValues({}, htmlAttributes), {
416
+ className: classNames(
417
+ className,
418
+ "k-calendar-footer"
419
+ )
420
+ }), /* @__PURE__ */ React6.createElement("a", {
421
+ className: "k-calendar-nav-today"
422
+ }, "Monday, October 29, 2021"));
423
+ }
424
+ };
425
+
426
+ // src/calendar/calendar-table.tsx
427
+ var React7 = __toESM(__require("react"));
428
+ var CalendarTable = class extends React7.Component {
429
+ render() {
430
+ const _a = this.props, {
431
+ className,
432
+ calendarView,
433
+ showOtherMonth,
434
+ showWeek,
435
+ showCalendarCaption,
436
+ selectedRange
437
+ } = _a, htmlAttributes = __objRest(_a, [
438
+ "className",
439
+ "calendarView",
440
+ "showOtherMonth",
441
+ "showWeek",
442
+ "showCalendarCaption",
443
+ "selectedRange"
444
+ ]);
445
+ if (calendarView === "year") {
446
+ return /* @__PURE__ */ React7.createElement("table", __spreadProps(__spreadValues({}, htmlAttributes), {
447
+ className: classNames(
448
+ className,
449
+ "k-calendar-table"
450
+ )
451
+ }), showCalendarCaption && /* @__PURE__ */ React7.createElement("caption", {
452
+ className: "k-calendar-caption"
453
+ }, "2022"), /* @__PURE__ */ React7.createElement("tbody", {
454
+ className: "k-calendar-tbody"
455
+ }, /* @__PURE__ */ React7.createElement("tr", {
456
+ className: "k-calendar-tr"
457
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
458
+ text: "Jan"
459
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
460
+ text: "Feb"
461
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
462
+ text: "Mar"
463
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
464
+ text: "Apr"
465
+ })), /* @__PURE__ */ React7.createElement("tr", {
466
+ className: "k-calendar-tr"
467
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
468
+ text: "May"
469
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
470
+ text: "Jun",
471
+ hover: true
472
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
473
+ text: "Jul",
474
+ focus: true
475
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
476
+ text: "Au",
477
+ selected: true
478
+ })), /* @__PURE__ */ React7.createElement("tr", {
479
+ className: "k-calendar-tr"
480
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
481
+ text: "Sep"
482
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
483
+ text: "Oct",
484
+ today: true
485
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
486
+ text: "Nov"
487
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
488
+ text: "Dec"
489
+ }))));
490
+ }
491
+ if (calendarView === "decade") {
492
+ return /* @__PURE__ */ React7.createElement("table", __spreadProps(__spreadValues({}, htmlAttributes), {
493
+ className: classNames(
494
+ className,
495
+ "k-calendar-table"
496
+ )
497
+ }), showCalendarCaption && /* @__PURE__ */ React7.createElement("caption", {
498
+ className: "k-calendar-caption"
499
+ }, "2020 - 2029"), /* @__PURE__ */ React7.createElement("tbody", {
500
+ className: "k-calendar-tbody"
501
+ }, /* @__PURE__ */ React7.createElement("tr", {
502
+ className: "k-calendar-tr"
503
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
504
+ className: "k-out-of-range"
505
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
506
+ text: "2020"
507
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
508
+ text: "2021",
509
+ today: true
510
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
511
+ text: "2022"
512
+ })), /* @__PURE__ */ React7.createElement("tr", {
513
+ className: "k-calendar-tr"
514
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
515
+ text: "2023"
516
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
517
+ text: "2024",
518
+ hover: true
519
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
520
+ text: "2025",
521
+ focus: true
522
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
523
+ text: "2026",
524
+ selected: true
525
+ })), /* @__PURE__ */ React7.createElement("tr", {
526
+ className: "k-calendar-tr"
527
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
528
+ text: "2027"
529
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
530
+ text: "2028"
531
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
532
+ text: "2029"
533
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
534
+ className: "k-out-of-range"
535
+ }))));
536
+ }
537
+ if (calendarView === "century") {
538
+ return /* @__PURE__ */ React7.createElement("table", __spreadProps(__spreadValues({}, htmlAttributes), {
539
+ className: classNames(
540
+ className,
541
+ "k-calendar-table"
542
+ )
543
+ }), showCalendarCaption && /* @__PURE__ */ React7.createElement("caption", {
544
+ className: "k-calendar-caption"
545
+ }, "2000 - 2099"), /* @__PURE__ */ React7.createElement("tbody", {
546
+ className: "k-calendar-tbody"
547
+ }, /* @__PURE__ */ React7.createElement("tr", {
548
+ className: "k-calendar-tr"
549
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
550
+ text: "1990 - 1999"
551
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
552
+ text: "2000 - 2009"
553
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
554
+ text: "2010 - 2019",
555
+ today: true
556
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
557
+ text: "2020 - 2029"
558
+ })), /* @__PURE__ */ React7.createElement("tr", {
559
+ className: "k-calendar-tr"
560
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
561
+ text: "2030 - 2039"
562
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
563
+ text: "2040 - 2049",
564
+ hover: true
565
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
566
+ text: "2050 - 2059",
567
+ focus: true
568
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
569
+ text: "2060 - 2069",
570
+ selected: true
571
+ })), /* @__PURE__ */ React7.createElement("tr", {
572
+ className: "k-calendar-tr"
573
+ }, /* @__PURE__ */ React7.createElement(CalendarCell, {
574
+ text: "2070 - 2079"
575
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
576
+ text: "2080 - 2089"
577
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
578
+ text: "2090 - 2099"
579
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
580
+ className: "k-out-of-range"
581
+ }))));
582
+ }
583
+ return /* @__PURE__ */ React7.createElement("table", __spreadProps(__spreadValues({}, htmlAttributes), {
584
+ className: classNames(
585
+ className,
586
+ "k-calendar-table"
587
+ )
588
+ }), showCalendarCaption && /* @__PURE__ */ React7.createElement("caption", {
589
+ className: "k-calendar-caption"
590
+ }, "October 2021"), /* @__PURE__ */ React7.createElement(CalendarTableHead, {
591
+ showWeek
592
+ }), /* @__PURE__ */ React7.createElement("tbody", {
593
+ className: "k-calendar-tbody"
594
+ }, /* @__PURE__ */ React7.createElement("tr", {
595
+ className: "k-calendar-tr"
596
+ }, showWeek && /* @__PURE__ */ React7.createElement(CalendarCell, {
597
+ text: "39",
598
+ weekCell: true
599
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
600
+ text: "30",
601
+ otherMonth: true,
602
+ showOtherMonth
603
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
604
+ text: "1"
605
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
606
+ text: "2"
607
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
608
+ text: "3"
609
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
610
+ text: "4"
611
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
612
+ text: "5"
613
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
614
+ text: "6",
615
+ weekend: true
616
+ })), /* @__PURE__ */ React7.createElement("tr", {
617
+ className: "k-calendar-tr"
618
+ }, showWeek && /* @__PURE__ */ React7.createElement(CalendarCell, {
619
+ text: "40",
620
+ weekCell: true
621
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
622
+ text: "7",
623
+ weekend: true
624
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
625
+ text: "8",
626
+ hover: true
627
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
628
+ text: "9",
629
+ focus: true
630
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
631
+ text: "10",
632
+ selected: true
633
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
634
+ text: "11",
635
+ hover: true,
636
+ focus: true
637
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
638
+ text: "12",
639
+ hover: true,
640
+ selected: true
641
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
642
+ text: "13",
643
+ weekend: true
644
+ })), /* @__PURE__ */ React7.createElement("tr", {
645
+ className: "k-calendar-tr"
646
+ }, showWeek && /* @__PURE__ */ React7.createElement(CalendarCell, {
647
+ text: "41",
648
+ weekCell: true
649
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
650
+ text: "14",
651
+ weekend: true
652
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
653
+ text: "15"
654
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
655
+ text: "16",
656
+ today: true
657
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
658
+ text: "17"
659
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
660
+ text: "18"
661
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
662
+ text: "19"
663
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
664
+ text: "20",
665
+ weekend: true
666
+ })), /* @__PURE__ */ React7.createElement("tr", {
667
+ className: "k-calendar-tr"
668
+ }, showWeek && /* @__PURE__ */ React7.createElement(CalendarCell, {
669
+ text: "42",
670
+ weekCell: true
671
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
672
+ text: "21",
673
+ weekend: true
674
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
675
+ text: "22"
676
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
677
+ text: "23"
678
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
679
+ text: "24"
680
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
681
+ text: "25",
682
+ rangeStart: selectedRange,
683
+ selected: selectedRange
684
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
685
+ text: "26",
686
+ rangeMid: selectedRange
687
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
688
+ text: "27",
689
+ weekend: true,
690
+ rangeMid: selectedRange
691
+ })), /* @__PURE__ */ React7.createElement("tr", {
692
+ className: "k-calendar-tr"
693
+ }, showWeek && /* @__PURE__ */ React7.createElement(CalendarCell, {
694
+ text: "43",
695
+ weekCell: true
696
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
697
+ text: "28",
698
+ weekend: true,
699
+ rangeMid: selectedRange
700
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
701
+ text: "29",
702
+ rangeEnd: selectedRange,
703
+ focus: selectedRange,
704
+ selected: selectedRange
705
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
706
+ text: "30"
707
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
708
+ text: "31"
709
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
710
+ text: "1",
711
+ otherMonth: true,
712
+ showOtherMonth
713
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
714
+ text: "2",
715
+ otherMonth: true,
716
+ showOtherMonth
717
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
718
+ text: "3",
719
+ otherMonth: true,
720
+ weekend: true,
721
+ showOtherMonth
722
+ })), /* @__PURE__ */ React7.createElement("tr", {
723
+ className: "k-calendar-tr"
724
+ }, showWeek && /* @__PURE__ */ React7.createElement(CalendarCell, {
725
+ text: "44",
726
+ weekCell: true
727
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
728
+ text: "4",
729
+ otherMonth: true,
730
+ weekend: true,
731
+ showOtherMonth
732
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
733
+ text: "5",
734
+ otherMonth: true,
735
+ showOtherMonth
736
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
737
+ text: "6",
738
+ otherMonth: true,
739
+ showOtherMonth
740
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
741
+ text: "7",
742
+ otherMonth: true,
743
+ showOtherMonth
744
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
745
+ text: "8",
746
+ otherMonth: true,
747
+ showOtherMonth
748
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
749
+ text: "9",
750
+ otherMonth: true,
751
+ showOtherMonth
752
+ }), /* @__PURE__ */ React7.createElement(CalendarCell, {
753
+ text: "10",
754
+ otherMonth: true,
755
+ weekend: true,
756
+ showOtherMonth
757
+ }))));
758
+ }
759
+ };
760
+
761
+ // src/calendar/calendar-table-head.tsx
762
+ var React8 = __toESM(__require("react"));
763
+ var CalendarTableHead = class extends React8.Component {
764
+ render() {
765
+ const _a = this.props, {
766
+ className,
767
+ showWeek
768
+ } = _a, htmlAttributes = __objRest(_a, [
769
+ "className",
770
+ "showWeek"
771
+ ]);
772
+ return /* @__PURE__ */ React8.createElement("thead", __spreadProps(__spreadValues({}, htmlAttributes), {
773
+ className: classNames(
774
+ className,
775
+ "k-calendar-thead"
776
+ )
777
+ }), /* @__PURE__ */ React8.createElement("tr", {
778
+ className: "k-calendar-tr"
779
+ }, showWeek && /* @__PURE__ */ React8.createElement(CalendarCell, {
780
+ weekCell: true,
781
+ headerCell: true
782
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
783
+ text: "Su",
784
+ headerCell: true
785
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
786
+ text: "Mo",
787
+ headerCell: true
788
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
789
+ text: "Tu",
790
+ headerCell: true
791
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
792
+ text: "We",
793
+ headerCell: true
794
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
795
+ text: "Th",
796
+ headerCell: true
797
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
798
+ text: "Fr",
799
+ headerCell: true
800
+ }), /* @__PURE__ */ React8.createElement(CalendarCell, {
801
+ text: "Sa",
802
+ headerCell: true
803
+ })));
804
+ }
805
+ };
806
+
807
+ // src/calendar/calendar-view.tsx
808
+ var React9 = __toESM(__require("react"));
809
+ var CalendarView = class extends React9.Component {
810
+ render() {
811
+ const _a = this.props, {
812
+ className,
813
+ orientation,
814
+ calendarView,
815
+ viewsCount,
816
+ showWeek,
817
+ showOtherMonth,
818
+ showCalendarCaption,
819
+ selectedRange
820
+ } = _a, htmlAttributes = __objRest(_a, [
821
+ "className",
822
+ "orientation",
823
+ "calendarView",
824
+ "viewsCount",
825
+ "showWeek",
826
+ "showOtherMonth",
827
+ "showCalendarCaption",
828
+ "selectedRange"
829
+ ]);
830
+ const views = Number(viewsCount);
831
+ return /* @__PURE__ */ React9.createElement("div", __spreadProps(__spreadValues({}, htmlAttributes), {
832
+ className: classNames(
833
+ className,
834
+ "k-calendar-view",
835
+ `k-calendar-${calendarView}view`,
836
+ "k-align-items-start",
837
+ "k-justify-content-center",
838
+ {
839
+ [`k-${kendoThemeMaps.orientationMap[orientation] || orientation}`]: orientation
840
+ }
841
+ )
842
+ }), [...Array(views)].map(
843
+ (_e, i) => /* @__PURE__ */ React9.createElement(CalendarTable, {
844
+ key: i,
845
+ calendarView,
846
+ showWeek,
847
+ showOtherMonth,
848
+ showCalendarCaption,
849
+ selectedRange
850
+ })
851
+ ));
852
+ }
853
+ };
854
+ CalendarView.defaultProps = {
855
+ viewsCount: "1",
856
+ orientation: "horizontal",
857
+ calendarView: "month"
858
+ };
859
+
860
+ // src/calendar/tests/calendar-modern-size.tsx
861
+ var root = import_client.default.createRoot(
862
+ document.getElementById("app")
863
+ );
864
+ root.render(
865
+ /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", {
866
+ id: "test-area",
867
+ className: "k-d-grid k-grid-cols-3"
868
+ }, /* @__PURE__ */ import_react.default.createElement("span", null, "small"), /* @__PURE__ */ import_react.default.createElement("span", null, "medium"), /* @__PURE__ */ import_react.default.createElement("span", null, "large"), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(Calendar, {
869
+ calendarView: "month",
870
+ size: "small"
871
+ })), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(Calendar, {
872
+ calendarView: "month",
873
+ showOtherMonth: true,
874
+ size: "medium"
875
+ })), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(Calendar, {
876
+ calendarView: "month",
877
+ showOtherMonth: true,
878
+ showWeek: true,
879
+ size: "large"
880
+ })), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(Calendar, {
881
+ calendarView: "year",
882
+ calendarHeaderText: "2019",
883
+ size: "small"
884
+ })), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(Calendar, {
885
+ calendarView: "decade",
886
+ calendarHeaderText: "2020 - 2029",
887
+ size: "medium"
888
+ })), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement(Calendar, {
889
+ calendarView: "century",
890
+ calendarHeaderText: "2000 - 2099",
891
+ size: "large"
892
+ }))))
893
+ );
894
+ })();
895
+ //# sourceMappingURL=calendar-modern-size.js.map