@progress/kendo-themes-html 6.3.0 → 6.4.0-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 (256) hide show
  1. package/dist/action-sheet/tests/action-sheet-calendar-infinite.js +1284 -0
  2. package/dist/action-sheet/tests/action-sheet-calendar-infinite.js.map +7 -0
  3. package/dist/bottom-nav/bottom-nav-item.js +234 -0
  4. package/dist/bottom-nav/bottom-nav-item.js.map +7 -0
  5. package/dist/bottom-nav/bottom-nav.spec.js +122 -0
  6. package/dist/bottom-nav/bottom-nav.spec.js.map +7 -0
  7. package/dist/bottom-nav/tests/bottom-nav-colors.js +269 -358
  8. package/dist/bottom-nav/tests/bottom-nav-colors.js.map +4 -4
  9. package/dist/bottom-nav/tests/bottom-nav-items.js +168 -53
  10. package/dist/bottom-nav/tests/bottom-nav-items.js.map +4 -4
  11. package/dist/bottom-nav/tests/bottom-nav-rtl.js +153 -50
  12. package/dist/bottom-nav/tests/bottom-nav-rtl.js.map +4 -4
  13. package/dist/bottom-nav/tests/bottom-nav.js +167 -76
  14. package/dist/bottom-nav/tests/bottom-nav.js.map +4 -4
  15. package/dist/breadcrumb/breadcrumb-container.js +76 -0
  16. package/dist/breadcrumb/breadcrumb-container.js.map +7 -0
  17. package/dist/breadcrumb/breadcrumb-input-container.js +65 -0
  18. package/dist/breadcrumb/breadcrumb-input-container.js.map +7 -0
  19. package/dist/breadcrumb/breadcrumb-item-text.js +70 -0
  20. package/dist/breadcrumb/breadcrumb-item-text.js.map +7 -0
  21. package/dist/breadcrumb/breadcrumb-item.js +75 -0
  22. package/dist/breadcrumb/breadcrumb-item.js.map +7 -0
  23. package/dist/breadcrumb/breadcrumb-link.js +132 -0
  24. package/dist/breadcrumb/breadcrumb-link.js.map +7 -0
  25. package/dist/breadcrumb/breadcrumb-root-item-container.js +65 -0
  26. package/dist/breadcrumb/breadcrumb-root-item-container.js.map +7 -0
  27. package/dist/breadcrumb/breadcrumb.spec.js +125 -0
  28. package/dist/breadcrumb/breadcrumb.spec.js.map +7 -0
  29. package/dist/breadcrumb/tests/breadcrumb-rtl.js +349 -153
  30. package/dist/breadcrumb/tests/breadcrumb-rtl.js.map +4 -4
  31. package/dist/breadcrumb/tests/breadcrumb.js +349 -153
  32. package/dist/breadcrumb/tests/breadcrumb.js.map +4 -4
  33. package/dist/coloreditor/color-editor.spec.js +1586 -0
  34. package/dist/coloreditor/color-editor.spec.js.map +7 -0
  35. package/dist/coloreditor/tests/coloreditor-focused-colorgradient.js +821 -176
  36. package/dist/coloreditor/tests/coloreditor-focused-colorgradient.js.map +4 -4
  37. package/dist/coloreditor/tests/coloreditor-rtl.js +727 -265
  38. package/dist/coloreditor/tests/coloreditor-rtl.js.map +4 -4
  39. package/dist/coloreditor/tests/coloreditor-states.js +821 -176
  40. package/dist/coloreditor/tests/coloreditor-states.js.map +4 -4
  41. package/dist/coloreditor/tests/coloreditor-views.js +727 -265
  42. package/dist/coloreditor/tests/coloreditor-views.js.map +4 -4
  43. package/dist/coloreditor/tests/coloreditor.js +821 -176
  44. package/dist/coloreditor/tests/coloreditor.js.map +4 -4
  45. package/dist/colorgradient/color-contrast.js +199 -0
  46. package/dist/colorgradient/color-contrast.js.map +7 -0
  47. package/dist/colorgradient/color-gradient.spec.js +1246 -0
  48. package/dist/colorgradient/color-gradient.spec.js.map +7 -0
  49. package/dist/colorgradient/color-input.js +1029 -0
  50. package/dist/colorgradient/color-input.js.map +7 -0
  51. package/dist/colorgradient/tests/colorgradient-contrast.js +532 -155
  52. package/dist/colorgradient/tests/colorgradient-contrast.js.map +4 -4
  53. package/dist/colorgradient/tests/colorgradient-draghandle.js +536 -202
  54. package/dist/colorgradient/tests/colorgradient-draghandle.js.map +4 -4
  55. package/dist/colorgradient/tests/colorgradient-modes.js +433 -260
  56. package/dist/colorgradient/tests/colorgradient-modes.js.map +4 -4
  57. package/dist/colorgradient/tests/colorgradient-rtl.js +532 -155
  58. package/dist/colorgradient/tests/colorgradient-rtl.js.map +4 -4
  59. package/dist/colorgradient/tests/colorgradient-states.js +536 -132
  60. package/dist/colorgradient/tests/colorgradient-states.js.map +4 -4
  61. package/dist/colorgradient/tests/colorgradient.js +532 -132
  62. package/dist/colorgradient/tests/colorgradient.js.map +4 -4
  63. package/dist/colorpalette/colorpalette.spec.js +1 -1
  64. package/dist/colorpalette/colorpalette.spec.js.map +2 -2
  65. package/dist/colorpalette/tests/colorpalette-states.js +1 -1
  66. package/dist/colorpalette/tests/colorpalette-states.js.map +2 -2
  67. package/dist/colorpalette/tests/colorpalette-variants.js +1 -1
  68. package/dist/colorpalette/tests/colorpalette-variants.js.map +2 -2
  69. package/dist/colorpalette/tests/colorpalette.js +1 -1
  70. package/dist/colorpalette/tests/colorpalette.js.map +2 -2
  71. package/dist/colorpicker/tests/colorpicker-dropdown.js +757 -185
  72. package/dist/colorpicker/tests/colorpicker-dropdown.js.map +4 -4
  73. package/dist/editor/tests/editor-table-wizard.js +1984 -0
  74. package/dist/editor/tests/editor-table-wizard.js.map +7 -0
  75. package/dist/expansion-panel/expansion-panel.spec.js +253 -0
  76. package/dist/expansion-panel/expansion-panel.spec.js.map +7 -0
  77. package/dist/expansion-panel/tests/expansion-panel-rtl.js +100 -83
  78. package/dist/expansion-panel/tests/expansion-panel-rtl.js.map +4 -4
  79. package/dist/expansion-panel/tests/expansion-panel.js +100 -83
  80. package/dist/expansion-panel/tests/expansion-panel.js.map +4 -4
  81. package/dist/filemanager/tests/filemanager-contextmenu.js +492 -340
  82. package/dist/filemanager/tests/filemanager-contextmenu.js.map +4 -4
  83. package/dist/filemanager/tests/filemanager-drag-hint.js +468 -316
  84. package/dist/filemanager/tests/filemanager-drag-hint.js.map +4 -4
  85. package/dist/filemanager/tests/filemanager-gridview.js +533 -381
  86. package/dist/filemanager/tests/filemanager-gridview.js.map +4 -4
  87. package/dist/filemanager/tests/filemanager-listview.js +487 -335
  88. package/dist/filemanager/tests/filemanager-listview.js.map +4 -4
  89. package/dist/filemanager/tests/filemanager-preview.js +586 -434
  90. package/dist/filemanager/tests/filemanager-preview.js.map +4 -4
  91. package/dist/grid/tests/grid-column-menu-rtl.js +15 -15
  92. package/dist/grid/tests/grid-column-menu-rtl.js.map +2 -2
  93. package/dist/grid/tests/grid-column-menu.js +15 -15
  94. package/dist/grid/tests/grid-column-menu.js.map +2 -2
  95. package/dist/index.js +2131 -1244
  96. package/dist/index.js.map +4 -4
  97. package/dist/multiselecttree/multiselecttree.spec.js +1003 -0
  98. package/dist/multiselecttree/multiselecttree.spec.js.map +7 -0
  99. package/dist/multiselecttree/tests/multiselecttree-flat.js +1208 -0
  100. package/dist/multiselecttree/tests/multiselecttree-flat.js.map +7 -0
  101. package/dist/{editor/tests/editor-table-wizard-accessibility.js → multiselecttree/tests/multiselecttree-opened.js} +646 -645
  102. package/dist/multiselecttree/tests/multiselecttree-opened.js.map +7 -0
  103. package/dist/multiselecttree/tests/multiselecttree-outline.js +1208 -0
  104. package/dist/multiselecttree/tests/multiselecttree-outline.js.map +7 -0
  105. package/dist/multiselecttree/tests/multiselecttree-size.js +1107 -0
  106. package/dist/multiselecttree/tests/multiselecttree-size.js.map +7 -0
  107. package/dist/multiselecttree/tests/multiselecttree.js +1194 -0
  108. package/dist/multiselecttree/tests/multiselecttree.js.map +7 -0
  109. package/dist/pivotgrid/tests/pivotgrid-column-menus.js +8 -8
  110. package/dist/pivotgrid/tests/pivotgrid-column-menus.js.map +2 -2
  111. package/dist/scheduler/tests/scheduler-adaptive-agenda.js +6 -4
  112. package/dist/scheduler/tests/scheduler-adaptive-agenda.js.map +2 -2
  113. package/dist/scheduler/tests/scheduler-adaptive-day-resource-group.js +6 -4
  114. package/dist/scheduler/tests/scheduler-adaptive-day-resource-group.js.map +2 -2
  115. package/dist/scheduler/tests/scheduler-adaptive-day.js +6 -4
  116. package/dist/scheduler/tests/scheduler-adaptive-day.js.map +2 -2
  117. package/dist/scheduler/tests/scheduler-adaptive-month.js +6 -4
  118. package/dist/scheduler/tests/scheduler-adaptive-month.js.map +2 -2
  119. package/dist/scheduler/tests/scheduler-angular-agenda-rtl.js +8 -11
  120. package/dist/scheduler/tests/scheduler-angular-agenda-rtl.js.map +2 -2
  121. package/dist/scheduler/tests/scheduler-angular-agenda.js +8 -11
  122. package/dist/scheduler/tests/scheduler-angular-agenda.js.map +2 -2
  123. package/dist/scheduler/tests/scheduler-angular-day-rtl.js +8 -11
  124. package/dist/scheduler/tests/scheduler-angular-day-rtl.js.map +2 -2
  125. package/dist/scheduler/tests/scheduler-angular-month-rtl.js +8 -11
  126. package/dist/scheduler/tests/scheduler-angular-month-rtl.js.map +2 -2
  127. package/dist/scheduler/tests/scheduler-angular-month.js +8 -11
  128. package/dist/scheduler/tests/scheduler-angular-month.js.map +2 -2
  129. package/dist/scheduler/tests/scheduler-angular-rtl.js +8 -11
  130. package/dist/scheduler/tests/scheduler-angular-rtl.js.map +2 -2
  131. package/dist/scheduler/tests/scheduler-angular.js +8 -11
  132. package/dist/scheduler/tests/scheduler-angular.js.map +2 -2
  133. package/dist/scheduler/tests/scheduler-flex-layout.js +7 -10
  134. package/dist/scheduler/tests/scheduler-flex-layout.js.map +2 -2
  135. package/dist/scheduler/tests/scheduler-jquery-agenda.js +7 -10
  136. package/dist/scheduler/tests/scheduler-jquery-agenda.js.map +2 -2
  137. package/dist/scheduler/tests/scheduler-jquery-month.js +7 -10
  138. package/dist/scheduler/tests/scheduler-jquery-month.js.map +2 -2
  139. package/dist/scheduler/tests/scheduler-react-agenda.js +7 -10
  140. package/dist/scheduler/tests/scheduler-react-agenda.js.map +2 -2
  141. package/dist/scheduler/tests/scheduler-react-day.js +7 -10
  142. package/dist/scheduler/tests/scheduler-react-day.js.map +2 -2
  143. package/dist/scheduler/tests/scheduler-react-month.js +7 -10
  144. package/dist/scheduler/tests/scheduler-react-month.js.map +2 -2
  145. package/dist/scheduler/tests/scheduler-react-timeline-multi.js +7 -10
  146. package/dist/scheduler/tests/scheduler-react-timeline-multi.js.map +2 -2
  147. package/dist/scheduler/tests/scheduler-react-timeline.js +14 -20
  148. package/dist/scheduler/tests/scheduler-react-timeline.js.map +2 -2
  149. package/dist/scheduler/tests/scheduler-react-week.js +7 -10
  150. package/dist/scheduler/tests/scheduler-react-week.js.map +2 -2
  151. package/dist/scheduler/tests/scheduler-year.js +6 -9
  152. package/dist/scheduler/tests/scheduler-year.js.map +2 -2
  153. package/dist/scheduler/tests/scheduler.js +13 -19
  154. package/dist/scheduler/tests/scheduler.js.map +2 -2
  155. package/dist/slider/slider-tick.js +48 -0
  156. package/dist/slider/slider-tick.js.map +7 -0
  157. package/dist/slider/slider.spec.js +411 -0
  158. package/dist/slider/slider.spec.js.map +7 -0
  159. package/dist/slider/tests/slider-css-vars.js +300 -268
  160. package/dist/slider/tests/slider-css-vars.js.map +4 -4
  161. package/dist/slider/tests/slider-tick-absolute-position.js +155 -36
  162. package/dist/slider/tests/slider-tick-absolute-position.js.map +4 -4
  163. package/dist/slider/tests/slider.js +235 -209
  164. package/dist/slider/tests/slider.js.map +4 -4
  165. package/dist/spreadsheet/tests/spreadsheet-filter-menu.js +2 -2
  166. package/dist/spreadsheet/tests/spreadsheet-filter-menu.js.map +2 -2
  167. package/package.json +2 -2
  168. package/src/action-sheet/tests/action-sheet-calendar-infinite.tsx +605 -0
  169. package/src/bottom-nav/bottom-nav-item.tsx +62 -0
  170. package/src/bottom-nav/bottom-nav.spec.tsx +76 -0
  171. package/src/bottom-nav/index.ts +2 -0
  172. package/src/bottom-nav/tests/bottom-nav-colors.tsx +109 -325
  173. package/src/bottom-nav/tests/bottom-nav-items.tsx +12 -22
  174. package/src/bottom-nav/tests/bottom-nav-rtl.tsx +13 -37
  175. package/src/bottom-nav/tests/bottom-nav.tsx +29 -77
  176. package/src/breadcrumb/breadcrumb-container.tsx +36 -0
  177. package/src/breadcrumb/breadcrumb-input-container.tsx +22 -0
  178. package/src/breadcrumb/breadcrumb-item-text.tsx +32 -0
  179. package/src/breadcrumb/breadcrumb-item.tsx +34 -0
  180. package/src/breadcrumb/breadcrumb-link.tsx +55 -0
  181. package/src/breadcrumb/breadcrumb-root-item-container.tsx +22 -0
  182. package/src/breadcrumb/breadcrumb.spec.tsx +55 -0
  183. package/src/breadcrumb/index.ts +7 -0
  184. package/src/breadcrumb/tests/breadcrumb-rtl.tsx +275 -231
  185. package/src/breadcrumb/tests/breadcrumb.tsx +274 -231
  186. package/src/coloreditor/color-editor.spec.tsx +93 -0
  187. package/src/coloreditor/index.ts +1 -0
  188. package/src/coloreditor/tests/coloreditor-focused-colorgradient.tsx +2 -76
  189. package/src/coloreditor/tests/coloreditor-rtl.tsx +3 -107
  190. package/src/coloreditor/tests/coloreditor-states.tsx +2 -77
  191. package/src/coloreditor/tests/coloreditor-views.tsx +3 -107
  192. package/src/coloreditor/tests/coloreditor.tsx +2 -77
  193. package/src/colorgradient/color-contrast.tsx +44 -0
  194. package/src/colorgradient/color-gradient.spec.tsx +102 -0
  195. package/src/colorgradient/color-input.tsx +123 -0
  196. package/src/colorgradient/index.ts +4 -0
  197. package/src/colorgradient/tests/colorgradient-contrast.tsx +2 -83
  198. package/src/colorgradient/tests/colorgradient-draghandle.tsx +4 -146
  199. package/src/colorgradient/tests/colorgradient-modes.tsx +6 -214
  200. package/src/colorgradient/tests/colorgradient-rtl.tsx +2 -74
  201. package/src/colorgradient/tests/colorgradient-states.tsx +14 -51
  202. package/src/colorgradient/tests/colorgradient.tsx +2 -55
  203. package/src/colorpalette/colorpalette.spec.tsx +5 -5
  204. package/src/colorpicker/tests/colorpicker-dropdown.tsx +7 -184
  205. package/src/editor/tests/editor-table-wizard.tsx +280 -0
  206. package/src/expansion-panel/expansion-panel.spec.tsx +86 -0
  207. package/src/expansion-panel/index.ts +1 -0
  208. package/src/expansion-panel/tests/expansion-panel-rtl.tsx +48 -111
  209. package/src/expansion-panel/tests/expansion-panel.tsx +49 -111
  210. package/src/filemanager/tests/filemanager-contextmenu.tsx +9 -8
  211. package/src/filemanager/tests/filemanager-drag-hint.tsx +9 -8
  212. package/src/filemanager/tests/filemanager-gridview.tsx +17 -16
  213. package/src/filemanager/tests/filemanager-listview.tsx +17 -16
  214. package/src/filemanager/tests/filemanager-preview.tsx +25 -24
  215. package/src/grid/tests/grid-column-menu-rtl.tsx +45 -15
  216. package/src/grid/tests/grid-column-menu.tsx +45 -15
  217. package/src/index.ts +7 -4
  218. package/src/multiselecttree/index.ts +1 -0
  219. package/src/multiselecttree/multiselecttree.spec.tsx +150 -0
  220. package/src/multiselecttree/tests/multiselecttree-flat.tsx +179 -0
  221. package/src/multiselecttree/tests/multiselecttree-opened.tsx +119 -0
  222. package/src/multiselecttree/tests/multiselecttree-outline.tsx +179 -0
  223. package/src/multiselecttree/tests/multiselecttree-size.tsx +54 -0
  224. package/src/multiselecttree/tests/multiselecttree.tsx +179 -0
  225. package/src/pivotgrid/tests/pivotgrid-column-menus.tsx +24 -8
  226. package/src/scheduler/tests/scheduler-adaptive-agenda.tsx +13 -14
  227. package/src/scheduler/tests/scheduler-adaptive-day-resource-group.tsx +13 -14
  228. package/src/scheduler/tests/scheduler-adaptive-day.tsx +13 -14
  229. package/src/scheduler/tests/scheduler-adaptive-month.tsx +13 -14
  230. package/src/scheduler/tests/scheduler-angular-agenda-rtl.tsx +13 -17
  231. package/src/scheduler/tests/scheduler-angular-agenda.tsx +13 -17
  232. package/src/scheduler/tests/scheduler-angular-day-rtl.tsx +13 -17
  233. package/src/scheduler/tests/scheduler-angular-month-rtl.tsx +13 -17
  234. package/src/scheduler/tests/scheduler-angular-month.tsx +13 -17
  235. package/src/scheduler/tests/scheduler-angular-rtl.tsx +13 -17
  236. package/src/scheduler/tests/scheduler-angular.tsx +13 -17
  237. package/src/scheduler/tests/scheduler-flex-layout.tsx +10 -14
  238. package/src/scheduler/tests/scheduler-jquery-agenda.tsx +10 -14
  239. package/src/scheduler/tests/scheduler-jquery-month.tsx +10 -14
  240. package/src/scheduler/tests/scheduler-react-agenda.tsx +10 -14
  241. package/src/scheduler/tests/scheduler-react-day.tsx +10 -14
  242. package/src/scheduler/tests/scheduler-react-month.tsx +10 -14
  243. package/src/scheduler/tests/scheduler-react-timeline-multi.tsx +10 -14
  244. package/src/scheduler/tests/scheduler-react-timeline.tsx +19 -28
  245. package/src/scheduler/tests/scheduler-react-week.tsx +10 -14
  246. package/src/scheduler/tests/scheduler-year.tsx +9 -13
  247. package/src/scheduler/tests/scheduler.tsx +20 -27
  248. package/src/slider/index.ts +2 -0
  249. package/src/slider/slider-tick.tsx +52 -0
  250. package/src/slider/slider.spec.tsx +120 -0
  251. package/src/slider/tests/slider-css-vars.tsx +185 -349
  252. package/src/slider/tests/slider-tick-absolute-position.tsx +40 -64
  253. package/src/slider/tests/slider.tsx +118 -262
  254. package/src/spreadsheet/tests/spreadsheet-filter-menu.tsx +6 -2
  255. package/dist/editor/tests/editor-table-wizard-accessibility.js.map +0 -7
  256. package/src/editor/tests/editor-table-wizard-accessibility.tsx +0 -69
package/src/action-sheet/tests/action-sheet-calendar-infinite.tsx ADDED
@@ -0,0 +1,605 @@
1
+ import ReactDOM from 'react-dom/client';
2
+ import { ActionSheet, ActionSheetHeader } from '..';
3
+
4
+ const root = ReactDOM.createRoot(
5
+ document.getElementById('app') as HTMLElement
6
+ );
7
+
8
+ const styles = `
9
+ #test-area {
10
+ --kendo-actionsheet-height: 400px;
11
+ --kendo-actionsheet-max-height: 400px;
12
+ }
13
+ #test-area> section {
14
+ height: 600px;
15
+ outline: 1px dotted;
16
+ overflow: hidden;
17
+ position: relative;
18
+ transform: translateZ(0);
19
+ }
20
+ `;
21
+
22
+ root.render(
23
+ <>
24
+ <style>{styles}</style>
25
+ <div id="test-area" className="k-d-grid k-grid-cols-2">
26
+
27
+ <span>partial</span>
28
+ <span>full screen</span>
29
+
30
+ <section>
31
+ <ActionSheet adaptive={true}>
32
+ <ActionSheetHeader actions={[ 'x' ]}>
33
+ <div className="k-text-center">Select date</div>
34
+ </ActionSheetHeader>
35
+ <div className="k-widget k-calendar k-calendar-lg k-calendar-infinite">
36
+ <div className="k-vstack k-calendar-view k-calendar-monthview">
37
+ <div className="k-calendar-header k-hstack">
38
+ <span className="k-button k-nav-fast k-button-md k-rounded-md k-button-flat k-button-flat-base k-calendar-title">December 1999</span>
39
+ <span className="k-spacer"></span>
40
+ <span className="k-calendar-nav k-hstack">
41
+ <button className="k-calendar-nav-today k-button k-button-md k-button-flat k-button-flat-primary k-rounded-md"> Today </button>
42
+ </span>
43
+ </div>
44
+ <table className="k-calendar-weekdays k-calendar-table">
45
+ <thead className="k-calendar-thead">
46
+ <tr className="k-calendar-tr">
47
+ <th className="k-calendar-th">Su</th>
48
+ <th className="k-calendar-th">Mo</th>
49
+ <th className="k-calendar-th">Tu</th>
50
+ <th className="k-calendar-th">We</th>
51
+ <th className="k-calendar-th">Th</th>
52
+ <th className="k-calendar-th">Fr</th>
53
+ <th className="k-calendar-th">Sa</th>
54
+ </tr>
55
+ </thead>
56
+ </table>
57
+ <div className="k-flex k-content k-scrollable">
58
+ <table className="k-calendar-table">
59
+ <colgroup>
60
+ <col />
61
+ <col />
62
+ <col />
63
+ <col />
64
+ <col />
65
+ <col />
66
+ <col />
67
+ </colgroup>
68
+ <tbody className="k-calendar-tbody">
69
+ <tr className="k-calendar-tr">
70
+ <th className="k-calendar-caption" colSpan={7}>December 1999</th>
71
+ </tr>
72
+ <tr className="k-calendar-tr">
73
+ <td className="k-empty k-calendar-td">&nbsp;</td>
74
+ <td className="k-empty k-calendar-td">&nbsp;</td>
75
+ <td className="k-empty k-calendar-td">&nbsp;</td>
76
+ <td className="k-calendar-td">
77
+ <span className="k-link">1</span>
78
+ </td>
79
+ <td className="k-calendar-td">
80
+ <span className="k-link">2</span>
81
+ </td>
82
+ <td className="k-calendar-td">
83
+ <span className="k-link">3</span>
84
+ </td>
85
+ <td className="k-calendar-td k-weekend">
86
+ <span className="k-link">4</span>
87
+ </td>
88
+ </tr>
89
+ <tr className="k-calendar-tr">
90
+ <td className="k-calendar-td k-weekend">
91
+ <span className="k-link">5</span>
92
+ </td>
93
+ <td className="k-calendar-td">
94
+ <span className="k-link">6</span>
95
+ </td>
96
+ <td className="k-calendar-td">
97
+ <span className="k-link">7</span>
98
+ </td>
99
+ <td className="k-calendar-td">
100
+ <span className="k-link">8</span>
101
+ </td>
102
+ <td className="k-calendar-td">
103
+ <span className="k-link">9</span>
104
+ </td>
105
+ <td className="k-calendar-td">
106
+ <span className="k-link">10</span>
107
+ </td>
108
+ <td className="k-calendar-td k-weekend">
109
+ <span className="k-link">11</span>
110
+ </td>
111
+ </tr>
112
+ <tr className="k-calendar-tr">
113
+ <td className="k-calendar-td k-weekend">
114
+ <span className="k-link">12</span>
115
+ </td>
116
+ <td className="k-calendar-td">
117
+ <span className="k-link">13</span>
118
+ </td>
119
+ <td className="k-calendar-td">
120
+ <span className="k-link">14</span>
121
+ </td>
122
+ <td className="k-calendar-td">
123
+ <span className="k-link">15</span>
124
+ </td>
125
+ <td className="k-calendar-td">
126
+ <span className="k-link">16</span>
127
+ </td>
128
+ <td className="k-calendar-td">
129
+ <span className="k-link">17</span>
130
+ </td>
131
+ <td className="k-calendar-td k-weekend">
132
+ <span className="k-link">18</span>
133
+ </td>
134
+ </tr>
135
+ <tr className="k-calendar-tr">
136
+ <td className="k-calendar-td k-weekend">
137
+ <span className="k-link">19</span>
138
+ </td>
139
+ <td className="k-calendar-td">
140
+ <span className="k-link">20</span>
141
+ </td>
142
+ <td className="k-calendar-td">
143
+ <span className="k-link">21</span>
144
+ </td>
145
+ <td className="k-calendar-td">
146
+ <span className="k-link">22</span>
147
+ </td>
148
+ <td className="k-calendar-td">
149
+ <span className="k-link">23</span>
150
+ </td>
151
+ <td className="k-calendar-td">
152
+ <span className="k-link">24</span>
153
+ </td>
154
+ <td className="k-calendar-td k-weekend">
155
+ <span className="k-link">25</span>
156
+ </td>
157
+ </tr>
158
+ <tr className="k-calendar-tr">
159
+ <td className="k-calendar-td k-weekend">
160
+ <span className="k-link">26</span>
161
+ </td>
162
+ <td className="k-calendar-td">
163
+ <span className="k-link">27</span>
164
+ </td>
165
+ <td className="k-calendar-td">
166
+ <span className="k-link">28</span>
167
+ </td>
168
+ <td className="k-calendar-td">
169
+ <span className="k-link">29</span>
170
+ </td>
171
+ <td className="k-calendar-td">
172
+ <span className="k-link">30</span>
173
+ </td>
174
+ <td className="k-calendar-td">
175
+ <span className="k-link">31</span>
176
+ </td>
177
+ <td className="k-empty k-calendar-td">&nbsp;</td>
178
+ </tr>
179
+ <tr className="k-calendar-tr">
180
+ <td className="k-empty k-calendar-td">&nbsp;</td>
181
+ <td className="k-empty k-calendar-td">&nbsp;</td>
182
+ <td className="k-empty k-calendar-td">&nbsp;</td>
183
+ <td className="k-empty k-calendar-td">&nbsp;</td>
184
+ <td className="k-empty k-calendar-td">&nbsp;</td>
185
+ <td className="k-empty k-calendar-td">&nbsp;</td>
186
+ <td className="k-empty k-calendar-td">&nbsp;</td>
187
+ </tr>
188
+ </tbody>
189
+ <tbody className="k-calendar-tbody">
190
+ <tr className="k-calendar-tr">
191
+ <th className="k-calendar-caption" colSpan={7}>January 2000</th>
192
+ </tr>
193
+ <tr className="k-calendar-tr">
194
+ <td className="k-empty k-calendar-td">&nbsp;</td>
195
+ <td className="k-empty k-calendar-td">&nbsp;</td>
196
+ <td className="k-empty k-calendar-td">&nbsp;</td>
197
+ <td className="k-empty k-calendar-td">&nbsp;</td>
198
+ <td className="k-empty k-calendar-td">&nbsp;</td>
199
+ <td className="k-empty k-calendar-td">&nbsp;</td>
200
+ <td className="k-calendar-td k-weekend">
201
+ <span className="k-link">1</span>
202
+ </td>
203
+ </tr>
204
+ <tr className="k-calendar-tr">
205
+ <td className="k-calendar-td k-weekend">
206
+ <span className="k-link">2</span>
207
+ </td>
208
+ <td className="k-calendar-td">
209
+ <span className="k-link">3</span>
210
+ </td>
211
+ <td className="k-calendar-td">
212
+ <span className="k-link">4</span>
213
+ </td>
214
+ <td className="k-calendar-td">
215
+ <span className="k-link">5</span>
216
+ </td>
217
+ <td className="k-calendar-td">
218
+ <span className="k-link">6</span>
219
+ </td>
220
+ <td className="k-calendar-td">
221
+ <span className="k-link">7</span>
222
+ </td>
223
+ <td className="k-calendar-td k-weekend">
224
+ <span className="k-link">8</span>
225
+ </td>
226
+ </tr>
227
+ <tr className="k-calendar-tr">
228
+ <td className="k-calendar-td k-weekend">
229
+ <span className="k-link">9</span>
230
+ </td>
231
+ <td className="k-calendar-td">
232
+ <span className="k-link">10</span>
233
+ </td>
234
+ <td className="k-calendar-td">
235
+ <span className="k-link">11</span>
236
+ </td>
237
+ <td className="k-calendar-td">
238
+ <span className="k-link">12</span>
239
+ </td>
240
+ <td className="k-calendar-td">
241
+ <span className="k-link">13</span>
242
+ </td>
243
+ <td className="k-calendar-td">
244
+ <span className="k-link">14</span>
245
+ </td>
246
+ <td className="k-calendar-td k-weekend">
247
+ <span className="k-link">15</span>
248
+ </td>
249
+ </tr>
250
+ <tr className="k-calendar-tr">
251
+ <td className="k-calendar-td k-weekend">
252
+ <span className="k-link">16</span>
253
+ </td>
254
+ <td className="k-calendar-td">
255
+ <span className="k-link">17</span>
256
+ </td>
257
+ <td className="k-calendar-td">
258
+ <span className="k-link">18</span>
259
+ </td>
260
+ <td className="k-calendar-td">
261
+ <span className="k-link">19</span>
262
+ </td>
263
+ <td className="k-calendar-td">
264
+ <span className="k-link">20</span>
265
+ </td>
266
+ <td className="k-calendar-td">
267
+ <span className="k-link">21</span>
268
+ </td>
269
+ <td className="k-calendar-td k-weekend">
270
+ <span className="k-link">22</span>
271
+ </td>
272
+ </tr>
273
+ <tr className="k-calendar-tr">
274
+ <td className="k-calendar-td k-weekend">
275
+ <span className="k-link">23</span>
276
+ </td>
277
+ <td className="k-calendar-td">
278
+ <span className="k-link">24</span>
279
+ </td>
280
+ <td className="k-calendar-td">
281
+ <span className="k-link">25</span>
282
+ </td>
283
+ <td className="k-calendar-td">
284
+ <span className="k-link">26</span>
285
+ </td>
286
+ <td className="k-calendar-td">
287
+ <span className="k-link">27</span>
288
+ </td>
289
+ <td className="k-calendar-td">
290
+ <span className="k-link">28</span>
291
+ </td>
292
+ <td className="k-calendar-td k-weekend">
293
+ <span className="k-link">29</span>
294
+ </td>
295
+ </tr>
296
+ <tr className="k-calendar-tr">
297
+ <td className="k-calendar-td k-weekend">
298
+ <span className="k-link">30</span>
299
+ </td>
300
+ <td className="k-calendar-td">
301
+ <span className="k-link">31</span>
302
+ </td>
303
+ <td className="k-empty k-calendar-td">&nbsp;</td>
304
+ <td className="k-empty k-calendar-td">&nbsp;</td>
305
+ <td className="k-empty k-calendar-td">&nbsp;</td>
306
+ <td className="k-empty k-calendar-td">&nbsp;</td>
307
+ <td className="k-empty k-calendar-td">&nbsp;</td>
308
+ </tr>
309
+ </tbody>
310
+ </table>
311
+ </div>
312
+ </div>
313
+ </div>
314
+ </ActionSheet>
315
+ </section>
316
+
317
+ <section>
318
+ <ActionSheet adaptive={true} fullscreen={true}>
319
+ <ActionSheetHeader actions={[ 'x' ]}>
320
+ <div className="k-text-center">Select date</div>
321
+ </ActionSheetHeader>
322
+ <div className="k-widget k-calendar k-calendar-lg k-calendar-infinite">
323
+ <div className="k-vstack k-calendar-view k-calendar-monthview">
324
+ <div className="k-calendar-header k-hstack">
325
+ <span className="k-button k-nav-fast k-button-md k-rounded-md k-button-flat k-button-flat-base k-calendar-title">December 1999</span>
326
+ <span className="k-spacer"></span>
327
+ <span className="k-calendar-nav k-hstack">
328
+ <button className="k-calendar-nav-today k-button k-button-md k-button-flat k-button-flat-primary k-rounded-md"> Today </button>
329
+ </span>
330
+ </div>
331
+ <table className="k-calendar-weekdays k-calendar-table">
332
+ <thead className="k-calendar-thead">
333
+ <tr className="k-calendar-tr">
334
+ <th className="k-calendar-th">Su</th>
335
+ <th className="k-calendar-th">Mo</th>
336
+ <th className="k-calendar-th">Tu</th>
337
+ <th className="k-calendar-th">We</th>
338
+ <th className="k-calendar-th">Th</th>
339
+ <th className="k-calendar-th">Fr</th>
340
+ <th className="k-calendar-th">Sa</th>
341
+ </tr>
342
+ </thead>
343
+ </table>
344
+ <div className="k-flex k-content k-scrollable">
345
+ <table className="k-calendar-table">
346
+ <colgroup>
347
+ <col />
348
+ <col />
349
+ <col />
350
+ <col />
351
+ <col />
352
+ <col />
353
+ <col />
354
+ </colgroup>
355
+ <tbody className="k-calendar-tbody">
356
+ <tr className="k-calendar-tr">
357
+ <th className="k-calendar-caption" colSpan={7}>December 1999</th>
358
+ </tr>
359
+ <tr className="k-calendar-tr">
360
+ <td className="k-empty k-calendar-td">&nbsp;</td>
361
+ <td className="k-empty k-calendar-td">&nbsp;</td>
362
+ <td className="k-empty k-calendar-td">&nbsp;</td>
363
+ <td className="k-calendar-td">
364
+ <span className="k-link">1</span>
365
+ </td>
366
+ <td className="k-calendar-td">
367
+ <span className="k-link">2</span>
368
+ </td>
369
+ <td className="k-calendar-td">
370
+ <span className="k-link">3</span>
371
+ </td>
372
+ <td className="k-calendar-td k-weekend">
373
+ <span className="k-link">4</span>
374
+ </td>
375
+ </tr>
376
+ <tr className="k-calendar-tr">
377
+ <td className="k-calendar-td k-weekend">
378
+ <span className="k-link">5</span>
379
+ </td>
380
+ <td className="k-calendar-td">
381
+ <span className="k-link">6</span>
382
+ </td>
383
+ <td className="k-calendar-td">
384
+ <span className="k-link">7</span>
385
+ </td>
386
+ <td className="k-calendar-td">
387
+ <span className="k-link">8</span>
388
+ </td>
389
+ <td className="k-calendar-td">
390
+ <span className="k-link">9</span>
391
+ </td>
392
+ <td className="k-calendar-td">
393
+ <span className="k-link">10</span>
394
+ </td>
395
+ <td className="k-calendar-td k-weekend">
396
+ <span className="k-link">11</span>
397
+ </td>
398
+ </tr>
399
+ <tr className="k-calendar-tr">
400
+ <td className="k-calendar-td k-weekend">
401
+ <span className="k-link">12</span>
402
+ </td>
403
+ <td className="k-calendar-td">
404
+ <span className="k-link">13</span>
405
+ </td>
406
+ <td className="k-calendar-td">
407
+ <span className="k-link">14</span>
408
+ </td>
409
+ <td className="k-calendar-td">
410
+ <span className="k-link">15</span>
411
+ </td>
412
+ <td className="k-calendar-td">
413
+ <span className="k-link">16</span>
414
+ </td>
415
+ <td className="k-calendar-td">
416
+ <span className="k-link">17</span>
417
+ </td>
418
+ <td className="k-calendar-td k-weekend">
419
+ <span className="k-link">18</span>
420
+ </td>
421
+ </tr>
422
+ <tr className="k-calendar-tr">
423
+ <td className="k-calendar-td k-weekend">
424
+ <span className="k-link">19</span>
425
+ </td>
426
+ <td className="k-calendar-td">
427
+ <span className="k-link">20</span>
428
+ </td>
429
+ <td className="k-calendar-td">
430
+ <span className="k-link">21</span>
431
+ </td>
432
+ <td className="k-calendar-td">
433
+ <span className="k-link">22</span>
434
+ </td>
435
+ <td className="k-calendar-td">
436
+ <span className="k-link">23</span>
437
+ </td>
438
+ <td className="k-calendar-td">
439
+ <span className="k-link">24</span>
440
+ </td>
441
+ <td className="k-calendar-td k-weekend">
442
+ <span className="k-link">25</span>
443
+ </td>
444
+ </tr>
445
+ <tr className="k-calendar-tr">
446
+ <td className="k-calendar-td k-weekend">
447
+ <span className="k-link">26</span>
448
+ </td>
449
+ <td className="k-calendar-td">
450
+ <span className="k-link">27</span>
451
+ </td>
452
+ <td className="k-calendar-td">
453
+ <span className="k-link">28</span>
454
+ </td>
455
+ <td className="k-calendar-td">
456
+ <span className="k-link">29</span>
457
+ </td>
458
+ <td className="k-calendar-td">
459
+ <span className="k-link">30</span>
460
+ </td>
461
+ <td className="k-calendar-td">
462
+ <span className="k-link">31</span>
463
+ </td>
464
+ <td className="k-empty k-calendar-td">&nbsp;</td>
465
+ </tr>
466
+ <tr className="k-calendar-tr">
467
+ <td className="k-empty k-calendar-td">&nbsp;</td>
468
+ <td className="k-empty k-calendar-td">&nbsp;</td>
469
+ <td className="k-empty k-calendar-td">&nbsp;</td>
470
+ <td className="k-empty k-calendar-td">&nbsp;</td>
471
+ <td className="k-empty k-calendar-td">&nbsp;</td>
472
+ <td className="k-empty k-calendar-td">&nbsp;</td>
473
+ <td className="k-empty k-calendar-td">&nbsp;</td>
474
+ </tr>
475
+ </tbody>
476
+ <tbody className="k-calendar-tbody">
477
+ <tr className="k-calendar-tr">
478
+ <th className="k-calendar-caption" colSpan={7}>January 2000</th>
479
+ </tr>
480
+ <tr className="k-calendar-tr">
481
+ <td className="k-empty k-calendar-td">&nbsp;</td>
482
+ <td className="k-empty k-calendar-td">&nbsp;</td>
483
+ <td className="k-empty k-calendar-td">&nbsp;</td>
484
+ <td className="k-empty k-calendar-td">&nbsp;</td>
485
+ <td className="k-empty k-calendar-td">&nbsp;</td>
486
+ <td className="k-empty k-calendar-td">&nbsp;</td>
487
+ <td className="k-calendar-td k-weekend">
488
+ <span className="k-link">1</span>
489
+ </td>
490
+ </tr>
491
+ <tr className="k-calendar-tr">
492
+ <td className="k-calendar-td k-weekend">
493
+ <span className="k-link">2</span>
494
+ </td>
495
+ <td className="k-calendar-td">
496
+ <span className="k-link">3</span>
497
+ </td>
498
+ <td className="k-calendar-td">
499
+ <span className="k-link">4</span>
500
+ </td>
501
+ <td className="k-calendar-td">
502
+ <span className="k-link">5</span>
503
+ </td>
504
+ <td className="k-calendar-td">
505
+ <span className="k-link">6</span>
506
+ </td>
507
+ <td className="k-calendar-td">
508
+ <span className="k-link">7</span>
509
+ </td>
510
+ <td className="k-calendar-td k-weekend">
511
+ <span className="k-link">8</span>
512
+ </td>
513
+ </tr>
514
+ <tr className="k-calendar-tr">
515
+ <td className="k-calendar-td k-weekend">
516
+ <span className="k-link">9</span>
517
+ </td>
518
+ <td className="k-calendar-td">
519
+ <span className="k-link">10</span>
520
+ </td>
521
+ <td className="k-calendar-td">
522
+ <span className="k-link">11</span>
523
+ </td>
524
+ <td className="k-calendar-td">
525
+ <span className="k-link">12</span>
526
+ </td>
527
+ <td className="k-calendar-td">
528
+ <span className="k-link">13</span>
529
+ </td>
530
+ <td className="k-calendar-td">
531
+ <span className="k-link">14</span>
532
+ </td>
533
+ <td className="k-calendar-td k-weekend">
534
+ <span className="k-link">15</span>
535
+ </td>
536
+ </tr>
537
+ <tr className="k-calendar-tr">
538
+ <td className="k-calendar-td k-weekend">
539
+ <span className="k-link">16</span>
540
+ </td>
541
+ <td className="k-calendar-td">
542
+ <span className="k-link">17</span>
543
+ </td>
544
+ <td className="k-calendar-td">
545
+ <span className="k-link">18</span>
546
+ </td>
547
+ <td className="k-calendar-td">
548
+ <span className="k-link">19</span>
549
+ </td>
550
+ <td className="k-calendar-td">
551
+ <span className="k-link">20</span>
552
+ </td>
553
+ <td className="k-calendar-td">
554
+ <span className="k-link">21</span>
555
+ </td>
556
+ <td className="k-calendar-td k-weekend">
557
+ <span className="k-link">22</span>
558
+ </td>
559
+ </tr>
560
+ <tr className="k-calendar-tr">
561
+ <td className="k-calendar-td k-weekend">
562
+ <span className="k-link">23</span>
563
+ </td>
564
+ <td className="k-calendar-td">
565
+ <span className="k-link">24</span>
566
+ </td>
567
+ <td className="k-calendar-td">
568
+ <span className="k-link">25</span>
569
+ </td>
570
+ <td className="k-calendar-td">
571
+ <span className="k-link">26</span>
572
+ </td>
573
+ <td className="k-calendar-td">
574
+ <span className="k-link">27</span>
575
+ </td>
576
+ <td className="k-calendar-td">
577
+ <span className="k-link">28</span>
578
+ </td>
579
+ <td className="k-calendar-td k-weekend">
580
+ <span className="k-link">29</span>
581
+ </td>
582
+ </tr>
583
+ <tr className="k-calendar-tr">
584
+ <td className="k-calendar-td k-weekend">
585
+ <span className="k-link">30</span>
586
+ </td>
587
+ <td className="k-calendar-td">
588
+ <span className="k-link">31</span>
589
+ </td>
590
+ <td className="k-empty k-calendar-td">&nbsp;</td>
591
+ <td className="k-empty k-calendar-td">&nbsp;</td>
592
+ <td className="k-empty k-calendar-td">&nbsp;</td>
593
+ <td className="k-empty k-calendar-td">&nbsp;</td>
594
+ <td className="k-empty k-calendar-td">&nbsp;</td>
595
+ </tr>
596
+ </tbody>
597
+ </table>
598
+ </div>
599
+ </div>
600
+ </div>
601
+ </ActionSheet>
602
+ </section>
603
+ </div>
604
+ </>
605
+ );