evui 3.3.19 → 3.3.20

package/dist/evui.common.js

@@ -96,6 +96,21 @@ module.exports =
 /* unused harmony reexport * */
 
 
+/***/ }),
+
+/***/ "009b":
+/***/ (function(module, exports, __webpack_require__) {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__("95d6");
+if(typeof content === 'string') content = [[module.i, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = __webpack_require__("499e").default
+var update = add("550a9dee", content, true, {"sourceMap":false,"shadowMode":false});
+
 /***/ }),
 
 /***/ "00ee":
@@ -164,21 +179,6 @@ module.exports = function (fn, that, length) {
 /* unused harmony reexport * */
 
 
-/***/ }),
-
-/***/ "044f":
-/***/ (function(module, exports, __webpack_require__) {
-
-// style-loader: Adds some css to the DOM by adding a <style> tag
-
-// load the styles
-var content = __webpack_require__("4890");
-if(typeof content === 'string') content = [[module.i, content, '']];
-if(content.locals) module.exports = content.locals;
-// add the styles to the DOM
-var add = __webpack_require__("499e").default
-var update = add("1fe9e43e", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "0538":
@@ -5360,20 +5360,6 @@ module.exports = function (O, defaultConstructor) {
 };
 
 
-/***/ }),
-
-/***/ "4890":
-/***/ (function(module, exports, __webpack_require__) {
-
-// Imports
-var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
-exports = ___CSS_LOADER_API_IMPORT___(false);
-// Module
-exports.push([module.i, ".table[data-v-1aab6f12]{position:relative;width:100%;height:100%;padding-top:33px}.table.non-header[data-v-1aab6f12]{padding-top:0}.table .table-header[data-v-1aab6f12]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .table .table-header[data-v-1aab6f12]{border-top:2px solid;border-bottom:1px solid}.column-list[data-v-1aab6f12]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-1aab6f12],.column-list[data-v-1aab6f12]{position:relative;height:100%}.column[data-v-1aab6f12]{display:inline-flex;padding:0 10px;line-height:30px;justify-content:center;align-items:center;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:1px solid #cfcfcf}.dark .column[data-v-1aab6f12]{border-right:1px solid}.column[data-v-1aab6f12]:last-child{border-right:0;margin-right:20px}.column:last-child .column-resize[data-v-1aab6f12]{cursor:default!important}.column .sort-icon[data-v-1aab6f12]{display:inline-block;float:right;font-size:14px;line-height:30px}.column .ev-icon-filter[data-v-1aab6f12]{font-size:13px;color:#005cc8}.column-name[data-v-1aab6f12]{display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:14px}.column-filter[data-v-1aab6f12]{display:none;position:absolute;right:0;background-color:transparent}.column-filter i[data-v-1aab6f12]{margin-right:2px;font-size:14px;vertical-align:middle}.column:hover .column-filter[data-v-1aab6f12]{display:block;cursor:pointer}.column-filter-status[data-v-1aab6f12]{position:absolute;left:0;background-color:transparent}.column-filter-status .ei[data-v-1aab6f12]{font-size:10px;vertical-align:top}.column-resize[data-v-1aab6f12]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-1aab6f12]:hover{cursor:col-resize}.table-body[data-v-1aab6f12]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-1aab6f12]{clear:both;width:inherit;border-spacing:0;border-collapse:collapse}.table-body.stripe tr[data-v-1aab6f12]:nth-child(2n){background:hsla(0,0%,89.8%,.6)}.table-body.bottom-border[data-v-1aab6f12]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-1aab6f12]{border-bottom:1px solid}.table-body .row[data-v-1aab6f12]{white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-1aab6f12]{border-bottom:1px solid}.table-body .row.selected[data-v-1aab6f12]{background:rgba(219,240,249,.6)!important;color:inherit!important}.dark .table-body .row.selected[data-v-1aab6f12]{background:!important;color:inherit!important}.table-body .row.highlight[data-v-1aab6f12]{background:#5ab7ff;color:#fff}.table-body .cell[data-v-1aab6f12]{display:inline-block;padding:0 10px;text-align:center;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-1aab6f12]{border-right:1px solid}.table-body .cell div[data-v-1aab6f12]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell.row-checkbox[data-v-1aab6f12]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-1aab6f12]{overflow:initial}.table-body .cell.float[data-v-1aab6f12],.table-body .cell.number[data-v-1aab6f12]{text-align:right}.table-body .cell.string[data-v-1aab6f12],.table-body .cell.stringNumber[data-v-1aab6f12]{text-align:left}.table-body .cell.center[data-v-1aab6f12]{text-align:center}.table-body .cell.left[data-v-1aab6f12]{text-align:left}.table-body .cell.left .wrap[data-v-1aab6f12]{justify-content:flex-start}.table-body .cell.right[data-v-1aab6f12]{text-align:right}.table-body .cell.right .wrap[data-v-1aab6f12]{justify-content:flex-end}.table-body .cell[data-v-1aab6f12]:last-child{border-right:0}.table-body .cell.tree-td[data-v-1aab6f12]{text-align:left!important}.table-resize-line[data-v-1aab6f12]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-1aab6f12]{border-right:1px solid}.vscroll-spacer[data-v-1aab6f12]{opacity:0;clear:both}[v-cloak][data-v-1aab6f12]{display:none}.ev-checkbox[data-v-1aab6f12]{margin:0}.non-border[data-v-1aab6f12]{border:none!important}.is-empty[data-v-1aab6f12]{height:30px;text-align:center}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "4930":
@@ -6924,7 +6910,7 @@ module.exports = {
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
 exports = ___CSS_LOADER_API_IMPORT___(false);
 // Module
-exports.push([module.i, ".ev-chart-wrapper{display:block}.ev-chart-container,.ev-chart-wrapper{position:relative;width:100%;height:100%}.ev-chart-container{overflow:hidden}.ev-chart-title{top:0;left:0;width:100%;padding-left:10px;word-wrap:normal;white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ev-chart-legend,.ev-chart-title{position:absolute;overflow:hidden}.ev-chart-legend-box{overflow-x:hidden;overflow-y:auto}.ev-chart-legend-container{position:relative;overflow:hidden}.ev-chart-legend-color,.ev-chart-legend-color--point-line{position:absolute;top:50%;left:0;transform:translateY(-50%);width:18px;height:4px}.ev-chart-legend-color--point-line:after{display:inline-block;position:absolute;top:-2px;left:5px;width:8px;height:8px;content:\" \";border-radius:50%;background-color:inherit}.ev-chart-legend-name{position:absolute;top:50%;left:0;width:100%;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:12px;margin-left:24px;padding-right:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;transform:translateY(-50%)}.ev-chart-legend-name:hover{font-weight:700}.ev-chart-legend-value{float:right;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ev-chart-resize-bar{position:absolute;background:transparent;opacity:.5;z-index:10}.ev-chart-resize-bar:hover,.ev-chart-resize-ghost{background-color:#e2e2e2}.ev-chart-resize-ghost{position:absolute;width:4px;height:100%;cursor:col-resize;opacity:.5}.ev-chart-resize-ghost.horizontal{width:100%;height:4px;cursor:row-resize}.ev-chart-tooltip{position:absolute;z-index:850;top:0;left:0;overflow-y:hidden;overflow-x:hidden;border-radius:8px}.ev-chart-tooltip .ev-chart-tooltip-header{padding:8px 16px 0 16px;font-family:Roboto,serif;overflow:hidden;font-size:16px}.ev-chart-tooltip .ev-chart-tooltip-header--wrap{word-wrap:break-word}.ev-chart-tooltip .ev-chart-tooltip-header--ellipsis{text-overflow:ellipsis;white-space:nowrap}.ev-chart-tooltip .ev-chart-tooltip-body{overflow-x:hidden;overflow-y:hidden}", ""]);
+exports.push([module.i, ".ev-chart-wrapper{display:block}.ev-chart-container,.ev-chart-wrapper{position:relative;width:100%;height:100%}.ev-chart-container{overflow:hidden}.ev-chart-title{top:0;left:0;width:100%;padding-left:10px;word-wrap:normal;white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ev-chart-legend,.ev-chart-title{position:absolute;overflow:hidden}.ev-chart-legend-box{overflow-x:hidden;overflow-y:auto}.ev-chart-legend-container{position:relative}.ev-chart-legend-color,.ev-chart-legend-color--point-line{position:absolute;top:50%;left:0;transform:translateY(-50%);width:18px;height:4px}.ev-chart-legend-color--point-line:after{display:inline-block;position:absolute;top:-2px;left:5px;width:8px;height:8px;content:\" \";border-radius:50%;background-color:inherit}.ev-chart-legend-name{position:absolute;top:50%;left:0;width:100%;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:12px;margin-left:24px;padding-right:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;transform:translateY(-50%)}.ev-chart-legend-name:hover{font-weight:700}.ev-chart-legend-value{float:right;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ev-chart-legend-line{position:relative;width:100%;height:100%;border-radius:10px;background-color:#e3e3e3}.ev-chart-legend-line-layer,.ev-chart-legend-thumb{position:absolute;top:0;left:0;width:100%;height:100%}.ev-chart-legend-thumb{border-radius:10px;color:#000}.ev-chart-legend-handle{position:absolute;top:0;left:0;cursor:pointer}.ev-chart-legend-handle.dragging,.ev-chart-legend-handle:hover{transform:scale(1.2)}.ev-chart-legend-handle-btn{width:100%;height:100%;border-radius:50%;background-color:#fff;transition:transform .1s ease-in-out;box-sizing:border-box;border:2px solid #979797}.ev-chart-legend-handle-btn-color{position:absolute;top:4px;left:4px;width:calc(100% - 8px);height:calc(100% - 8px);border-radius:50%}.ev-chart-legend-label{position:absolute;font-size:12px;line-height:1.4em}.ev-chart-legend-label-text{display:block;white-space:nowrap}.ev-chart-legend-overlay{position:absolute;top:0;left:0;width:100%;height:100%}.ev-chart-legend-overlay .ev-chart-legend-overlay-item{position:absolute;top:1px;left:1px;border-radius:50%;border:1px solid #fff;background-color:transparent}.ev-chart-legend-overlay .ev-chart-legend-overlay-tooltip{position:absolute;font-size:12px;line-height:1.4em}.ev-chart-resize-bar{position:absolute;background:transparent;opacity:.5;z-index:10}.ev-chart-resize-bar:hover,.ev-chart-resize-ghost{background-color:#e2e2e2}.ev-chart-resize-ghost{position:absolute;width:4px;height:100%;cursor:col-resize;opacity:.5}.ev-chart-resize-ghost.horizontal{width:100%;height:4px;cursor:row-resize}.ev-chart-tooltip{position:absolute;z-index:850;top:0;left:0;overflow-y:hidden;overflow-x:hidden;border-radius:8px}.ev-chart-tooltip .ev-chart-tooltip-header{padding:8px 16px 0 16px;font-family:Roboto,serif;overflow:hidden;font-size:16px}.ev-chart-tooltip .ev-chart-tooltip-header--wrap{word-wrap:break-word}.ev-chart-tooltip .ev-chart-tooltip-header--ellipsis{text-overflow:ellipsis;white-space:nowrap}.ev-chart-tooltip .ev-chart-tooltip-body{overflow-x:hidden;overflow-y:hidden}", ""]);
 // Exports
 module.exports = exports;
 
@@ -7957,7 +7943,7 @@ $({ target: 'Number', stat: true }, {
 /***/ "9224":
 /***/ (function(module) {
 
-module.exports = JSON.parse("{\"a\":\"3.3.19\"}");
+module.exports = JSON.parse("{\"a\":\"3.3.20\"}");
 
 /***/ }),
 
@@ -8096,6 +8082,20 @@ exports.push([module.i, ".ev-tree-view li ul{padding:0 0 0 18px;margin:0}.ev-tre
 module.exports = exports;
 
 
+/***/ }),
+
+/***/ "95d6":
+/***/ (function(module, exports, __webpack_require__) {
+
+// Imports
+var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
+exports = ___CSS_LOADER_API_IMPORT___(false);
+// Module
+exports.push([module.i, ".table[data-v-89cff218]{position:relative;width:100%;height:100%;padding-top:33px}.table.non-header[data-v-89cff218]{padding-top:0}.table .table-header[data-v-89cff218]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .table .table-header[data-v-89cff218]{border-top:2px solid;border-bottom:1px solid}.column-list[data-v-89cff218]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-89cff218],.column-list[data-v-89cff218]{position:relative;height:100%}.column[data-v-89cff218]{display:inline-flex;padding:0 10px;line-height:30px;justify-content:center;align-items:center;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-right:1px solid #cfcfcf}.dark .column[data-v-89cff218]{border-right:1px solid}.column[data-v-89cff218]:last-child{border-right:0;margin-right:20px}.column:last-child .column-resize[data-v-89cff218]{cursor:default!important}.column .sort-icon[data-v-89cff218]{display:inline-block;float:right;font-size:14px;line-height:30px}.column .ev-icon-filter[data-v-89cff218]{font-size:13px;color:#005cc8}.column-name[data-v-89cff218]{display:inline-block;float:left;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:14px}.column-filter[data-v-89cff218]{display:none;position:absolute;right:0;background-color:transparent}.column-filter i[data-v-89cff218]{margin-right:2px;font-size:14px;vertical-align:middle}.column:hover .column-filter[data-v-89cff218]{display:block;cursor:pointer}.column-filter-status[data-v-89cff218]{position:absolute;left:0;background-color:transparent}.column-filter-status .ei[data-v-89cff218]{font-size:10px;vertical-align:top}.column-resize[data-v-89cff218]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-89cff218]:hover{cursor:col-resize}.table-body[data-v-89cff218]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-89cff218]{clear:both;width:inherit;border-spacing:0;border-collapse:collapse}.table-body.stripe tr[data-v-89cff218]:nth-child(2n){background:hsla(0,0%,89.8%,.6)}.table-body.bottom-border[data-v-89cff218]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-89cff218]{border-bottom:1px solid}.table-body .row[data-v-89cff218]{white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-89cff218]{border-bottom:1px solid}.table-body .row.selected[data-v-89cff218]{background:rgba(219,240,249,.6)!important;color:inherit!important}.dark .table-body .row.selected[data-v-89cff218]{background:!important;color:inherit!important}.table-body .row.highlight[data-v-89cff218]{background:#5ab7ff;color:#fff}.table-body .cell[data-v-89cff218]{display:inline-block;padding:0 10px;text-align:center;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-89cff218]{border-right:1px solid}.table-body .cell div[data-v-89cff218]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell.row-checkbox[data-v-89cff218]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-89cff218]{overflow:initial}.table-body .cell.float[data-v-89cff218],.table-body .cell.number[data-v-89cff218]{text-align:right}.table-body .cell.string[data-v-89cff218],.table-body .cell.stringNumber[data-v-89cff218]{text-align:left}.table-body .cell.center[data-v-89cff218]{text-align:center}.table-body .cell.left[data-v-89cff218]{text-align:left}.table-body .cell.left .wrap[data-v-89cff218]{justify-content:flex-start}.table-body .cell.right[data-v-89cff218]{text-align:right}.table-body .cell.right .wrap[data-v-89cff218]{justify-content:flex-end}.table-body .cell[data-v-89cff218]:last-child{border-right:0}.table-body .cell.tree-td[data-v-89cff218]{text-align:left!important}.table-resize-line[data-v-89cff218]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-89cff218]{border-right:1px solid}.vscroll-spacer[data-v-89cff218]{opacity:0;clear:both}[v-cloak][data-v-89cff218]{display:none}.ev-checkbox[data-v-89cff218]{margin:0}.non-border[data-v-89cff218]{border:none!important}.is-empty[data-v-89cff218]{height:30px;text-align:center}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "96cf":
@@ -9851,17 +9851,6 @@ module.exports = {
 };
 
 
-/***/ }),
-
-/***/ "af65":
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("044f");
-/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
 /***/ }),
 
 /***/ "afaf":
@@ -10597,6 +10586,17 @@ $({ target: 'Array', proto: true, forced: NEGATIVE_ZERO || !STRICT_METHOD || !US
 });
 
 
+/***/ }),
+
+/***/ "ca6f":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_89cff218_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("009b");
+/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_89cff218_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_8_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_8_oneOf_1_1_node_modules_vue_loader_v16_dist_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_3_node_modules_sass_loader_dist_cjs_js_ref_8_oneOf_1_4_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_v16_dist_index_js_ref_0_1_TreeGrid_vue_vue_type_style_index_0_id_89cff218_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "ca84":
@@ -32746,7 +32746,9 @@ var modules = {
     return def;
   },
   getSeriesValueOptForHeatMap: function getSeriesValueOptForHeatMap(series) {
-    var data = series.data;
+    var data = series.data,
+        colorState = series.colorState,
+        isGradient = series.isGradient;
     var colorOpt = this.options.heatMapColor;
     var categoryCnt = colorOpt.categoryCnt;
     var decimalPoint = colorOpt.decimalPoint;
@@ -32769,10 +32771,10 @@ var modules = {
       }
     });
 
-    if (isExistError && series.colorAxis.length === categoryCnt) {
-      series.colorAxis.push({
+    if (isExistError && !isGradient && colorState.length === categoryCnt) {
+      colorState.push({
         id: "color#".concat(categoryCnt),
-        value: colorOpt.error,
+        color: colorOpt.error,
         state: 'normal',
         show: true
       });
@@ -34221,7 +34223,8 @@ var PLOT_BAND_OPTION = {
 var HEAT_MAP_OPTION = {
   show: true,
   highlight: {
-    maxShadowOpacity: 0.4
+    maxShadowOpacity: 0.4,
+    brightness: 150
   },
   xAxisIndex: 0,
   yAxisIndex: 0,
@@ -36271,10 +36274,13 @@ var element_pie_Pie = /*#__PURE__*/function () {
 
 
 
+
+
+
 
 
 var element_heatmap_HeatMap = /*#__PURE__*/function () {
-  function HeatMap(sId, opt, colorOpt) {
+  function HeatMap(sId, opt, colorOpt, isGradient) {
     var _this = this;
 
     _classCallCheck(this, HeatMap);
@@ -36283,7 +36289,8 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
     Object.keys(merged).forEach(function (key) {
       _this[key] = merged[key];
     });
-    this.createColorAxis(colorOpt);
+    this.isGradient = isGradient;
+    this.createColorState(colorOpt);
     this.sId = sId;
     this.data = [];
     this.labels = {};
@@ -36302,16 +36309,17 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
 
   _createClass(HeatMap, [{
-    key: "createColorAxis",
-    value: function createColorAxis(colorOpt) {
-      var colorAxis = [];
+    key: "createColorState",
+    value: function createColorState(colorOpt) {
+      var colorState = [];
+      var regex = /[^0-9]&[^,]/g;
       var min = colorOpt.min,
           max = colorOpt.max,
           categoryCnt = colorOpt.categoryCnt,
           error = colorOpt.error,
           stroke = colorOpt.stroke;
-      var minColor = min.includes('#') ? helpers_util.hexToRgb(min) : min;
-      var maxColor = max.includes('#') ? helpers_util.hexToRgb(max) : max;
+      var minColor = min.includes('#') ? helpers_util.hexToRgb(min) : min.replace(regex, '');
+      var maxColor = max.includes('#') ? helpers_util.hexToRgb(max) : max.replace(regex, '');
 
       var _minColor$split = minColor.split(','),
           _minColor$split2 = _slicedToArray(_minColor$split, 3),
@@ -36325,35 +36333,71 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
           maxG = _maxColor$split2[1],
           maxB = _maxColor$split2[2];
 
-      var unitR = Math.floor((minR - maxR) / (categoryCnt - 1));
-      var unitG = Math.floor((minG - maxG) / (categoryCnt - 1));
-      var unitB = Math.floor((minB - maxB) / (categoryCnt - 1));
-
-      for (var ix = 0; ix < categoryCnt; ix++) {
-        var r = +minR - unitR * ix;
-        var g = +minG - unitG * ix;
-        var b = +minB - unitB * ix;
-        colorAxis.push({
-          id: "color#".concat(ix),
-          value: "rgb(".concat(r, ",").concat(g, ",").concat(b, ")"),
-          state: 'normal',
-          show: true
+      if (this.isGradient) {
+        colorState.push({
+          minColor: {
+            minR: minR,
+            minG: minG,
+            minB: minB
+          },
+          maxColor: {
+            maxR: maxR,
+            maxG: maxG,
+            maxB: maxB
+          },
+          categoryCnt: categoryCnt,
+          start: 0,
+          end: 100,
+          selectedValue: null
         });
+      } else {
+        var unitR = Math.floor((minR - maxR) / (categoryCnt - 1));
+        var unitG = Math.floor((minG - maxG) / (categoryCnt - 1));
+        var unitB = Math.floor((minB - maxB) / (categoryCnt - 1));
+
+        for (var ix = 0; ix < categoryCnt; ix++) {
+          var r = +minR - unitR * ix;
+          var g = +minG - unitG * ix;
+          var b = +minB - unitB * ix;
+          colorState.push({
+            id: "color#".concat(ix),
+            color: "rgb(".concat(r, ",").concat(g, ",").concat(b, ")"),
+            state: 'normal',
+            show: true
+          });
+        }
       }
 
-      this.colorAxis = colorAxis;
+      this.colorState = colorState;
       this.errorColor = error;
       this.stroke = stroke;
     }
   }, {
-    key: "getColorIndex",
-    value: function getColorIndex(value) {
+    key: "getColorForGradient",
+    value: function getColorForGradient(value) {
+      var _this$colorState$ = this.colorState[0],
+          minColor = _this$colorState$.minColor,
+          maxColor = _this$colorState$.maxColor;
+      var minR = minColor.minR,
+          minG = minColor.minG,
+          minB = minColor.minB;
+      var maxR = maxColor.maxR,
+          maxG = maxColor.maxG,
+          maxB = maxColor.maxB;
+      var r = +minR - Math.floor((minR - maxR) * value / 100);
+      var g = +minG - Math.floor((minG - maxG) * value / 100);
+      var b = +minB - Math.floor((minB - maxB) * value / 100);
+      return "rgb(".concat(r, ",").concat(g, ",").concat(b, ")");
+    }
+  }, {
+    key: "getColorIndexForIcon",
+    value: function getColorIndexForIcon(value) {
       var _this$valueOpt = this.valueOpt,
           existError = _this$valueOpt.existError,
           min = _this$valueOpt.min,
           interval = _this$valueOpt.interval,
           decimalPoint = _this$valueOpt.decimalPoint;
-      var maxIndex = this.colorAxis.length - 1;
+      var maxIndex = this.colorState.length - 1;
 
       if (existError && value < 0) {
         return maxIndex;
@@ -36367,14 +36411,67 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
       return colorIndex;
     }
+  }, {
+    key: "getItemInfo",
+    value: function getItemInfo(value) {
+      var _this$valueOpt2 = this.valueOpt,
+          min = _this$valueOpt2.min,
+          max = _this$valueOpt2.max;
+      var itemInfo = {
+        show: false,
+        opacity: 0,
+        dataColor: null,
+        id: null,
+        isHighlight: null
+      };
+
+      if (this.isGradient) {
+        var ratio = convertToPercent(value - min, max - min);
+        var _this$colorState$2 = this.colorState[0],
+            start = _this$colorState$2.start,
+            end = _this$colorState$2.end,
+            selectedValue = _this$colorState$2.selectedValue;
+
+        if (value < 0 || start <= ratio && ratio <= end) {
+          itemInfo.show = true;
+          itemInfo.isHighlight = selectedValue !== null && Math.floor(value) === Math.floor(min + (max - min) * (selectedValue / 100));
+          itemInfo.opacity = 1;
+          itemInfo.dataColor = value < 0 ? this.errorColor : this.getColorForGradient(ratio);
+        }
+      } else {
+        var colorIndex = this.getColorIndexForIcon(value);
+        var _this$colorState$colo = this.colorState[colorIndex],
+            show = _this$colorState$colo.show,
+            state = _this$colorState$colo.state,
+            color = _this$colorState$colo.color,
+            id = _this$colorState$colo.id;
+        itemInfo.show = show;
+        itemInfo.opacity = state === 'downplay' ? 0.1 : 1;
+        itemInfo.dataColor = value < 0 ? this.errorColor : color;
+        itemInfo.id = id;
+      }
+
+      return itemInfo;
+    }
   }, {
     key: "drawItem",
     value: function drawItem(ctx, x, y, w, h) {
       ctx.beginPath();
 
       if (this.stroke.show) {
-        ctx.strokeRect(x, y, w, h);
-        ctx.fillRect(x, y, w, h);
+        var radius = this.stroke.radius;
+
+        if (radius > 0) {
+          ctx.moveTo(x + radius, y);
+          ctx.arcTo(x + w, y, x + w, y + h, radius);
+          ctx.arcTo(x + w, y + h, x, y + h, radius);
+          ctx.arcTo(x, y + h, x, y, radius);
+          ctx.arcTo(x, y, x + w, y, radius);
+          ctx.fill();
+        } else {
+          ctx.strokeRect(x, y, w, h);
+          ctx.fillRect(x, y, w, h);
+        }
       } else {
         var aliasPixel = helpers_util.aliasPixel(1);
         ctx.fillRect(x, y - aliasPixel, w + aliasPixel, h + aliasPixel);
@@ -36418,7 +36515,8 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
       var ctx = param.ctx,
           chartRect = param.chartRect,
-          labelOffset = param.labelOffset;
+          labelOffset = param.labelOffset,
+          overlayCtx = param.overlayCtx;
       var xArea = chartRect.chartWidth - (labelOffset.left + labelOffset.right);
       var yArea = chartRect.chartHeight - (labelOffset.top + labelOffset.bottom);
       var xsp = chartRect.x1 + labelOffset.left;
@@ -36435,13 +36533,18 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
         var value = item.o;
 
         if (xp !== null && yp !== null && value !== null && value !== undefined) {
-          var colorIndex = _this2.getColorIndex(value);
-
-          var opacity = _this2.colorAxis[colorIndex].state === 'downplay' ? 0.1 : 1;
-          item.dataColor = value < 0 ? _this2.errorColor : _this2.colorAxis[colorIndex].value;
-          item.cId = _this2.colorAxis[colorIndex].id;
+          var _this2$getItemInfo = _this2.getItemInfo(value),
+              show = _this2$getItemInfo.show,
+              opacity = _this2$getItemInfo.opacity,
+              dataColor = _this2$getItemInfo.dataColor,
+              id = _this2$getItemInfo.id,
+              isHighlight = _this2$getItemInfo.isHighlight;
+
+          item.dataColor = dataColor;
+          item.cId = id;
+          ctx.save();
 
-          if (_this2.colorAxis[colorIndex].show) {
+          if (show) {
             ctx.fillStyle = helpers_util.colorStringToRgba(item.dataColor, opacity);
 
             if (_this2.stroke.show) {
@@ -36459,24 +36562,25 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
 
             _this2.drawItem(ctx, xp, yp, w, h);
 
+            ctx.restore();
+            item.xp = xp;
+            item.yp = yp;
+            item.w = w;
+            item.h = h;
+
             if (_this2.showValue.use) {
               _this2.drawValueLabels({
                 context: ctx,
-                data: item,
-                positions: {
-                  x: xp,
-                  y: yp,
-                  w: w,
-                  h: h
-                }
+                data: item
               });
             }
-          }
 
-          item.xp = xp;
-          item.yp = yp;
-          item.w = w;
-          item.h = h;
+            if (isHighlight) {
+              _this2.itemHighlight({
+                data: item
+              }, overlayCtx);
+            }
+          }
         }
       });
     }
@@ -36491,18 +36595,18 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
     key: "drawValueLabels",
     value: function drawValueLabels(_ref) {
       var context = _ref.context,
-          data = _ref.data,
-          positions = _ref.positions;
+          data = _ref.data;
       var _this$showValue = this.showValue,
           fontSize = _this$showValue.fontSize,
           textColor = _this$showValue.textColor,
           align = _this$showValue.align,
           formatter = _this$showValue.formatter,
           decimalPoint = _this$showValue.decimalPoint;
-      var x = positions.x,
-          y = positions.y,
-          w = positions.w,
-          h = positions.h;
+      var x = data.xp,
+          y = data.yp,
+          w = data.w,
+          h = data.h,
+          value = data.o;
       var ctx = context;
       ctx.save();
       ctx.beginPath();
@@ -36511,7 +36615,6 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
       ctx.lineWidth = 1;
       ctx.textBaseline = 'middle';
       ctx.textAlign = align !== 'center' ? 'left' : 'center';
-      var value = data.o;
       var formattedTxt;
 
       if (formatter) {
@@ -36613,8 +36716,6 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
   }, {
     key: "itemHighlight",
     value: function itemHighlight(item, context) {
-      var _this$colorAxis$find;
-
       var gdata = item.data;
       var ctx = context;
       var x = gdata.xp;
@@ -36622,34 +36723,46 @@ var element_heatmap_HeatMap = /*#__PURE__*/function () {
       var w = gdata.w;
       var h = gdata.h;
       var cId = gdata.cId;
-      var isShow = (_this$colorAxis$find = this.colorAxis.find(function (_ref4) {
-        var id = _ref4.id;
-        return id === cId;
-      })) === null || _this$colorAxis$find === void 0 ? void 0 : _this$colorAxis$find.show;
+      var isShow;
+
+      if (this.isGradient) {
+        var _this$valueOpt3 = this.valueOpt,
+            min = _this$valueOpt3.min,
+            max = _this$valueOpt3.max;
+        var ratio = convertToPercent(gdata.o - min, max - min);
+        var _this$colorState$3 = this.colorState[0],
+            start = _this$colorState$3.start,
+            end = _this$colorState$3.end;
+        isShow = start <= ratio && ratio <= end || gdata.o === -1;
+      } else {
+        var _this$colorState$find;
+
+        isShow = (_this$colorState$find = this.colorState.find(function (_ref4) {
+          var id = _ref4.id;
+          return id === cId;
+        })) === null || _this$colorState$find === void 0 ? void 0 : _this$colorState$find.show;
+      }
+
       ctx.save();
+      ctx.shadowOffsetX = 2;
+      ctx.shadowOffsetY = 2;
+      ctx.shadowBlur = 4;
 
       if (x !== null && y !== null && isShow) {
         var color = gdata.dataColor;
-        ctx.strokeStyle = helpers_util.colorStringToRgba(color, 1);
-        ctx.fillStyle = helpers_util.colorStringToRgba(color, this.highlight.maxShadowOpacity);
-        ctx.shadowColor = color;
-        this.drawItem(ctx, x, y, w, h);
+        ctx.shadowColor = helpers_util.colorStringToRgba('#605F5F');
+        ctx.strokeStyle = helpers_util.colorStringToRgba(color);
+        ctx.fillStyle = helpers_util.colorStringToRgba(color);
+        this.drawItem(ctx, x - 2, y - 2, w + 4, h + 4);
+        ctx.restore();
 
         if (this.showValue.use) {
           this.drawValueLabels({
             context: ctx,
-            data: gdata,
-            positions: {
-              x: x,
-              y: y,
-              w: w,
-              h: h
-            }
+            data: gdata
           });
         }
       }
-
-      ctx.restore();
     }
     /**
      * Find graph item for tooltip
@@ -36868,7 +36981,11 @@ var model_series_modules = {
       return new element_pie(id, opt, index);
     } else if (type === 'heatMap') {
       this.seriesInfo.charts.heatMap.push(id);
-      return new element_heatmap(id, opt, this.options.heatMapColor);
+      var _this$options = this.options,
+          heatMapColor = _this$options.heatMapColor,
+          legend = _this$options.legend;
+      var isGradient = legend.type === 'gradient';
+      return new element_heatmap(id, opt, heatMapColor, isGradient);
     }
 
     return false;
@@ -38920,18 +39037,18 @@ var plugins_legend_modules = {
     var seriesList = this.seriesList;
     Object.values(seriesList).forEach(function (series) {
       if (!series.isExistGrp && series.showLegend) {
-        var colorAxis = series.colorAxis,
+        var colorState = series.colorState,
             valueOpt = series.valueOpt;
         var min = valueOpt.min,
             max = valueOpt.max,
             interval = valueOpt.interval,
             existError = valueOpt.existError,
             decimalPoint = valueOpt.decimalPoint;
-        var length = colorAxis.length;
+        var length = colorState.length;
         var endIndex = existError ? length - 2 : length - 1;
 
         for (var index = 0; index < length; index++) {
-          var colorItem = colorAxis[index];
+          var colorItem = colorState[index];
           var minValue = min + interval * index;
           var maxValue = minValue + interval;
 
@@ -38959,7 +39076,7 @@ var plugins_legend_modules = {
 
           _this2.addLegend({
             cId: colorItem.id,
-            color: colorItem.value,
+            color: colorItem.color,
             name: name
           });
         }
@@ -39164,7 +39281,7 @@ var plugins_legend_modules = {
       var nameDOM = (_targetDOM4 = targetDOM) === null || _targetDOM4 === void 0 ? void 0 : _targetDOM4.getElementsByClassName('ev-chart-legend-name')[0];
       var isActive = !(colorDOM !== null && colorDOM !== void 0 && colorDOM.className.includes('inactive'));
       var targetId = nameDOM.series.cId;
-      var activeCount = series.colorAxis.filter(function (colorItem) {
+      var activeCount = series.colorState.filter(function (colorItem) {
         return colorItem.show;
       }).length;
 
@@ -39185,12 +39302,12 @@ var plugins_legend_modules = {
         nameDOM.style.color = opt.color;
       }
 
-      var targetIndex = series.colorAxis.findIndex(function (colorItem) {
+      var targetIndex = series.colorState.findIndex(function (colorItem) {
         return colorItem.id === targetId;
       });
 
       if (targetIndex > -1) {
-        series.colorAxis[targetIndex].show = !isActive;
+        series.colorState[targetIndex].show = !isActive;
       }
 
       colorDOM.classList.toggle('inactive');
@@ -39226,7 +39343,7 @@ var plugins_legend_modules = {
 
       var nameDOM = targetDOM.getElementsByClassName('ev-chart-legend-name')[0];
       var targetId = nameDOM.series.cId;
-      series.colorAxis.forEach(function (colorItem) {
+      series.colorState.forEach(function (colorItem) {
         colorItem.state = colorItem.id === targetId ? 'highlight' : 'downplay';
       });
 
@@ -39247,7 +39364,7 @@ var plugins_legend_modules = {
 
     this.onLegendBoxLeave = function () {
       var series = Object.values(_this4.seriesList)[0];
-      series.colorAxis.forEach(function (item) {
+      series.colorState.forEach(function (item) {
         item.state = 'normal';
       });
 
@@ -39400,6 +39517,7 @@ var plugins_legend_modules = {
 
     containerDOM.style.height = '18px';
     containerDOM.style.display = 'inline-block';
+    containerDOM.style.overflow = 'hidden';
     containerDOM.dataset.type = 'container';
     this.legendBoxDOM.appendChild(containerDOM);
     this.seriesInfo.count++;
@@ -39766,6 +39884,592 @@ var plugins_legend_modules = {
   }
 };
 /* harmony default export */ var plugins_legend = (plugins_legend_modules);
+// CONCATENATED MODULE: ./src/components/chart/plugins/plugins.legend.gradient.js
+
+
+
+
+
+
+
+
+var MAX_HANDLE_SIZE = 28;
+var MIN_BOX_SIZE = {
+  width: 70,
+  height: 60
+};
+var plugins_legend_gradient_modules = {
+  /**
+   * Create legend DOM
+   *
+   * @returns {undefined}
+   */
+  createLegendLayout: function createLegendLayout() {
+    this.legendDOM = document.createElement('div');
+    this.legendDOM.className = 'ev-chart-legend';
+    this.legendBoxDOM = document.createElement('div');
+    this.legendBoxDOM.className = 'ev-chart-legend-box';
+    this.containerDOM = document.createElement('div');
+    this.containerDOM.className = 'ev-chart-legend-container';
+    this.legendBoxDOM.appendChild(this.containerDOM);
+    this.legendDOM.appendChild(this.legendBoxDOM);
+    this.wrapperDOM.appendChild(this.legendDOM);
+  },
+
+  /**
+   * Initialize legend
+   * If there was no initialization, create DOM and set default layout.
+   * It not, there will already be set layout, so add a legend for each series with group
+   *
+   * @returns {undefined}
+   */
+  initLegend: function initLegend() {
+    if (!this.isInitLegend) {
+      this.createLegendLayout();
+      this.createLegend();
+    }
+
+    var series = Object.values(this.seriesList)[0];
+    this.setLegendStyle(series);
+    this.initEvent();
+    this.isInitLegend = true;
+    this.legendDragInfo = {
+      dragging: false,
+      isStart: true
+    };
+  },
+
+  /**
+   * Initialize legend event
+   *
+   * @returns {undefined}
+   */
+  initEvent: function initEvent() {
+    var _this = this;
+
+    if (this.isInitLegend) {
+      return;
+    }
+
+    this.onLegendMouseDown = function (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      var type = e.target.dataset.type;
+      var targetDOM;
+
+      if (type === 'handle') {
+        targetDOM = e.target;
+      } else if (type === 'handle-btn') {
+        targetDOM = e.target.parentElement;
+      } else if (type === 'handle-btn-color') {
+        targetDOM = e.target.parentElement.parentElement;
+      } else {
+        return;
+      }
+
+      var colorState = Object.values(_this.seriesList)[0].colorState;
+      var _colorState$ = colorState[0],
+          start = _colorState$.start,
+          end = _colorState$.end;
+      colorState[0].selectedValue = null;
+
+      _this.clearOverlay();
+
+      _this.legendDragInfo.dragging = true;
+      _this.legendDragInfo.isStart = start !== end ? targetDOM.className.includes('start') : _this.legendDragInfo.isStart;
+      targetDOM.classList.add('dragging');
+
+      _this.legendBoxDOM.addEventListener('mousemove', _this.onLegendMouseMove, false);
+
+      _this.legendBoxDOM.addEventListener('mouseup', _this.onLegendMouseUp, false);
+    };
+
+    this.onLegendMouseMove = function (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      var _this$legendDragInfo = _this.legendDragInfo,
+          dragging = _this$legendDragInfo.dragging,
+          isStart = _this$legendDragInfo.isStart;
+
+      if (dragging) {
+        var value = _this.getSelectedValue(e);
+
+        value = _this.isSide ? 100 - value : value;
+        var dir = isStart ? 'start' : 'end';
+        var colorState = Object.values(_this.seriesList)[0].colorState;
+        var _colorState$2 = colorState[0],
+            start = _colorState$2.start,
+            end = _colorState$2.end;
+
+        if (isStart && value > end || !isStart && value < start) {
+          return;
+        }
+
+        colorState[0][dir] = value;
+
+        _this.update({
+          updateSeries: false,
+          updateSelTip: {
+            update: false,
+            keepDomain: false
+          }
+        });
+      }
+    };
+
+    this.onLegendMouseUp = function () {
+      _this.legendDragInfo.dragging = false;
+
+      var targetDOM = _this.containerDOM.getElementsByClassName('ev-chart-legend-handle dragging')[0];
+
+      targetDOM === null || targetDOM === void 0 ? void 0 : targetDOM.classList.remove('dragging');
+
+      _this.legendBoxDOM.removeEventListener('mouseup', _this.onLegendMouseUp, false);
+    };
+    /**
+     * callback for legendBoxDOM hovering
+     *
+     * @returns {undefined}
+     */
+
+
+    this.onLegendBoxOver = function (e) {
+      var type = e.target.dataset.type;
+      var _Object$values$ = Object.values(_this.seriesList)[0],
+          colorState = _Object$values$.colorState,
+          valueOpt = _Object$values$.valueOpt;
+      var state = colorState[0];
+
+      var value = _this.getSelectedValue(e);
+
+      value = _this.isSide ? 100 - value : value;
+
+      if (['line', 'thumb', 'layer', 'overlay', 'overlay-item'].includes(type)) {
+        if (state.start <= value && value <= state.end) {
+          state.selectedValue = value;
+
+          _this.createLegendOverlay(value, valueOpt);
+        } else {
+          return;
+        }
+      } else if (['handle', 'handle-btn', 'handle-btn-color'].includes(type)) {
+        var isStart = e.target.className.includes('start');
+        state.selectedValue = isStart ? state.start : state.end;
+
+        _this.clearOverlay();
+      } else {
+        return;
+      }
+
+      _this.update({
+        updateSeries: false,
+        updateSelTip: {
+          update: false,
+          keepDomain: false
+        }
+      });
+    };
+    /**
+     * callback for mouseleave event on legendBoxDOM
+     *
+     * @returns {undefined}
+     */
+
+
+    this.onLegendBoxLeave = function () {
+      _this.legendDragInfo.dragging = false;
+
+      var lineDOM = _this.containerDOM.getElementsByClassName('ev-chart-legend-line')[0];
+
+      var targetDOM = lineDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+
+      _this.clearOverlay(targetDOM);
+
+      var colorState = Object.values(_this.seriesList)[0].colorState;
+      colorState[0].selectedValue = null;
+
+      _this.update({
+        updateSeries: false,
+        updateSelTip: {
+          update: false,
+          keepDomain: false
+        }
+      });
+    };
+
+    this.legendBoxDOM.addEventListener('mousedown', this.onLegendMouseDown);
+    this.legendBoxDOM.addEventListener('mouseover', this.onLegendBoxOver);
+    this.legendBoxDOM.addEventListener('mouseleave', this.onLegendBoxLeave);
+  },
+  getSelectedValue: function getSelectedValue(evt) {
+    var _this$containerDOM$ge = this.containerDOM.getBoundingClientRect(),
+        x = _this$containerDOM$ge.x,
+        y = _this$containerDOM$ge.y,
+        width = _this$containerDOM$ge.width,
+        height = _this$containerDOM$ge.height;
+
+    var isTop = !this.isSide;
+    var sp = isTop ? x : y;
+    var size = isTop ? width : height;
+    var movePoint = isTop ? evt.clientX : evt.clientY;
+
+    if (movePoint < sp) {
+      movePoint = sp;
+    } else if (movePoint > sp + size) {
+      movePoint = sp + size;
+    }
+
+    var move = movePoint - sp;
+    return +convertToPercent(move, size);
+  },
+
+  /**
+   * To update legend, reset all process.
+   *
+   * @returns {undefined}
+   */
+  updateLegend: function updateLegend() {
+    this.resetLegend();
+    this.createLegend();
+    var series = Object.values(this.seriesList)[0];
+    this.setLegendStyle(series);
+  },
+
+  /**
+   * To update legend, remove all of legendBoxDOM's children
+   *
+   * @returns {undefined}
+   */
+  resetLegend: function resetLegend() {
+    var containerDOM = this.containerDOM;
+
+    if (!containerDOM) {
+      return;
+    }
+
+    while (containerDOM.hasChildNodes()) {
+      containerDOM.removeChild(containerDOM.firstChild);
+    }
+  },
+  clearOverlay: function clearOverlay() {
+    var targetDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-line')[0];
+    var overlayDOM = targetDOM.getElementsByClassName('ev-chart-legend-overlay')[0];
+
+    if (overlayDOM) {
+      targetDOM.removeChild(overlayDOM);
+      var thumbDOM = targetDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+      var labels = thumbDOM.children;
+      labels.forEach(function (labelDOM) {
+        labelDOM.style.opacity = 1;
+      });
+    }
+  },
+  createLegendOverlay: function createLegendOverlay(value, opt) {
+    this.clearOverlay();
+    var handleSize = this.legendHandleSize;
+    var min = opt.min,
+        max = opt.max;
+    var targetDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-line')[0];
+    var overlayDOM = document.createElement('div');
+    overlayDOM.className = 'ev-chart-legend-overlay';
+    overlayDOM.dataset.type = 'overlay';
+    var tooltipDOM = document.createElement('div');
+    tooltipDOM.className = 'ev-chart-legend-overlay-tooltip';
+    tooltipDOM.innerText = Math.floor(min + (max - min) * (value / 100));
+    var itemDOM = document.createElement('span');
+    itemDOM.className = 'ev-chart-legend-overlay-item';
+    itemDOM.dataset.type = 'overlay-item';
+    var itemStyle;
+    var tooltipStyle;
+    var position = Math.floor(handleSize / 2) + 14;
+
+    if (this.isSide) {
+      tooltipStyle = "top:".concat(100 - value, "%;left:").concat(position, "px;transform:translateY(-50%);");
+      itemStyle = "top:".concat(100 - value, "%;transform:translateY(-50%);");
+    } else {
+      tooltipStyle = "top:-".concat(position, "px;left:").concat(value, "%;transform:translateX(-50%);");
+      itemStyle = "left:".concat(value, "%;transform:translateX(-50%);");
+    }
+
+    itemStyle += "width:".concat(handleSize - 10, "px;height:").concat(handleSize - 10, "px;");
+    tooltipDOM.style.cssText = tooltipStyle;
+    itemDOM.style.cssText = itemStyle;
+    overlayDOM.appendChild(tooltipDOM);
+    overlayDOM.appendChild(itemDOM);
+    targetDOM.appendChild(overlayDOM);
+    var thumbDOM = targetDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+    var labels = thumbDOM.children;
+    labels.forEach(function (labelDOM) {
+      labelDOM.style.opacity = 0.2;
+    });
+  },
+  createLegendHandle: function createLegendHandle(type) {
+    var colorBtnDOM = document.createElement('span');
+    colorBtnDOM.className = "ev-chart-legend-handle-btn-color ".concat(type);
+    colorBtnDOM.dataset.type = 'handle-btn-color';
+    var btnDOM = document.createElement('div');
+    btnDOM.className = "ev-chart-legend-handle-btn ".concat(type);
+    btnDOM.dataset.type = 'handle-btn';
+    btnDOM.appendChild(colorBtnDOM);
+    var handleDOM = document.createElement('div');
+    handleDOM.className = "ev-chart-legend-handle ".concat(type);
+    handleDOM.dataset.type = 'handle';
+    handleDOM.appendChild(btnDOM);
+    return handleDOM;
+  },
+  createLegendLabel: function createLegendLabel() {
+    var textDOM = document.createElement('span');
+    textDOM.className = 'ev-chart-legend-label-text';
+    var labelDOM = document.createElement('div');
+    labelDOM.className = 'ev-chart-legend-label';
+    return labelDOM;
+  },
+
+  /**
+   * Create legend DOM
+   *
+   * @returns {undefined}
+   */
+  createLegend: function createLegend() {
+    var opt = this.options.legend;
+    this.isSide = !['top', 'bottom'].includes(opt.position);
+    var legendSize = this.isSide ? opt.width : opt.height;
+    this.legendHandleSize = legendSize > MAX_HANDLE_SIZE ? MAX_HANDLE_SIZE : legendSize;
+    var handleSize = this.legendHandleSize;
+    var startHandleDOM = this.createLegendHandle(this.isSide ? 'end' : 'start', handleSize);
+    var endHandleDOM = this.createLegendHandle(this.isSide ? 'start' : 'end', handleSize);
+    var lineLayerDOM = document.createElement('div');
+    lineLayerDOM.className = 'ev-chart-legend-line-layer';
+    lineLayerDOM.dataset.type = 'line-layer';
+    var thumbDOM = document.createElement('div');
+    thumbDOM.className = 'ev-chart-legend-thumb';
+    thumbDOM.dataset.type = 'thumb';
+    thumbDOM.appendChild(this.createLegendLabel());
+    thumbDOM.appendChild(this.createLegendLabel());
+    var lineDOM = document.createElement('div');
+    lineDOM.className = 'ev-chart-legend-line';
+    lineDOM.dataset.type = 'line';
+    lineDOM.appendChild(lineLayerDOM);
+    lineDOM.appendChild(thumbDOM);
+    this.containerDOM.appendChild(lineDOM);
+    this.containerDOM.appendChild(startHandleDOM);
+    this.containerDOM.appendChild(endHandleDOM);
+  },
+  setLegendStyle: function setLegendStyle(series) {
+    var dir = this.isSide ? 'top' : 'right';
+    var handleSize = this.legendHandleSize;
+    var valueOpt = series.valueOpt,
+        colorState = series.colorState;
+    var min = valueOpt.min,
+        max = valueOpt.max,
+        decimalPoint = valueOpt.decimalPoint;
+    var _colorState$3 = colorState[0],
+        start = _colorState$3.start,
+        end = _colorState$3.end;
+    var startColor = series.getColorForGradient(start);
+    var endColor = series.getColorForGradient(end);
+    var gradient = "linear-gradient(to ".concat(dir, ", ");
+    gradient += "".concat(startColor, ", ").concat(endColor, ")");
+    var labelPosition = Math.floor(handleSize / 2) + 14;
+    var defaultHandleStyle = "width:".concat(handleSize, "px;height:").concat(handleSize, "px;");
+    var labelStyle;
+    var startStyle;
+    var endStyle;
+    var thumbStyle = "background:".concat(gradient, ";");
+
+    if (this.isSide) {
+      defaultHandleStyle += "margin-top:-".concat(handleSize / 2, "px;");
+      labelStyle = "left:".concat(labelPosition, "px;transform:translateY(-50%);top:");
+      startStyle = "top:".concat(100 - end, "%;");
+      endStyle = "top:".concat(100 - start, "%;");
+      thumbStyle += "top:".concat(100 - end, "%;height:").concat(end - start, "%;");
+    } else {
+      defaultHandleStyle += "margin-left:-".concat(handleSize / 2, "px;");
+      labelStyle = "top:-".concat(labelPosition, "px;transform:translateX(-50%);left:");
+      startStyle = "left:".concat(start, "%;");
+      endStyle = "left:".concat(end, "%;");
+      thumbStyle += "left:".concat(start, "%;width:").concat(end - start, "%;");
+    }
+
+    var minText = (min + (max - min) * (start / 100)).toFixed(decimalPoint);
+    var maxText = (min + (max - min) * (end / 100)).toFixed(decimalPoint);
+    var thumbDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-thumb')[0];
+    thumbDOM.style.cssText = thumbStyle;
+    var labelDOM = thumbDOM.getElementsByClassName('ev-chart-legend-label');
+    labelDOM[0].style.cssText = "".concat(labelStyle, "0%;");
+    labelDOM[1].style.cssText = "".concat(labelStyle, "100%;");
+    labelDOM[0].innerText = this.isSide ? maxText : minText;
+    labelDOM[1].innerText = this.isSide ? minText : maxText;
+    var handleDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-handle');
+    handleDOM[0].style.cssText = defaultHandleStyle + startStyle;
+    handleDOM[1].style.cssText = defaultHandleStyle + endStyle;
+    var btnDOM = this.containerDOM.getElementsByClassName('ev-chart-legend-handle-btn-color');
+    btnDOM[0].style.backgroundColor = this.isSide ? endColor : startColor;
+    btnDOM[1].style.backgroundColor = this.isSide ? startColor : endColor;
+  },
+
+  /**
+   * Set legend components position by option
+   *
+   * @returns {undefined}
+   */
+  setLegendPosition: function setLegendPosition() {
+    var _opt$legend, _opt$title, _opt$title2, _opt$legend$padding, _opt$legend2;
+
+    var opt = this.options;
+    var position = opt === null || opt === void 0 ? void 0 : (_opt$legend = opt.legend) === null || _opt$legend === void 0 ? void 0 : _opt$legend.position;
+    var minWidth = MIN_BOX_SIZE.width,
+        minHeight = MIN_BOX_SIZE.height;
+    var handleSize = this.legendHandleSize;
+    var title = opt !== null && opt !== void 0 && (_opt$title = opt.title) !== null && _opt$title !== void 0 && _opt$title.show ? opt === null || opt === void 0 ? void 0 : (_opt$title2 = opt.title) === null || _opt$title2 === void 0 ? void 0 : _opt$title2.height : 0;
+    var positionTop = title + minHeight;
+
+    var _ref = (_opt$legend$padding = opt === null || opt === void 0 ? void 0 : (_opt$legend2 = opt.legend) === null || _opt$legend2 === void 0 ? void 0 : _opt$legend2.padding) !== null && _opt$legend$padding !== void 0 ? _opt$legend$padding : {},
+        _ref$top = _ref.top,
+        top = _ref$top === void 0 ? 0 : _ref$top,
+        _ref$bottom = _ref.bottom,
+        bottom = _ref$bottom === void 0 ? 0 : _ref$bottom,
+        _ref$left = _ref.left,
+        left = _ref$left === void 0 ? 0 : _ref$left,
+        _ref$right = _ref.right,
+        right = _ref$right === void 0 ? 0 : _ref$right;
+
+    var wrapperStyle = this.wrapperDOM.style;
+
+    if (!wrapperStyle) {
+      return;
+    }
+
+    var legendStyle;
+    var boxStyle;
+    var containerStyle;
+    var chartRect;
+
+    switch (position) {
+      case 'top':
+        wrapperStyle.padding = "".concat(positionTop, "px 0 0 0");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(handleSize + 7, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += 'width:100%';
+        boxStyle += "height".concat(minHeight, "px;");
+        legendStyle = "width:".concat(chartRect.width, "px;");
+        legendStyle += "height:".concat(minHeight, "px;");
+        legendStyle += "top:".concat(title, "px;");
+        break;
+
+      case 'right':
+        wrapperStyle.padding = "".concat(title, "px ").concat(minWidth, "px 0 0");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(top, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += "width:".concat(minWidth, "px;");
+        boxStyle += 'height:100%;';
+        boxStyle += "max-height:".concat(chartRect.height, "px;");
+        legendStyle = "width:".concat(minWidth, "px;");
+        legendStyle += "height:".concat(chartRect.height, "px;");
+        legendStyle += "top:".concat(title, "px;right:0px;");
+        break;
+
+      case 'bottom':
+        wrapperStyle.padding = "".concat(title, "px 0 ").concat(minHeight, "px 0");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(handleSize + 7, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += 'width:100%;';
+        boxStyle += "height:".concat(minHeight, "px;");
+        legendStyle = "width:".concat(chartRect.width, "px;");
+        legendStyle += "height:".concat(minHeight, "px;");
+        legendStyle += 'bottom:0px;left:0px;';
+        break;
+
+      case 'left':
+        wrapperStyle.padding = "".concat(title, "px 0 0 ").concat(minWidth, "px");
+        chartRect = this.chartDOM.getBoundingClientRect();
+        boxStyle = "padding:".concat(top, "px ").concat(right, "px ").concat(bottom, "px ").concat(left, "px;");
+        boxStyle += 'display:absolute;';
+        boxStyle += 'bottom:0px;';
+        boxStyle += "width:".concat(minWidth, "px;");
+        boxStyle += 'height:100%;';
+        boxStyle += "maxHeight:".concat(chartRect.height, "px;");
+        legendStyle = "width:".concat(minWidth, "px;");
+        legendStyle += "height:".concat(chartRect.height, "px;");
+        legendStyle += "top:".concat(title, "px;left:0px");
+        break;
+
+      default:
+        break;
+    }
+
+    if (['top', 'bottom'].includes(position)) {
+      var containerSize = chartRect.width / 2;
+      containerStyle = "left:".concat(chartRect.width / 2 - containerSize / 2, "px;");
+      containerStyle += "width:".concat(containerSize, "px;");
+      containerStyle += "height:".concat(handleSize, "px;");
+      containerStyle += 'padding:4px 0;';
+      containerStyle += 'margin:0 4px;';
+    } else {
+      var _containerSize = chartRect.height / 2;
+
+      containerStyle = "top:".concat(chartRect.height / 2 - _containerSize / 2, "px;");
+      containerStyle += 'left:5px;';
+      containerStyle += "width:".concat(handleSize, "px;");
+      containerStyle += "height:".concat(_containerSize, "px;");
+      containerStyle += 'padding:0 4px;';
+      containerStyle += 'margin:4px 0;';
+    }
+
+    this.containerDOM.style.cssText = containerStyle;
+    this.legendBoxDOM.style.cssText = boxStyle;
+    this.legendDOM.style.cssText = legendStyle;
+  },
+
+  /**
+   * Update legend components size
+   *
+   * @returns {undefined}
+   */
+  updateLegendContainerSize: function updateLegendContainerSize() {
+    var series = Object.values(this.seriesList)[0];
+    this.setLegendStyle(series);
+  },
+
+  /**
+   * Show legend components by manipulating css
+   *
+   * @returns {undefined}
+   */
+  showLegend: function showLegend() {
+    if (this.resizeDOM) {
+      this.resizeDOM.style.display = 'block';
+    }
+
+    if (this.legendDOM) {
+      this.legendDOM.style.display = 'block';
+    }
+  },
+
+  /**
+   * Hide legend components by manipulating css
+   *
+   * @returns {undefined}
+   */
+  hideLegend: function hideLegend() {
+    var _this$wrapperDOM, _this$legendDOM, _opt$title3, _opt$title4;
+
+    var opt = this.options;
+    var wrapperStyle = (_this$wrapperDOM = this.wrapperDOM) === null || _this$wrapperDOM === void 0 ? void 0 : _this$wrapperDOM.style;
+    var legendStyle = (_this$legendDOM = this.legendDOM) === null || _this$legendDOM === void 0 ? void 0 : _this$legendDOM.style;
+    var title = opt !== null && opt !== void 0 && (_opt$title3 = opt.title) !== null && _opt$title3 !== void 0 && _opt$title3.show ? opt === null || opt === void 0 ? void 0 : (_opt$title4 = opt.title) === null || _opt$title4 === void 0 ? void 0 : _opt$title4.height : 0;
+
+    if (!legendStyle || !wrapperStyle) {
+      return;
+    }
+
+    legendStyle.display = 'none';
+    legendStyle.width = '0';
+    legendStyle.height = '0';
+    wrapperStyle.padding = "".concat(title, "px 0 0 0");
+  }
+};
+/* harmony default export */ var plugins_legend_gradient = (plugins_legend_gradient_modules);
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.object.from-entries.js
 var es_object_from_entries = __webpack_require__("c1f9");
 
@@ -40591,6 +41295,7 @@ var plugins_interaction_modules = {
 
 
 
+
 var TITLE_HEIGHT = 30;
 var TEXT_HEIGHT = 14;
 var LINE_SPACING = 8;
@@ -40937,7 +41642,7 @@ var plugins_tooltip_modules = {
    * @returns {undefined}
    */
   drawToolTipForHeatMap: function drawToolTipForHeatMap(hitInfo, context) {
-    var _opt$formatter3, _opt$formatter4, _colorAxis$find;
+    var _opt$formatter3, _opt$formatter4;
 
     var ctx = context;
     var items = hitInfo.items;
@@ -40955,11 +41660,28 @@ var plugins_tooltip_modules = {
     var opt = this.options.tooltip;
     var valueFormatter = typeof opt.formatter === 'function' ? opt.formatter : (_opt$formatter3 = opt.formatter) === null || _opt$formatter3 === void 0 ? void 0 : _opt$formatter3.value;
     var titleFormatter = (_opt$formatter4 = opt.formatter) === null || _opt$formatter4 === void 0 ? void 0 : _opt$formatter4.title;
-    var colorAxis = Object.values(this.seriesList)[0].colorAxis;
-    var isShow = (_colorAxis$find = colorAxis.find(function (_ref) {
-      var id = _ref.id;
-      return id === hitItem.cId;
-    })) === null || _colorAxis$find === void 0 ? void 0 : _colorAxis$find.show;
+    var series = Object.values(this.seriesList)[0];
+    var isShow = false;
+    var colorState = series.colorState,
+        isGradient = series.isGradient;
+
+    if (isGradient) {
+      var _series$valueOpt = series.valueOpt,
+          min = _series$valueOpt.min,
+          max = _series$valueOpt.max;
+      var ratio = convertToPercent(hitItem.o - min, max - min);
+      var _colorState$ = colorState[0],
+          start = _colorState$.start,
+          end = _colorState$.end;
+      isShow = start <= ratio && ratio <= end || hitItem.o === -1;
+    } else {
+      var _colorState$find;
+
+      isShow = (_colorState$find = colorState.find(function (_ref) {
+        var id = _ref.id;
+        return id === hitItem.cId;
+      })) === null || _colorState$find === void 0 ? void 0 : _colorState$find.show;
+    }
 
     if (!isShow) {
       this.tooltipClear();
@@ -42214,6 +42936,7 @@ var element_tip_modules = {
 
 
 
+
 
 
 var chart_core_EvChart = /*#__PURE__*/function () {
@@ -42231,6 +42954,11 @@ var chart_core_EvChart = /*#__PURE__*/function () {
     Object.assign(this, plugins_tooltip);
     Object.assign(this, plugins_pie);
     Object.assign(this, element_tip);
+
+    if (options.type === 'heatMap' && options.legend.type === 'gradient') {
+      Object.assign(this, plugins_legend_gradient);
+    }
+
     this.target = target;
     this.data = data;
     this.options = options;
@@ -42403,7 +43131,8 @@ var chart_core_EvChart = /*#__PURE__*/function () {
         selectSeries: {
           option: selectSeries,
           selected: this.defaultSelectInfo
-        }
+        },
+        overlayCtx: this.overlayCtx
       };
       var showIndex = 0;
       var showSeriesCount = 0;
@@ -43183,6 +43912,7 @@ var DEFAULT_OPTIONS = {
   },
   legend: {
     show: true,
+    type: 'icon',
     position: 'right',
     color: '#353740',
     inactive: '#aaa',
@@ -43270,12 +44000,13 @@ var DEFAULT_OPTIONS = {
   heatMapColor: {
     min: '#FFFFFF',
     max: '#0052FF',
-    categoryCnt: 5,
+    categoryCnt: 1,
     stroke: {
       show: false,
       color: '#FFFFFF',
       lineWidth: 1,
-      opacity: 1
+      opacity: 1,
+      radius: 0
     },
     error: '#FF0000',
     decimalPoint: 0
@@ -43684,32 +44415,32 @@ Chart.install = function (app) {
 };
 
 /* harmony default export */ var chart = (Chart);
-// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=1aab6f12&scoped=true
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=89cff218&scoped=true
 
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-1aab6f12");
+var TreeGridvue_type_template_id_89cff218_scoped_true_withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-89cff218");
 
-Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-1aab6f12");
+Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-89cff218");
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_1 = {
+var TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_1 = {
   class: "column-list"
 };
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_2 = {
+var TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_2 = {
   key: 0
 };
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_3 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
+var TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_3 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
   class: "is-empty"
 }, "No records", -1);
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_4 = {
+var TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_4 = {
   ref: "resizeLine",
   class: "table-resize-line"
 };
 
 Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])();
 
-var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/TreeGridvue_type_template_id_1aab6f12_scoped_true_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
+var TreeGridvue_type_template_id_89cff218_scoped_true_render = /*#__PURE__*/TreeGridvue_type_template_id_89cff218_scoped_true_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
   var _component_toolbar = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("toolbar");
 
   var _component_ev_checkbox = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-checkbox");
@@ -43731,7 +44462,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
     class: "toolbar-wrapper",
     style: "width: ".concat(_ctx.gridWidth, ";")
   }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_toolbar, null, {
-    toolbarWrapper: TreeGridvue_type_template_id_1aab6f12_scoped_true_withId(function () {
+    toolbarWrapper: TreeGridvue_type_template_id_89cff218_scoped_true_withId(function () {
       return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "toolbar", {
         item: {
           onSearch: $setup.onSearch
@@ -43748,7 +44479,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
   }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
     ref: "header",
     class: $setup.headerClass
-  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_1, [_ctx.useCheckbox.use ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
+  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_1, [_ctx.useCheckbox.use ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("li", {
     key: 0,
     class: $setup.headerCheckboxClass,
     style: "width: ".concat(_ctx.minWidth, "px;")
@@ -43817,7 +44548,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
     }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.orderedColumns, function (column, cellIndex) {
       return {
         name: $setup.getSlotName(column.field),
-        fn: TreeGridvue_type_template_id_1aab6f12_scoped_true_withId(function (_ref) {
+        fn: TreeGridvue_type_template_id_89cff218_scoped_true_withId(function (_ref) {
           var item = _ref.item;
           return [!!_ctx.$slots[column.field] ? Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, column.field, {
             key: 0,
@@ -43832,13 +44563,13 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
         })
       };
     })]), 1032, ["selected-data", "node-data", "use-checkbox", "ordered-columns", "expand-icon", "collapse-icon", "parent-icon", "child-icon", "is-resize", "row-height", "min-width", "highlight-index", "border-style", "onCheckTreeData", "onExpandTreeData", "onClickTreeData", "onDblClickTreeData"]);
-  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_2, [TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_3])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
+  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_2, [TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_3])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
     style: "height: ".concat(_ctx.vScrollBottomHeight, "px;"),
     class: "vscroll-spacer"
   }, null, 4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_context_menu, {
     ref: "menu",
     items: _ctx.contextMenuItems
-  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", TreeGridvue_type_template_id_1aab6f12_scoped_true_hoisted_4, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]])], 2)], 4), [[_directive_resize, $setup.onResize], [_directive_observe_visibility, {
+  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", TreeGridvue_type_template_id_89cff218_scoped_true_hoisted_4, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]])], 2)], 4), [[_directive_resize, $setup.onResize], [_directive_observe_visibility, {
     callback: $setup.onShow,
     once: true
   }]]), $setup.useSummary ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_grid_summary, {
@@ -43866,7 +44597,7 @@ var TreeGridvue_type_template_id_1aab6f12_scoped_true_render = /*#__PURE__*/Tree
     order: _ctx.order
   }, null, 8, ["modelValue", "total", "per-page", "visible-page", "show-page-info", "order"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 64);
 });
-// CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=1aab6f12&scoped=true
+// CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=template&id=89cff218&scoped=true
 
 // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/treeGrid/TreeGridNode.vue?vue&type=template&id=89ae5faa&scoped=true
 
@@ -45744,6 +46475,7 @@ var treeGrid_uses_pagingEvent = function pagingEvent(params) {
 
                 setParentShow = function setParentShow(data) {
                   if (!(data !== null && data !== void 0 && data.parent)) {
+                    setChildShow(data);
                     return;
                   }
 
@@ -46004,8 +46736,8 @@ var treeGrid_uses_pagingEvent = function pagingEvent(params) {
 });
 // CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=script&lang=js
  
-// EXTERNAL MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=style&index=0&id=1aab6f12&lang=scss&scoped=true
-var TreeGridvue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true = __webpack_require__("af65");
+// EXTERNAL MODULE: ./src/components/treeGrid/TreeGrid.vue?vue&type=style&index=0&id=89cff218&lang=scss&scoped=true
+var TreeGridvue_type_style_index_0_id_89cff218_lang_scss_scoped_true = __webpack_require__("ca6f");
 
 // CONCATENATED MODULE: ./src/components/treeGrid/TreeGrid.vue
 
@@ -46013,8 +46745,8 @@ var TreeGridvue_type_style_index_0_id_1aab6f12_lang_scss_scoped_true = __webpack
 
 
 
-TreeGridvue_type_script_lang_js.render = TreeGridvue_type_template_id_1aab6f12_scoped_true_render
-TreeGridvue_type_script_lang_js.__scopeId = "data-v-1aab6f12"
+TreeGridvue_type_script_lang_js.render = TreeGridvue_type_template_id_89cff218_scoped_true_render
+TreeGridvue_type_script_lang_js.__scopeId = "data-v-89cff218"
 
 /* harmony default export */ var TreeGrid = (TreeGridvue_type_script_lang_js);
 // CONCATENATED MODULE: ./src/components/treeGrid/index.js