@king-design/react 3.6.0 → 3.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/__tests__/__snapshots__/React Demos.md +117 -61
- package/components/copy/index.spec.js +14 -31
- package/components/datepicker/index.spec.js +646 -608
- package/components/datepicker/useValueBase.js +5 -2
- package/components/form/form.d.ts +1 -0
- package/components/form/form.js +7 -0
- package/components/form/index.spec.js +10 -8
- package/components/menu/index.spec.js +28 -0
- package/components/menu/styles.js +2 -2
- package/components/select/index.spec.js +231 -177
- package/components/select/menu.js +1 -1
- package/components/select/useCard.d.ts +4 -3
- package/components/select/useCard.js +15 -4
- package/components/spinner/index.spec.js +82 -44
- package/components/spinner/useValue.js +2 -1
- package/index.d.ts +2 -2
- package/index.js +2 -2
- package/package.json +2 -2
- package/yarn-error.log +528 -0
|
@@ -31,13 +31,13 @@
|
|
|
31
31
|
#### `Breadcrumb basic`
|
|
32
32
|
|
|
33
33
|
```
|
|
34
|
-
"<div class=\"k-breadcrumb css-
|
|
34
|
+
"<div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><a class=\"k-breadcrumb-link\">item 1</a></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><a class=\"k-breadcrumb-link\">item 2</a></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">item 3</span></div></div>"
|
|
35
35
|
```
|
|
36
36
|
|
|
37
37
|
#### `Breadcrumb separator`
|
|
38
38
|
|
|
39
39
|
```
|
|
40
|
-
"<div class=\"k-breadcrumb css-
|
|
40
|
+
"<div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><a class=\"k-breadcrumb-link\"><i class=\"k-icon ion-home k-small css-16qej3\"></i> item 1</a></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon ion-ios-arrow-thin-right separator css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><a class=\"k-breadcrumb-link\"><i class=\"k-icon ion-earth k-small css-16qej3\"></i> item 2</a></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon ion-ios-arrow-thin-right separator css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\"><i class=\"k-icon ion-planet k-small css-16qej3\"></i> item 3</span></div></div>"
|
|
41
41
|
```
|
|
42
42
|
|
|
43
43
|
## `button`
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
#### `Button basic`
|
|
46
46
|
|
|
47
47
|
```
|
|
48
|
-
"<div><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">default</button><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">primary</button><button class=\"k-btn k-secondary css-h31bz\" tabindex=\"0\" type=\"button\">secondary</button><button class=\"k-btn k-warning css-h31bz\" tabindex=\"0\" type=\"button\">warning</button><button class=\"k-btn k-danger css-h31bz\" tabindex=\"0\" type=\"button\">danger</button><button class=\"k-btn k-success css-h31bz\" tabindex=\"0\" type=\"button\">success</button><button class=\"k-btn k-none css-h31bz\" tabindex=\"0\" type=\"button\">none</button><button class=\"k-btn k-link css-h31bz\" tabindex=\"0\" type=\"button\">link</button><button class=\"k-btn k-flat css-h31bz\" tabindex=\"0\" type=\"button\">flat</button><button class=\"k-btn k-custom css-989a5g\" tabindex=\"0\" type=\"button\">custom</button><button class=\"k-btn k-custom css-1k0icaw\" tabindex=\"0\" type=\"button\">custom</button
|
|
48
|
+
"<div><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">default</button><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">primary</button><button class=\"k-btn k-secondary css-h31bz\" tabindex=\"0\" type=\"button\">secondary</button><button class=\"k-btn k-warning css-h31bz\" tabindex=\"0\" type=\"button\">warning</button><button class=\"k-btn k-danger css-h31bz\" tabindex=\"0\" type=\"button\">danger</button><button class=\"k-btn k-success css-h31bz\" tabindex=\"0\" type=\"button\">success</button><button class=\"k-btn k-none css-h31bz\" tabindex=\"0\" type=\"button\">none</button><button class=\"k-btn k-link css-h31bz\" tabindex=\"0\" type=\"button\">link</button><button class=\"k-btn k-flat css-h31bz\" tabindex=\"0\" type=\"button\">flat</button><button class=\"k-btn k-custom css-989a5g\" tabindex=\"0\" type=\"button\">custom</button><button class=\"k-btn k-custom css-1k0icaw\" tabindex=\"0\" type=\"button\">custom</button></div>"
|
|
49
49
|
```
|
|
50
50
|
|
|
51
51
|
#### `Button disabled`
|
|
@@ -321,61 +321,61 @@
|
|
|
321
321
|
#### `Datepicker basic`
|
|
322
322
|
|
|
323
323
|
```
|
|
324
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
324
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><div class=\"k-select k-flat k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline k-flat css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><div class=\"k-select k-disabled k-datepicker css-1bseial\" tabindex=\"-1\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"2018-01-01\"><div class=\"k-input k-disabled k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"2018-01-01\" disabled=\"\" value=\"2018-01-01\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div>"
|
|
325
325
|
```
|
|
326
326
|
|
|
327
327
|
#### `Datepicker clearable`
|
|
328
328
|
|
|
329
329
|
```
|
|
330
|
-
"<div class=\"k-select k-datepicker css-
|
|
330
|
+
"<div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->"
|
|
331
331
|
```
|
|
332
332
|
|
|
333
333
|
#### `Datepicker datetime`
|
|
334
334
|
|
|
335
335
|
```
|
|
336
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
336
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期和时间\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"时间精确到分钟\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div>"
|
|
337
337
|
```
|
|
338
338
|
|
|
339
339
|
#### `Datepicker disabledDate`
|
|
340
340
|
|
|
341
341
|
```
|
|
342
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
342
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><br><br><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择月份\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><br><br><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择年份\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div>"
|
|
343
343
|
```
|
|
344
344
|
|
|
345
345
|
#### `Datepicker format`
|
|
346
346
|
|
|
347
347
|
```
|
|
348
|
-
"<div><div><div class=\"k-select k-datepicker css-
|
|
348
|
+
"<div><div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->value: </div><div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->value: </div><div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期和时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->value: </div></div>"
|
|
349
349
|
```
|
|
350
350
|
|
|
351
351
|
#### `Datepicker maxMin`
|
|
352
352
|
|
|
353
353
|
```
|
|
354
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
354
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--> ~<div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"结束日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><br><br><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--> ~<div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"结束时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div>"
|
|
355
355
|
```
|
|
356
356
|
|
|
357
357
|
#### `Datepicker multiple`
|
|
358
358
|
|
|
359
359
|
```
|
|
360
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
360
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请选择日期</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: []<br><br><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期和时间\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请选择日期和时间</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: []<br><br><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择年份\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请选择年份</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: []<br><br><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择月份\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请选择月份</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: []<br><br><div class=\"k-select k-datepicker css-68s2gf\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始日期 ~ 结束日期\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>开始日期 ~ 结束日期</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: []<br><br><div class=\"k-select k-datepicker css-ys5lm8\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>开始时间 ~ 结束时间</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: []<br><br></div>"
|
|
361
361
|
```
|
|
362
362
|
|
|
363
363
|
#### `Datepicker range`
|
|
364
364
|
|
|
365
365
|
```
|
|
366
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
366
|
+
"<div><div class=\"k-select k-datepicker css-68s2gf\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始日期 ~ 结束日期\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: null<br><br><div class=\"k-select k-datepicker css-ys5lm8\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: null<br><br><div class=\"k-select k-datepicker css-d4snoy\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始年份 ~ 结束年份\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: null<br><br><div class=\"k-select k-datepicker css-h2ffjv\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始月份 ~ 结束月份\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal-->You selected: null<br><br></div>"
|
|
367
367
|
```
|
|
368
368
|
|
|
369
369
|
#### `Datepicker shortcuts`
|
|
370
370
|
|
|
371
371
|
```
|
|
372
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
372
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><div class=\"k-select k-datepicker css-ys5lm8\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div>"
|
|
373
373
|
```
|
|
374
374
|
|
|
375
375
|
#### `Datepicker yearMonth`
|
|
376
376
|
|
|
377
377
|
```
|
|
378
|
-
"<div><div class=\"k-select k-datepicker css-
|
|
378
|
+
"<div><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择年份\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择月份\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div>"
|
|
379
379
|
```
|
|
380
380
|
|
|
381
381
|
## `descriptions`
|
|
@@ -383,19 +383,19 @@
|
|
|
383
383
|
#### `Descriptions basic`
|
|
384
384
|
|
|
385
385
|
```
|
|
386
|
-
"<div><div class=\"k-descriptions css-1t0vgme\"><div class=\"k-descriptions-title\">基础信息</div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-
|
|
386
|
+
"<div><div class=\"k-descriptions css-1t0vgme\"><div class=\"k-descriptions-title\">基础信息</div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试1</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label2</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试测试</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label3</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试3</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label4</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试4</div></div><div class=\"k-description-option\">option</div></div></div></div></div><div class=\"k-descriptions css-85ywe6\"><div class=\"k-descriptions-title\">基础信息</div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试1</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试2</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长</div><!--portal--></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试3</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试3</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试4</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试4</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试5</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试5</div></div></div></div></div></div></div>"
|
|
387
387
|
```
|
|
388
388
|
|
|
389
389
|
#### `Descriptions custom`
|
|
390
390
|
|
|
391
391
|
```
|
|
392
|
-
"<div><div class=\"k-descriptions css-85ywe6\"><div class=\"k-descriptions-title\"><span>自定义标题</span><!-- react-mount-point-unstable --><i class=\"k-icon k-icon-question css-16qej3\"></i><!--portal--></div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-
|
|
392
|
+
"<div><div class=\"k-descriptions css-85ywe6\"><div class=\"k-descriptions-title\"><span>自定义标题</span><!-- react-mount-point-unstable --><i class=\"k-icon k-icon-question css-16qej3\"></i><!--portal--></div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</div><!--portal--></div><div class=\"k-description-option\"><i class=\"k-icon k-hoverable k-icon-clone k-copy css-t3aops css-16qej3\" title=\"复制\"></i></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label2</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\"><span>自定义label</span><!-- react-mount-point-unstable --><i class=\"k-icon k-icon-question css-16qej3\"></i><!--portal--></div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label4</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>测试4</span><!-- react-mount-point-unstable --><button class=\"k-btn k-link css-h31bz\" tabindex=\"0\" type=\"button\">分配项目</button></div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label5</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试5</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">label6</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试6</div></div></div></div></div></div></div>"
|
|
393
393
|
```
|
|
394
394
|
|
|
395
395
|
#### `Descriptions vertical`
|
|
396
396
|
|
|
397
397
|
```
|
|
398
|
-
"<div><div class=\"k-descriptions k-vertical css-85ywe6\"><div class=\"k-descriptions-title\">基础信息</div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-
|
|
398
|
+
"<div><div class=\"k-descriptions k-vertical css-85ywe6\"><div class=\"k-descriptions-title\">基础信息</div><div class=\"k-descriptions-content\"><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试1</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试1</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试2</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试2</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试3</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试3</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试4</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试4</div></div></div></div><div class=\"k-description-item css-qruqir\"><div class=\"k-description-item-label\">测试5</div><div class=\"k-description-centent\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试5</div></div></div></div></div></div></div>"
|
|
399
399
|
```
|
|
400
400
|
|
|
401
401
|
## `diagram`
|
|
@@ -403,7 +403,7 @@
|
|
|
403
403
|
#### `Diagram basic`
|
|
404
404
|
|
|
405
405
|
```
|
|
406
|
-
"<div class=\"k-diagram css-ohhwil\"><div class=\"k-diagram-scheme\"><dtreelayout><drectangle></drectangle><ddiamond></ddiamond><dcircle></dcircle><dline></dline><dline></dline></dtreelayout></div><div class=\"k-diagram-canvas\" style=\"position: relative; width: 193px; height: 187px;\"><svg style=\"left: 0px; top: 0px; width: 100%; height: 100%; display: block; min-width: 193px; min-height: 187px;\"><g><g></g><g><g transform=\"translate(0.5,0.5)\" style=\"visibility: visible;\"><rect x=\"36\" y=\"0\" width=\"120\" height=\"60\" fill=\"#ffffff\" stroke=\"#000000\" pointer-events=\"all\"></rect></g><g style=\"\"><g transform=\"translate(
|
|
406
|
+
"<div class=\"k-diagram css-ohhwil\"><div class=\"k-diagram-scheme\"><dtreelayout><drectangle></drectangle><ddiamond></ddiamond><dcircle></dcircle><dline></dline><dline></dline></dtreelayout></div><div class=\"k-diagram-canvas\" style=\"position: relative; width: 193px; height: 187px;\"><svg style=\"left: 0px; top: 0px; width: 100%; height: 100%; display: block; min-width: 193px; min-height: 187px;\"><g><g></g><g><g transform=\"translate(0.5,0.5)\" style=\"visibility: visible;\"><rect x=\"36\" y=\"0\" width=\"120\" height=\"60\" fill=\"#ffffff\" stroke=\"#000000\" pointer-events=\"all\"></rect></g><g style=\"\"><g transform=\"translate(75,6)\"><foreignObject style=\"overflow:visible;\" pointer-events=\"all\" width=\"42\" height=\"49\"><div style=\"display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; width: 43px; white-space: normal; overflow-wrap: normal; text-align: center;\"><div xmlns=\"http://www.w3.org/1999/xhtml\" style=\"display:inline-block;text-align:inherit;text-decoration:inherit;white-space:normal;\"><h2>hello</h2></div></div></foreignObject></g></g><g transform=\"translate(0.5,0.5)\" style=\"visibility: visible;\"><path d=\"M 40 106 L 80 146 L 40 186 L 0 146 Z\" fill=\"#ffffff\" stroke=\"#000000\" stroke-miterlimit=\"10\" pointer-events=\"all\"></path></g><g style=\"\"><g transform=\"translate(26,140)\"><foreignObject style=\"overflow:visible;\" pointer-events=\"all\" width=\"29\" height=\"12\"><div style=\"display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; width: 30px; white-space: normal; overflow-wrap: normal; text-align: center;\"><div xmlns=\"http://www.w3.org/1999/xhtml\" style=\"display:inline-block;text-align:inherit;text-decoration:inherit;white-space:normal;\">world</div></div></foreignObject></g></g><g transform=\"translate(0.5,0.5)\" style=\"visibility: visible;\"><ellipse cx=\"152\" cy=\"146\" rx=\"40\" ry=\"40\" fill=\"#ffffff\" stroke=\"#000000\" pointer-events=\"all\"></ellipse></g><g style=\"\"><g transform=\"translate(143,140)\"><foreignObject style=\"overflow:visible;\" pointer-events=\"all\" width=\"19\" height=\"12\"><div style=\"display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; vertical-align: top; width: 20px; white-space: normal; overflow-wrap: normal; text-align: center;\"><div xmlns=\"http://www.w3.org/1999/xhtml\" style=\"display:inline-block;text-align:inherit;text-decoration:inherit;white-space:normal;\">kpc</div></div></foreignObject></g></g><g transform=\"translate(0.5,0.5)\" style=\"visibility: visible;\"><path d=\"M 96 60 L 96 73 Q 96 83 86 83 L 50 83 Q 40 83 40 91.32 L 40 99.63\" fill=\"none\" stroke=\"white\" stroke-miterlimit=\"10\" pointer-events=\"stroke\" visibility=\"hidden\" stroke-width=\"9\"></path><path d=\"M 96 60 L 96 73 Q 96 83 86 83 L 50 83 Q 40 83 40 91.32 L 40 99.63\" fill=\"none\" stroke=\"#000000\" stroke-miterlimit=\"10\" pointer-events=\"stroke\"></path><path d=\"M 40 104.88 L 36.5 97.88 L 40 99.63 L 43.5 97.88 Z\" fill=\"#000000\" stroke=\"#000000\" stroke-miterlimit=\"10\" pointer-events=\"all\"></path></g><g transform=\"translate(0.5,0.5)\" style=\"visibility: visible;\"><path d=\"M 96 60 L 96 73 Q 96 83 106 83 L 142 83 Q 152 83 152 91.32 L 152 99.63\" fill=\"none\" stroke=\"white\" stroke-miterlimit=\"10\" pointer-events=\"stroke\" visibility=\"hidden\" stroke-width=\"9\"></path><path d=\"M 96 60 L 96 73 Q 96 83 106 83 L 142 83 Q 152 83 152 91.32 L 152 99.63\" fill=\"none\" stroke=\"#000000\" stroke-miterlimit=\"10\" pointer-events=\"stroke\"></path><path d=\"M 152 104.88 L 148.5 97.88 L 152 99.63 L 155.5 97.88 Z\" fill=\"#000000\" stroke=\"#000000\" stroke-miterlimit=\"10\" pointer-events=\"all\"></path></g></g><g></g><g></g></g></svg></div></div>"
|
|
407
407
|
```
|
|
408
408
|
|
|
409
409
|
#### `Diagram children`
|
|
@@ -601,25 +601,25 @@
|
|
|
601
601
|
#### `Ellipsis basic`
|
|
602
602
|
|
|
603
603
|
```
|
|
604
|
-
"<div class=\"k-split k-horizontal css-1ug4f89 k-last-auto\" style=\"width: 400px;\"><div class=\"k-split-first\" style=\"width: 50%;\"><div class=\"k-ellipsis css-
|
|
604
|
+
"<div class=\"k-split k-horizontal css-1ug4f89 k-last-auto\" style=\"width: 400px;\"><div class=\"k-split-first\" style=\"width: 50%;\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper panel\">测试测试测试测试测试测试</div></div><br><!-- react-mount-point-unstable --><div class=\"k-ellipsis k-multiline css-1uouvw7\"><div class=\"c-ellipsis k-ellipsis-wrapper panel\">最大几行忽略最大几行忽略最大几行忽略</div></div></div><div class=\"k-split-line-wrapper\"><div class=\"k-split-line\"><div class=\"k-split-drag-lines\"></div></div></div><div class=\"k-split-last\" style=\"width: auto;\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper panel\">不展示tooltip不展示tooltip</div></div></div></div>"
|
|
605
605
|
```
|
|
606
606
|
|
|
607
607
|
#### `Ellipsis custom`
|
|
608
608
|
|
|
609
609
|
```
|
|
610
|
-
"<div style=\"width: 200px;\"><div class=\"k-ellipsis css-
|
|
610
|
+
"<div style=\"width: 200px;\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper panel tooltip-class\"><i class=\"k-icon ion-heart css-16qej3\"></i><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">测试</button><i class=\"k-icon ion-heart css-16qej3\"></i><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">测试</button><i class=\"k-icon ion-heart css-16qej3\"></i><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">测试</button><i class=\"k-icon ion-heart css-16qej3\"></i><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">测试</button><i class=\"k-icon ion-heart css-16qej3\"></i><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">测试</button></div><!--portal--></div></div>"
|
|
611
611
|
```
|
|
612
612
|
|
|
613
613
|
#### `Ellipsis hoverable`
|
|
614
614
|
|
|
615
615
|
```
|
|
616
|
-
"<div><div class=\"k-ellipsis css-
|
|
616
|
+
"<div><div class=\"k-ellipsis css-1vrj62t\" style=\"width: 50px;\"><div class=\"c-ellipsis k-ellipsis-wrapper\">hoverable</div><!--portal--></div></div>"
|
|
617
617
|
```
|
|
618
618
|
|
|
619
619
|
#### `Ellipsis position`
|
|
620
620
|
|
|
621
621
|
```
|
|
622
|
-
"<div><div class=\"k-ellipsis css-
|
|
622
|
+
"<div><div class=\"k-ellipsis css-1vrj62t\" style=\"width: 90px;\"><div class=\"c-ellipsis k-ellipsis-wrapper\">tooltip在右侧tooltip在右侧</div><!--portal--></div><div class=\"k-ellipsis css-1vrj62t\" style=\"width: 90px;\"><div class=\"c-ellipsis k-ellipsis-wrapper\">tooltip在下方tooltip在下方</div><!--portal--></div></div>"
|
|
623
623
|
```
|
|
624
624
|
|
|
625
625
|
## `form`
|
|
@@ -627,37 +627,37 @@
|
|
|
627
627
|
#### `Form basic`
|
|
628
628
|
|
|
629
629
|
```
|
|
630
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
630
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: 200px;\">Input</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Select</label><div class=\"k-form-content\"><div class=\"k-select css-1ti24q0\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-select-placeholder c-ellipsis\">请选择</div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Checkbox</label><div class=\"k-form-content\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"Javascript\"></span><span class=\"k-checkbox-text\">Javascript</span></label><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"PHP\"></span><span class=\"k-checkbox-text\">PHP</span></label><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"C++\"></span><span class=\"k-checkbox-text\">C++</span></label></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Radio</label><div class=\"k-form-content\"><label class=\"k-radio css-zzqsx1\" tabindex=\"0\"><span class=\"k-radio-wrapper\"><input type=\"radio\" tabindex=\"-1\" value=\"Javascript\"></span><span class=\"k-radio-text\">Javascript</span></label><label class=\"k-radio css-zzqsx1\" tabindex=\"0\"><span class=\"k-radio-wrapper\"><input type=\"radio\" tabindex=\"-1\" value=\"PHP\"></span><span class=\"k-radio-text\">PHP</span></label><label class=\"k-radio css-zzqsx1\" tabindex=\"0\"><span class=\"k-radio-wrapper\"><input type=\"radio\" tabindex=\"-1\" value=\"C++\"></span><span class=\"k-radio-text\">C++</span></label></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Radio ButtonGroup</label><div class=\"k-form-content\"><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">Javascript<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">PHP<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">C++<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Switch</label><div class=\"k-form-content\"><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Slider</label><div class=\"k-form-content\"><div class=\"k-slider css-1a62bpu\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 0%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 0%;\"><div class=\"k-slider-thumb k-slider-tooltip\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-o1x0o9 css-7sngro\" style=\"display: none;\">0<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: 200px;\">Datepicker</label><div class=\"k-form-content\"><div class=\"k-select k-datepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择日期\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-calendar css-16qej3\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Textarea</label><div class=\"k-form-content\"><div class=\"k-input k-type-textarea k-resize-vertical css-1x5beu2\"><div class=\"k-input-wrapper\"><textarea class=\"k-input-inner k-textarea\" rows=\"2\"></textarea></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: 200px;\">Password</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" type=\"password\"></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\">Confirm Password</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" type=\"password\"></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\" style=\"width: px;\"></label><div class=\"k-form-content\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"submit\">提交</button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\" style=\"margin-left: 8px;\">重置</button></div></div></form>"
|
|
631
631
|
```
|
|
632
632
|
|
|
633
633
|
#### `Form custom`
|
|
634
634
|
|
|
635
635
|
```
|
|
636
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
636
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">描述</label><div class=\"k-form-content\"><div class=\"k-form-item css-15gu3l7\"><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div><div class=\"k-form-append\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">删除</button></div></div><div class=\"k-form-item css-15gu3l7\"><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div><div class=\"k-form-append\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">删除</button></div></div><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">添加</button></div></div></form>"
|
|
637
637
|
```
|
|
638
638
|
|
|
639
639
|
#### `Form label`
|
|
640
640
|
|
|
641
641
|
```
|
|
642
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
642
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\"><span class=\"k-form-star\">*</span>姓名</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\"><i class=\"ion-person\"></i><!-- react-mount-point-unstable --> 姓名</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div></form>"
|
|
643
643
|
```
|
|
644
644
|
|
|
645
645
|
#### `Form layout`
|
|
646
646
|
|
|
647
647
|
```
|
|
648
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
648
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">Layout</label><div class=\"k-form-content\"><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">horizontal<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">vertical<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">inline<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">Size</label><div class=\"k-form-content\"><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">default<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">small<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">mini<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">Input</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">Select</label><div class=\"k-form-content\"><div class=\"k-select css-1ti24q0\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-select-placeholder c-ellipsis\">请选择</div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\"></label><div class=\"k-form-content\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"submit\">Submit</button></div></div></form>"
|
|
649
649
|
```
|
|
650
650
|
|
|
651
651
|
#### `Form remote`
|
|
652
652
|
|
|
653
653
|
```
|
|
654
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
654
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">用户名</label><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div></form>"
|
|
655
655
|
```
|
|
656
656
|
|
|
657
657
|
#### `Form variable`
|
|
658
658
|
|
|
659
659
|
```
|
|
660
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
660
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">姓名</label><div class=\"k-form-content\"><div class=\"k-row css-1d2b9xj\" style=\"margin-left: -8px; margin-right: -8px;\"><div class=\"k-col k-12 css-1xiwk0e\" style=\"padding-left: 8px; padding-right: 8px;\"><div class=\"k-col-wrapper\"><div class=\"k-form-item css-15gu3l7\"><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div></div></div><div class=\"k-col k-12 css-1xiwk0e\" style=\"padding-left: 8px; padding-right: 8px;\"><div class=\"k-col-wrapper\"><div class=\"k-form-item css-15gu3l7\"><div class=\"k-form-content\"><div class=\"k-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div></div></div></div></div></div></form>"
|
|
661
661
|
```
|
|
662
662
|
|
|
663
663
|
## `grid`
|
|
@@ -821,31 +821,31 @@
|
|
|
821
821
|
#### `Layout aside`
|
|
822
822
|
|
|
823
823
|
```
|
|
824
|
-
"<div class=\"k-layout k-has-aside css-1vdvr25 layout\"><div class=\"k-layout-aside k-dark css-1rytxc7\" style=\"width: 200px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-layout-wrapper\"><div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
824
|
+
"<div class=\"k-layout k-has-aside css-1vdvr25 layout\"><div class=\"k-layout-aside k-dark css-1rytxc7\" style=\"width: 200px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-layout-wrapper\"><div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout css-1vdvr25\"><div class=\"k-layout-header k-dark css-1b0q9ji\" style=\"height: 64px;\"><button class=\"k-btn k-large k-none k-ghost css-h31bz\" tabindex=\"0\" type=\"button\" style=\"height: 64px;\"><i class=\"k-icon ion-navicon css-16qej3\" style=\"font-size: 30px;\"></i></button></div><div class=\"k-layout-body css-u3mwlr\"><div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div><div>content</div><!-- react-mount-point-unstable --></div></div></div>"
|
|
825
825
|
```
|
|
826
826
|
|
|
827
827
|
#### `Layout asideFix`
|
|
828
828
|
|
|
829
829
|
```
|
|
830
|
-
"<div class=\"k-layout k-has-aside css-1vdvr25 layout\"><div class=\"k-layout-aside k-fixed k-light css-1rytxc7\" style=\"width: 260px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-layout-wrapper\"><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout css-1vdvr25\" style=\"padding-left: 260px;\"><div class=\"k-layout-header k-fixed k-white css-1b0q9ji\" style=\"height: 64px; left: 260px;\"><button class=\"k-btn k-large k-none css-h31bz\" tabindex=\"0\" type=\"button\" style=\"height: 64px;\"><i class=\"k-icon ion-navicon css-16qej3\" style=\"font-size: 30px;\"></i></button></div><div class=\"k-layout-body css-u3mwlr\" style=\"margin-top: 64px;\"><div class=\"k-breadcrumb css-1ggv82t\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --></div></div></div>"
|
|
830
|
+
"<div class=\"k-layout k-has-aside css-1vdvr25 layout\"><div class=\"k-layout-aside k-fixed k-light css-1rytxc7\" style=\"width: 260px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-layout-wrapper\"><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout css-1vdvr25\" style=\"padding-left: 260px;\"><div class=\"k-layout-header k-fixed k-white css-1b0q9ji\" style=\"height: 64px; left: 260px;\"><button class=\"k-btn k-large k-none css-h31bz\" tabindex=\"0\" type=\"button\" style=\"height: 64px;\"><i class=\"k-icon ion-navicon css-16qej3\" style=\"font-size: 30px;\"></i></button></div><div class=\"k-layout-body css-u3mwlr\" style=\"margin-top: 64px;\"><div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --></div></div></div>"
|
|
831
831
|
```
|
|
832
832
|
|
|
833
833
|
#### `Layout basic`
|
|
834
834
|
|
|
835
835
|
```
|
|
836
|
-
"<div class=\"k-layout css-1vdvr25 layout\"><div class=\"k-layout-header k-fixed k-blur k-box-shadow k-white header css-1b0q9ji\" style=\"height: 54px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-menu k-light k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
836
|
+
"<div class=\"k-layout css-1vdvr25 layout\"><div class=\"k-layout-header k-fixed k-blur k-box-shadow k-white header css-1b0q9ji\" style=\"height: 54px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-menu k-light k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-layout k-has-aside css-1vdvr25\" style=\"margin-top: 54px;\"><div class=\"k-layout-aside k-fixed k-light css-1rytxc7\" style=\"width: 200px; top: 54px;\"><div class=\"k-layout-wrapper\"><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout-body css-u3mwlr\" style=\"padding-left: 200px;\"><div class=\"content\"><div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div><div>content</div></div><!-- react-mount-point-unstable --></div></div></div>"
|
|
837
837
|
```
|
|
838
838
|
|
|
839
839
|
#### `Layout fix`
|
|
840
840
|
|
|
841
841
|
```
|
|
842
|
-
"<div class=\"k-layout css-1vdvr25 layout\"><div class=\"k-layout-header k-fixed k-dark css-1b0q9ji\" style=\"height: 64px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-menu k-dark k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-layout k-has-aside css-1vdvr25\" style=\"margin-top: 64px;\"><div class=\"k-layout-aside k-fixed k-light css-1rytxc7\" style=\"width: 200px; top: 64px;\"><div class=\"k-layout-wrapper\"><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1jf5h5f\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout-body css-u3mwlr\" style=\"padding-left: 200px;\"><div class=\"k-breadcrumb css-1ggv82t\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --></div></div></div>"
|
|
842
|
+
"<div class=\"k-layout css-1vdvr25 layout\"><div class=\"k-layout-header k-fixed k-dark css-1b0q9ji\" style=\"height: 64px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-menu k-dark k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-layout k-has-aside css-1vdvr25\" style=\"margin-top: 64px;\"><div class=\"k-layout-aside k-fixed k-light css-1rytxc7\" style=\"width: 200px; top: 64px;\"><div class=\"k-layout-wrapper\"><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout-body css-u3mwlr\" style=\"padding-left: 200px;\"><div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --><div>content</div><!-- react-mount-point-unstable --></div></div></div>"
|
|
843
843
|
```
|
|
844
844
|
|
|
845
845
|
#### `Layout theme`
|
|
846
846
|
|
|
847
847
|
```
|
|
848
|
-
"<div class=\"k-layout css-1vdvr25 layout\"><div class=\"k-layout-header k-light header css-1b0q9ji\" style=\"height: 64px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-menu k-light k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
848
|
+
"<div class=\"k-layout css-1vdvr25 layout\"><div class=\"k-layout-header k-light header css-1b0q9ji\" style=\"height: 64px;\"><div class=\"logo\">LOGO</div><!-- react-mount-point-unstable --><div class=\"k-menu k-light k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-layout k-has-aside css-1vdvr25\"><div class=\"k-layout-aside k-light css-1rytxc7\" style=\"width: 200px;\"><div class=\"k-layout-wrapper\"><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div></div><div class=\"k-layout-body css-u3mwlr\"><div class=\"k-breadcrumb css-10qdcy4\"><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Home</span></div><span class=\"k-breadcrumb-separator\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></span><div class=\"k-breadcrumb-item\"><span class=\"k-breadcrumb-link\">Detail</span></div></div>切换主题：<div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div></div>"
|
|
849
849
|
```
|
|
850
850
|
|
|
851
851
|
## `menu`
|
|
@@ -853,55 +853,55 @@
|
|
|
853
853
|
#### `Menu accordion`
|
|
854
854
|
|
|
855
855
|
```
|
|
856
|
-
"<div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
856
|
+
"<div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1k8qtgp k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>Option 1</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1k8qtgp k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>Option 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>Option 2</span></div></div></div></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div></div></div></div></div></div>"
|
|
857
857
|
```
|
|
858
858
|
|
|
859
859
|
#### `Menu basic`
|
|
860
860
|
|
|
861
861
|
```
|
|
862
|
-
"<div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
862
|
+
"<div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1k8qtgp k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>Option 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>Option 2</span></div></div></div></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div>"
|
|
863
863
|
```
|
|
864
864
|
|
|
865
865
|
#### `Menu collapse`
|
|
866
866
|
|
|
867
867
|
```
|
|
868
|
-
"<div><div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\" style=\"margin-right: 16px; width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">展开</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">收起</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">dark</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">light</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><br><br><div class=\"k-menu k-dark k-collapsed k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
868
|
+
"<div><div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\" style=\"margin-right: 16px; width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">展开</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">收起</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">dark</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">light</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><br><br><div class=\"k-menu k-dark k-collapsed k-vertical css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i></div></div></div></div><!--portal--></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i></div></div></div></div><!--portal--></div><div class=\"k-menu-item k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i></div></div></div></div><!--portal--></div><div class=\"k-menu-title\"><div class=\"k-menu-name css-14asjef\"><i class=\"k-icon ion-cloud css-16qej3\"></i></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-stats-bars css-16qej3\"></i></div></div></div></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-upload css-16qej3\"></i></div></div></div></div><!--portal--></div></div></div></div>"
|
|
869
869
|
```
|
|
870
870
|
|
|
871
871
|
#### `Menu dot`
|
|
872
872
|
|
|
873
873
|
```
|
|
874
|
-
"<div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>Header</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><i class=\"k-icon k-menu-dot ion-record css-16qej3\"></i><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
874
|
+
"<div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>Header</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><i class=\"k-icon k-menu-dot ion-record css-16qej3\"></i><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><i class=\"k-icon k-menu-dot ion-record css-16qej3\"></i><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><i class=\"k-icon k-menu-dot ion-record css-16qej3\"></i><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 4</span></div></div></div></div></div></div></div>"
|
|
875
875
|
```
|
|
876
876
|
|
|
877
877
|
#### `Menu horizontal`
|
|
878
878
|
|
|
879
879
|
```
|
|
880
|
-
"<div><div class=\"k-menu k-dark k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
880
|
+
"<div><div class=\"k-menu k-dark k-horizontal css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><!--portal--></div></div></div><br><br><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">dark</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">light</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div></div>"
|
|
881
881
|
```
|
|
882
882
|
|
|
883
883
|
#### `Menu recursive`
|
|
884
884
|
|
|
885
885
|
```
|
|
886
|
-
"<div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>测试</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
886
|
+
"<div class=\"k-menu k-dark k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>测试</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-m8cc5e k-sub-menu css-g3l0a0 k-expand-enter-active k-expand-enter-to\" style=\"height: 160px;\"><div class=\"k-menu-body\"><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-xb6zyv k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>option 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>option 2</span></div></div></div></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 4</span></div></div></div></div></div></div></div>"
|
|
887
887
|
```
|
|
888
888
|
|
|
889
889
|
#### `Menu showCollapseArrow`
|
|
890
890
|
|
|
891
891
|
```
|
|
892
|
-
"<div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\" style=\"width: px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">隐藏折叠按钮</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 110px;\">展示折叠按钮</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">large<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">default<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">small<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><br><br><div class=\"k-menu k-light k-small k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\">自定义Header</div><div class=\"k-menu-arrow-box\"><i class=\"k-icon k-menu-arrow ion-arrow-left-b css-16qej3\"></i></div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
892
|
+
"<div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\" style=\"width: px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">隐藏折叠按钮</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 110px;\">展示折叠按钮</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">large<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">default<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">small<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><br><br><div class=\"k-menu k-light k-small k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\">自定义Header</div><div class=\"k-menu-arrow-box\"><i class=\"k-icon k-menu-arrow ion-arrow-left-b css-16qej3\"></i></div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 0</span></div></div></div></div></div><div class=\"k-menu-title\"><div class=\"k-menu-name css-14asjef\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">title 1</div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-active css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 3menu 3menu 3menu 3menu 3menu 3</span></div><!--portal--></div></div></div></div><div class=\"k-menu-title\"><div class=\"k-menu-name css-14asjef\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">title 2</div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 6</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-boowsa k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 7</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-w16crk k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>option 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>option 2</span></div></div></div></div></div></div></div></div></div></div></div><div class=\"k-divider k-light k-horizontal k-default css-1ewnbs divider-style\"></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 8</span></div></div></div></div></div></div></div></div>"
|
|
893
893
|
```
|
|
894
894
|
|
|
895
895
|
#### `Menu size`
|
|
896
896
|
|
|
897
897
|
```
|
|
898
|
-
"<div><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">展开</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">收起</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">vertical</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 100px;\">horizontal</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">large<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">default<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">small<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><br><br><div class=\"k-menu k-light k-large k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>Header</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
898
|
+
"<div><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: 60px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">展开</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 60px;\">收起</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\" style=\"width: px;\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-off\" style=\"width: px;\">vertical</div><div class=\"k-switch-bar\"><div class=\"k-switch-on\" style=\"width: 100px;\">horizontal</div><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">large<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">default<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">small<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><br><br><div class=\"k-menu k-light k-large k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>Header</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><i class=\"k-icon k-menu-dot ion-record css-16qej3\"></i><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1k8qtgp k-sub-menu css-g3l0a0\" style=\"display: none;\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>option 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>option 2</span></div></div></div></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div>"
|
|
899
899
|
```
|
|
900
900
|
|
|
901
901
|
#### `Menu theme`
|
|
902
902
|
|
|
903
903
|
```
|
|
904
|
-
"<div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><br><br><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>Header</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-
|
|
904
|
+
"<div><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">light<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">dark<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div><br><br><div class=\"k-menu k-light k-vertical css-g3l0a0\"><div class=\"k-menu-header css-14asjef\"><i class=\"k-icon ion-star css-16qej3\"></i>Header</div><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-flag css-16qej3\"></i><span>menu 1</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-star css-16qej3\"></i><span>menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-expanded css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-heart css-16qej3\"></i><span>menu 3</span></div></div></div><i class=\"k-icon k-menu-item-arrow ion-arrow-down-b css-16qej3\"></i></div><div class=\"k-menu css-1ve3qyh k-sub-menu css-g3l0a0\"><div class=\"k-menu-body\"><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 1</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 2</span></div></div></div></div></div><div class=\"k-menu-item k-disabled css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 3</span></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><span>sub menu 4</span></div></div></div></div></div></div></div></div><div class=\"k-menu-item css-12sq2r7\"><div class=\"k-menu-item-title css-14asjef\"><div class=\"k-menu-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\"><i class=\"k-icon ion-gear-b css-16qej3\"></i><span>menu 4</span></div></div></div></div></div></div></div></div>"
|
|
905
905
|
```
|
|
906
906
|
|
|
907
907
|
## `message`
|
|
@@ -1181,7 +1181,7 @@
|
|
|
1181
1181
|
|
|
1182
1182
|
```
|
|
1183
1183
|
"<div><div class=\"k-select css-1ti24q0\" tabindex=\"0\" style=\"margin-right: 10px;\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请输入或选择\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal-->Day: <br><br><div class=\"k-select k-nowrap css-1ti24q0\" tabindex=\"0\" style=\"margin-right: 10px;\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags k-nowrap css-czb0gm\"><div class=\"k-tag k-tags-more c-hidden k-tags-tooltip k-none css-1weg519\">
|
|
1184
|
-
+0</div><!--portal--><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请输入或选择\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请输入或选择</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal-->Days: []</div>"
|
|
1184
|
+
+0</div><!--portal--><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请输入或选择\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请输入或选择</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal-->Days: []<br><br><div class=\"k-select css-1ti24q0\" tabindex=\"0\" style=\"margin-right: 10px;\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请输入或选择\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请输入或选择</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-select-arrow k-icon-down css-16qej3\"></i></span></span></div><!--portal-->Day with keepKeywords=false: []</div>"
|
|
1185
1185
|
```
|
|
1186
1186
|
|
|
1187
1187
|
#### `Select custom`
|
|
@@ -1367,7 +1367,7 @@
|
|
|
1367
1367
|
#### `Slider tooltip`
|
|
1368
1368
|
|
|
1369
1369
|
```
|
|
1370
|
-
"<div><div class=\"k-slider css-1a62bpu\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 50.4444%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 50.4444%;\"><div class=\"k-slider-thumb k-slider-tooltip\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-o1x0o9 css-7sngro\" style=\"display: none;\">277<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>50</span><span>500</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-mi4xql\"><button class=\"k-btn k-none k-btn-icon k-spinner-btn k-left css-h31bz\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon k-icon-down css-16qej3\"></i></button><div class=\"k-input k-spinner-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"277\"></div></div><button class=\"k-btn k-none k-btn-icon k-spinner-btn k-right css-h31bz\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon k-icon-up css-16qej3\"></i></button></div></div></div><div class=\"k-slider css-1a62bpu\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: px;\">300<i class=\"k-tooltip-arrow k-bottom\" style=\"left: 9.
|
|
1370
|
+
"<div><div class=\"k-slider css-1a62bpu\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 50.4444%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 50.4444%;\"><div class=\"k-slider-thumb k-slider-tooltip\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-o1x0o9 css-7sngro\" style=\"display: none;\">277<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>50</span><span>500</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-mi4xql\"><button class=\"k-btn k-none k-btn-icon k-spinner-btn k-left css-h31bz\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon k-icon-down css-16qej3\"></i></button><div class=\"k-input k-spinner-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"277\"></div></div><button class=\"k-btn k-none k-btn-icon k-spinner-btn k-right css-h31bz\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon k-icon-up css-16qej3\"></i></button></div></div></div><div class=\"k-slider css-1a62bpu\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: px;\">300<i class=\"k-tooltip-arrow k-bottom\" style=\"left: 9.015625px\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>50</span><span>500</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-mi4xql\"><button class=\"k-btn k-none k-btn-icon k-spinner-btn k-left css-h31bz\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon k-icon-down css-16qej3\"></i></button><div class=\"k-input k-spinner-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"300\"></div></div><button class=\"k-btn k-none k-btn-icon k-spinner-btn k-right css-h31bz\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon k-icon-up css-16qej3\"></i></button></div></div></div></div>"
|
|
1371
1371
|
```
|
|
1372
1372
|
|
|
1373
1373
|
## `spin`
|
|
@@ -1595,7 +1595,7 @@
|
|
|
1595
1595
|
#### `Table ellipsis`
|
|
1596
1596
|
|
|
1597
1597
|
```
|
|
1598
|
-
"<div class=\"k-table css-18ftmyp\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-resize\"></div><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 2</div></div></th></tr></thead><tbody><tr data-key=\"0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"\"><div class=\"k-ellipsis css-
|
|
1598
|
+
"<div class=\"k-table css-18ftmyp\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-resize\"></div><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 2</div></div></th></tr></thead><tbody><tr data-key=\"0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长</div><!--portal--></div></td><td title=\"Cell 1-2\">Cell 1-2</td></tr><tr data-key=\"1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">Cell 2-1</div></div></td><td title=\"Cell 2-2\">Cell 2-2</td></tr></tbody></table></div></div>"
|
|
1599
1599
|
```
|
|
1600
1600
|
|
|
1601
1601
|
#### `Table empty`
|
|
@@ -1769,7 +1769,7 @@
|
|
|
1769
1769
|
#### `Table virtual`
|
|
1770
1770
|
|
|
1771
1771
|
```
|
|
1772
|
-
"<div><h4>表格</h4><div class=\"k-table k-fix-header css-18ftmyp\"><div class=\"k-virtual k-virtual-container css-1mtyfo1 k-table-wrapper\" style=\"max-height: 400px;\"><div class=\"k-virtual-phantom css-aekvjh\" style=\"height: 410000px;\"></div><div class=\"k-affix k-table-affix-header css-8m3pex\"><div class=\"k-affix-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 2</div></div></th></tr></thead></table></div></div><table><colgroup><col width=\"40\"><col><col></colgroup><tbody class=\"k-virtual-wrapper\" style=\"transform: translateY(0px);\"><tr data-key=\"0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 0-1\">Cell 0-1</td><td title=\"Cell 0-2\">Cell 0-2</td></tr><tr data-key=\"1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 1-1\">Cell 1-1</td><td title=\"Cell 1-2\">Cell 1-2</td></tr><tr data-key=\"2\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 2-1\">Cell 2-1</td><td title=\"Cell 2-2\">Cell 2-2</td></tr><tr data-key=\"3\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 3-1\">Cell 3-1</td><td title=\"Cell 3-2\">Cell 3-2</td></tr><tr data-key=\"4\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 4-1\">Cell 4-1</td><td title=\"Cell 4-2\">Cell 4-2</td></tr><tr data-key=\"5\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 5-1\">Cell 5-1</td><td title=\"Cell 5-2\">Cell 5-2</td></tr><tr data-key=\"6\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 6-1\">Cell 6-1</td><td title=\"Cell 6-2\">Cell 6-2</td></tr><tr data-key=\"7\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 7-1\">Cell 7-1</td><td title=\"Cell 7-2\">Cell 7-2</td></tr><tr data-key=\"8\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 8-1\">Cell 8-1</td><td title=\"Cell 8-2\">Cell 8-2</td></tr><tr data-key=\"9\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 9-1\">Cell 9-1</td><td title=\"Cell 9-2\">Cell 9-2</td></tr><tr data-key=\"10\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 10-1\">Cell 10-1</td><td title=\"Cell 10-2\">Cell 10-2</td></tr><tr data-key=\"11\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 11-1\">Cell 11-1</td><td title=\"Cell 11-2\">Cell 11-2</td></tr><tr data-key=\"12\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 12-1\">Cell 12-1</td><td title=\"Cell 12-2\">Cell 12-2</td></tr><tr data-key=\"13\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 13-1\">Cell 13-1</td><td title=\"Cell 13-2\">Cell 13-2</td></tr><tr data-key=\"14\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 14-1\">Cell 14-1</td><td title=\"Cell 14-2\">Cell 14-2</td></tr><tr data-key=\"15\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 15-1\">Cell 15-1</td><td title=\"Cell 15-2\">Cell 15-2</td></tr></tbody></table></div></div><h4>树形表格</h4><div class=\"k-table k-fix-header css-18ftmyp\"><div class=\"k-virtual k-virtual-container css-1mtyfo1 k-table-wrapper\" style=\"max-height: 400px;\"><div class=\"k-virtual-phantom css-aekvjh\" style=\"height: 0px;\"></div><div class=\"k-affix k-table-affix-header css-8m3pex\"><div class=\"k-affix-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 2</div></div></th></tr></thead></table></div></div><table><colgroup><col width=\"40\"><col><col></colgroup><tbody class=\"k-virtual-wrapper\" style=\"transform: translateY(0px);\"><tr data-key=\"Node-0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-0\">Node-0</td><td title=\"78\">78</td></tr><tr data-key=\"Node-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-1\">Node-1</td><td title=\"21\">21</td></tr><tr data-key=\"Node-2\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-2\">Node-2</td><td title=\"65\">65</td></tr><tr data-key=\"Node-3\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-3\">Node-3</td><td title=\"3\">3</td></tr><tr data-key=\"Node-4\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-4\">Node-4</td><td title=\"6\">6</td></tr><tr data-key=\"Node-5\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-5\">Node-5</td><td title=\"46\">46</td></tr><tr data-key=\"Node-6\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-6\">Node-6</td><td title=\"50\">50</td></tr><tr data-key=\"Node-7\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-7\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-7</td><td title=\"11\">11</td></tr><tr data-key=\"Node-8\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-8\">Node-8</td><td title=\"39\">39</td></tr><tr data-key=\"Node-9\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-9\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-9</td><td title=\"25\">25</td></tr></tbody></table></div></div></div>"
|
|
1772
|
+
"<div><h4>表格</h4><div class=\"k-table k-fix-header css-18ftmyp\"><div class=\"k-virtual k-virtual-container css-1mtyfo1 k-table-wrapper\" style=\"max-height: 400px;\"><div class=\"k-virtual-phantom css-aekvjh\" style=\"height: 410000px;\"></div><div class=\"k-affix k-table-affix-header css-8m3pex\"><div class=\"k-affix-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 2</div></div></th></tr></thead></table></div></div><table><colgroup><col width=\"40\"><col><col></colgroup><tbody class=\"k-virtual-wrapper\" style=\"transform: translateY(0px);\"><tr data-key=\"0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 0-1\">Cell 0-1</td><td title=\"Cell 0-2\">Cell 0-2</td></tr><tr data-key=\"1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 1-1\">Cell 1-1</td><td title=\"Cell 1-2\">Cell 1-2</td></tr><tr data-key=\"2\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 2-1\">Cell 2-1</td><td title=\"Cell 2-2\">Cell 2-2</td></tr><tr data-key=\"3\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 3-1\">Cell 3-1</td><td title=\"Cell 3-2\">Cell 3-2</td></tr><tr data-key=\"4\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 4-1\">Cell 4-1</td><td title=\"Cell 4-2\">Cell 4-2</td></tr><tr data-key=\"5\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 5-1\">Cell 5-1</td><td title=\"Cell 5-2\">Cell 5-2</td></tr><tr data-key=\"6\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 6-1\">Cell 6-1</td><td title=\"Cell 6-2\">Cell 6-2</td></tr><tr data-key=\"7\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 7-1\">Cell 7-1</td><td title=\"Cell 7-2\">Cell 7-2</td></tr><tr data-key=\"8\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 8-1\">Cell 8-1</td><td title=\"Cell 8-2\">Cell 8-2</td></tr><tr data-key=\"9\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 9-1\">Cell 9-1</td><td title=\"Cell 9-2\">Cell 9-2</td></tr><tr data-key=\"10\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 10-1\">Cell 10-1</td><td title=\"Cell 10-2\">Cell 10-2</td></tr><tr data-key=\"11\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 11-1\">Cell 11-1</td><td title=\"Cell 11-2\">Cell 11-2</td></tr><tr data-key=\"12\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 12-1\">Cell 12-1</td><td title=\"Cell 12-2\">Cell 12-2</td></tr><tr data-key=\"13\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 13-1\">Cell 13-1</td><td title=\"Cell 13-2\">Cell 13-2</td></tr><tr data-key=\"14\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 14-1\">Cell 14-1</td><td title=\"Cell 14-2\">Cell 14-2</td></tr><tr data-key=\"15\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 15-1\">Cell 15-1</td><td title=\"Cell 15-2\">Cell 15-2</td></tr></tbody></table></div></div><h4>树形表格</h4><div class=\"k-table k-fix-header css-18ftmyp\"><div class=\"k-virtual k-virtual-container css-1mtyfo1 k-table-wrapper\" style=\"max-height: 400px;\"><div class=\"k-virtual-phantom css-aekvjh\" style=\"height: 424000px;\"></div><div class=\"k-affix k-table-affix-header css-8m3pex\"><div class=\"k-affix-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 2</div></div></th></tr></thead></table></div></div><table><colgroup><col width=\"40\"><col><col></colgroup><tbody class=\"k-virtual-wrapper\" style=\"transform: translateY(0px);\"><tr data-key=\"Node-0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-0\">Node-0</td><td title=\"41\">41</td></tr><tr data-key=\"Node-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-1\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-1</td><td title=\"35\">35</td></tr><tr data-key=\"Node-2\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-2\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-2</td><td title=\"53\">53</td></tr><tr data-key=\"Node-3\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-3\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-3</td><td title=\"71\">71</td></tr><tr data-key=\"Node-4\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-4\">Node-4</td><td title=\"55\">55</td></tr><tr data-key=\"Node-5\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-5\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-5</td><td title=\"31\">31</td></tr><tr data-key=\"Node-6\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-6\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-6</td><td title=\"13\">13</td></tr><tr data-key=\"Node-7\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-7\">Node-7</td><td title=\"79\">79</td></tr><tr data-key=\"Node-8\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-8\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-8</td><td title=\"19\">19</td></tr><tr data-key=\"Node-9\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-9\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-9</td><td title=\"54\">54</td></tr><tr data-key=\"Node-10\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-10\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-10</td><td title=\"94\">94</td></tr><tr data-key=\"Node-11\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-11\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-11</td><td title=\"50\">50</td></tr><tr data-key=\"Node-12\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-12\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-12</td><td title=\"70\">70</td></tr><tr data-key=\"Node-13\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-13\"><button class=\"k-btn k-mini k-none k-btn-icon k-table-arrow k-circle css-h31bz\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-right k-small css-16qej3\"></i></button>Node-13</td><td title=\"34\">34</td></tr><tr data-key=\"Node-14\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-14\">Node-14</td><td title=\"67\">67</td></tr><tr data-key=\"Node-15\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rfvdpj\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Node-15\">Node-15</td><td title=\"3\">3</td></tr></tbody></table></div></div></div>"
|
|
1773
1773
|
```
|
|
1774
1774
|
|
|
1775
1775
|
## `tabs`
|
|
@@ -1887,19 +1887,19 @@
|
|
|
1887
1887
|
#### `Timepicker basic`
|
|
1888
1888
|
|
|
1889
1889
|
```
|
|
1890
|
-
"<div><div class=\"k-select k-timepicker css-
|
|
1890
|
+
"<div><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal-->You selected: <br><br><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择时间\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>请选择时间</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal-->You selected: []</div>"
|
|
1891
1891
|
```
|
|
1892
1892
|
|
|
1893
1893
|
#### `Timepicker format`
|
|
1894
1894
|
|
|
1895
1895
|
```
|
|
1896
|
-
"<div><div class=\"k-select k-timepicker css-
|
|
1896
|
+
"<div><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal--><span>You selected: </span><br><br><div class=\"k-select css-1ti24q0\" step=\"00:30:00\" showformat=\"HH:mm\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"请选择时间\"></div></div></div><span class=\"k-select-suffix\"><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal--><span>You selected: </span><br><br><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal--><span>You selected: null</span></div>"
|
|
1897
1897
|
```
|
|
1898
1898
|
|
|
1899
1899
|
#### `Timepicker range`
|
|
1900
1900
|
|
|
1901
1901
|
```
|
|
1902
|
-
"<div><div class=\"k-select k-timepicker css-
|
|
1902
|
+
"<div><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal-->You selected: null<br><br><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\" value=\"\"><div class=\"k-select-values\"><div class=\"k-tags css-czb0gm\"><div class=\"k-input k-auto-width k-inline k-select-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\" style=\"width: px;\"><div class=\"k-input-fake\"><pre>开始时间 ~ 结束时间</pre></div></div></div></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal-->You selected: []</div>"
|
|
1903
1903
|
```
|
|
1904
1904
|
|
|
1905
1905
|
#### `Timepicker step`
|
|
@@ -1911,7 +1911,7 @@
|
|
|
1911
1911
|
#### `Timepicker stepRange`
|
|
1912
1912
|
|
|
1913
1913
|
```
|
|
1914
|
-
"<div><div class=\"k-select k-timepicker css-
|
|
1914
|
+
"<div><div class=\"k-select k-timepicker css-1bseial\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" readonly=\"\" placeholder=\"开始时间 ~ 结束时间\"></div></div></div><span class=\"k-select-suffix\"><i class=\"k-icon k-hoverable k-select-clear ion-ios-close css-16qej3\"></i><span class=\"k-select-suffix-icon\"><i class=\"k-icon k-icon-time css-16qej3\"></i></span></span></div><!--portal-->You selected: null</div>"
|
|
1915
1915
|
```
|
|
1916
1916
|
|
|
1917
1917
|
## `tip`
|
|
@@ -1951,7 +1951,7 @@
|
|
|
1951
1951
|
#### `Tooltip always`
|
|
1952
1952
|
|
|
1953
1953
|
```
|
|
1954
|
-
"<div style=\"position: relative;\"><span class=\"k-dropdown-open\">always show this tootip</span><!--portal--><br><br><span>always hide this tootip</span><!--portal--><br><br><span class=\"k-dropdown-open\">don't show if content is empty</span><!--portal--></div><div class=\"k-dropdown-menu k-tooltip-content k-always k-dark css-o1x0o9 css-7sngro k-fade-enter-active k-fade-enter-to\" style=\"left:
|
|
1954
|
+
"<div style=\"position: relative;\"><span class=\"k-dropdown-open\">always show this tootip</span><!--portal--><br><br><span>always hide this tootip</span><!--portal--><br><br><span class=\"k-dropdown-open\">don't show if content is empty</span><!--portal--></div><div class=\"k-dropdown-menu k-tooltip-content k-always k-dark css-o1x0o9 css-7sngro k-fade-enter-active k-fade-enter-to\" style=\"left: 36.6875px; top: 26px;\">hello<i class=\"k-tooltip-arrow k-top\" style=\"left: 19.6796875px\"></i></div><div class=\"k-dropdown-menu k-tooltip-content k-always k-dark css-o1x0o9 css-7sngro\" style=\"display: none;\">hide<i class=\"k-tooltip-arrow\"></i></div>"
|
|
1955
1955
|
```
|
|
1956
1956
|
|
|
1957
1957
|
#### `Tooltip basic`
|
|
@@ -1969,7 +1969,7 @@
|
|
|
1969
1969
|
#### `Tooltip position`
|
|
1970
1970
|
|
|
1971
1971
|
```
|
|
1972
|
-
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-
|
|
1972
|
+
"<form class=\"k-form k-horizontal css-1mv8rmx\" novalidate=\"true\"><div class=\"k-form-item css-15gu3l7\"><label class=\"k-form-label\">position:</label><div class=\"k-form-content\"><div class=\"k-btns css-z9s2vw\"><button class=\"k-btn k-default k-active css-h31bz\" tabindex=\"0\" type=\"button\">left<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">right<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">top<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">bottom<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">custom<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div><div class=\"k-form-item k-fluid css-15gu3l7\"><label class=\"k-form-label\"></label><div class=\"k-form-content\"><div class=\"opera\"><button class=\"k-btn k-default k-dropdown-open css-h31bz\" tabindex=\"0\" type=\"button\">at</button><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-always k-dark css-o1x0o9 css-7sngro k-fade-enter-active k-fade-enter-to\" style=\"left: -58.5312px; top: -0.398438px;\">\"left\"<i class=\"k-tooltip-arrow k-right\" style=\"top: 11.3984375px\"></i></div></div><!-- react-mount-point-unstable --></div></div></form>"
|
|
1973
1973
|
```
|
|
1974
1974
|
|
|
1975
1975
|
#### `Tooltip trigger`
|
|
@@ -1984,6 +1984,62 @@
|
|
|
1984
1984
|
"<div><button class=\"k-btn css-eerehs\" tabindex=\"0\" type=\"button\">删除</button><!--portal--></div>"
|
|
1985
1985
|
```
|
|
1986
1986
|
|
|
1987
|
+
## `tour`
|
|
1988
|
+
|
|
1989
|
+
#### `Tour basic`
|
|
1990
|
+
|
|
1991
|
+
```
|
|
1992
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"btn1\" tabindex=\"0\" type=\"button\">示例元素1</button><button class=\"k-btn k-default css-h31bz\" id=\"btn2\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">示例元素2</button></div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动引导</button><span style=\"margin-left: 10px;\">当前步骤: 1</span></div></div>"
|
|
1993
|
+
```
|
|
1994
|
+
|
|
1995
|
+
#### `Tour beforeChange`
|
|
1996
|
+
|
|
1997
|
+
```
|
|
1998
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"step1\" tabindex=\"0\" type=\"button\">步骤1</button><button class=\"k-btn k-default css-h31bz\" id=\"step2\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">步骤2</button><div style=\"margin-top: 20px;\"><div class=\"k-input step3-input css-1x5beu2\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" placeholder=\"通过验证才能进入下一步\"></div></div></div><button class=\"k-btn k-default css-h31bz\" id=\"step4\" tabindex=\"0\" type=\"button\" style=\"margin-top: 20px;\">步骤4</button></div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动引导</button><span style=\"margin-left: 10px;\">当前步骤: 1</span></div></div>"
|
|
1999
|
+
```
|
|
2000
|
+
|
|
2001
|
+
#### `Tour closable`
|
|
2002
|
+
|
|
2003
|
+
```
|
|
2004
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"closabelDemo\" tabindex=\"0\" type=\"button\">目标元素1</button></div><div style=\"margin-top: 20px;\"><div style=\"margin-bottom: 10px;\"><div class=\"k-switch k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><span style=\"margin-left: 10px;\">关闭图标: 禁用</span></div><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动引导</button></div></div>"
|
|
2005
|
+
```
|
|
2006
|
+
|
|
2007
|
+
#### `Tour custom`
|
|
2008
|
+
|
|
2009
|
+
```
|
|
2010
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"btn5\" tabindex=\"0\" type=\"button\">示例元素</button></div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动自定义引导</button></div></div>"
|
|
2011
|
+
```
|
|
2012
|
+
|
|
2013
|
+
#### `Tour customText`
|
|
2014
|
+
|
|
2015
|
+
```
|
|
2016
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"welcome-btn\" tabindex=\"0\" type=\"button\">欢迎页面</button><button class=\"k-btn k-default css-h31bz\" id=\"feature-btn\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">功能介绍</button><button class=\"k-btn k-default css-h31bz\" id=\"finish-btn\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">完成设置</button></div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-primary css-h31bz\" tabindex=\"0\" type=\"button\">开始自定义按钮引导</button><span style=\"margin-left: 10px;\">当前步骤: 1</span></div></div>"
|
|
2017
|
+
```
|
|
2018
|
+
|
|
2019
|
+
#### `Tour declarative`
|
|
2020
|
+
|
|
2021
|
+
```
|
|
2022
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"btn3\" tabindex=\"0\" type=\"button\">示例元素1</button><button class=\"k-btn k-default css-h31bz\" id=\"btn4\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">示例元素2</button></div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动引导</button><span style=\"margin-left: 10px;\">当前步骤: 1</span></div></div>"
|
|
2023
|
+
```
|
|
2024
|
+
|
|
2025
|
+
#### `Tour events`
|
|
2026
|
+
|
|
2027
|
+
```
|
|
2028
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"event-btn1\" tabindex=\"0\" type=\"button\">第一步</button><button class=\"k-btn k-default css-h31bz\" id=\"event-btn2\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">第二步</button><button class=\"k-btn k-default css-h31bz\" id=\"event-btn3\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">第三步</button></div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">开始引导</button><span style=\"margin-left: 10px;\">当前步骤: 1</span></div></div>"
|
|
2029
|
+
```
|
|
2030
|
+
|
|
2031
|
+
#### `Tour maskClosable`
|
|
2032
|
+
|
|
2033
|
+
```
|
|
2034
|
+
"<div><div class=\"example-container\"><button class=\"k-btn k-default css-h31bz\" id=\"maskDemo1\" tabindex=\"0\" type=\"button\">目标元素1</button><button class=\"k-btn k-default css-h31bz\" id=\"maskDemo2\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">目标元素2</button></div><div style=\"margin-top: 20px;\"><div style=\"margin-bottom: 10px;\"><div class=\"k-switch k-checked k-default css-1kd39ob\" tabindex=\"0\"><input type=\"checkbox\" tabindex=\"-1\"><div class=\"k-switch-bar\"><div class=\"k-switch-wrapper\"><div class=\"k-switch-handle\"><img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\"></div></div></div></div><span style=\"margin-left: 10px;\">点击遮罩关闭引导: 启用</span></div><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动引导</button></div></div>"
|
|
2035
|
+
```
|
|
2036
|
+
|
|
2037
|
+
#### `Tour notarget`
|
|
2038
|
+
|
|
2039
|
+
```
|
|
2040
|
+
"<div><div style=\"margin-top: 20px;\"><button class=\"k-btn k-default css-h31bz\" tabindex=\"0\" type=\"button\">启动无目标引导</button></div></div>"
|
|
2041
|
+
```
|
|
2042
|
+
|
|
1987
2043
|
## `transfer`
|
|
1988
2044
|
|
|
1989
2045
|
#### `Transfer basic`
|
|
@@ -2155,7 +2211,7 @@
|
|
|
2155
2211
|
#### `Upload files`
|
|
2156
2212
|
|
|
2157
2213
|
```
|
|
2158
|
-
"<div class=\"k-upload css-kpooy2\"><input class=\"c-hidden\" type=\"file\" multiple=\"\"><div class=\"k-upload-handle\"><button class=\"k-btn k-default css-spvvi2\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-upload css-16qej3\"></i>点击上传</button></div><div class=\"k-upload-files\"><div class=\"k-upload-file\"><div class=\"k-upload-file-main\"><div class=\"k-upload-name c-ellipsis\"><i class=\"k-icon k-upload-file-icon ion-document css-16qej3\"></i><span class=\"k-upload-file-name\"><div class=\"k-ellipsis css-
|
|
2214
|
+
"<div class=\"k-upload css-kpooy2\"><input class=\"c-hidden\" type=\"file\" multiple=\"\"><div class=\"k-upload-handle\"><button class=\"k-btn k-default css-spvvi2\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-icon-upload css-16qej3\"></i>点击上传</button></div><div class=\"k-upload-files\"><div class=\"k-upload-file\"><div class=\"k-upload-file-main\"><div class=\"k-upload-name c-ellipsis\"><i class=\"k-icon k-upload-file-icon ion-document css-16qej3\"></i><span class=\"k-upload-file-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">test1.jpg</div></div></span><i class=\"k-icon k-upload-status-icon k-icon-success-fill css-16qej3\"></i></div></div><i class=\"k-icon k-hoverable k-upload-close k-icon-delete css-16qej3\"></i></div><div class=\"k-upload-file\"><div class=\"k-upload-file-main\"><div class=\"k-upload-name c-ellipsis\"><i class=\"k-icon k-upload-file-icon ion-document css-16qej3\"></i><span class=\"k-upload-file-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">test2.png</div></div></span><i class=\"k-icon k-upload-status-icon k-icon-success-fill css-16qej3\"></i></div></div><i class=\"k-icon k-hoverable k-upload-close k-icon-delete css-16qej3\"></i></div><div class=\"k-upload-file k-error\"><div class=\"k-upload-file-main\"><div class=\"k-upload-name c-ellipsis\"><i class=\"k-icon k-upload-file-icon ion-document css-16qej3\"></i><span class=\"k-upload-file-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">test3.png</div></div></span><i class=\"k-icon k-upload-status-icon k-icon-error-fill css-16qej3\"></i></div></div><i class=\"k-icon k-hoverable k-upload-close k-icon-delete css-16qej3\"></i></div><div class=\"k-upload-file\"><div class=\"k-upload-file-main\"><div class=\"k-upload-name c-ellipsis\"><i class=\"k-icon k-upload-file-icon ion-document css-16qej3\"></i><span class=\"k-upload-file-name\"><div class=\"k-ellipsis css-1vrj62t\"><div class=\"c-ellipsis k-ellipsis-wrapper\">test4-测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长测试超长.png</div><!--portal--></div></span><i class=\"k-icon k-upload-status-icon k-icon-success-fill css-16qej3\"></i></div></div><i class=\"k-icon k-hoverable k-upload-close k-icon-delete css-16qej3\"></i></div></div><!--portal--></div>"
|
|
2159
2215
|
```
|
|
2160
2216
|
|
|
2161
2217
|
#### `Upload gallery`
|
|
@@ -2176,16 +2232,16 @@
|
|
|
2176
2232
|
|
|
2177
2233
|
```
|
|
2178
2234
|
"<div><h3>1. 定高元素</h3><div class=\"k-virtual k-virtual-container css-1mtyfo1\" style=\"height: 450px;\"><div class=\"k-virtual-phantom css-aekvjh\" style=\"height: 180000px;\"></div><div class=\"k-virtual-wrapper\" style=\"transform: translateY(0px);\"><div class=\"fixed-height-item\">测试0</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试1</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试2</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试3</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试4</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试5</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试6</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试7</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试8</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试9</div><div class=\"fixed-height-item\">测试10</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试11</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试12</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试13</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试14</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试15</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试16</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试17</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试18</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试19</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试20</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试21</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试22</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试23</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试24</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试25</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试26</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试27</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试28</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试29</div><!-- react-mount-point-unstable --><div class=\"fixed-height-item\">测试30</div><!-- react-mount-point-unstable --><!-- react-mount-point-unstable --></div></div><h3>2. 不定高元素</h3><div class=\"k-virtual k-virtual-container css-1mtyfo1\" style=\"width: 200px; height: 450px;\"><div class=\"k-virtual-phantom css-aekvjh\" style=\"height: 0px;\"></div><div class=\"k-virtual-wrapper\" style=\"transform: translateY(0px);\"><div class=\"variable-height-item\">不定高度项 0
|
|
2179
|
-
|
|
2180
|
-
|
|
2181
|
-
|
|
2182
|
-
|
|
2183
|
-
|
|
2184
|
-
|
|
2185
|
-
|
|
2235
|
+
行内容行内容行内容行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 1
|
|
2236
|
+
行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 2
|
|
2237
|
+
行内容行内容行内容行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 3
|
|
2238
|
+
行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 4
|
|
2239
|
+
行内容行内容行内容行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 5
|
|
2240
|
+
行内容行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 6
|
|
2241
|
+
行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 7
|
|
2186
2242
|
行内容行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 8
|
|
2187
|
-
|
|
2188
|
-
|
|
2243
|
+
行内容行内容行内容行内容行内容</div><!-- react-mount-point-unstable --><div class=\"variable-height-item\">不定高度项 9
|
|
2244
|
+
行内容</div><!-- react-mount-point-unstable --></div></div></div>"
|
|
2189
2245
|
```
|
|
2190
2246
|
|
|
2191
2247
|
#### `VirtualList combined`
|