@king-design/vue 2.1.0 → 2.1.2

package/__tests__/__snapshots__/Vue Next Demos.md

@@ -509,7 +509,7 @@
 ####   `Form basic`
 
 ```
-"<form class=\"k-form k-horizontal css-11cgyra\" novalidate=\"true\"><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: 200px;\">Input</label><div class=\"k-form-content\"><div class=\"k-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Select</label><div class=\"k-form-content\"><div class=\"k-select css-1k3uw7s\" 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 ion-ios-arrow-down css-x0ey6t\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Checkbox</label><div class=\"k-form-content\"><label class=\"k-checkbox css-rt2md4\" 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-rt2md4\" 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-rt2md4\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Radio</label><div class=\"k-form-content\"><label class=\"k-radio css-9px8r3\" 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-9px8r3\" 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-9px8r3\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Radio ButtonGroup</label><div class=\"k-form-content\"><div class=\"k-btns css-16i9d0z\"><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">Javascript<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">PHP<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">C++<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Switch</label><div class=\"k-form-content\"><div class=\"k-switch k-default css-1r7l1sz\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Slider</label><div class=\"k-form-content\"><div class=\"k-slider css-1g0hxdl\"><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\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: 200px;\">Datepicker</label><div class=\"k-form-content\"><div class=\"k-select k-datepicker css-1k3uw7s\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1j9tfcu\"><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-x0ey6t\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Textarea</label><div class=\"k-form-content\"><div class=\"k-input k-resize-vertical css-1j9tfcu\"><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-19k8qnx\"><label class=\"k-form-label\" style=\"width: 200px;\">Password</label><div class=\"k-form-content\"><div class=\"k-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" type=\"password\"></div></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Confirm Password</label><div class=\"k-form-content\"><div class=\"k-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" type=\"password\"></div></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\"></label><div class=\"k-form-content\"><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"submit\">提交</button><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">重置</button></div></div></form>"
+"<form class=\"k-form k-horizontal css-11cgyra\" novalidate=\"true\"><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: 200px;\">Input</label><div class=\"k-form-content\"><div class=\"k-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\"></div></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Select</label><div class=\"k-form-content\"><div class=\"k-select css-1k3uw7s\" 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 ion-ios-arrow-down css-x0ey6t\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Checkbox</label><div class=\"k-form-content\"><label class=\"k-checkbox css-rt2md4\" 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-rt2md4\" 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-rt2md4\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Radio</label><div class=\"k-form-content\"><label class=\"k-radio css-9px8r3\" 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-9px8r3\" 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-9px8r3\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Radio ButtonGroup</label><div class=\"k-form-content\"><div class=\"k-btns css-16i9d0z\"><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">Javascript<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">PHP<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">C++<input class=\"k-button-input\" type=\"radio\" tabindex=\"-1\"></button></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Switch</label><div class=\"k-form-content\"><div class=\"k-switch k-default css-1r7l1sz\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Slider</label><div class=\"k-form-content\"><div class=\"k-slider css-1g0hxdl\"><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-z651tk css-1iaopr2\" 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-19k8qnx\"><label class=\"k-form-label\" style=\"width: 200px;\">Datepicker</label><div class=\"k-form-content\"><div class=\"k-select k-datepicker css-1k3uw7s\" tabindex=\"0\"><div class=\"k-select-main\"><input type=\"hidden\"><div class=\"k-input k-fluid k-inline css-1j9tfcu\"><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-x0ey6t\"></i></span></span></div><!--portal--></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Textarea</label><div class=\"k-form-content\"><div class=\"k-input k-resize-vertical css-1j9tfcu\"><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-19k8qnx\"><label class=\"k-form-label\" style=\"width: 200px;\">Password</label><div class=\"k-form-content\"><div class=\"k-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" type=\"password\"></div></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\">Confirm Password</label><div class=\"k-form-content\"><div class=\"k-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" type=\"password\"></div></div></div></div><div class=\"k-form-item css-19k8qnx\"><label class=\"k-form-label\" style=\"width: px;\"></label><div class=\"k-form-content\"><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"submit\">提交</button><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\" style=\"margin-left: 20px;\">重置</button></div></div></form>"
 ```
 
 ####   `Form custom`
@@ -729,7 +729,7 @@
 ####   `Menu collapse`
 
 ```
-"<div><div class=\"k-switch k-default css-1r7l1sz\" 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-1r7l1sz\" 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-vertical css-drqtdg\"><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-flag css-x0ey6t\"></i>menu 1</div></div></div><div class=\"k-menu-item k-disabled css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-star css-x0ey6t\"></i>menu 2</div></div></div><div class=\"k-menu-item k-expanded k-highlighted css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-heart css-x0ey6t\"></i>menu 3 </div><i class=\"k-menu-arrow ion-ios-arrow-down\"></i></div><div class=\"k-menu css-drqtdg\"><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\">sub menu 1</div></div></div><div class=\"k-menu-item k-active css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\">sub menu 2</div></div></div><div class=\"k-menu-item k-disabled css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\">sub menu 3</div></div></div><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"> sub menu 4 </div><i class=\"k-menu-arrow ion-ios-arrow-down\"></i></div><div class=\"k-menu css-drqtdg\" style=\"display: none;\"><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\">option 1</div></div></div><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\">option 2</div></div></div></div></div></div></div><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-gear-b css-x0ey6t\"></i>menu 4</div></div></div></div></div>"
+"<div><div class=\"k-switch k-checked k-default css-1r7l1sz\" 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-1r7l1sz\" 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-drqtdg\"><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-flag css-x0ey6t\"></i></div></div><!--portal--></div><div class=\"k-menu-item k-disabled css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-star css-x0ey6t\"></i></div></div><!--portal--></div><div class=\"k-menu-item k-highlighted css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-heart css-x0ey6t\"></i></div><i class=\"k-menu-arrow ion-ios-arrow-down\"></i></div><!--portal--></div><div class=\"k-menu-item css-kt9fag\"><div class=\"k-menu-title css-r08qjw\"><div class=\"k-menu-name\"><i class=\"k-icon ion-gear-b css-x0ey6t\"></i></div></div><!--portal--></div></div></div>"
 ```
 
 ####   `Menu dot`
@@ -1094,49 +1094,49 @@
 ####   `Slider basic`
 
 ```
-"<div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 60%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 60%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">60<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0MB</span><span>100MB</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"60MB\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><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\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" 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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"277\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">Change Range Randomly</button></div>"
+"<div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 60%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 60%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">60<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0MB</span><span>100MB</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"60MB\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><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-z651tk css-1iaopr2\" 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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"277\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><button class=\"k-btn css-12uxt25\" tabindex=\"0\" type=\"button\">Change Range Randomly</button></div>"
 ```
 
 ####   `Slider disabled`
 
 ```
-"<div><div class=\"k-slider k-disabled css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 50%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 50%;\"><div class=\"k-slider-thumb\" tabindex=\"-1\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">50<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-disabled k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-disabled k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" disabled=\"\" value=\"50\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider k-disabled css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 50%; left: 10%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 10%;\"><div class=\"k-slider-thumb\" tabindex=\"-1\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">55<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 60%;\"><div class=\"k-slider-thumb\" tabindex=\"-1\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">80<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>50</span><span>100</span></div></div></div></div>"
+"<div><div class=\"k-slider k-disabled css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 50%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 50%;\"><div class=\"k-slider-thumb k-slider-tooltip\" tabindex=\"-1\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">50<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-disabled k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-disabled k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" disabled=\"\" value=\"50\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider k-disabled css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 50%; left: 10%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 10%;\"><div class=\"k-slider-thumb k-slider-tooltip\" tabindex=\"-1\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">55<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 60%;\"><div class=\"k-slider-thumb k-slider-tooltip\" tabindex=\"-1\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">80<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>50</span><span>100</span></div></div></div></div>"
 ```
 
 ####   `Slider dynamicStep`
 
 ```
-"<div class=\"k-slider css-1g0hxdl\"><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\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">0<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point\" style=\"left: 2%;\"></i><i class=\"k-slider-point\" style=\"left: 4%;\"></i><i class=\"k-slider-point\" style=\"left: 6%;\"></i><i class=\"k-slider-point\" style=\"left: 8%;\"></i><i class=\"k-slider-point\" style=\"left: 10%;\"></i><i class=\"k-slider-point\" style=\"left: 12%;\"></i><i class=\"k-slider-point\" style=\"left: 14%;\"></i><i class=\"k-slider-point\" style=\"left: 16%;\"></i><i class=\"k-slider-point\" style=\"left: 18%;\"></i><i class=\"k-slider-point\" style=\"left: 20%;\"></i><i class=\"k-slider-point\" style=\"left: 30%;\"></i><i class=\"k-slider-point\" style=\"left: 40%;\"></i><i class=\"k-slider-point\" style=\"left: 50%;\"></i><i class=\"k-slider-point\" style=\"left: 60%;\"></i><i class=\"k-slider-point\" style=\"left: 70%;\"></i><i class=\"k-slider-point\" style=\"left: 80%;\"></i><i class=\"k-slider-point\" style=\"left: 90%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>500</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"0\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div>"
+"<div class=\"k-slider css-1g0hxdl\"><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-z651tk css-1iaopr2\" style=\"display: none;\">0<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point\" style=\"left: 2%;\"></i><i class=\"k-slider-point\" style=\"left: 4%;\"></i><i class=\"k-slider-point\" style=\"left: 6%;\"></i><i class=\"k-slider-point\" style=\"left: 8%;\"></i><i class=\"k-slider-point\" style=\"left: 10%;\"></i><i class=\"k-slider-point\" style=\"left: 12%;\"></i><i class=\"k-slider-point\" style=\"left: 14%;\"></i><i class=\"k-slider-point\" style=\"left: 16%;\"></i><i class=\"k-slider-point\" style=\"left: 18%;\"></i><i class=\"k-slider-point\" style=\"left: 20%;\"></i><i class=\"k-slider-point\" style=\"left: 30%;\"></i><i class=\"k-slider-point\" style=\"left: 40%;\"></i><i class=\"k-slider-point\" style=\"left: 50%;\"></i><i class=\"k-slider-point\" style=\"left: 60%;\"></i><i class=\"k-slider-point\" style=\"left: 70%;\"></i><i class=\"k-slider-point\" style=\"left: 80%;\"></i><i class=\"k-slider-point\" style=\"left: 90%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>500</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"0\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div>"
 ```
 
 ####   `Slider marks`
 
 ```
-"<div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 45.4545%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45.4545%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">6<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-marks\"><span style=\"left: 0%;\">1</span><span style=\"left: 9.09091%;\">2</span><span style=\"left: 18.1818%;\">3</span><span style=\"left: 27.2727%;\">4</span><span style=\"left: 36.3636%;\">5</span><span class=\"k-active\" style=\"left: 45.4545%;\">6月</span><span style=\"left: 54.5455%;\">7</span><span style=\"left: 63.6364%;\">8</span><span style=\"left: 72.7273%;\">9</span><span style=\"left: 81.8182%;\">1年</span><span style=\"left: 90.9091%;\">2年</span><span style=\"left: 100%;\">3年</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 36.3636%; left: 9.09091%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 9.09091%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">2<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45.4545%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">6<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-marks\"><span style=\"left: 0%;\">1</span><span class=\"k-active\" style=\"left: 9.09091%;\">2月</span><span style=\"left: 18.1818%;\">3</span><span style=\"left: 27.2727%;\">4</span><span style=\"left: 36.3636%;\">5</span><span class=\"k-active\" style=\"left: 45.4545%;\">6月</span><span style=\"left: 54.5455%;\">7</span><span style=\"left: 63.6364%;\">8</span><span style=\"left: 72.7273%;\">9</span><span style=\"left: 81.8182%;\">1年</span><span style=\"left: 90.9091%;\">2年</span><span style=\"left: 100%;\">3年</span></div></div></div></div>"
+"<div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 45.4545%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45.4545%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">6<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-marks\"><span style=\"left: 0%;\">1</span><span style=\"left: 9.09091%;\">2</span><span style=\"left: 18.1818%;\">3</span><span style=\"left: 27.2727%;\">4</span><span style=\"left: 36.3636%;\">5</span><span class=\"k-active\" style=\"left: 45.4545%;\">6月</span><span style=\"left: 54.5455%;\">7</span><span style=\"left: 63.6364%;\">8</span><span style=\"left: 72.7273%;\">9</span><span style=\"left: 81.8182%;\">1年</span><span style=\"left: 90.9091%;\">2年</span><span style=\"left: 100%;\">3年</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 36.3636%; left: 9.09091%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 9.09091%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">2<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45.4545%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">6<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-marks\"><span style=\"left: 0%;\">1</span><span class=\"k-active\" style=\"left: 9.09091%;\">2月</span><span style=\"left: 18.1818%;\">3</span><span style=\"left: 27.2727%;\">4</span><span style=\"left: 36.3636%;\">5</span><span class=\"k-active\" style=\"left: 45.4545%;\">6月</span><span style=\"left: 54.5455%;\">7</span><span style=\"left: 63.6364%;\">8</span><span style=\"left: 72.7273%;\">9</span><span style=\"left: 81.8182%;\">1年</span><span style=\"left: 90.9091%;\">2年</span><span style=\"left: 100%;\">3年</span></div></div></div></div>"
 ```
 
 ####   `Slider points`
 
 ```
-"<div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 45%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">45<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point k-active\" style=\"left: 5%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 10%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 15%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 20%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 25%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 30%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 35%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 40%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 45%;\"></i><i class=\"k-slider-point\" style=\"left: 50%;\"></i><i class=\"k-slider-point\" style=\"left: 55%;\"></i><i class=\"k-slider-point\" style=\"left: 60%;\"></i><i class=\"k-slider-point\" style=\"left: 65%;\"></i><i class=\"k-slider-point\" style=\"left: 70%;\"></i><i class=\"k-slider-point\" style=\"left: 75%;\"></i><i class=\"k-slider-point\" style=\"left: 80%;\"></i><i class=\"k-slider-point\" style=\"left: 85%;\"></i><i class=\"k-slider-point\" style=\"left: 90%;\"></i><i class=\"k-slider-point\" style=\"left: 95%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 30%; left: 30%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 30%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">0.3<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 60%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">0.6<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point\" style=\"left: 10%;\"></i><i class=\"k-slider-point\" style=\"left: 20%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 30%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 40%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 50%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 60%;\"></i><i class=\"k-slider-point\" style=\"left: 70%;\"></i><i class=\"k-slider-point\" style=\"left: 80%;\"></i><i class=\"k-slider-point\" style=\"left: 90%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>1</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 45%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">45<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point k-active\" style=\"left: 0%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 35%;\"></i><i class=\"k-slider-point\" style=\"left: 95%;\"></i><i class=\"k-slider-point\" style=\"left: 100%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div></div></div>"
+"<div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 45%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">45<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point k-active\" style=\"left: 5%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 10%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 15%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 20%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 25%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 30%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 35%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 40%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 45%;\"></i><i class=\"k-slider-point\" style=\"left: 50%;\"></i><i class=\"k-slider-point\" style=\"left: 55%;\"></i><i class=\"k-slider-point\" style=\"left: 60%;\"></i><i class=\"k-slider-point\" style=\"left: 65%;\"></i><i class=\"k-slider-point\" style=\"left: 70%;\"></i><i class=\"k-slider-point\" style=\"left: 75%;\"></i><i class=\"k-slider-point\" style=\"left: 80%;\"></i><i class=\"k-slider-point\" style=\"left: 85%;\"></i><i class=\"k-slider-point\" style=\"left: 90%;\"></i><i class=\"k-slider-point\" style=\"left: 95%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 30%; left: 30%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 30%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">0.3<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 60%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">0.6<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point\" style=\"left: 10%;\"></i><i class=\"k-slider-point\" style=\"left: 20%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 30%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 40%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 50%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 60%;\"></i><i class=\"k-slider-point\" style=\"left: 70%;\"></i><i class=\"k-slider-point\" style=\"left: 80%;\"></i><i class=\"k-slider-point\" style=\"left: 90%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>1</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 45%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 45%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">45<i class=\"k-tooltip-arrow\"></i></div></div><i class=\"k-slider-point k-active\" style=\"left: 0%;\"></i><i class=\"k-slider-point k-active\" style=\"left: 35%;\"></i><i class=\"k-slider-point\" style=\"left: 95%;\"></i><i class=\"k-slider-point\" style=\"left: 100%;\"></i></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div></div></div>"
 ```
 
 ####   `Slider range`
 
 ```
-"<div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 26%; left: 50%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 50%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">50<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 76%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">76<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 class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 26%; left: 50%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 50%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">50<i class=\"k-tooltip-arrow\"></i></div></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 76%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">76<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0</span><span>100</span></div></div></div>"
 ```
 
 ####   `Slider step`
 
 ```
-"<div><div class=\"k-slider css-1g0hxdl\"><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\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">0<i class=\"k-tooltip-arrow\"></i></div></div></div></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"0\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><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\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">50<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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"50\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 23.4234%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 23.4234%;\"><div class=\"k-slider-thumb\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" style=\"display: none;\">0.234234<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0</span><span>1</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"0.234234\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div></div>"
+"<div><div class=\"k-slider css-1g0hxdl\"><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-z651tk css-1iaopr2\" style=\"display: none;\">0<i class=\"k-tooltip-arrow\"></i></div></div></div></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"0\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><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-z651tk css-1iaopr2\" style=\"display: none;\">50<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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left k-disabled css-12uxt25\" tabindex=\"-1\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"50\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 23.4234%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 23.4234%;\"><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-z651tk css-1iaopr2\" style=\"display: none;\">0.234234<i class=\"k-tooltip-arrow\"></i></div></div></div></div><div class=\"k-slider-ends\"><span>0</span><span>1</span></div></div><div class=\"k-slider-spinner\"><div class=\"k-spinner k-vertical css-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"0.234234\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div></div>"
 ```
 
 ####   `Slider tooltip`
 
 ```
-"<div><div class=\"k-slider css-1g0hxdl\"><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\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-dark k-slider-tooltip css-z651tk css-1iaopr2\" 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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"277\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: px;\">6<i class=\"k-tooltip-arrow k-bottom\" style=\"left: 9.34375px\"></i></div></div></div></div><div class=\"k-slider-marks\"><span style=\"left: 0%;\">1</span><span style=\"left: 9.09091%;\">2</span><span style=\"left: 18.1818%;\">3</span><span style=\"left: 27.2727%;\">4</span><span style=\"left: 36.3636%;\">5</span><span class=\"k-active\" style=\"left: 45.4545%;\">6月</span><span style=\"left: 54.5455%;\">7</span><span style=\"left: 63.6364%;\">8</span><span style=\"left: 72.7273%;\">9</span><span style=\"left: 81.8182%;\">1年</span><span style=\"left: 90.9091%;\">2年</span><span style=\"left: 100%;\">3年</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 55.5556%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 55.5556%;\"><div class=\"k-slider-thumb k-dropdown-open\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-always k-light k-small k-slider-tooltip css-z651tk css-1iaopr2 k-fade-enter-from k-fade-enter-active\" style=\"left: -8.01562px; top: -34.7969px;\">300<i class=\"k-tooltip-arrow k-bottom\" style=\"left: 8.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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"300\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div></div>"
+"<div><div class=\"k-slider css-1g0hxdl\"><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-z651tk css-1iaopr2\" 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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"277\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: px;\">6<i class=\"k-tooltip-arrow k-bottom\" style=\"left: 9.34375px\"></i></div></div></div></div><div class=\"k-slider-marks\"><span style=\"left: 0%;\">1</span><span style=\"left: 9.09091%;\">2</span><span style=\"left: 18.1818%;\">3</span><span style=\"left: 27.2727%;\">4</span><span style=\"left: 36.3636%;\">5</span><span class=\"k-active\" style=\"left: 45.4545%;\">6月</span><span style=\"left: 54.5455%;\">7</span><span style=\"left: 63.6364%;\">8</span><span style=\"left: 72.7273%;\">9</span><span style=\"left: 81.8182%;\">1年</span><span style=\"left: 90.9091%;\">2年</span><span style=\"left: 100%;\">3年</span></div></div></div><div class=\"k-slider css-1g0hxdl\"><div class=\"k-slider-main\"><div class=\"k-slider-track-wrapper\"><div class=\"k-slider-track\"><div class=\"k-slider-bar\" style=\"width: 55.5556%;\"></div><div class=\"k-slider-thumb-wrapper\" style=\"left: 55.5556%;\"><div class=\"k-slider-thumb k-dropdown-open k-slider-tooltip\" tabindex=\"0\"></div><!--portal--><div class=\"k-dropdown-menu k-tooltip-content k-hoverable k-always k-light k-small k-slider-tooltip css-z651tk css-1iaopr2 k-fade-enter-from k-fade-enter-active\" style=\"left: -8.01562px; top: -34.7969px;\">300<i class=\"k-tooltip-arrow k-bottom\" style=\"left: 8.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-4xu2td\"><button class=\"k-btn k-btn-icon k-spinner-btn k-left css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-down css-x0ey6t\"></i></button><div class=\"k-input k-spinner-input css-1j9tfcu\"><div class=\"k-input-wrapper\"><input class=\"k-input-inner\" value=\"300\"></div></div><button class=\"k-btn k-btn-icon k-spinner-btn k-right css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon k-spinner-icon ion-ios-arrow-up css-x0ey6t\"></i></button></div></div></div></div>"
 ```
 
 ## `spin`
@@ -1466,7 +1466,7 @@
 ####   `Table title`
 
 ```
-"<div class=\"k-table css-1nq07fu\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th class=\"k-column-sortable\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\"><span title=\"自定义表头内容\" class=\"middle title\">自定义表头内容</span><i class=\"\"></i><!--portal--></div><button class=\"k-btn k-mini k-btn-icon k-table-group css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon ion-android-arrow-dropdown css-x0ey6t\"></i></button><!--portal--><div class=\"k-column-sort\"><i class=\"k-icon ion-android-arrow-dropup k-asc css-x0ey6t\"></i><i class=\"k-icon ion-android-arrow-dropdown k-desc css-x0ey6t\"></i></div></div></th><th title=\"表头2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">表头2</div></div></th></tr></thead><tbody><tr data-key=\"0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"第一行\">第一行</td><td title=\"哈哈2\">哈哈2</td></tr><tr data-key=\"1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"第二行\">第二行</td><td title=\"哈哈2\">哈哈2</td></tr></tbody></table></div></div>"
+"<div class=\"k-table css-1nq07fu\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th class=\"k-column-sortable\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\"><span title=\"自定义表头内容\" class=\"middle title\">自定义表头内容</span><i class=\"ion-ios-help-outline middle\"></i><!--portal--></div><button class=\"k-btn k-mini k-btn-icon k-table-group css-12uxt25\" tabindex=\"0\" type=\"button\"><i class=\"k-icon ion-android-arrow-dropdown css-x0ey6t\"></i></button><!--portal--><div class=\"k-column-sort\"><i class=\"k-icon ion-android-arrow-dropup k-asc css-x0ey6t\"></i><i class=\"k-icon ion-android-arrow-dropdown k-desc css-x0ey6t\"></i></div></div></th><th title=\"表头2\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">表头2</div></div></th></tr></thead><tbody><tr data-key=\"0\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"第一行\">第一行</td><td title=\"哈哈2\">哈哈2</td></tr><tr data-key=\"1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"第二行\">第二行</td><td title=\"哈哈2\">哈哈2</td></tr></tbody></table></div></div>"
 ```
 
 ####   `Table tooltip`

package/components/dropdown/dropdown.d.ts

@@ -3,6 +3,7 @@ import { Options, Feedback } from '../position';
 import { Portal, PortalProps } from '../portal';
 import { FeedbackCallback } from './usePosition';
 import type { Events } from '../types';
+import { Virtual } from '../virtual';
 export declare type Position = Options;
 export declare type PositionShorthand = 'left' | 'bottom' | 'right' | 'top';
 export declare const DROPDOWN = "Dropdown";
@@ -12,6 +13,7 @@ export interface DropdownProps {
     disabled?: boolean;
     value?: boolean;
     position?: Position | 'left' | 'bottom' | 'right' | 'top';
+    collison?: Position['collision'];
     of?: 'self' | 'parent' | Event;
     container?: PortalProps['container'];
 }
@@ -21,6 +23,8 @@ export interface DropdownEvents {
     hide: [];
     mouseenter: [MouseEvent];
     mouseleave: [MouseEvent];
+    click: [MouseEvent];
+    contextmenu: [MouseEvent];
     positioned: [Feedback];
 }
 export interface DropdownBlocks {
@@ -30,7 +34,7 @@ export declare class Dropdown<T extends DropdownProps = DropdownProps, E extends
     static typeDefs: Required<TypeDefs<DropdownProps>>;
     static defaults: () => Partial<DropdownProps>;
     static events: Events<DropdownEvents>;
-    static template: (this: Dropdown) => (VNode<import("intact").VNodeTag> | VNode<typeof Portal>)[];
+    static template: (this: Dropdown) => (VNode<typeof Virtual> | VNode<typeof Portal>)[];
     menuVNode: VNode | null;
     dropdown: Dropdown | null;
     rootDropdown: Dropdown | null;
@@ -41,8 +45,7 @@ export declare class Dropdown<T extends DropdownProps = DropdownProps, E extends
             value: boolean;
         };
     };
-    private timer;
-    private triggerProps;
+    protected timer: number | undefined;
     init(): void;
     show(shouldFocus?: boolean): void;
     hide(immediately?: boolean): void;
@@ -52,6 +55,4 @@ export declare class Dropdown<T extends DropdownProps = DropdownProps, E extends
     private onContextMenu;
     private onLeave;
     private initEventCallbacks;
-    private callOriginalCallback;
-    private normalizeTriggerProps;
 }

package/components/dropdown/dropdown.js

@@ -3,14 +3,15 @@ import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js/instance/filter";
 import { __decorate } from "tslib";
-import { Component, createVNode as h, directClone, provide, inject, findDomFromVNode, createVNode, nextTick } from 'intact-vue-next';
-import { bind, isTextChildren } from '../utils';
-import { EMPTY_OBJ, isFunction, noop } from 'intact-shared';
+import { Component, createVNode as h, provide, inject, findDomFromVNode, nextTick } from 'intact-vue-next';
+import { bind, getRestProps } from '../utils';
+import { noop } from 'intact-shared';
 import { cx } from '@emotion/css';
 import { useDocumentClick, containsOrEqual } from '../../hooks/useDocumentClick';
 import { Portal } from '../portal';
 import { useShowHideEvents } from '../../hooks/useShowHideEvents';
 import { usePosition } from './usePosition';
+import { Virtual } from '../virtual';
 export var DROPDOWN = 'Dropdown';
 export var ROOT_DROPDOWN = 'RootDropdown';
 var typeDefs = {
@@ -20,13 +21,15 @@ var typeDefs = {
   position: [Object, 'left', 'bottom', 'right', 'top'],
   // Event is undefined in NodeJs
   of: ['self', 'parent', typeof Event === 'undefined' ? undefined : Event],
-  container: [String, Function]
+  container: [String, Function],
+  collison: ['none', 'fit', 'flip', 'flipfit', Array]
 };
 
 var defaults = function defaults() {
   return {
     trigger: 'hover',
-    of: 'self'
+    of: 'self',
+    value: false
   };
 };
 
@@ -36,6 +39,8 @@ var events = {
   hide: true,
   mouseenter: true,
   mouseleave: true,
+  click: true,
+  contextmenu: true,
   positioned: true
 };
 export var Dropdown = /*#__PURE__*/function (_Component) {
@@ -57,7 +62,6 @@ export var Dropdown = /*#__PURE__*/function (_Component) {
     _this.showedDropdown = null;
     _this.positionHook = usePosition();
     _this.timer = undefined;
-    _this.triggerProps = null;
     return _this;
   }
 
@@ -95,7 +99,13 @@ export var Dropdown = /*#__PURE__*/function (_Component) {
 
     if (this.get('disabled')) return;
     clearTimeout(this.timer);
-    this.set('value', true);
+    this.set('value', true); // should show parent dropdown
+
+    var parentDropdown = this.dropdown;
+
+    if (parentDropdown) {
+      parentDropdown.show();
+    }
 
     if (shouldFocus) {
       nextTick(function () {
@@ -113,10 +123,16 @@ export var Dropdown = /*#__PURE__*/function (_Component) {
 
     if (this.get('disabled')) return;
     if (!this.get('value')) return;
+    var showedDropdown = this.showedDropdown;
+
+    if (showedDropdown) {
+      showedDropdown.hide(immediately);
+    }
 
     if (immediately) {
       this.set('value', false);
     } else {
+      clearTimeout(this.timer);
       this.timer = window.setTimeout(function () {
         _this4.set('value', false);
       }, 200);
@@ -136,23 +152,24 @@ export var Dropdown = /*#__PURE__*/function (_Component) {
   };
 
   _proto.onEnter = function onEnter(e) {
-    this.callOriginalCallback(e.type === 'click' ? 'ev-click' : 'ev-mouseenter', e);
     this.show();
+    this.trigger(e.type, e);
   };
 
   _proto.onContextMenu = function onContextMenu(e) {
-    this.callOriginalCallback('ev-contextmenu', e);
     e.preventDefault();
     this.set('of', e);
     this.show();
+    this.trigger('contextmenu', e);
   };
 
   _proto.onLeave = function onLeave(e) {
-    this.callOriginalCallback('ev-mouseleave', e);
     this.hide();
+    this.trigger(e.type, e);
   };
 
-  _proto.initEventCallbacks = function initEventCallbacks(trigger) {
+  _proto.initEventCallbacks = function initEventCallbacks() {
+    var trigger = this.get('trigger');
     var props = {};
 
     switch (trigger) {
@@ -179,51 +196,6 @@ export var Dropdown = /*#__PURE__*/function (_Component) {
     return props;
   };
 
-  _proto.callOriginalCallback = function callOriginalCallback(name, e) {
-    var callback = this.triggerProps[name];
-    var callbackOnDropdown = this.get(name);
-    if (isFunction(callback)) callback(e);
-    if (isFunction(callbackOnDropdown)) callbackOnDropdown(e);
-  };
-
-  _proto.normalizeTriggerProps = function normalizeTriggerProps(props) {
-    // if use kpc in react or vue, normalize props by Wrapper.props.vnode;
-    var vnode = props.vnode;
-    if (!vnode) return props; // maybe we render the intact component in react slot property, in this case
-    // the $isReact is false. so use the vnode $$typeof field as gauge
-
-    if (vnode.$$typeof || this.$isVueNext) {
-      var _props = vnode.props;
-      if (!_props) return props;
-      return {
-        vnode: vnode,
-        'ev-click': _props.onClick,
-        'ev-mouseenter': _props.onMouseEnter,
-        'ev-mouseleave': _props.onMouseLeave,
-        'ev-contextmenu': _props.onContextMenu,
-        className: _props.className || _props.class
-        /* vue-next */
-
-      };
-    } else if (this.$isVue) {
-      var data = vnode.data;
-      var on = data && data.on || EMPTY_OBJ;
-      var ret = {
-        vnode: vnode
-      };
-      ['click', 'mouseenter', 'mouseleave', 'contextmenu'].forEach(function (event) {
-        var method = on[event];
-
-        if (method) {
-          ret["ev-" + event] = method;
-        }
-      });
-      return ret;
-    }
-
-    return props;
-  };
-
   return Dropdown;
 }(Component);
 Dropdown.$doubleVNodes = true;
@@ -253,21 +225,22 @@ Dropdown.template = function () {
   var _children = children,
       trigger = _children[0],
       menu = _children[1];
-  var triggerType = this.get('trigger');
-  var props = this.initEventCallbacks(triggerType);
-  var clonedTrigger = isTextChildren(trigger) ? createVNode('span', null, trigger) : directClone(trigger);
-  var triggerProps = this.triggerProps = this.normalizeTriggerProps(trigger.props || EMPTY_OBJ); // add a className for opening status
-
-  var className = trigger.className || triggerProps.className;
-  className = cx((_cx = {}, _cx[className] = className, _cx['k-dropdown-open'] = this.get('value'), _cx));
-  clonedTrigger.props = _extends({}, triggerProps, props, {
-    className: className
-  });
-  clonedTrigger.className = className;
+  var props = this.initEventCallbacks();
+
+  var _this$get = this.get(),
+      className = _this$get.className,
+      value = _this$get.value,
+      container = _this$get.container;
+
+  className = cx((_cx = {
+    'k-dropdown-open': value
+  }, _cx[className] = !!className, _cx));
   this.menuVNode = menu;
-  return [clonedTrigger, h(Portal, {
+  return [h(Virtual, _extends({}, props, getRestProps(this), {
+    className: className
+  }), trigger), h(Portal, {
     children: menu,
-    container: this.get('container')
+    container: container
   })];
 };