evui 3.4.2 → 3.4.5

package/dist/evui.common.js

@@ -5009,6 +5009,20 @@ exports.push([module.i, ".ev-menu-item{line-height:1.3em}.ev-menu-item:not(.dept
 module.exports = exports;
 
 
+/***/ }),
+
+/***/ "3bbd":
+/***/ (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, ".ev-grid[data-v-5cdcf102]{position:relative;width:100%;height:100%;padding-top:33px}.ev-grid--empty[data-v-5cdcf102]{overflow:auto}.ev-grid--empty .table-header[data-v-5cdcf102]{display:table}.ev-grid.non-header[data-v-5cdcf102]{padding-top:0}.ev-grid .table-header[data-v-5cdcf102]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .ev-grid .table-header[data-v-5cdcf102]{border-top:2px solid;border-bottom:1px solid}.ev-grid .table-header.non-border[data-v-5cdcf102]{border-bottom:2px solid #7f7f7f!important}.ev-grid .row-contextmenu__btn[data-v-5cdcf102]{display:none;vertical-align:middle}.column-list[data-v-5cdcf102]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-5cdcf102],.column-list[data-v-5cdcf102]{position:relative;height:100%}.column[data-v-5cdcf102]{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}.column .column-sort__icon[data-v-5cdcf102]{position:absolute;top:50%;right:0;width:24px;height:24px;background-size:contain;transform:translateY(-50%)}.column .column-sort__icon[data-v-5cdcf102]:hover{cursor:pointer}.column .column-sort__icon--basic[data-v-5cdcf102]{visibility:hidden}.column :hover .column-sort__icon--basic[data-v-5cdcf102]{visibility:visible}.column :hover .column-sort__icon--asc[data-v-5cdcf102],.column :hover .column-sort__icon--desc[data-v-5cdcf102]{visibility:hidden}.column-name[data-v-5cdcf102]{display:-webkit-box;float:left;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:1;font-weight:700;font-size:14px;cursor:pointer}.column-resize[data-v-5cdcf102]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-5cdcf102]:hover{cursor:col-resize}.table-body[data-v-5cdcf102]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-5cdcf102]{clear:both;border-spacing:0;border-collapse:collapse;width:inherit}.table-body.stripe tr[data-v-5cdcf102]:nth-child(2n){background:#e5e5e5}.table-body.bottom-border[data-v-5cdcf102]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-5cdcf102]{border-bottom:1px solid}.table-body .row[data-v-5cdcf102]{color:inherit;white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-5cdcf102]{border-bottom:1px solid}.table-body .row.selected[data-v-5cdcf102]{background:#dbf0f9}.dark .table-body .row.selected[data-v-5cdcf102],.table-body .row.selected[data-v-5cdcf102]{color:inherit;font-size:inherit}.table-body .row.highlight[data-v-5cdcf102]{background:#5ab7ff;color:#fff}.table-body .row:hover .row-contextmenu__btn[data-v-5cdcf102]{display:grid}.table-body .row:hover .row-contextmenu__btn[data-v-5cdcf102]:hover{cursor:pointer;opacity:.6}.table-body .cell[data-v-5cdcf102]{display:inline-block;padding:0 10px;text-align:center;max-width:100%}.table-body .cell[data-v-5cdcf102],.table-body .cell div[data-v-5cdcf102]{white-space:nowrap;text-overflow:ellipsis}.table-body .cell div[data-v-5cdcf102]{overflow:hidden}.table-body .cell.row-checkbox[data-v-5cdcf102]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-5cdcf102]{overflow:initial}.table-body .cell.float[data-v-5cdcf102],.table-body .cell.number[data-v-5cdcf102]{text-align:right}.table-body .cell.string[data-v-5cdcf102],.table-body .cell.stringNumber[data-v-5cdcf102]{text-align:left}.table-body .cell.center[data-v-5cdcf102]{text-align:center}.table-body .cell.left[data-v-5cdcf102]{text-align:left}.table-body .cell.left .wrap[data-v-5cdcf102]{justify-content:flex-start}.table-body .cell.right[data-v-5cdcf102]{text-align:right}.table-body .cell.right .wrap[data-v-5cdcf102]{justify-content:flex-end}.table-resize-line[data-v-5cdcf102]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-5cdcf102]{border-right:1px solid}.vscroll-spacer[data-v-5cdcf102]{opacity:0;clear:both}[v-cloak][data-v-5cdcf102]{display:none}.ev-checkbox[data-v-5cdcf102]{margin:0}.non-border[data-v-5cdcf102]{border:none!important}.is-empty[data-v-5cdcf102]{height:30px;text-align:center}.filtering-items[data-v-5cdcf102]{display:flex;flex-flow:row wrap;gap:10px;position:absolute;padding:8px;flex-direction:row;align-items:center;z-index:1;border-radius:4px}.filtering-items-expand[data-v-5cdcf102]:hover{cursor:pointer;color:#07f}.filtering-items__item[data-v-5cdcf102]{padding:4px;border-radius:4px;background:#eaf2fa}.filtering-items__item[data-v-5cdcf102]:hover{cursor:pointer;border:1px solid #198fff}.filtering-items__item--title[data-v-5cdcf102]{color:#07f;margin-right:6px;vertical-align:middle}.filtering-items__item--value[data-v-5cdcf102]{display:inline-block;max-width:80px;text-overflow:ellipsis;overflow:hidden;vertical-align:middle;white-space:nowrap}.filtering-items__item--remove[data-v-5cdcf102]{vertical-align:middle;margin-left:6px}.filtering-items__item--remove[data-v-5cdcf102]:hover{opacity:.6}.filtering-items__item.non-display[data-v-5cdcf102]{display:none}.ev-grid-filtering-items[data-v-5cdcf102]{display:flex;flex-flow:row wrap;gap:10px;position:relative;padding:10px;align-items:center;border:1px solid #ced4da;background:#fff;border-radius:4px;overflow:auto;max-width:500px;max-height:100px}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "3bbe":
@@ -5962,6 +5976,17 @@ module.exports = function (argument) {
 };
 
 
+/***/ }),
+
+/***/ "50d0":
+/***/ (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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_5cdcf102_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("c7ba");
+/* 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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_5cdcf102_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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_5cdcf102_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "5135":
@@ -6147,6 +6172,20 @@ if(content.locals) module.exports = content.locals;
 var add = __webpack_require__("499e").default
 var update = add("7fbad1a3", content, true, {"sourceMap":false,"shadowMode":false});
 
+/***/ }),
+
+/***/ "5533":
+/***/ (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, ".ev-grid-filter-setting{position:absolute;width:auto;border:1px solid #d0d0d0;background:#fff;font-size:12px;z-index:1}.ev-grid-filter-setting__header{padding:10px}.ev-grid-filter-setting__header .ev-text-field{margin-top:10px}.ev-grid-filter-setting__row{display:flex;width:100%;padding:6px 0;gap:5px}.ev-grid-filter-setting__row .ev-select__wrapper{width:inherit}.ev-grid-filter-setting__row--operator{width:80px}.ev-grid-filter-setting__row--comparison,.ev-grid-filter-setting__row--value{width:120px}.ev-grid-filter-setting__row--button{display:flex;justify-content:center;align-items:center}.ev-grid-filter-setting__row--button.add{padding:6px 0;justify-content:end}.ev-grid-filter-setting__row--button i{font-size:22px;margin-left:8px}.ev-grid-filter-setting__row--button i:hover{opacity:.6;cursor:pointer}.ev-grid-filter-setting__content{padding:0 10px;border-top:1px solid #ced4da;border-bottom:1px solid #ced4da}.ev-grid-filter-setting__footer{display:flex;padding:5px 10px}.ev-grid-filter-setting__footer .ev-button{margin-left:auto}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "554d":
@@ -7983,7 +8022,7 @@ $({ target: 'Number', stat: true }, {
 /***/ "9224":
 /***/ (function(module) {
 
-module.exports = JSON.parse("{\"a\":\"3.4.2\"}");
+module.exports = JSON.parse("{\"a\":\"3.4.5\"}");
 
 /***/ }),
 
@@ -9965,17 +10004,6 @@ if (DESCRIPTORS && !(NAME in FunctionPrototype)) {
 }
 
 
-/***/ }),
-
-/***/ "b2ca":
-/***/ (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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_948a1734_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("d4ac");
-/* 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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_948a1734_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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_Grid_vue_vue_type_style_index_0_id_948a1734_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
 /***/ }),
 
 /***/ "b575":
@@ -10438,7 +10466,7 @@ module.exports = exports;
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__("24fb");
 exports = ___CSS_LOADER_API_IMPORT___(false);
 // Module
-exports.push([module.i, ".ev-grid[data-v-fd0ffe52]{position:relative;width:100%;height:100%;padding-top:33px}.ev-grid--empty[data-v-fd0ffe52]{overflow:auto}.ev-grid--empty .table-header[data-v-fd0ffe52]{display:table}.ev-grid.non-header[data-v-fd0ffe52]{padding-top:0}.ev-grid .table-header[data-v-fd0ffe52]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .ev-grid .table-header[data-v-fd0ffe52]{border-top:2px solid;border-bottom:1px solid}.ev-grid .table-header.non-border[data-v-fd0ffe52]{border-bottom:2px solid #7f7f7f!important}.column-list[data-v-fd0ffe52]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-fd0ffe52],.column-list[data-v-fd0ffe52]{position:relative;height:100%}.column[data-v-fd0ffe52]{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;background:#fff}.dark .column[data-v-fd0ffe52]{border-right:1px solid;background:#0d0d0d}.column[data-v-fd0ffe52]:last-child{border-right:0}.column .column-sort__icon[data-v-fd0ffe52]{position:absolute;top:50%;width:24px;height:24px;background-size:contain;transform:translateY(-50%)}.column .column-sort__icon[data-v-fd0ffe52]:hover{cursor:pointer}.column .column-sort__icon--basic[data-v-fd0ffe52]{visibility:hidden}.column :hover .column-sort__icon--basic[data-v-fd0ffe52]{visibility:visible}.column :hover .column-sort__icon--asc[data-v-fd0ffe52],.column :hover .column-sort__icon--desc[data-v-fd0ffe52]{visibility:hidden}.column-name[data-v-fd0ffe52]{display:-webkit-box;float:left;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:1;font-weight:700;font-size:14px;cursor:pointer}.column-resize[data-v-fd0ffe52]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-fd0ffe52]:hover{cursor:col-resize}.table-body[data-v-fd0ffe52]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-fd0ffe52]{clear:both;border-spacing:0;border-collapse:collapse;width:inherit}.table-body.stripe tr[data-v-fd0ffe52]:nth-child(2n){background:#e5e5e5}.table-body.bottom-border[data-v-fd0ffe52]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-fd0ffe52]{border-bottom:1px solid}.table-body .row[data-v-fd0ffe52]{color:inherit;white-space:nowrap;background:#fff;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-fd0ffe52]{background:#0d0d0d;border-bottom:1px solid}.table-body .row.selected[data-v-fd0ffe52]{background:#dbf0f9}.dark .table-body .row.selected[data-v-fd0ffe52],.table-body .row.selected[data-v-fd0ffe52]{color:inherit;font-size:inherit}.table-body .row.highlight[data-v-fd0ffe52]{background:#5ab7ff;color:#fff}.table-body .row:hover .row-contextmenu__btn[data-v-fd0ffe52]{visibility:visible}.table-body .cell[data-v-fd0ffe52]{display:inline-block;padding:0 10px;background:inherit;text-align:center;max-width:100%;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-fd0ffe52]{border-right:1px solid}.table-body .cell div[data-v-fd0ffe52]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell .row-contextmenu__btn[data-v-fd0ffe52]{visibility:hidden;vertical-align:middle;cursor:pointer}.table-body .cell.row-checkbox[data-v-fd0ffe52]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-fd0ffe52]{overflow:initial}.table-body .cell.float[data-v-fd0ffe52],.table-body .cell.number[data-v-fd0ffe52]{text-align:right}.table-body .cell.string[data-v-fd0ffe52],.table-body .cell.stringNumber[data-v-fd0ffe52]{text-align:left}.table-body .cell.center[data-v-fd0ffe52]{text-align:center}.table-body .cell.left[data-v-fd0ffe52]{text-align:left}.table-body .cell.left .wrap[data-v-fd0ffe52]{justify-content:flex-start}.table-body .cell.right[data-v-fd0ffe52]{text-align:right}.table-body .cell.right .wrap[data-v-fd0ffe52]{justify-content:flex-end}.table-body .cell[data-v-fd0ffe52]:last-child{border-right:0}.table-resize-line[data-v-fd0ffe52]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-fd0ffe52]{border-right:1px solid}.vscroll-spacer[data-v-fd0ffe52]{opacity:0;clear:both}[v-cloak][data-v-fd0ffe52]{display:none}.ev-checkbox[data-v-fd0ffe52]{margin:0}.non-border[data-v-fd0ffe52]{border:none!important}.is-empty[data-v-fd0ffe52]{height:30px;text-align:center}.grid-summary[data-v-fd0ffe52]{width:100%;overflow:hidden;border-bottom:1px solid #b2b2b2;background-color:hsla(0,0%,69.8%,.1)}.dark .grid-summary[data-v-fd0ffe52]{border-bottom:1px solid #555;background-color:hsla(0,0%,40%,.3)}.grid-summary .non-border[data-v-fd0ffe52]{border-bottom:none!important}.grid-summary span[data-v-fd0ffe52]{display:inline-block;overflow:hidden;text-overflow:ellipsis;font-size:14px}.grid-summary span>div[data-v-fd0ffe52]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.grid-summary .column.float[data-v-fd0ffe52],.grid-summary .column.number[data-v-fd0ffe52]{text-align:right}.grid-summary .column.string[data-v-fd0ffe52],.grid-summary .column.stringNumber[data-v-fd0ffe52]{text-align:left}.grid-summary .column.center[data-v-fd0ffe52]{text-align:center}.grid-summary .column.left[data-v-fd0ffe52]{text-align:left}.grid-summary .column.left .wrap[data-v-fd0ffe52]{justify-content:flex-start}.grid-summary .column.right[data-v-fd0ffe52]{text-align:right}.grid-summary .column.right .wrap[data-v-fd0ffe52]{justify-content:flex-end}", ""]);
+exports.push([module.i, ".ev-grid[data-v-fd0ffe52]{position:relative;width:100%;height:100%;padding-top:33px}.ev-grid--empty[data-v-fd0ffe52]{overflow:auto}.ev-grid--empty .table-header[data-v-fd0ffe52]{display:table}.ev-grid.non-header[data-v-fd0ffe52]{padding-top:0}.ev-grid .table-header[data-v-fd0ffe52]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .ev-grid .table-header[data-v-fd0ffe52]{border-top:2px solid;border-bottom:1px solid}.ev-grid .table-header.non-border[data-v-fd0ffe52]{border-bottom:2px solid #7f7f7f!important}.ev-grid .row-contextmenu__btn[data-v-fd0ffe52]{display:none;vertical-align:middle}.column-list[data-v-fd0ffe52]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-fd0ffe52],.column-list[data-v-fd0ffe52]{position:relative;height:100%}.column[data-v-fd0ffe52]{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}.column .column-sort__icon[data-v-fd0ffe52]{position:absolute;top:50%;right:0;width:24px;height:24px;background-size:contain;transform:translateY(-50%)}.column .column-sort__icon[data-v-fd0ffe52]:hover{cursor:pointer}.column .column-sort__icon--basic[data-v-fd0ffe52]{visibility:hidden}.column :hover .column-sort__icon--basic[data-v-fd0ffe52]{visibility:visible}.column :hover .column-sort__icon--asc[data-v-fd0ffe52],.column :hover .column-sort__icon--desc[data-v-fd0ffe52]{visibility:hidden}.column-name[data-v-fd0ffe52]{display:-webkit-box;float:left;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:1;font-weight:700;font-size:14px;cursor:pointer}.column-resize[data-v-fd0ffe52]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-fd0ffe52]:hover{cursor:col-resize}.table-body[data-v-fd0ffe52]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-fd0ffe52]{clear:both;border-spacing:0;border-collapse:collapse;width:inherit}.table-body.stripe tr[data-v-fd0ffe52]:nth-child(2n){background:#e5e5e5}.table-body.bottom-border[data-v-fd0ffe52]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-fd0ffe52]{border-bottom:1px solid}.table-body .row[data-v-fd0ffe52]{color:inherit;white-space:nowrap;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-fd0ffe52]{border-bottom:1px solid}.table-body .row.selected[data-v-fd0ffe52]{background:#dbf0f9}.dark .table-body .row.selected[data-v-fd0ffe52],.table-body .row.selected[data-v-fd0ffe52]{color:inherit;font-size:inherit}.table-body .row.highlight[data-v-fd0ffe52]{background:#5ab7ff;color:#fff}.table-body .row:hover .row-contextmenu__btn[data-v-fd0ffe52]{display:grid}.table-body .row:hover .row-contextmenu__btn[data-v-fd0ffe52]:hover{cursor:pointer;opacity:.6}.table-body .cell[data-v-fd0ffe52]{display:inline-block;padding:0 10px;text-align:center;max-width:100%}.table-body .cell[data-v-fd0ffe52],.table-body .cell div[data-v-fd0ffe52]{white-space:nowrap;text-overflow:ellipsis}.table-body .cell div[data-v-fd0ffe52]{overflow:hidden}.table-body .cell.row-checkbox[data-v-fd0ffe52]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-fd0ffe52]{overflow:initial}.table-body .cell.float[data-v-fd0ffe52],.table-body .cell.number[data-v-fd0ffe52]{text-align:right}.table-body .cell.string[data-v-fd0ffe52],.table-body .cell.stringNumber[data-v-fd0ffe52]{text-align:left}.table-body .cell.center[data-v-fd0ffe52]{text-align:center}.table-body .cell.left[data-v-fd0ffe52]{text-align:left}.table-body .cell.left .wrap[data-v-fd0ffe52]{justify-content:flex-start}.table-body .cell.right[data-v-fd0ffe52]{text-align:right}.table-body .cell.right .wrap[data-v-fd0ffe52]{justify-content:flex-end}.table-resize-line[data-v-fd0ffe52]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-fd0ffe52]{border-right:1px solid}.vscroll-spacer[data-v-fd0ffe52]{opacity:0;clear:both}[v-cloak][data-v-fd0ffe52]{display:none}.ev-checkbox[data-v-fd0ffe52]{margin:0}.non-border[data-v-fd0ffe52]{border:none!important}.is-empty[data-v-fd0ffe52]{height:30px;text-align:center}.filtering-items[data-v-fd0ffe52]{display:flex;flex-flow:row wrap;gap:10px;position:absolute;padding:8px;flex-direction:row;align-items:center;z-index:1;border-radius:4px}.filtering-items-expand[data-v-fd0ffe52]:hover{cursor:pointer;color:#07f}.filtering-items__item[data-v-fd0ffe52]{padding:4px;border-radius:4px;background:#eaf2fa}.filtering-items__item[data-v-fd0ffe52]:hover{cursor:pointer;border:1px solid #198fff}.filtering-items__item--title[data-v-fd0ffe52]{color:#07f;margin-right:6px;vertical-align:middle}.filtering-items__item--value[data-v-fd0ffe52]{display:inline-block;max-width:80px;text-overflow:ellipsis;overflow:hidden;vertical-align:middle;white-space:nowrap}.filtering-items__item--remove[data-v-fd0ffe52]{vertical-align:middle;margin-left:6px}.filtering-items__item--remove[data-v-fd0ffe52]:hover{opacity:.6}.filtering-items__item.non-display[data-v-fd0ffe52]{display:none}.ev-grid-filtering-items[data-v-fd0ffe52]{display:flex;flex-flow:row wrap;gap:10px;position:relative;padding:10px;align-items:center;border:1px solid #ced4da;background:#fff;border-radius:4px;overflow:auto;max-width:500px;max-height:100px}.grid-summary[data-v-fd0ffe52]{width:100%;overflow:hidden;border-bottom:1px solid #b2b2b2;background-color:hsla(0,0%,69.8%,.1)}.dark .grid-summary[data-v-fd0ffe52]{border-bottom:1px solid #555;background-color:hsla(0,0%,40%,.3)}.grid-summary .non-border[data-v-fd0ffe52]{border-bottom:none!important}.grid-summary span[data-v-fd0ffe52]{display:inline-block;overflow:hidden;text-overflow:ellipsis;font-size:14px}.grid-summary span>div[data-v-fd0ffe52]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.grid-summary .column.float[data-v-fd0ffe52],.grid-summary .column.number[data-v-fd0ffe52]{text-align:right}.grid-summary .column.string[data-v-fd0ffe52],.grid-summary .column.stringNumber[data-v-fd0ffe52]{text-align:left}.grid-summary .column.center[data-v-fd0ffe52]{text-align:center}.grid-summary .column.left[data-v-fd0ffe52]{text-align:left}.grid-summary .column.left .wrap[data-v-fd0ffe52]{justify-content:flex-start}.grid-summary .column.right[data-v-fd0ffe52]{text-align:right}.grid-summary .column.right .wrap[data-v-fd0ffe52]{justify-content:flex-end}", ""]);
 // Exports
 module.exports = exports;
 
@@ -10647,6 +10675,21 @@ $({ target: 'Array', proto: true, forced: SKIPS_HOLES || !USES_TO_LENGTH }, {
 addToUnscopables(FIND_INDEX);
 
 
+/***/ }),
+
+/***/ "c7ba":
+/***/ (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__("3bbd");
+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("100bed7e", content, true, {"sourceMap":false,"shadowMode":false});
+
 /***/ }),
 
 /***/ "c8ba":
@@ -11092,21 +11135,6 @@ module.exports = function (it, TAG, STATIC) {
 };
 
 
-/***/ }),
-
-/***/ "d4ac":
-/***/ (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__("f40f");
-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("386ac9a6", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "d58f":
@@ -12453,6 +12481,17 @@ module.exports = Array.isArray || function isArray(arg) {
 };
 
 
+/***/ }),
+
+/***/ "e8de":
+/***/ (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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_grid_filterSetting_vue_vue_type_style_index_0_id_6129991f_lang_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("f469");
+/* 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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_grid_filterSetting_vue_vue_type_style_index_0_id_6129991f_lang_scss__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_cli_service_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_cli_service_node_modules_vue_loader_v16_dist_index_js_ref_0_1_grid_filterSetting_vue_vue_type_style_index_0_id_6129991f_lang_scss__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "e95a":
@@ -12687,17 +12726,18 @@ module.exports = exports;
 
 /***/ }),
 
-/***/ "f40f":
+/***/ "f469":
 /***/ (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, ".ev-grid[data-v-948a1734]{position:relative;width:100%;height:100%;padding-top:33px}.ev-grid--empty[data-v-948a1734]{overflow:auto}.ev-grid--empty .table-header[data-v-948a1734]{display:table}.ev-grid.non-header[data-v-948a1734]{padding-top:0}.ev-grid .table-header[data-v-948a1734]{overflow:hidden;position:absolute;top:0;width:100%;height:33px;border-top:2px solid #7f7f7f;border-bottom:1px solid #cfcfcf}.dark .ev-grid .table-header[data-v-948a1734]{border-top:2px solid;border-bottom:1px solid}.ev-grid .table-header.non-border[data-v-948a1734]{border-bottom:2px solid #7f7f7f!important}.column-list[data-v-948a1734]{width:100%;white-space:nowrap;list-style-type:none}.column[data-v-948a1734],.column-list[data-v-948a1734]{position:relative;height:100%}.column[data-v-948a1734]{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;background:#fff}.dark .column[data-v-948a1734]{border-right:1px solid;background:#0d0d0d}.column[data-v-948a1734]:last-child{border-right:0}.column .column-sort__icon[data-v-948a1734]{position:absolute;top:50%;width:24px;height:24px;background-size:contain;transform:translateY(-50%)}.column .column-sort__icon[data-v-948a1734]:hover{cursor:pointer}.column .column-sort__icon--basic[data-v-948a1734]{visibility:hidden}.column :hover .column-sort__icon--basic[data-v-948a1734]{visibility:visible}.column :hover .column-sort__icon--asc[data-v-948a1734],.column :hover .column-sort__icon--desc[data-v-948a1734]{visibility:hidden}.column-name[data-v-948a1734]{display:-webkit-box;float:left;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:1;font-weight:700;font-size:14px;cursor:pointer}.column-resize[data-v-948a1734]{position:absolute;bottom:0;right:-5px;width:10px;height:100%}.column-resize[data-v-948a1734]:hover{cursor:col-resize}.table-body[data-v-948a1734]{position:relative;width:100%;height:100%;overflow:auto;overflow-anchor:none}.table-body table[data-v-948a1734]{clear:both;border-spacing:0;border-collapse:collapse;width:inherit}.table-body.stripe tr[data-v-948a1734]:nth-child(2n){background:#e5e5e5}.table-body.bottom-border[data-v-948a1734]{border-bottom:1px solid #cfcfcf}.dark .table-body.bottom-border[data-v-948a1734]{border-bottom:1px solid}.table-body .row[data-v-948a1734]{color:inherit;white-space:nowrap;background:#fff;border-bottom:1px solid #cfcfcf}.dark .table-body .row[data-v-948a1734]{background:#0d0d0d;border-bottom:1px solid}.table-body .row.selected[data-v-948a1734]{background:#dbf0f9}.dark .table-body .row.selected[data-v-948a1734],.table-body .row.selected[data-v-948a1734]{color:inherit;font-size:inherit}.table-body .row.highlight[data-v-948a1734]{background:#5ab7ff;color:#fff}.table-body .row:hover .row-contextmenu__btn[data-v-948a1734]{visibility:visible}.table-body .cell[data-v-948a1734]{display:inline-block;padding:0 10px;background:inherit;text-align:center;max-width:100%;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #cfcfcf}.dark .table-body .cell[data-v-948a1734]{border-right:1px solid}.table-body .cell div[data-v-948a1734]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table-body .cell .row-contextmenu__btn[data-v-948a1734]{visibility:hidden;vertical-align:middle;cursor:pointer}.table-body .cell.row-checkbox[data-v-948a1734]{display:inline-flex;justify-content:center;align-items:center}.table-body .cell.render[data-v-948a1734]{overflow:initial}.table-body .cell.float[data-v-948a1734],.table-body .cell.number[data-v-948a1734]{text-align:right}.table-body .cell.string[data-v-948a1734],.table-body .cell.stringNumber[data-v-948a1734]{text-align:left}.table-body .cell.center[data-v-948a1734]{text-align:center}.table-body .cell.left[data-v-948a1734]{text-align:left}.table-body .cell.left .wrap[data-v-948a1734]{justify-content:flex-start}.table-body .cell.right[data-v-948a1734]{text-align:right}.table-body .cell.right .wrap[data-v-948a1734]{justify-content:flex-end}.table-body .cell[data-v-948a1734]:last-child{border-right:0}.table-resize-line[data-v-948a1734]{position:absolute;top:0;bottom:0;width:1px;border-right:1px solid #cfcfcf}.dark .table-resize-line[data-v-948a1734]{border-right:1px solid}.vscroll-spacer[data-v-948a1734]{opacity:0;clear:both}[v-cloak][data-v-948a1734]{display:none}.ev-checkbox[data-v-948a1734]{margin:0}.non-border[data-v-948a1734]{border:none!important}.is-empty[data-v-948a1734]{height:30px;text-align:center}", ""]);
-// Exports
-module.exports = exports;
+// style-loader: Adds some css to the DOM by adding a <style> tag
 
+// load the styles
+var content = __webpack_require__("5533");
+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("d5622dec", content, true, {"sourceMap":false,"shadowMode":false});
 
 /***/ }),
 
@@ -15968,6 +16008,14 @@ function getPrecision(v) {
 function checkNullAndUndefined(value) {
   return value === null || value === undefined;
 }
+/**
+ * Check if the device is mobile
+ * @returns {boolean}
+ */
+
+function mobileCheck() {
+  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || 'ontouchstart' in window || navigator.maxTouchPoints;
+}
 // CONCATENATED MODULE: ./src/components/inputNumber/uses.js
 
 
@@ -27290,48 +27338,71 @@ var dist_default = /*#__PURE__*/__webpack_require__.n(dist);
 var vue3_observe_visibility_common = __webpack_require__("196e");
 var vue3_observe_visibility_common_default = /*#__PURE__*/__webpack_require__.n(vue3_observe_visibility_common);
 
-// 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/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/Grid.vue?vue&type=template&id=948a1734&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/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/Grid.vue?vue&type=template&id=5cdcf102&scoped=true
 
 
 
 
-var _withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-948a1734");
 
-Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-948a1734");
+var _withId = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withScopeId"])("data-v-5cdcf102");
 
-var Gridvue_type_template_id_948a1734_scoped_true_hoisted_1 = {
+Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-5cdcf102");
+
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_1 = {
+  class: "filtering-items__item--title"
+};
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_2 = {
+  key: 1,
+  class: "filtering-items__item--value"
+};
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_3 = {
+  class: "filtering-items__item"
+};
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_4 = {
+  class: "filtering-items__item--title"
+};
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_5 = {
+  class: "filtering-items__item--value"
+};
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_6 = {
   class: "column-list"
 };
-var Gridvue_type_template_id_948a1734_scoped_true_hoisted_2 = {
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_7 = {
   ref: "table"
 };
-var Gridvue_type_template_id_948a1734_scoped_true_hoisted_3 = {
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_8 = {
   key: 0
 };
-var Gridvue_type_template_id_948a1734_scoped_true_hoisted_4 = {
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_9 = {
   key: 0
 };
 
-var Gridvue_type_template_id_948a1734_scoped_true_hoisted_5 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_10 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("td", {
   class: "is-empty"
 }, "No records", -1);
 
-var Gridvue_type_template_id_948a1734_scoped_true_hoisted_6 = {
+var Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_11 = {
   ref: "resizeLine",
   class: "table-resize-line"
 };
 
 Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])();
 
-var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
+var Gridvue_type_template_id_5cdcf102_scoped_true_render = /*#__PURE__*/_withId(function (_ctx, _cache, $props, $setup, $data, $options) {
   var _ctx$$props$option$cu;
 
+  var _component_ev_icon = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-icon");
+
+  var _component_ev_select = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-select");
+
   var _component_grid_option_button = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("grid-option-button");
 
   var _component_toolbar = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("toolbar");
 
   var _component_column_setting = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("column-setting");
 
+  var _component_filter_setting = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("filter-setting");
+
   var _component_ev_checkbox = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-checkbox");
 
   var _component_grid_sort_button = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("grid-sort-button");
@@ -27342,6 +27413,8 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
 
   var _component_grid_pagination = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("grid-pagination");
 
+  var _directive_clickoutside = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDirective"])("clickoutside");
+
   var _directive_resize = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDirective"])("resize");
 
   var _directive_observe_visibility = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDirective"])("observe-visibility");
@@ -27353,8 +27426,91 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
     style: "width: ".concat(_ctx.gridWidth, ";")
   }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_toolbar, null, {
     toolbarWrapper: _withId(function () {
-      return [$setup.useColumnSetting ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_grid_option_button, {
+      return [_ctx.isFiltering && Object.keys(_ctx.filteringItemsByColumn).length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", {
         key: 0,
+        ref: "filteringItemsRef",
+        class: "filtering-items",
+        style: {
+          width: "".concat($setup.filteringItemsWidth, "px"),
+          background: !$setup.isShowColumnFilteringItems && $setup.isExpandColumnFilteringItems ? '#FFFFFF' : 'none',
+          border: !$setup.isShowColumnFilteringItems && $setup.isExpandColumnFilteringItems ? '1px solid #CED4DA' : 'none'
+        }
+      }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+        class: "filtering-items__item--remove",
+        icon: "ev-icon-s-close",
+        style: {
+          'margin-left': 0
+        },
+        onClick: $setup.removeAllFiltering
+      }, null, 8, ["onClick"]), (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(Object.keys(_ctx.filteringItemsByColumn), function (field, idx) {
+        return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+          key: idx
+        }, [idx === 0 ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+          key: 0
+        }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+          icon: "ev-icon-filter-list",
+          class: "filtering-items-expand",
+          onClick: $setup.onExpandFilteringItems
+        }, null, 8, ["onClick"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(" Filter (" + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(Object.keys(_ctx.filteringItemsByColumn).length) + ") ", 1)], 64)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), idx === 1 ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ev_select, {
+          key: 1,
+          modelValue: _ctx.columnOperator,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = function ($event) {
+            return _ctx.columnOperator = $event;
+          }),
+          class: "ev-grid-filter-setting__row--operator",
+          items: $setup.operatorItems,
+          onChange: $setup.onChangeOperator
+        }, null, 8, ["modelValue", "items", "onChange"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
+          class: "filtering-items__item",
+          onClick: function onClick($event) {
+            return $setup.onClickFilteringItem(field, _ctx.filteringItemsByColumn[field]);
+          }
+        }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_1, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(field), 1), _ctx.filteringItemsByColumn[field].length < 2 ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", {
+          key: 0,
+          class: "filtering-items__item--value",
+          title: "".concat(_ctx.filteringItemsByColumn[field][0].value)
+        }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.filteringItemsByColumn[field][0].comparison) + " " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.filteringItemsByColumn[field][0].value), 9, ["title"])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_2, " + " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.filteringItemsByColumn[field].length), 1)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+          class: "filtering-items__item--remove",
+          icon: "ev-icon-s-close",
+          onClick: function onClick($event) {
+            return $setup.removeColumnFiltering(field);
+          }
+        }, null, 8, ["onClick"])], 8, ["onClick"])], 64);
+      }), 128))], 4)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), _ctx.isFiltering && $setup.isShowFilteringItemsBox ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Teleport"], {
+        key: 1,
+        to: "#ev-grid-filtering-items-modal"
+      }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("section", {
+        class: "ev-grid-filtering-items",
+        style: {
+          top: _ctx.boxTop,
+          left: _ctx.boxLeft
+        }
+      }, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])($setup.selectedFilteringItems, function (field, idx) {
+        return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+          key: idx
+        }, [idx === 1 ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ev_select, {
+          key: 0,
+          modelValue: field.operator,
+          "onUpdate:modelValue": function onUpdateModelValue($event) {
+            return field.operator = $event;
+          },
+          class: "ev-grid-filter-setting__row--operator",
+          disabled: "",
+          items: $setup.operatorItems
+        }, null, 8, ["modelValue", "onUpdate:modelValue", "items"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_4, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])($setup.selectedFilteringFiled), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_5, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(field.comparison) + " " + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(field.value), 1), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+          class: "filtering-items__item--remove",
+          icon: "ev-icon-s-close",
+          onClick: function onClick($event) {
+            return $setup.removeFiltering({
+              field: $setup.selectedFilteringFiled,
+              idx: idx
+            });
+          }
+        }, null, 8, ["onClick"])])], 64);
+      }), 128))], 4), [[_directive_clickoutside, function () {
+        $setup.isShowFilteringItemsBox = false;
+      }]])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), $setup.useColumnSetting ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_grid_option_button, {
+        key: 2,
         class: "column-setting__icon",
         onClick: $setup.setColumnSetting
       }, null, 8, ["onClick"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "toolbar", {
@@ -27366,13 +27522,25 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
     _: 1
   }), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_column_setting, {
     "is-show": _ctx.isShowColumnSetting,
-    "onUpdate:is-show": _cache[1] || (_cache[1] = function ($event) {
+    "onUpdate:is-show": _cache[2] || (_cache[2] = function ($event) {
       return _ctx.isShowColumnSetting = $event;
     }),
     columns: _ctx.$props.columns,
     "hidden-column": _ctx.hiddenColumn,
     onApplyColumn: $setup.onApplyColumn
-  }, null, 8, ["is-show", "columns", "hidden-column", "onApplyColumn"])], 4)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Object(external_commonjs_vue_commonjs2_vue_root_Vue_["mergeProps"])({
+  }, null, 8, ["is-show", "columns", "hidden-column", "onApplyColumn"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_filter_setting, {
+    "is-show": _ctx.isShowFilterSetting,
+    "onUpdate:is-show": _cache[3] || (_cache[3] = function ($event) {
+      return _ctx.isShowFilterSetting = $event;
+    }),
+    items: _ctx.filteringItemsByColumn,
+    "onUpdate:items": _cache[4] || (_cache[4] = function ($event) {
+      return _ctx.filteringItemsByColumn = $event;
+    }),
+    column: _ctx.filteringColumn,
+    position: _ctx.filterSettingPosition,
+    onApplyFiltering: $setup.onApplyFilter
+  }, null, 8, ["is-show", "items", "column", "position", "onApplyFiltering"])], 4)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Object(external_commonjs_vue_commonjs2_vue_root_Vue_["mergeProps"])({
     ref: "grid-wrapper"
   }, _ctx.$attrs, {
     class: "grid-wrapper",
@@ -27392,17 +27560,20 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
       'table-header': true,
       'non-border': !!$setup.borderStyle
     }
-  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("ul", Gridvue_type_template_id_948a1734_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", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_6, [_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: {
       'column': true,
       'non-border': !!$setup.borderStyle
     },
-    style: "width: ".concat(_ctx.minWidth, "px;")
+    style: {
+      width: "".concat(_ctx.minWidth, "px"),
+      'border-right': '1px solid #CFCFCF'
+    }
   }, [_ctx.useCheckbox.use && _ctx.useCheckbox.headerCheck && _ctx.useCheckbox.mode !== 'single' ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_ev_checkbox, {
     key: 0,
     modelValue: _ctx.isHeaderChecked,
-    "onUpdate:modelValue": _cache[2] || (_cache[2] = function ($event) {
+    "onUpdate:modelValue": _cache[5] || (_cache[5] = function ($event) {
       return _ctx.isHeaderChecked = $event;
     }),
     onChange: $setup.onCheckAll
@@ -27420,14 +27591,15 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
       style: {
         width: "".concat(column.width, "px"),
         'min-width': "".concat($setup.isRenderer(column) ? _ctx.rendererMinWidth : _ctx.minWidth, "px"),
-        'margin-right': _ctx.orderedColumns.length - 1 === index && (_ctx.hasVerticalScrollBar || _ctx.hasHorizontalScrollBar) ? "".concat(_ctx.scrollWidth, "px") : '0px'
+        'margin-right': _ctx.orderedColumns.length - 1 === index && (_ctx.hasVerticalScrollBar || _ctx.hasHorizontalScrollBar) ? "".concat(_ctx.scrollWidth, "px") : '0px',
+        'border-right': _ctx.orderedColumns.length - 1 === index ? 'none' : '1px solid #CFCFCF'
       }
     }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", {
       title: column.caption,
       class: "column-name",
       onClick: [function ($event) {
         return $setup.onColumnContextMenu($event, column);
-      }, _cache[3] || (_cache[3] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function () {
+      }, _cache[6] || (_cache[6] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function () {
         var _ctx$columnMenu;
 
         return _ctx.columnMenu.show && (_ctx$columnMenu = _ctx.columnMenu).show.apply(_ctx$columnMenu, arguments);
@@ -27492,10 +27664,8 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
       'non-border': !!$setup.borderStyle
     },
     style: {
-      position: 'sticky',
-      right: 0,
-      width: '40px',
-      'min-width': '40px',
+      width: '30px',
+      'min-width': '30px',
       'margin-right': _ctx.hasVerticalScrollBar || _ctx.hasHorizontalScrollBar ? "".concat(_ctx.scrollWidth, "px") : '0px'
     }
   }, null, 6)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 2), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], $setup.showHeader]]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
@@ -27506,12 +27676,12 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
       'bottom-border': !!_ctx.viewStore.length,
       'non-border': !!$setup.borderStyle
     },
-    onScroll: _cache[5] || (_cache[5] = function () {
+    onScroll: _cache[10] || (_cache[10] = function () {
       return $setup.onScroll && $setup.onScroll.apply($setup, arguments);
     }),
-    onContextmenu: [_cache[6] || (_cache[6] = function ($event) {
+    onContextmenu: [_cache[11] || (_cache[11] = function ($event) {
       return $setup.onContextMenu($event);
-    }), _cache[7] || (_cache[7] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function () {
+    }), _cache[12] || (_cache[12] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function () {
       var _ctx$menu;
 
       return _ctx.menu.show && (_ctx$menu = _ctx.menu).show.apply(_ctx$menu, arguments);
@@ -27519,7 +27689,7 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
   }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
     style: "height: ".concat(_ctx.vScrollTopHeight, "px;"),
     class: "vscroll-spacer"
-  }, null, 4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("table", Gridvue_type_template_id_948a1734_scoped_true_hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("tbody", null, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.viewStore, function (row, rowIndex) {
+  }, null, 4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("table", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_7, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("tbody", null, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(_ctx.viewStore, function (row, rowIndex) {
     var _ctx$$props$option$cu2;
 
     return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", {
@@ -27544,7 +27714,11 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
         'row-checkbox': true,
         'non-border': !!$setup.borderStyle
       },
-      style: "width: ".concat(_ctx.minWidth, "px; height: ").concat(_ctx.rowHeight, "px;")
+      style: {
+        width: "".concat(_ctx.minWidth, "px"),
+        height: "".concat(_ctx.rowHeight, "px"),
+        'border-right': '1px solid #CFCFCF'
+      }
     }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_checkbox, {
       modelValue: row[1],
       "onUpdate:modelValue": function onUpdateModelValue($event) {
@@ -27571,9 +27745,10 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
           width: "".concat(column.width, "px"),
           height: "".concat(_ctx.rowHeight, "px"),
           'line-height': "".concat(_ctx.rowHeight, "px"),
-          'min-width': "".concat($setup.isRenderer(column) ? _ctx.rendererMinWidth : _ctx.minWidth, "px")
+          'min-width': "".concat($setup.isRenderer(column) ? _ctx.rendererMinWidth : _ctx.minWidth, "px"),
+          'border-right': _ctx.orderedColumns.length - 1 === column.index ? 'none' : '1px solid #CFCFCF'
         }
-      }, [!!_ctx.$slots[column.field] ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Gridvue_type_template_id_948a1734_scoped_true_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, column.field, {
+      }, [!!_ctx.$slots[column.field] ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_8, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, column.field, {
         item: {
           row: row,
           column: column
@@ -27585,24 +27760,36 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
     }), 128)), (_ctx$$props$option$cu2 = _ctx.$props.option.customContextMenu) !== null && _ctx$$props$option$cu2 !== void 0 && _ctx$$props$option$cu2.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("td", {
       key: 1,
       class: {
-        cell: true,
+        'row-contextmenu': true,
         'non-border': !!$setup.borderStyle
       },
       style: {
         position: 'sticky',
         right: 0,
-        width: '40px',
+        width: '30px',
         height: "".concat(_ctx.rowHeight, "px"),
-        'min-width': '40px',
+        'min-width': '30px',
         'line-height': "".concat(_ctx.rowHeight, "px")
       }
-    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_grid_option_button, {
+    }, [_ctx.$slots.contextmenuIcon ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("span", {
+      key: 0,
+      class: "row-contextmenu__btn",
+      onClick: [_cache[7] || (_cache[7] = function ($event) {
+        return $setup.onContextMenu($event);
+      }), _cache[8] || (_cache[8] = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(function () {
+        var _ctx$menu2;
+
+        return _ctx.menu.show && (_ctx$menu2 = _ctx.menu).show.apply(_ctx$menu2, arguments);
+      }, ["prevent"]))]
+    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "contextmenuIcon")])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_grid_option_button, {
+      key: 1,
+      icon: "ev-icon-warning2",
       class: "row-contextmenu__btn",
-      onClick: [_cache[4] || (_cache[4] = function ($event) {
+      onClick: [_cache[9] || (_cache[9] = function ($event) {
         return $setup.onContextMenu($event);
       }), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(_ctx.menu.show, ["prevent"])]
-    }, null, 8, ["onClick"])], 6)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 42, ["data-index", "onClick", "onDblclick"]);
-  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", Gridvue_type_template_id_948a1734_scoped_true_hoisted_4, [Gridvue_type_template_id_948a1734_scoped_true_hoisted_5])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 512), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", {
+    }, null, 8, ["onClick"]))], 6)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 42, ["data-index", "onClick", "onDblclick"]);
+  }), 128)), !_ctx.viewStore.length ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("tr", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_9, [Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_10])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 512), 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, {
@@ -27611,7 +27798,7 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
   }, null, 8, ["items"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_context_menu, {
     ref: "columnMenu",
     items: _ctx.columnMenuItems
-  }, null, 8, ["items"])], 34), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", Gridvue_type_template_id_948a1734_scoped_true_hoisted_6, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]])], 2)], 16), [[_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", Gridvue_type_template_id_5cdcf102_scoped_true_hoisted_11, null, 512), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vShow"], _ctx.showResizeLine]])], 2)], 16), [[_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, {
@@ -27628,7 +27815,7 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
   }, null, 8, ["ordered-columns", "stores", "use-checkbox", "style-option", "scroll-left"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), _ctx.usePage && !_ctx.isInfinite ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_grid_pagination, {
     key: 2,
     modelValue: _ctx.currentPage,
-    "onUpdate:modelValue": _cache[8] || (_cache[8] = function ($event) {
+    "onUpdate:modelValue": _cache[13] || (_cache[13] = function ($event) {
       return _ctx.currentPage = $event;
     }),
     total: _ctx.pageTotal,
@@ -27638,7 +27825,7 @@ var Gridvue_type_template_id_948a1734_scoped_true_render = /*#__PURE__*/_withId(
     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/grid/Grid.vue?vue&type=template&id=948a1734&scoped=true
+// CONCATENATED MODULE: ./src/components/grid/Grid.vue?vue&type=template&id=5cdcf102&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/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/grid.toolbar.vue?vue&type=template&id=481d025f
 
@@ -28383,6 +28570,337 @@ var grid_columnSettingvue_type_style_index_0_id_01f79a26_lang_scss = __webpack_r
 const grid_columnSetting_exports_ = /*#__PURE__*/exportHelper_default()(grid_columnSettingvue_type_script_lang_js, [['render',grid_columnSettingvue_type_template_id_01f79a26_render]])
 
 /* harmony default export */ var grid_columnSetting = (grid_columnSetting_exports_);
+// 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/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/grid.filterSetting.vue?vue&type=template&id=6129991f
+
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_1 = {
+  class: "ev-grid-filter-setting__header"
+};
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_2 = {
+  class: "header-title"
+};
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_3 = {
+  class: "ev-grid-filter-setting__content"
+};
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_4 = {
+  class: "ev-grid-filter-setting__row--button"
+};
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_5 = {
+  class: "ev-grid-filter-setting__row--button add"
+};
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_6 = {
+  class: "ev-grid-filter-setting__footer"
+};
+
+var grid_filterSettingvue_type_template_id_6129991f_hoisted_7 = /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(" OK ");
+
+function grid_filterSettingvue_type_template_id_6129991f_render(_ctx, _cache, $props, $setup, $data, $options) {
+  var _component_ev_icon = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-icon");
+
+  var _component_ev_select = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-select");
+
+  var _component_ev_text_field = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-text-field");
+
+  var _component_ev_button = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("ev-button");
+
+  var _directive_clickoutside = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDirective"])("clickoutside");
+
+  return $setup.isShowFilterSetting ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Teleport"], {
+    key: 0,
+    to: "#ev-grid-column-setting-modal"
+  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("section", {
+    class: "ev-grid-filter-setting",
+    style: {
+      top: _ctx.$props.position.top,
+      left: _ctx.$props.position.left
+    }
+  }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", grid_filterSettingvue_type_template_id_6129991f_hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+    icon: "ev-icon-filter-list"
+  }), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("span", grid_filterSettingvue_type_template_id_6129991f_hoisted_2, " Filter (" + Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(_ctx.$props.column.caption) + ") ", 1)]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", grid_filterSettingvue_type_template_id_6129991f_hoisted_3, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])($setup.filteringItems, function (item, idx) {
+    return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])("div", {
+      key: idx,
+      class: "ev-grid-filter-setting__row"
+    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_select, {
+      modelValue: item.operator,
+      "onUpdate:modelValue": function onUpdateModelValue($event) {
+        return item.operator = $event;
+      },
+      class: "ev-grid-filter-setting__row--operator",
+      items: $setup.items1,
+      disabled: idx > 1,
+      style: {
+        visibility: idx > 0 ? 'visible' : 'hidden'
+      },
+      onChange: $setup.changeOperator
+    }, null, 8, ["modelValue", "onUpdate:modelValue", "items", "disabled", "style", "onChange"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_select, {
+      modelValue: item.comparison,
+      "onUpdate:modelValue": function onUpdateModelValue($event) {
+        return item.comparison = $event;
+      },
+      class: "ev-grid-filter-setting__row--comparison",
+      items: $setup.items2,
+      onChange: function onChange($event) {
+        return $setup.changeComparison(item.comparison, idx);
+      }
+    }, null, 8, ["modelValue", "onUpdate:modelValue", "items", "onChange"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_text_field, {
+      modelValue: item.value,
+      "onUpdate:modelValue": function onUpdateModelValue($event) {
+        return item.value = $event;
+      },
+      class: "ev-grid-filter-setting__row--value",
+      disabled: item.comparison === 'isEmpty' || item.comparison === 'isNotEmpty'
+    }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", grid_filterSettingvue_type_template_id_6129991f_hoisted_4, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+      icon: "ev-icon-trash2",
+      onClick: function onClick($event) {
+        return $setup.removeRow(idx);
+      }
+    }, null, 8, ["onClick"])])]);
+  }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", grid_filterSettingvue_type_template_id_6129991f_hoisted_5, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_icon, {
+    icon: "ev-icon-add",
+    onClick: $setup.addRow
+  }, null, 8, ["onClick"])])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])("div", grid_filterSettingvue_type_template_id_6129991f_hoisted_6, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(_component_ev_button, {
+    type: "primary",
+    onClick: $setup.applyFiltering
+  }, {
+    default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+      return [grid_filterSettingvue_type_template_id_6129991f_hoisted_7];
+    }),
+    _: 1
+  }, 8, ["onClick"])])], 4), [[_directive_clickoutside, function () {
+    $setup.isShowFilterSetting = false;
+  }]])])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true);
+}
+// CONCATENATED MODULE: ./src/components/grid/grid.filterSetting.vue?vue&type=template&id=6129991f
+
+// 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/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/grid.filterSetting.vue?vue&type=script&lang=js
+
+
+
+
+
+
+
+
+
+/* harmony default export */ var grid_filterSettingvue_type_script_lang_js = ({
+  name: 'EVGridFilterSetting',
+  directives: {
+    clickoutside: clickoutside
+  },
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false
+    },
+    position: {
+      type: Object,
+      default: function _default() {
+        return {
+          top: 0,
+          left: 0
+        };
+      }
+    },
+    column: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    },
+    items: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    }
+  },
+  emits: {
+    'update:isShow': null,
+    'apply-filtering': null
+  },
+  setup: function setup(props, _ref) {
+    var emit = _ref.emit;
+    var filteringItems = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])([]);
+    var columnField = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+      var _props$column;
+
+      return (_props$column = props.column) === null || _props$column === void 0 ? void 0 : _props$column.field;
+    });
+    var items1 = [{
+      name: 'AND',
+      value: 'and'
+    }, {
+      name: 'OR',
+      value: 'or'
+    }];
+    var numberItems = [{
+      name: '=',
+      value: '='
+    }, {
+      name: '!=',
+      value: '!='
+    }, {
+      name: '<',
+      value: '<'
+    }, {
+      name: '>',
+      value: '>'
+    }, {
+      name: '<=',
+      value: '<='
+    }, {
+      name: '>=',
+      value: '>='
+    }];
+    var stringItems = [{
+      name: 's%',
+      value: 's%'
+    }, // starts with
+    {
+      name: '%s',
+      value: '%s'
+    }, // ends with
+    {
+      name: '%s%',
+      value: '%s%'
+    }, // contains
+    {
+      name: 'Not Like',
+      value: 'notLike'
+    }, // does not contains
+    {
+      name: '=',
+      value: '='
+    }, // is
+    {
+      name: '!=',
+      value: '!='
+    } // is not
+    ];
+    var commonItems = [{
+      name: 'Is empty',
+      value: 'isEmpty'
+    }, {
+      name: 'Is not empty',
+      value: 'isNotEmpty'
+    }];
+
+    var getComparisonItems = function getComparisonItems(columnType) {
+      if (columnType === 'string' || columnType === 'stringNumber') {
+        return [].concat(stringItems, commonItems);
+      } else if (columnType === 'number' || columnType === 'float') {
+        return [].concat(numberItems, commonItems);
+      } else if (columnType === 'boolean') {
+        return [{
+          name: 'Is',
+          value: 'is'
+        }];
+      }
+
+      return [];
+    };
+
+    var items2 = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+      return getComparisonItems(props.column.type);
+    });
+    var isShowFilterSetting = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])({
+      get: function get() {
+        return props.isShow;
+      },
+      set: function set(val) {
+        return emit('update:isShow', val);
+      }
+    });
+
+    var addRow = function addRow() {
+      var operator = filteringItems.value.length > 2 ? filteringItems.value[2].operator : 'and';
+      filteringItems.value.push({
+        comparison: '=',
+        operator: operator,
+        value: ''
+      });
+    };
+
+    var removeRow = function removeRow(idx) {
+      if (filteringItems.value.length > 1) {
+        filteringItems.value.splice(idx, 1);
+      } else if (idx === 0) {
+        filteringItems.value[0].comparison = '=';
+        filteringItems.value[0].value = '';
+      }
+    };
+
+    var changeComparison = function changeComparison(comparison, idx) {
+      if (comparison === 'isEmpty' || comparison === 'isNotEmpty') {
+        filteringItems.value[idx].value = '';
+      }
+    };
+
+    var changeOperator = function changeOperator(val) {
+      filteringItems.value = filteringItems.value.map(function (item) {
+        return _objectSpread2(_objectSpread2({}, item), {}, {
+          operator: val
+        });
+      });
+    };
+
+    var applyFiltering = function applyFiltering() {
+      emit('apply-filtering', columnField.value, filteringItems.value.filter(function (item) {
+        return item.value || item.comparison === 'isEmpty' || item.comparison === 'isNotEmpty';
+      }));
+    };
+
+    Object(external_commonjs_vue_commonjs2_vue_root_Vue_["watch"])(function () {
+      return props.isShow;
+    }, function (isShow) {
+      var rowList = [];
+
+      if (isShow && columnField.value) {
+        var _props$items$columnFi;
+
+        if (!((_props$items$columnFi = props.items[columnField.value]) !== null && _props$items$columnFi !== void 0 && _props$items$columnFi.length)) {
+          rowList.push({
+            comparison: '=',
+            operator: 'and',
+            value: ''
+          });
+        } else {
+          props.items[columnField.value].forEach(function (row) {
+            rowList.push(row);
+          });
+        }
+
+        filteringItems.value = rowList;
+      }
+    });
+    return {
+      filteringItems: filteringItems,
+      isShowFilterSetting: isShowFilterSetting,
+      items1: items1,
+      items2: items2,
+      addRow: addRow,
+      removeRow: removeRow,
+      changeOperator: changeOperator,
+      applyFiltering: applyFiltering,
+      changeComparison: changeComparison
+    };
+  }
+});
+// CONCATENATED MODULE: ./src/components/grid/grid.filterSetting.vue?vue&type=script&lang=js
+ 
+// EXTERNAL MODULE: ./src/components/grid/grid.filterSetting.vue?vue&type=style&index=0&id=6129991f&lang=scss
+var grid_filterSettingvue_type_style_index_0_id_6129991f_lang_scss = __webpack_require__("e8de");
+
+// CONCATENATED MODULE: ./src/components/grid/grid.filterSetting.vue
+
+
+
+
+
+
+
+const grid_filterSetting_exports_ = /*#__PURE__*/exportHelper_default()(grid_filterSettingvue_type_script_lang_js, [['render',grid_filterSettingvue_type_template_id_6129991f_render]])
+
+/* harmony default export */ var grid_filterSetting = (grid_filterSetting_exports_);
 // 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/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/grid/grid.sortButton.vue?vue&type=template&id=f56c261c
 
 var grid_sortButtonvue_type_template_id_f56c261c_hoisted_1 = {
@@ -28540,6 +29058,1049 @@ function grid_optionButtonvue_type_template_id_3ffafe0b_render(_ctx, _cache, $pr
 const grid_optionButton_exports_ = /*#__PURE__*/exportHelper_default()(grid_optionButtonvue_type_script_lang_js, [['render',grid_optionButtonvue_type_template_id_3ffafe0b_render]])
 
 /* harmony default export */ var grid_optionButton = (grid_optionButton_exports_);
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseIsMatch.js
+
+
+
+/** Used to compose bitmasks for value comparisons. */
+var _baseIsMatch_COMPARE_PARTIAL_FLAG = 1,
+    _baseIsMatch_COMPARE_UNORDERED_FLAG = 2;
+
+/**
+ * The base implementation of `_.isMatch` without support for iteratee shorthands.
+ *
+ * @private
+ * @param {Object} object The object to inspect.
+ * @param {Object} source The object of property values to match.
+ * @param {Array} matchData The property names, values, and compare flags to match.
+ * @param {Function} [customizer] The function to customize comparisons.
+ * @returns {boolean} Returns `true` if `object` is a match, else `false`.
+ */
+function baseIsMatch(object, source, matchData, customizer) {
+  var index = matchData.length,
+      length = index,
+      noCustomizer = !customizer;
+
+  if (object == null) {
+    return !length;
+  }
+  object = Object(object);
+  while (index--) {
+    var data = matchData[index];
+    if ((noCustomizer && data[2])
+          ? data[1] !== object[data[0]]
+          : !(data[0] in object)
+        ) {
+      return false;
+    }
+  }
+  while (++index < length) {
+    data = matchData[index];
+    var key = data[0],
+        objValue = object[key],
+        srcValue = data[1];
+
+    if (noCustomizer && data[2]) {
+      if (objValue === undefined && !(key in object)) {
+        return false;
+      }
+    } else {
+      var stack = new _Stack;
+      if (customizer) {
+        var result = customizer(objValue, srcValue, key, object, source, stack);
+      }
+      if (!(result === undefined
+            ? _baseIsEqual(srcValue, objValue, _baseIsMatch_COMPARE_PARTIAL_FLAG | _baseIsMatch_COMPARE_UNORDERED_FLAG, customizer, stack)
+            : result
+          )) {
+        return false;
+      }
+    }
+  }
+  return true;
+}
+
+/* harmony default export */ var _baseIsMatch = (baseIsMatch);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_isStrictComparable.js
+
+
+/**
+ * Checks if `value` is suitable for strict equality comparisons, i.e. `===`.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` if suitable for strict
+ *  equality comparisons, else `false`.
+ */
+function isStrictComparable(value) {
+  return value === value && !lodash_es_isObject(value);
+}
+
+/* harmony default export */ var _isStrictComparable = (isStrictComparable);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_getMatchData.js
+
+
+
+/**
+ * Gets the property names, values, and compare flags of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the match data of `object`.
+ */
+function getMatchData(object) {
+  var result = lodash_es_keys(object),
+      length = result.length;
+
+  while (length--) {
+    var key = result[length],
+        value = object[key];
+
+    result[length] = [key, value, _isStrictComparable(value)];
+  }
+  return result;
+}
+
+/* harmony default export */ var _getMatchData = (getMatchData);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_matchesStrictComparable.js
+/**
+ * A specialized version of `matchesProperty` for source values suitable
+ * for strict equality comparisons, i.e. `===`.
+ *
+ * @private
+ * @param {string} key The key of the property to get.
+ * @param {*} srcValue The value to match.
+ * @returns {Function} Returns the new spec function.
+ */
+function matchesStrictComparable(key, srcValue) {
+  return function(object) {
+    if (object == null) {
+      return false;
+    }
+    return object[key] === srcValue &&
+      (srcValue !== undefined || (key in Object(object)));
+  };
+}
+
+/* harmony default export */ var _matchesStrictComparable = (matchesStrictComparable);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseMatches.js
+
+
+
+
+/**
+ * The base implementation of `_.matches` which doesn't clone `source`.
+ *
+ * @private
+ * @param {Object} source The object of property values to match.
+ * @returns {Function} Returns the new spec function.
+ */
+function baseMatches(source) {
+  var matchData = _getMatchData(source);
+  if (matchData.length == 1 && matchData[0][2]) {
+    return _matchesStrictComparable(matchData[0][0], matchData[0][1]);
+  }
+  return function(object) {
+    return object === source || _baseIsMatch(object, source, matchData);
+  };
+}
+
+/* harmony default export */ var _baseMatches = (baseMatches);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_isKey.js
+
+
+
+/** Used to match property names within property paths. */
+var reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/,
+    reIsPlainProp = /^\w*$/;
+
+/**
+ * Checks if `value` is a property name and not a property path.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @param {Object} [object] The object to query keys on.
+ * @returns {boolean} Returns `true` if `value` is a property name, else `false`.
+ */
+function isKey(value, object) {
+  if (lodash_es_isArray(value)) {
+    return false;
+  }
+  var type = typeof value;
+  if (type == 'number' || type == 'symbol' || type == 'boolean' ||
+      value == null || lodash_es_isSymbol(value)) {
+    return true;
+  }
+  return reIsPlainProp.test(value) || !reIsDeepProp.test(value) ||
+    (object != null && value in Object(object));
+}
+
+/* harmony default export */ var _isKey = (isKey);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/memoize.js
+
+
+/** Error message constants. */
+var memoize_FUNC_ERROR_TEXT = 'Expected a function';
+
+/**
+ * Creates a function that memoizes the result of `func`. If `resolver` is
+ * provided, it determines the cache key for storing the result based on the
+ * arguments provided to the memoized function. By default, the first argument
+ * provided to the memoized function is used as the map cache key. The `func`
+ * is invoked with the `this` binding of the memoized function.
+ *
+ * **Note:** The cache is exposed as the `cache` property on the memoized
+ * function. Its creation may be customized by replacing the `_.memoize.Cache`
+ * constructor with one whose instances implement the
+ * [`Map`](http://ecma-international.org/ecma-262/7.0/#sec-properties-of-the-map-prototype-object)
+ * method interface of `clear`, `delete`, `get`, `has`, and `set`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to have its output memoized.
+ * @param {Function} [resolver] The function to resolve the cache key.
+ * @returns {Function} Returns the new memoized function.
+ * @example
+ *
+ * var object = { 'a': 1, 'b': 2 };
+ * var other = { 'c': 3, 'd': 4 };
+ *
+ * var values = _.memoize(_.values);
+ * values(object);
+ * // => [1, 2]
+ *
+ * values(other);
+ * // => [3, 4]
+ *
+ * object.a = 2;
+ * values(object);
+ * // => [1, 2]
+ *
+ * // Modify the result cache.
+ * values.cache.set(object, ['a', 'b']);
+ * values(object);
+ * // => ['a', 'b']
+ *
+ * // Replace `_.memoize.Cache`.
+ * _.memoize.Cache = WeakMap;
+ */
+function memoize(func, resolver) {
+  if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) {
+    throw new TypeError(memoize_FUNC_ERROR_TEXT);
+  }
+  var memoized = function() {
+    var args = arguments,
+        key = resolver ? resolver.apply(this, args) : args[0],
+        cache = memoized.cache;
+
+    if (cache.has(key)) {
+      return cache.get(key);
+    }
+    var result = func.apply(this, args);
+    memoized.cache = cache.set(key, result) || cache;
+    return result;
+  };
+  memoized.cache = new (memoize.Cache || _MapCache);
+  return memoized;
+}
+
+// Expose `MapCache`.
+memoize.Cache = _MapCache;
+
+/* harmony default export */ var lodash_es_memoize = (memoize);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_memoizeCapped.js
+
+
+/** Used as the maximum memoize cache size. */
+var MAX_MEMOIZE_SIZE = 500;
+
+/**
+ * A specialized version of `_.memoize` which clears the memoized function's
+ * cache when it exceeds `MAX_MEMOIZE_SIZE`.
+ *
+ * @private
+ * @param {Function} func The function to have its output memoized.
+ * @returns {Function} Returns the new memoized function.
+ */
+function memoizeCapped(func) {
+  var result = lodash_es_memoize(func, function(key) {
+    if (cache.size === MAX_MEMOIZE_SIZE) {
+      cache.clear();
+    }
+    return key;
+  });
+
+  var cache = result.cache;
+  return result;
+}
+
+/* harmony default export */ var _memoizeCapped = (memoizeCapped);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_stringToPath.js
+
+
+/** Used to match property names within property paths. */
+var rePropName = /[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g;
+
+/** Used to match backslashes in property paths. */
+var reEscapeChar = /\\(\\)?/g;
+
+/**
+ * Converts `string` to a property path array.
+ *
+ * @private
+ * @param {string} string The string to convert.
+ * @returns {Array} Returns the property path array.
+ */
+var stringToPath = _memoizeCapped(function(string) {
+  var result = [];
+  if (string.charCodeAt(0) === 46 /* . */) {
+    result.push('');
+  }
+  string.replace(rePropName, function(match, number, quote, subString) {
+    result.push(quote ? subString.replace(reEscapeChar, '$1') : (number || match));
+  });
+  return result;
+});
+
+/* harmony default export */ var _stringToPath = (stringToPath);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_arrayMap.js
+/**
+ * A specialized version of `_.map` for arrays without support for iteratee
+ * shorthands.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the new mapped array.
+ */
+function arrayMap(array, iteratee) {
+  var index = -1,
+      length = array == null ? 0 : array.length,
+      result = Array(length);
+
+  while (++index < length) {
+    result[index] = iteratee(array[index], index, array);
+  }
+  return result;
+}
+
+/* harmony default export */ var _arrayMap = (arrayMap);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseToString.js
+
+
+
+
+
+/** Used as references for various `Number` constants. */
+var INFINITY = 1 / 0;
+
+/** Used to convert symbols to primitives and strings. */
+var _baseToString_symbolProto = _Symbol ? _Symbol.prototype : undefined,
+    symbolToString = _baseToString_symbolProto ? _baseToString_symbolProto.toString : undefined;
+
+/**
+ * The base implementation of `_.toString` which doesn't convert nullish
+ * values to empty strings.
+ *
+ * @private
+ * @param {*} value The value to process.
+ * @returns {string} Returns the string.
+ */
+function baseToString(value) {
+  // Exit early for strings to avoid a performance hit in some environments.
+  if (typeof value == 'string') {
+    return value;
+  }
+  if (lodash_es_isArray(value)) {
+    // Recursively convert values (susceptible to call stack limits).
+    return _arrayMap(value, baseToString) + '';
+  }
+  if (lodash_es_isSymbol(value)) {
+    return symbolToString ? symbolToString.call(value) : '';
+  }
+  var result = (value + '');
+  return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
+}
+
+/* harmony default export */ var _baseToString = (baseToString);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/toString.js
+
+
+/**
+ * Converts `value` to a string. An empty string is returned for `null`
+ * and `undefined` values. The sign of `-0` is preserved.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to convert.
+ * @returns {string} Returns the converted string.
+ * @example
+ *
+ * _.toString(null);
+ * // => ''
+ *
+ * _.toString(-0);
+ * // => '-0'
+ *
+ * _.toString([1, 2, 3]);
+ * // => '1,2,3'
+ */
+function toString_toString(value) {
+  return value == null ? '' : _baseToString(value);
+}
+
+/* harmony default export */ var lodash_es_toString = (toString_toString);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_castPath.js
+
+
+
+
+
+/**
+ * Casts `value` to a path array if it's not one.
+ *
+ * @private
+ * @param {*} value The value to inspect.
+ * @param {Object} [object] The object to query keys on.
+ * @returns {Array} Returns the cast property path array.
+ */
+function castPath(value, object) {
+  if (lodash_es_isArray(value)) {
+    return value;
+  }
+  return _isKey(value, object) ? [value] : _stringToPath(lodash_es_toString(value));
+}
+
+/* harmony default export */ var _castPath = (castPath);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_toKey.js
+
+
+/** Used as references for various `Number` constants. */
+var _toKey_INFINITY = 1 / 0;
+
+/**
+ * Converts `value` to a string key if it's not a string or symbol.
+ *
+ * @private
+ * @param {*} value The value to inspect.
+ * @returns {string|symbol} Returns the key.
+ */
+function toKey(value) {
+  if (typeof value == 'string' || lodash_es_isSymbol(value)) {
+    return value;
+  }
+  var result = (value + '');
+  return (result == '0' && (1 / value) == -_toKey_INFINITY) ? '-0' : result;
+}
+
+/* harmony default export */ var _toKey = (toKey);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseGet.js
+
+
+
+/**
+ * The base implementation of `_.get` without support for default values.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path of the property to get.
+ * @returns {*} Returns the resolved value.
+ */
+function baseGet(object, path) {
+  path = _castPath(path, object);
+
+  var index = 0,
+      length = path.length;
+
+  while (object != null && index < length) {
+    object = object[_toKey(path[index++])];
+  }
+  return (index && index == length) ? object : undefined;
+}
+
+/* harmony default export */ var _baseGet = (baseGet);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/get.js
+
+
+/**
+ * Gets the value at `path` of `object`. If the resolved value is
+ * `undefined`, the `defaultValue` is returned in its place.
+ *
+ * @static
+ * @memberOf _
+ * @since 3.7.0
+ * @category Object
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path of the property to get.
+ * @param {*} [defaultValue] The value returned for `undefined` resolved values.
+ * @returns {*} Returns the resolved value.
+ * @example
+ *
+ * var object = { 'a': [{ 'b': { 'c': 3 } }] };
+ *
+ * _.get(object, 'a[0].b.c');
+ * // => 3
+ *
+ * _.get(object, ['a', '0', 'b', 'c']);
+ * // => 3
+ *
+ * _.get(object, 'a.b.c', 'default');
+ * // => 'default'
+ */
+function get_get(object, path, defaultValue) {
+  var result = object == null ? undefined : _baseGet(object, path);
+  return result === undefined ? defaultValue : result;
+}
+
+/* harmony default export */ var lodash_es_get = (get_get);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseHasIn.js
+/**
+ * The base implementation of `_.hasIn` without support for deep paths.
+ *
+ * @private
+ * @param {Object} [object] The object to query.
+ * @param {Array|string} key The key to check.
+ * @returns {boolean} Returns `true` if `key` exists, else `false`.
+ */
+function baseHasIn(object, key) {
+  return object != null && key in Object(object);
+}
+
+/* harmony default export */ var _baseHasIn = (baseHasIn);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_hasPath.js
+
+
+
+
+
+
+
+/**
+ * Checks if `path` exists on `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path to check.
+ * @param {Function} hasFunc The function to check properties.
+ * @returns {boolean} Returns `true` if `path` exists, else `false`.
+ */
+function hasPath(object, path, hasFunc) {
+  path = _castPath(path, object);
+
+  var index = -1,
+      length = path.length,
+      result = false;
+
+  while (++index < length) {
+    var key = _toKey(path[index]);
+    if (!(result = object != null && hasFunc(object, key))) {
+      break;
+    }
+    object = object[key];
+  }
+  if (result || ++index != length) {
+    return result;
+  }
+  length = object == null ? 0 : object.length;
+  return !!length && lodash_es_isLength(length) && _isIndex(key, length) &&
+    (lodash_es_isArray(object) || lodash_es_isArguments(object));
+}
+
+/* harmony default export */ var _hasPath = (hasPath);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/hasIn.js
+
+
+
+/**
+ * Checks if `path` is a direct or inherited property of `object`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Object
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path to check.
+ * @returns {boolean} Returns `true` if `path` exists, else `false`.
+ * @example
+ *
+ * var object = _.create({ 'a': _.create({ 'b': 2 }) });
+ *
+ * _.hasIn(object, 'a');
+ * // => true
+ *
+ * _.hasIn(object, 'a.b');
+ * // => true
+ *
+ * _.hasIn(object, ['a', 'b']);
+ * // => true
+ *
+ * _.hasIn(object, 'b');
+ * // => false
+ */
+function hasIn(object, path) {
+  return object != null && _hasPath(object, path, _baseHasIn);
+}
+
+/* harmony default export */ var lodash_es_hasIn = (hasIn);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseMatchesProperty.js
+
+
+
+
+
+
+
+
+/** Used to compose bitmasks for value comparisons. */
+var _baseMatchesProperty_COMPARE_PARTIAL_FLAG = 1,
+    _baseMatchesProperty_COMPARE_UNORDERED_FLAG = 2;
+
+/**
+ * The base implementation of `_.matchesProperty` which doesn't clone `srcValue`.
+ *
+ * @private
+ * @param {string} path The path of the property to get.
+ * @param {*} srcValue The value to match.
+ * @returns {Function} Returns the new spec function.
+ */
+function baseMatchesProperty(path, srcValue) {
+  if (_isKey(path) && _isStrictComparable(srcValue)) {
+    return _matchesStrictComparable(_toKey(path), srcValue);
+  }
+  return function(object) {
+    var objValue = lodash_es_get(object, path);
+    return (objValue === undefined && objValue === srcValue)
+      ? lodash_es_hasIn(object, path)
+      : _baseIsEqual(srcValue, objValue, _baseMatchesProperty_COMPARE_PARTIAL_FLAG | _baseMatchesProperty_COMPARE_UNORDERED_FLAG);
+  };
+}
+
+/* harmony default export */ var _baseMatchesProperty = (baseMatchesProperty);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/identity.js
+/**
+ * This method returns the first argument it receives.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Util
+ * @param {*} value Any value.
+ * @returns {*} Returns `value`.
+ * @example
+ *
+ * var object = { 'a': 1 };
+ *
+ * console.log(_.identity(object) === object);
+ * // => true
+ */
+function identity(value) {
+  return value;
+}
+
+/* harmony default export */ var lodash_es_identity = (identity);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseProperty.js
+/**
+ * The base implementation of `_.property` without support for deep paths.
+ *
+ * @private
+ * @param {string} key The key of the property to get.
+ * @returns {Function} Returns the new accessor function.
+ */
+function baseProperty(key) {
+  return function(object) {
+    return object == null ? undefined : object[key];
+  };
+}
+
+/* harmony default export */ var _baseProperty = (baseProperty);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_basePropertyDeep.js
+
+
+/**
+ * A specialized version of `baseProperty` which supports deep paths.
+ *
+ * @private
+ * @param {Array|string} path The path of the property to get.
+ * @returns {Function} Returns the new accessor function.
+ */
+function basePropertyDeep(path) {
+  return function(object) {
+    return _baseGet(object, path);
+  };
+}
+
+/* harmony default export */ var _basePropertyDeep = (basePropertyDeep);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/property.js
+
+
+
+
+
+/**
+ * Creates a function that returns the value at `path` of a given object.
+ *
+ * @static
+ * @memberOf _
+ * @since 2.4.0
+ * @category Util
+ * @param {Array|string} path The path of the property to get.
+ * @returns {Function} Returns the new accessor function.
+ * @example
+ *
+ * var objects = [
+ *   { 'a': { 'b': 2 } },
+ *   { 'a': { 'b': 1 } }
+ * ];
+ *
+ * _.map(objects, _.property('a.b'));
+ * // => [2, 1]
+ *
+ * _.map(_.sortBy(objects, _.property(['a', 'b'])), 'a.b');
+ * // => [1, 2]
+ */
+function property(path) {
+  return _isKey(path) ? _baseProperty(_toKey(path)) : _basePropertyDeep(path);
+}
+
+/* harmony default export */ var lodash_es_property = (property);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseIteratee.js
+
+
+
+
+
+
+/**
+ * The base implementation of `_.iteratee`.
+ *
+ * @private
+ * @param {*} [value=_.identity] The value to convert to an iteratee.
+ * @returns {Function} Returns the iteratee.
+ */
+function baseIteratee(value) {
+  // Don't store the `typeof` result in a variable to avoid a JIT bug in Safari 9.
+  // See https://bugs.webkit.org/show_bug.cgi?id=156034 for more details.
+  if (typeof value == 'function') {
+    return value;
+  }
+  if (value == null) {
+    return lodash_es_identity;
+  }
+  if (typeof value == 'object') {
+    return lodash_es_isArray(value)
+      ? _baseMatchesProperty(value[0], value[1])
+      : _baseMatches(value);
+  }
+  return lodash_es_property(value);
+}
+
+/* harmony default export */ var _baseIteratee = (baseIteratee);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseFindIndex.js
+/**
+ * The base implementation of `_.findIndex` and `_.findLastIndex` without
+ * support for iteratee shorthands.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {Function} predicate The function invoked per iteration.
+ * @param {number} fromIndex The index to search from.
+ * @param {boolean} [fromRight] Specify iterating from right to left.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function baseFindIndex(array, predicate, fromIndex, fromRight) {
+  var length = array.length,
+      index = fromIndex + (fromRight ? 1 : -1);
+
+  while ((fromRight ? index-- : ++index < length)) {
+    if (predicate(array[index], index, array)) {
+      return index;
+    }
+  }
+  return -1;
+}
+
+/* harmony default export */ var _baseFindIndex = (baseFindIndex);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseIsNaN.js
+/**
+ * The base implementation of `_.isNaN` without support for number objects.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is `NaN`, else `false`.
+ */
+function baseIsNaN(value) {
+  return value !== value;
+}
+
+/* harmony default export */ var _baseIsNaN = (baseIsNaN);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_strictIndexOf.js
+/**
+ * A specialized version of `_.indexOf` which performs strict equality
+ * comparisons of values, i.e. `===`.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {*} value The value to search for.
+ * @param {number} fromIndex The index to search from.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function strictIndexOf(array, value, fromIndex) {
+  var index = fromIndex - 1,
+      length = array.length;
+
+  while (++index < length) {
+    if (array[index] === value) {
+      return index;
+    }
+  }
+  return -1;
+}
+
+/* harmony default export */ var _strictIndexOf = (strictIndexOf);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseIndexOf.js
+
+
+
+
+/**
+ * The base implementation of `_.indexOf` without `fromIndex` bounds checks.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {*} value The value to search for.
+ * @param {number} fromIndex The index to search from.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function baseIndexOf(array, value, fromIndex) {
+  return value === value
+    ? _strictIndexOf(array, value, fromIndex)
+    : _baseFindIndex(array, _baseIsNaN, fromIndex);
+}
+
+/* harmony default export */ var _baseIndexOf = (baseIndexOf);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_arrayIncludes.js
+
+
+/**
+ * A specialized version of `_.includes` for arrays without support for
+ * specifying an index to search from.
+ *
+ * @private
+ * @param {Array} [array] The array to inspect.
+ * @param {*} target The value to search for.
+ * @returns {boolean} Returns `true` if `target` is found, else `false`.
+ */
+function arrayIncludes(array, value) {
+  var length = array == null ? 0 : array.length;
+  return !!length && _baseIndexOf(array, value, 0) > -1;
+}
+
+/* harmony default export */ var _arrayIncludes = (arrayIncludes);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_arrayIncludesWith.js
+/**
+ * This function is like `arrayIncludes` except that it accepts a comparator.
+ *
+ * @private
+ * @param {Array} [array] The array to inspect.
+ * @param {*} target The value to search for.
+ * @param {Function} comparator The comparator invoked per element.
+ * @returns {boolean} Returns `true` if `target` is found, else `false`.
+ */
+function arrayIncludesWith(array, value, comparator) {
+  var index = -1,
+      length = array == null ? 0 : array.length;
+
+  while (++index < length) {
+    if (comparator(value, array[index])) {
+      return true;
+    }
+  }
+  return false;
+}
+
+/* harmony default export */ var _arrayIncludesWith = (arrayIncludesWith);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/noop.js
+/**
+ * This method returns `undefined`.
+ *
+ * @static
+ * @memberOf _
+ * @since 2.3.0
+ * @category Util
+ * @example
+ *
+ * _.times(2, _.noop);
+ * // => [undefined, undefined]
+ */
+function noop() {
+  // No operation performed.
+}
+
+/* harmony default export */ var lodash_es_noop = (noop);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_createSet.js
+
+
+
+
+/** Used as references for various `Number` constants. */
+var _createSet_INFINITY = 1 / 0;
+
+/**
+ * Creates a set object of `values`.
+ *
+ * @private
+ * @param {Array} values The values to add to the set.
+ * @returns {Object} Returns the new set.
+ */
+var createSet = !(_Set && (1 / _setToArray(new _Set([,-0]))[1]) == _createSet_INFINITY) ? lodash_es_noop : function(values) {
+  return new _Set(values);
+};
+
+/* harmony default export */ var _createSet = (createSet);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/_baseUniq.js
+
+
+
+
+
+
+
+/** Used as the size to enable large array optimizations. */
+var _baseUniq_LARGE_ARRAY_SIZE = 200;
+
+/**
+ * The base implementation of `_.uniqBy` without support for iteratee shorthands.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {Function} [iteratee] The iteratee invoked per element.
+ * @param {Function} [comparator] The comparator invoked per element.
+ * @returns {Array} Returns the new duplicate free array.
+ */
+function baseUniq(array, iteratee, comparator) {
+  var index = -1,
+      includes = _arrayIncludes,
+      length = array.length,
+      isCommon = true,
+      result = [],
+      seen = result;
+
+  if (comparator) {
+    isCommon = false;
+    includes = _arrayIncludesWith;
+  }
+  else if (length >= _baseUniq_LARGE_ARRAY_SIZE) {
+    var set = iteratee ? null : _createSet(array);
+    if (set) {
+      return _setToArray(set);
+    }
+    isCommon = false;
+    includes = _cacheHas;
+    seen = new _SetCache;
+  }
+  else {
+    seen = iteratee ? [] : result;
+  }
+  outer:
+  while (++index < length) {
+    var value = array[index],
+        computed = iteratee ? iteratee(value) : value;
+
+    value = (comparator || value !== 0) ? value : 0;
+    if (isCommon && computed === computed) {
+      var seenIndex = seen.length;
+      while (seenIndex--) {
+        if (seen[seenIndex] === computed) {
+          continue outer;
+        }
+      }
+      if (iteratee) {
+        seen.push(computed);
+      }
+      result.push(value);
+    }
+    else if (!includes(seen, computed, comparator)) {
+      if (seen !== result) {
+        seen.push(computed);
+      }
+      result.push(value);
+    }
+  }
+  return result;
+}
+
+/* harmony default export */ var _baseUniq = (baseUniq);
+
+// CONCATENATED MODULE: ./node_modules/lodash-es/uniqBy.js
+
+
+
+/**
+ * This method is like `_.uniq` except that it accepts `iteratee` which is
+ * invoked for each element in `array` to generate the criterion by which
+ * uniqueness is computed. The order of result values is determined by the
+ * order they occur in the array. The iteratee is invoked with one argument:
+ * (value).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Array
+ * @param {Array} array The array to inspect.
+ * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+ * @returns {Array} Returns the new duplicate free array.
+ * @example
+ *
+ * _.uniqBy([2.1, 1.2, 2.3], Math.floor);
+ * // => [2.1, 1.2]
+ *
+ * // The `_.property` iteratee shorthand.
+ * _.uniqBy([{ 'x': 1 }, { 'x': 2 }, { 'x': 1 }], 'x');
+ * // => [{ 'x': 1 }, { 'x': 2 }]
+ */
+function uniqBy(array, iteratee) {
+  return (array && array.length) ? _baseUniq(array, _baseIteratee(iteratee, 2)) : [];
+}
+
+/* harmony default export */ var lodash_es_uniqBy = (uniqBy);
+
 // CONCATENATED MODULE: ./src/components/grid/uses.js
 
 
@@ -28561,6 +30122,9 @@ const grid_optionButton_exports_ = /*#__PURE__*/exportHelper_default()(grid_opti
 
 
 
+
+
+
 
 
 
@@ -28569,6 +30133,7 @@ var uses_this = undefined;
 
 
 
+
 var ROW_INDEX = 0;
 var uses_ROW_CHECK_INDEX = 1;
 var uses_ROW_DATA_INDEX = 2;
@@ -28777,7 +30342,8 @@ var uses_resizeEvent = function resizeEvent(params) {
       stores = params.stores,
       isRenderer = params.isRenderer,
       updateVScroll = params.updateVScroll,
-      updateHScroll = params.updateHScroll;
+      updateHScroll = params.updateHScroll,
+      contextInfo = params.contextInfo;
   /**
    * 고정 너비, 스크롤 유무 등에 따른 컬럼 너비를 계산한다.
    */
@@ -28799,10 +30365,6 @@ var uses_resizeEvent = function resizeEvent(params) {
           return acc;
         }
 
-        if (cur.field === 'db-icon' || cur.field === 'user-icon') {
-          cur.width = resizeInfo.iconWidth;
-        }
-
         if (cur.width) {
           acc.totalWidth += cur.width;
         } else {
@@ -28811,7 +30373,7 @@ var uses_resizeEvent = function resizeEvent(params) {
 
         return acc;
       }, {
-        totalWidth: 0,
+        totalWidth: contextInfo.customContextMenu.length ? 30 : 0,
         emptyCount: 0
       });
 
@@ -29001,19 +30563,18 @@ var uses_clickEvent = function clickEvent(params) {
   var lastIndex = -1;
 
   var onRowClick = function onRowClick(event, row) {
-    var _event$target$parentE, _event$target$classLi;
+    var _event$target$parentE, _event$target$closest, _event$target$closest2;
 
-    if ((_event$target$parentE = event.target.parentElement.classList) !== null && _event$target$parentE !== void 0 && _event$target$parentE.contains('row-checkbox-input') || (_event$target$classLi = event.target.classList) !== null && _event$target$classLi !== void 0 && _event$target$classLi.contains('row-contextmenu__btn')) {
+    if ((_event$target$parentE = event.target.parentElement.classList) !== null && _event$target$parentE !== void 0 && _event$target$parentE.contains('row-checkbox-input') || (_event$target$closest = event.target.closest('td')) !== null && _event$target$closest !== void 0 && (_event$target$closest2 = _event$target$closest.classList) !== null && _event$target$closest2 !== void 0 && _event$target$closest2.contains('row-contextmenu')) {
       return false;
     }
 
     var onMultiSelectByKey = function onMultiSelectByKey(keyType, selected, selectedRow) {
       if (keyType === 'shift') {
-        // shift
         var rowIndex = row[ROW_INDEX];
 
         if (lastIndex > -1) {
-          var _loop = function _loop(i) {
+          for (var i = Math.min(rowIndex, lastIndex); i <= Math.max(rowIndex, lastIndex); i++) {
             if (!selected) {
               stores.originStore[i][uses_ROW_SELECT_INDEX] = true;
 
@@ -29022,21 +30583,20 @@ var uses_clickEvent = function clickEvent(params) {
               }
             } else {
               stores.originStore[i][uses_ROW_SELECT_INDEX] = false;
-              var deselectedIndex = selectInfo.selectedRow.findIndex(function (sr) {
-                return sr === stores.originStore[i][uses_ROW_DATA_INDEX];
-              });
-              selectInfo.selectedRow.splice(deselectedIndex, 1);
-            }
-          };
+              var deselectedIndex = selectInfo.selectedRow.indexOf(stores.originStore[i][uses_ROW_DATA_INDEX]);
 
-          for (var i = Math.min(rowIndex, lastIndex); i <= Math.max(rowIndex, lastIndex); i++) {
-            _loop(i);
+              if (deselectedIndex > -1) {
+                selectInfo.selectedRow.splice(deselectedIndex, 1);
+              }
+            }
           }
         }
-      } else if (selected) {
-        selectInfo.selectedRow.splice(selectInfo.selectedRow.indexOf(row[uses_ROW_DATA_INDEX]), 1);
-      } else {
-        selectInfo.selectedRow.push(selectedRow);
+      } else if (keyType === 'ctrl') {
+        if (!selected) {
+          selectInfo.selectedRow.push(selectedRow);
+        } else {
+          selectInfo.selectedRow.splice(selectInfo.selectedRow.indexOf(row[uses_ROW_DATA_INDEX]), 1);
+        }
       }
     };
 
@@ -29054,7 +30614,7 @@ var uses_clickEvent = function clickEvent(params) {
           keyType = 'ctrl';
         }
 
-        if (selectInfo.multiple) {
+        if (selectInfo.multiple && keyType) {
           // multi select
           onMultiSelectByKey(keyType, selected, rowData);
         } else if (selected) {
@@ -29366,6 +30926,9 @@ var uses_sortEvent = function sortEvent(params) {
   };
 };
 var uses_filterEvent = function filterEvent(params) {
+  var _getCurrentInstance5 = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["getCurrentInstance"])(),
+      props = _getCurrentInstance5.props;
+
   var columnSettingInfo = params.columnSettingInfo,
       filterInfo = params.filterInfo,
       stores = params.stores,
@@ -29374,7 +30937,169 @@ var uses_filterEvent = function filterEvent(params) {
       getConvertValue = params.getConvertValue,
       updateVScroll = params.updateVScroll,
       getPagingData = params.getPagingData,
-      updatePagingInfo = params.updatePagingInfo;
+      updatePagingInfo = params.updatePagingInfo,
+      getColumnIndex = params.getColumnIndex;
+  /**
+   * 전달받은 문자열 내 해당 키워드가 존재하는지 확인한다.
+   *
+   * @param {string} search - 검색 키워드
+   * @param {string} origin - 기준 문자열
+   * @returns {boolean} 문자열 내 키워드 존재 유무
+   */
+
+  var findLike = function findLike(search, origin, pos) {
+    if (typeof search !== 'string' || origin === null) {
+      return false;
+    }
+
+    var regx = search.replace(new RegExp('([\\.\\\\\\+\\*\\?\\[\\^\\]\\$\\(\\)\\{\\}\\=\\!\\<\\>\\|\\:\\-])', 'g'), '\\$1');
+    regx = regx.replace(/%/g, '.*').replace(/_/g, '.');
+    var regValue = "^".concat(regx, "$");
+
+    if (pos) {
+      if (pos === 'start') {
+        regValue = "^".concat(regx);
+      } else if (pos === 'end') {
+        regValue = "".concat(regx, "$");
+      }
+    }
+
+    return RegExp(regValue, 'gi').test(origin);
+  };
+  /**
+   * 필터 조건에 따라 문자열을 확인한다.
+   *
+   * @param {array} item - row 데이터
+   * @param {object} condition - 필터 정보
+   * @returns {boolean} 확인 결과
+   */
+
+
+  var stringFilter = function stringFilter(item, condition) {
+    var comparison = condition.comparison;
+    var conditionValue = condition.value;
+    var value = item[uses_ROW_DATA_INDEX][condition.index];
+    var result;
+
+    if (comparison === '=') {
+      result = value === conditionValue;
+    } else if (comparison === '!=') {
+      result = value !== conditionValue;
+    } else if (comparison === '%s%') {
+      result = findLike("%".concat(conditionValue, "%"), value);
+    } else if (comparison === 'notLike') {
+      result = !findLike("%".concat(conditionValue, "%"), value);
+    } else if (comparison === 's%') {
+      result = findLike("".concat(conditionValue), value, 'start');
+    } else if (comparison === '%s') {
+      result = findLike("".concat(conditionValue), value, 'end');
+    } else if (comparison === 'isEmpty') {
+      result = value === undefined || value === null || value === '';
+    } else if (comparison === 'isNotEmpty') {
+      result = !!value;
+    }
+
+    return result;
+  };
+  /**
+   * 필터 조건에 따라 숫자를 확인한다.
+   *
+   * @param {array} item - row 데이터
+   * @param {object} condition - 필터 정보
+   * @param {string} columnType - 데이터 유형
+   * @returns {boolean} 확인 결과
+   */
+
+
+  var numberFilter = function numberFilter(item, condition, columnType) {
+    var comparison = condition.comparison;
+    var conditionValue = Number(condition.value);
+    var value = Number(item[uses_ROW_DATA_INDEX][condition.index]);
+    var result;
+
+    if (columnType === 'float') {
+      value = Number(value.toFixed(3));
+    }
+
+    if (comparison === '=') {
+      result = value === conditionValue;
+    } else if (comparison === '>') {
+      result = value > conditionValue;
+    } else if (comparison === '<') {
+      result = value < conditionValue;
+    } else if (comparison === '<=') {
+      result = value <= conditionValue;
+    } else if (comparison === '>=') {
+      result = value >= conditionValue;
+    } else if (comparison === '!=') {
+      result = value !== conditionValue;
+    } else if (comparison === 'isEmpty') {
+      result = value === undefined || value === null;
+    } else if (comparison === 'isNotEmpty') {
+      result = !!value;
+    }
+
+    return result;
+  };
+  /**
+   * 필터 조건이 적용된 데이터를 반환한다.
+   *
+   * @param {array} data - row 데이터
+   * @param {string} columnType - 데이터 유형
+   * @param {object} condition - 필터 정보
+   * @returns {boolean} 확인 결과
+   */
+
+
+  var getFilteringData = function getFilteringData(data, columnType, condition) {
+    var filterFn = columnType === 'string' || columnType === 'stringNumber' ? stringFilter : numberFilter;
+    return data.filter(function (row) {
+      return filterFn(row, condition, columnType);
+    }) || [];
+  };
+  /**
+   * 전체 데이터에서 설정된 필터 적용 후 결과를 filterStore 에 저장한다.
+   */
+
+
+  var setFilter = function setFilter() {
+    var filterStore = [];
+    var isApply = false;
+    var filteringItemsByColumn = filterInfo.filteringItemsByColumn;
+    var fields = Object.keys(filteringItemsByColumn);
+    var originStore = stores.originStore;
+    fields.forEach(function (field) {
+      var filters = filteringItemsByColumn[field];
+      var index = getColumnIndex(field);
+      var columnType = props.columns[index].type;
+      filters.forEach(function (filterItem) {
+        isApply = true;
+
+        if (!filterStore.length) {
+          filterStore = getFilteringData(originStore, columnType, _objectSpread2(_objectSpread2({}, filterItem), {}, {
+            index: index
+          }));
+        } else if (filterItem.operator === 'or' || filterInfo.columnOperator === 'or') {
+          var _filterStore;
+
+          (_filterStore = filterStore).push.apply(_filterStore, _toConsumableArray(getFilteringData(originStore, columnType, _objectSpread2(_objectSpread2({}, filterItem), {}, {
+            index: index
+          }))));
+        } else {
+          filterStore = getFilteringData(filterStore, columnType, _objectSpread2(_objectSpread2({}, filterItem), {}, {
+            index: index
+          }));
+        }
+      });
+    });
+
+    if (!isApply) {
+      stores.filterStore = originStore;
+    } else {
+      stores.filterStore = lodash_es_uniqBy(filterStore, JSON.stringify);
+    }
+  };
+
   var timer = null;
 
   var onSearch = function onSearch(searchWord) {
@@ -29450,19 +31175,18 @@ var uses_filterEvent = function filterEvent(params) {
   };
 
   return {
-    onSearch: onSearch
+    onSearch: onSearch,
+    setFilter: setFilter
   };
 };
 var uses_contextMenuEvent = function contextMenuEvent(params) {
-  var _getCurrentInstance5 = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["getCurrentInstance"])(),
-      emit = _getCurrentInstance5.emit;
-
   var contextInfo = params.contextInfo,
       stores = params.stores,
       selectInfo = params.selectInfo,
       onSort = params.onSort,
       setColumnHidden = params.setColumnHidden,
-      useColumnSetting = params.useColumnSetting;
+      useColumnSetting = params.useColumnSetting,
+      filterInfo = params.filterInfo;
   /**
    * 컨텍스트 메뉴를 설정한다.
    *
@@ -29483,6 +31207,7 @@ var uses_contextMenuEvent = function contextMenuEvent(params) {
         }
 
         menuItem.selectedRow = row !== null && row !== void 0 ? row : [];
+        menuItem.contextmenuInfo = [selectInfo.contextmenuInfo];
         return menuItem;
       });
       menuItems.push.apply(menuItems, _toConsumableArray(customItems));
@@ -29508,6 +31233,18 @@ var uses_contextMenuEvent = function contextMenuEvent(params) {
         click: function click() {
           return onSort(column, 'desc');
         }
+      }, {
+        text: 'Filter',
+        iconClass: 'ev-icon-filter-list',
+        click: function click() {
+          filterInfo.filterSettingPosition = {
+            top: contextInfo.columnMenu.menuStyle.top,
+            left: contextInfo.columnMenu.menuStyle.left
+          };
+          filterInfo.isShowFilterSetting = true;
+          filterInfo.filteringColumn = column;
+        },
+        disabled: !filterInfo.isFiltering
       }, {
         text: 'Hide',
         iconClass: 'ev-icon-visibility-off',
@@ -29530,13 +31267,7 @@ var uses_contextMenuEvent = function contextMenuEvent(params) {
 
     var target = event.target;
     var rowIndex = (_target$closest = target.closest('.row')) === null || _target$closest === void 0 ? void 0 : (_target$closest$datas = _target$closest.dataset) === null || _target$closest$datas === void 0 ? void 0 : _target$closest$datas.index;
-
-    if (target.classList.contains('row-contextmenu__btn')) {
-      setContextMenu();
-      return;
-    }
-
-    var clickedRow;
+    var clickedRow = null;
 
     if (rowIndex) {
       var _stores$viewStore$fin;
@@ -29547,13 +31278,8 @@ var uses_contextMenuEvent = function contextMenuEvent(params) {
     }
 
     if (clickedRow) {
-      selectInfo.selectedRow = clickedRow;
+      selectInfo.contextmenuInfo = clickedRow;
       setContextMenu();
-      emit('update:selected', [clickedRow]);
-    } else {
-      selectInfo.selectedRow = [];
-      setContextMenu(false);
-      emit('update:selected', []);
     }
   };
 
@@ -29572,8 +31298,10 @@ var uses_storeEvent = function storeEvent(params) {
       stores = params.stores,
       sortInfo = params.sortInfo,
       elementInfo = params.elementInfo,
+      filterInfo = params.filterInfo,
       setSort = params.setSort,
-      updateVScroll = params.updateVScroll;
+      updateVScroll = params.updateVScroll,
+      setFilter = params.setFilter;
   /**
    * 전달된 데이터를 내부 store 및 속성에 저장한다.
    *
@@ -29607,6 +31335,10 @@ var uses_storeEvent = function storeEvent(params) {
       stores.originStore = store;
     }
 
+    if (filterInfo.isFiltering) {
+      setFilter();
+    }
+
     if (sortInfo.sortField) {
       setSort();
     }
@@ -29779,13 +31511,20 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
 
 
 
+
+
+
 /* harmony default export */ var Gridvue_type_script_lang_js = ({
   name: 'EvGrid',
+  directives: {
+    clickoutside: clickoutside
+  },
   components: {
     Toolbar: grid_toolbar,
     GridPagination: grid_pagination,
     GridSummary: grid_summary,
     ColumnSetting: grid_columnSetting,
+    filterSetting: grid_filterSetting,
     GridSortButton: grid_sortButton,
     GridOptionButton: grid_optionButton
   },
@@ -29894,7 +31633,20 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
     });
     var filterInfo = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["reactive"])({
       isSearch: false,
-      searchWord: ''
+      searchWord: '',
+      isFiltering: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+        var _props$option$useFilt;
+
+        return (_props$option$useFilt = props.option.useFilter) !== null && _props$option$useFilt !== void 0 ? _props$option$useFilt : false;
+      }),
+      isShowFilterSetting: false,
+      filterSettingPosition: {
+        left: 0,
+        top: 0
+      },
+      filteringColumn: null,
+      filteringItemsByColumn: {},
+      columnOperator: 'and'
     });
     var columnSettingInfo = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["reactive"])({
       isShowColumnSetting: false,
@@ -29908,8 +31660,11 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       viewStore: [],
       originStore: [],
       pagingStore: [],
+      searchStore: [],
+      filterStore: [],
       store: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
-        return filterInfo.isSearch ? stores.searchStore : stores.originStore;
+        var store = filterInfo.isFiltering ? stores.filterStore : stores.originStore;
+        return filterInfo.isSearch ? stores.searchStore : store;
       }),
       filteredColumns: [],
       originColumns: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
@@ -29988,6 +31743,7 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       hasHorizontalScrollBar: false
     });
     var selectInfo = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["reactive"])({
+      contextmenuInfo: props.contextmenuInfo,
       selectedRow: props.selected,
       useSelect: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
         var _props$option$useSele, _props$option3, _props$option3$useSel;
@@ -30109,9 +31865,11 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       getConvertValue: getConvertValue,
       updateVScroll: updateVScroll,
       getPagingData: getPagingData,
-      updatePagingInfo: updatePagingInfo
+      updatePagingInfo: updatePagingInfo,
+      getColumnIndex: getColumnIndex
     }),
-        onSearch = _filterEvent.onSearch;
+        onSearch = _filterEvent.onSearch,
+        setFilter = _filterEvent.setFilter;
 
     var _storeEvent = uses_storeEvent({
       selectInfo: selectInfo,
@@ -30119,8 +31877,10 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       stores: stores,
       sortInfo: sortInfo,
       elementInfo: elementInfo,
+      filterInfo: filterInfo,
       setSort: setSort,
-      updateVScroll: updateVScroll
+      updateVScroll: updateVScroll,
+      setFilter: setFilter
     }),
         setStore = _storeEvent.setStore;
 
@@ -30132,7 +31892,8 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       filterInfo: filterInfo,
       isRenderer: isRenderer,
       updateVScroll: updateVScroll,
-      updateHScroll: updateHScroll
+      updateHScroll: updateHScroll,
+      contextInfo: contextInfo
     }),
         calculatedColumn = _resizeEvent.calculatedColumn,
         onResize = _resizeEvent.onResize,
@@ -30156,16 +31917,21 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       selectInfo: selectInfo,
       onSort: onSort,
       setColumnHidden: setColumnHidden,
-      useColumnSetting: useColumnSetting
+      useColumnSetting: useColumnSetting,
+      filterInfo: filterInfo
     }),
         setContextMenu = _contextMenuEvent.setContextMenu,
         onContextMenu = _contextMenuEvent.onContextMenu,
         onColumnContextMenu = _contextMenuEvent.onColumnContextMenu;
 
     Object(external_commonjs_vue_commonjs2_vue_root_Vue_["provide"])('toolbarWrapper', toolbarWrapper);
+    var filteringItemsWidth = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(0);
     Object(external_commonjs_vue_commonjs2_vue_root_Vue_["onMounted"])(function () {
+      var _elementInfo$gridWra;
+
       calculatedColumn();
       setStore(props.rows);
+      filteringItemsWidth.value = ((_elementInfo$gridWra = elementInfo['grid-wrapper']) === null || _elementInfo$gridWra === void 0 ? void 0 : _elementInfo$gridWra.offsetWidth) / 1.5 || 0;
     });
     Object(external_commonjs_vue_commonjs2_vue_root_Vue_["onActivated"])(function () {
       onResize();
@@ -30175,7 +31941,10 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
     }, function () {
       sortInfo.isSorting = false;
       sortInfo.sortField = '';
-      setSort();
+      filterInfo.filteringColumn = null;
+      filterInfo.filteringItemsByColumn = {};
+      stores.filterStore = [];
+      setStore([], false);
       initColumnSettingInfo();
     }, {
       deep: true
@@ -30383,7 +32152,157 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
         }
       });
     });
-    return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
+    var filteringItemsBoxPosition = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["reactive"])({
+      boxTop: 0,
+      boxLeft: 0
+    });
+    var filteringItemsRef = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(null);
+    var isShowFilteringItemsBox = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(false);
+    var isShowColumnFilteringItems = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(false);
+    var selectedFilteringFiled = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])('');
+    var selectedFilteringItems = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])([]);
+    var operatorItems = [{
+      name: 'AND',
+      value: 'and'
+    }, {
+      name: 'OR',
+      value: 'or'
+    }];
+    var isExpandColumnFilteringItems = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(false);
+
+    var onClickFilteringItem = function onClickFilteringItem(field, filters) {
+      selectedFilteringFiled.value = field;
+      selectedFilteringItems.value = filters;
+
+      if ((filters === null || filters === void 0 ? void 0 : filters.length) > 1) {
+        // open filtering items box
+        isShowFilteringItemsBox.value = true;
+        var x = filteringItemsRef.value.getBoundingClientRect().left;
+        var y = filteringItemsRef.value.getBoundingClientRect().top + filteringItemsRef.value.getBoundingClientRect().height;
+        filteringItemsBoxPosition.boxTop = "".concat(y, "px");
+        filteringItemsBoxPosition.boxLeft = "".concat(x, "px");
+      }
+    };
+
+    var onChangeOperator = function onChangeOperator() {
+      stores.filterStore = [];
+      setStore([], false);
+    };
+
+    var setColumnFilteringItems = function setColumnFilteringItems() {
+      isExpandColumnFilteringItems.value = true;
+      var conditionItems = filteringItemsRef.value.getElementsByClassName('filtering-items__item');
+      var hasHiddenElement = false;
+
+      for (var i = 0; i < conditionItems.length; i++) {
+        var _filteringItemsRef$va;
+
+        var itemEl = conditionItems[i];
+        itemEl.classList.remove('non-display');
+        var filteringBoxTop = (_filteringItemsRef$va = filteringItemsRef.value.getBoundingClientRect()) === null || _filteringItemsRef$va === void 0 ? void 0 : _filteringItemsRef$va.top;
+
+        var _itemEl$getBoundingCl = itemEl.getBoundingClientRect(),
+            top = _itemEl$getBoundingCl.top; // rect height: 27
+
+
+        if (isShowColumnFilteringItems.value && top - filteringBoxTop > 27) {
+          isExpandColumnFilteringItems.value = false;
+          hasHiddenElement = true;
+        }
+
+        itemEl.classList.toggle('non-display', hasHiddenElement);
+      }
+    };
+
+    var onApplyFilter = /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(field, list) {
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                if (list !== null && list !== void 0 && list.length) {
+                  _context2.next = 4;
+                  break;
+                }
+
+                delete filterInfo.filteringItemsByColumn[field];
+                _context2.next = 9;
+                break;
+
+              case 4:
+                filterInfo.filteringItemsByColumn[field] = list;
+                isShowColumnFilteringItems.value = true;
+                _context2.next = 8;
+                return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["nextTick"])();
+
+              case 8:
+                setColumnFilteringItems();
+
+              case 9:
+                filterInfo.isShowFilterSetting = false; // filter setting close
+
+                stores.filterStore = [];
+                setStore([], false);
+
+              case 12:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee2);
+      }));
+
+      return function onApplyFilter(_x2, _x3) {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+
+    var onExpandFilteringItems = function onExpandFilteringItems() {
+      isShowColumnFilteringItems.value = !isShowColumnFilteringItems.value;
+      setColumnFilteringItems();
+    };
+
+    var removeColumnFiltering = function removeColumnFiltering(field) {
+      delete filterInfo.filteringItemsByColumn[field];
+      stores.filterStore = [];
+      setStore([], false);
+    };
+
+    var removeFiltering = function removeFiltering(_ref3) {
+      var field = _ref3.field,
+          idx = _ref3.idx;
+      filterInfo.filteringItemsByColumn[field].splice(idx, 1);
+
+      if (!filterInfo.filteringItemsByColumn[field].length) {
+        delete filterInfo.filteringItemsByColumn[field];
+      }
+
+      stores.filterStore = [];
+      setStore([], false);
+    };
+
+    var removeAllFiltering = function removeAllFiltering() {
+      filterInfo.filteringColumn = null;
+      filterInfo.filteringItemsByColumn = {};
+      stores.filterStore = [];
+      setStore([], false);
+    };
+
+    var initWrapperDiv = function initWrapperDiv() {
+      var root = document.createElement('div');
+      root.id = 'ev-grid-filtering-items-modal';
+      root.setAttribute('style', 'position: absolute; top: 0; left: 0;');
+      var hasRoot = document.getElementById('ev-grid-filtering-items-modal');
+
+      if (!hasRoot) {
+        document.body.appendChild(root);
+      }
+    };
+
+    Object(external_commonjs_vue_commonjs2_vue_root_Vue_["onBeforeMount"])(function () {
+      return initWrapperDiv();
+    });
+    return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
       summaryScroll: summaryScroll,
       showHeader: showHeader,
       stripeStyle: stripeStyle,
@@ -30418,14 +32337,32 @@ var uses_columnSettingEvent = function columnSettingEvent(params) {
       onSearch: onSearch,
       setColumnSetting: setColumnSetting,
       onApplyColumn: onApplyColumn,
-      onColumnContextMenu: onColumnContextMenu
+      onColumnContextMenu: onColumnContextMenu,
+      // filtering
+      filteringItemsWidth: filteringItemsWidth,
+      isExpandColumnFilteringItems: isExpandColumnFilteringItems,
+      isShowColumnFilteringItems: isShowColumnFilteringItems,
+      operatorItems: operatorItems,
+      selectedFilteringItems: selectedFilteringItems,
+      selectedFilteringFiled: selectedFilteringFiled,
+      filteringItemsRef: filteringItemsRef,
+      isShowFilteringItemsBox: isShowFilteringItemsBox
+    }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toRefs"])(filteringItemsBoxPosition)), {}, {
+      removeFiltering: removeFiltering,
+      removeColumnFiltering: removeColumnFiltering,
+      removeAllFiltering: removeAllFiltering,
+      onExpandFilteringItems: onExpandFilteringItems,
+      setColumnFilteringItems: setColumnFilteringItems,
+      onChangeOperator: onChangeOperator,
+      onApplyFilter: onApplyFilter,
+      onClickFilteringItem: onClickFilteringItem
     });
   }
 });
 // CONCATENATED MODULE: ./src/components/grid/Grid.vue?vue&type=script&lang=js
  
-// EXTERNAL MODULE: ./src/components/grid/Grid.vue?vue&type=style&index=0&id=948a1734&lang=scss&scoped=true
-var Gridvue_type_style_index_0_id_948a1734_lang_scss_scoped_true = __webpack_require__("b2ca");
+// EXTERNAL MODULE: ./src/components/grid/Grid.vue?vue&type=style&index=0&id=5cdcf102&lang=scss&scoped=true
+var Gridvue_type_style_index_0_id_5cdcf102_lang_scss_scoped_true = __webpack_require__("50d0");
 
 // CONCATENATED MODULE: ./src/components/grid/Grid.vue
 
@@ -30435,7 +32372,7 @@ var Gridvue_type_style_index_0_id_948a1734_lang_scss_scoped_true = __webpack_req
 
 
 
-const Grid_exports_ = /*#__PURE__*/exportHelper_default()(Gridvue_type_script_lang_js, [['render',Gridvue_type_template_id_948a1734_scoped_true_render],['__scopeId',"data-v-948a1734"]])
+const Grid_exports_ = /*#__PURE__*/exportHelper_default()(Gridvue_type_script_lang_js, [['render',Gridvue_type_template_id_5cdcf102_scoped_true_render],['__scopeId',"data-v-5cdcf102"]])
 
 /* harmony default export */ var Grid = (Grid_exports_);
 // CONCATENATED MODULE: ./src/components/grid/index.js
@@ -33779,29 +35716,6 @@ function apply(func, thisArg, args) {
 
 /* harmony default export */ var _apply = (apply);
 
-// CONCATENATED MODULE: ./node_modules/lodash-es/identity.js
-/**
- * This method returns the first argument it receives.
- *
- * @static
- * @since 0.1.0
- * @memberOf _
- * @category Util
- * @param {*} value Any value.
- * @returns {*} Returns `value`.
- * @example
- *
- * var object = { 'a': 1 };
- *
- * console.log(_.identity(object) === object);
- * // => true
- */
-function identity(value) {
-  return value;
-}
-
-/* harmony default export */ var lodash_es_identity = (identity);
-
 // CONCATENATED MODULE: ./node_modules/lodash-es/_overRest.js
 
 
@@ -34629,10 +36543,6 @@ var AXIS_OPTION = {
     }
   }
 };
-var PLOT_LINE_OPTION = {
-  color: '#FF0000',
-  lineWidth: 1
-};
 var PLOT_LINE_LABEL_OPTION = {
   show: false,
   fontSize: 12,
@@ -34648,6 +36558,11 @@ var PLOT_LINE_LABEL_OPTION = {
   // 'none', 'ellipsis'
   maxWidth: null
 };
+var PLOT_LINE_OPTION = {
+  color: '#FF0000',
+  lineWidth: 1,
+  label: PLOT_LINE_LABEL_OPTION
+};
 var PLOT_BAND_OPTION = {
   color: '#FAE59D'
 };
@@ -37929,7 +39844,7 @@ var model_series_modules = {
 
 
 var scale_Scale = /*#__PURE__*/function () {
-  function Scale(type, axisOpt, ctx, options) {
+  function Scale(type, axisOpt, ctx, labels, options) {
     var _this = this;
 
     _classCallCheck(this, Scale);
@@ -37941,6 +39856,7 @@ var scale_Scale = /*#__PURE__*/function () {
     this.type = type;
     this.ctx = ctx;
     this.units = AXIS_UNITS[this.type];
+    this.labels = labels;
     this.options = options;
 
     if (!this.position) {
@@ -38203,92 +40119,109 @@ var scale_Scale = /*#__PURE__*/function () {
       }
 
       if ((_this$labelStyle = this.labelStyle) !== null && _this$labelStyle !== void 0 && _this$labelStyle.show) {
-        var labelGap = (endPoint - startPoint) / steps;
+        var distance = endPoint - startPoint;
+        var labelGap = distance / steps;
         var ticks = [];
+        var size = stepInfo.interval;
         var labelCenter = null;
         var linePosition = null;
+        var offsetStartPoint = startPoint;
+        var axisMinForLabel = axisMin;
+
+        if (this.type === 'x' && options !== null && options !== void 0 && options.axesX[0].flow && this.labels.length !== steps + 1) {
+          var axisMinByMinutes = Math.floor(axisMin / size) * size;
+
+          if (axisMinByMinutes !== +axisMin) {
+            axisMinForLabel = axisMinByMinutes + size;
+            offsetStartPoint += distance / (axisMax - axisMin) * (axisMinForLabel - axisMin);
+          }
+        }
+
         ctx.strokeStyle = this.gridLineColor;
         ctx.lineWidth = 1;
         aliasPixel = helpers_util.aliasPixel(ctx.lineWidth);
         var labelText;
 
         for (var ix = 0; ix <= steps; ix++) {
-          var _this$options, _this$options$selectL, _this$options2, _this$options2$select, _selectLabelInfo$data;
-
-          ctx.beginPath();
-          ticks[ix] = axisMin + ix * stepValue;
-          labelCenter = Math.round(startPoint + labelGap * ix);
-          linePosition = labelCenter + aliasPixel;
-          labelText = this.getLabelFormat(Math.min(axisMax, ticks[ix]));
-          var isBlurredLabel = ((_this$options = this.options) === null || _this$options === void 0 ? void 0 : (_this$options$selectL = _this$options.selectLabel) === null || _this$options$selectL === void 0 ? void 0 : _this$options$selectL.use) && ((_this$options2 = this.options) === null || _this$options2 === void 0 ? void 0 : (_this$options2$select = _this$options2.selectLabel) === null || _this$options2$select === void 0 ? void 0 : _this$options2$select.useLabelOpacity) && this.options.horizontal === (this.type === 'y') && (selectLabelInfo === null || selectLabelInfo === void 0 ? void 0 : (_selectLabelInfo$data = selectLabelInfo.dataIndex) === null || _selectLabelInfo$data === void 0 ? void 0 : _selectLabelInfo$data.length) && !(selectLabelInfo !== null && selectLabelInfo !== void 0 && selectLabelInfo.label.map(function (t) {
-            return _this2.getLabelFormat(Math.min(axisMax, t));
-          }).includes(labelText));
-          var labelColor = this.labelStyle.color;
-          var defaultOpacity = 1;
-
-          if (helpers_util.getColorStringType(labelColor) === 'RGBA') {
-            defaultOpacity = helpers_util.getOpacity(labelColor);
-          }
-
-          ctx.fillStyle = helpers_util.colorStringToRgba(labelColor, isBlurredLabel ? 0.1 : defaultOpacity);
-          var labelPoint = void 0;
+          labelCenter = Math.round(offsetStartPoint + labelGap * ix);
+
+          if (labelCenter <= endPoint || this.type !== 'x' || !(options !== null && options !== void 0 && options.axesX[0].flow) || this.labels.length === steps + 1) {
+            var _this$options, _this$options$selectL, _this$options2, _this$options2$select, _selectLabelInfo$data;
+
+            ctx.beginPath();
+            ticks[ix] = axisMinForLabel + ix * stepValue;
+            linePosition = labelCenter + aliasPixel;
+            labelText = this.getLabelFormat(Math.min(axisMax, ticks[ix]));
+            var isBlurredLabel = ((_this$options = this.options) === null || _this$options === void 0 ? void 0 : (_this$options$selectL = _this$options.selectLabel) === null || _this$options$selectL === void 0 ? void 0 : _this$options$selectL.use) && ((_this$options2 = this.options) === null || _this$options2 === void 0 ? void 0 : (_this$options2$select = _this$options2.selectLabel) === null || _this$options2$select === void 0 ? void 0 : _this$options2$select.useLabelOpacity) && this.options.horizontal === (this.type === 'y') && (selectLabelInfo === null || selectLabelInfo === void 0 ? void 0 : (_selectLabelInfo$data = selectLabelInfo.dataIndex) === null || _selectLabelInfo$data === void 0 ? void 0 : _selectLabelInfo$data.length) && !(selectLabelInfo !== null && selectLabelInfo !== void 0 && selectLabelInfo.label.map(function (t) {
+              return _this2.getLabelFormat(Math.min(axisMax, t));
+            }).includes(labelText));
+            var labelColor = this.labelStyle.color;
+            var defaultOpacity = 1;
+
+            if (helpers_util.getColorStringType(labelColor) === 'RGBA') {
+              defaultOpacity = helpers_util.getOpacity(labelColor);
+            }
 
-          if (this.type === 'x') {
-            var _options$brush, _options$selectItem, _this$options3;
+            ctx.fillStyle = helpers_util.colorStringToRgba(labelColor, isBlurredLabel ? 0.1 : defaultOpacity);
+            var labelPoint = void 0;
 
-            labelPoint = this.position === 'top' ? offsetPoint - 10 : offsetPoint + 10;
+            if (this.type === 'x') {
+              var _options$brush, _options$selectItem, _this$options3;
 
-            if (options !== null && options !== void 0 && (_options$brush = options.brush) !== null && _options$brush !== void 0 && _options$brush.showLabel || !(options !== null && options !== void 0 && options.brush)) {
-              ctx.fillText(labelText, labelCenter, labelPoint);
-            }
+              labelPoint = this.position === 'top' ? offsetPoint - 10 : offsetPoint + 10;
 
-            if (!isBlurredLabel && options !== null && options !== void 0 && (_options$selectItem = options.selectItem) !== null && _options$selectItem !== void 0 && _options$selectItem.showLabelTip && hitInfo !== null && hitInfo !== void 0 && hitInfo.label && !((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.horizontal)) {
-              var selectedLabel = this.getLabelFormat(Math.min(axisMax, hitInfo.label + 0 * stepValue));
+              if (options !== null && options !== void 0 && (_options$brush = options.brush) !== null && _options$brush !== void 0 && _options$brush.showLabel || !(options !== null && options !== void 0 && options.brush)) {
+                ctx.fillText(labelText, labelCenter, labelPoint);
+              }
 
-              if (selectedLabel === labelText) {
-                var _this$labelStyle2, _options$selectItem2, _options$selectItem2$, _options$selectItem3, _options$selectItem3$;
+              if (!isBlurredLabel && options !== null && options !== void 0 && (_options$selectItem = options.selectItem) !== null && _options$selectItem !== void 0 && _options$selectItem.showLabelTip && hitInfo !== null && hitInfo !== void 0 && hitInfo.label && !((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.horizontal)) {
+                var selectedLabel = this.getLabelFormat(Math.min(axisMax, hitInfo.label + 0 * stepValue));
+
+                if (selectedLabel === labelText) {
+                  var _this$labelStyle2, _options$selectItem2, _options$selectItem2$, _options$selectItem3, _options$selectItem3$;
+
+                  var height = Math.round(ctx.measureText((_this$labelStyle2 = this.labelStyle) === null || _this$labelStyle2 === void 0 ? void 0 : _this$labelStyle2.fontSize).width);
+                  helpers_util.showLabelTip({
+                    ctx: this.ctx,
+                    width: Math.round(ctx.measureText(selectedLabel).width) + 10,
+                    height: height,
+                    x: labelCenter,
+                    y: labelPoint + (height - 2),
+                    borderRadius: 2,
+                    arrowSize: 3,
+                    text: labelText,
+                    backgroundColor: options === null || options === void 0 ? void 0 : (_options$selectItem2 = options.selectItem) === null || _options$selectItem2 === void 0 ? void 0 : (_options$selectItem2$ = _options$selectItem2.labelTipStyle) === null || _options$selectItem2$ === void 0 ? void 0 : _options$selectItem2$.backgroundColor,
+                    textColor: options === null || options === void 0 ? void 0 : (_options$selectItem3 = options.selectItem) === null || _options$selectItem3 === void 0 ? void 0 : (_options$selectItem3$ = _options$selectItem3.labelTipStyle) === null || _options$selectItem3$ === void 0 ? void 0 : _options$selectItem3$.textColor
+                  });
+                }
+              }
 
-                var height = Math.round(ctx.measureText((_this$labelStyle2 = this.labelStyle) === null || _this$labelStyle2 === void 0 ? void 0 : _this$labelStyle2.fontSize).width);
-                helpers_util.showLabelTip({
-                  ctx: this.ctx,
-                  width: Math.round(ctx.measureText(selectedLabel).width) + 10,
-                  height: height,
-                  x: labelCenter,
-                  y: labelPoint + (height - 2),
-                  borderRadius: 2,
-                  arrowSize: 3,
-                  text: labelText,
-                  backgroundColor: options === null || options === void 0 ? void 0 : (_options$selectItem2 = options.selectItem) === null || _options$selectItem2 === void 0 ? void 0 : (_options$selectItem2$ = _options$selectItem2.labelTipStyle) === null || _options$selectItem2$ === void 0 ? void 0 : _options$selectItem2$.backgroundColor,
-                  textColor: options === null || options === void 0 ? void 0 : (_options$selectItem3 = options.selectItem) === null || _options$selectItem3 === void 0 ? void 0 : (_options$selectItem3$ = _options$selectItem3.labelTipStyle) === null || _options$selectItem3$ === void 0 ? void 0 : _options$selectItem3$.textColor
-                });
+              if ((ix !== 0 || options !== null && options !== void 0 && options.axesX[0].flow) && this.showGrid) {
+                ctx.moveTo(linePosition, offsetPoint);
+                ctx.lineTo(linePosition, offsetCounterPoint);
               }
-            }
+            } else {
+              var _options$brush2;
 
-            if (ix !== 0 && this.showGrid) {
-              ctx.moveTo(linePosition, offsetPoint);
-              ctx.lineTo(linePosition, offsetCounterPoint);
-            }
-          } else {
-            var _options$brush2;
+              labelPoint = this.position === 'left' ? offsetPoint - 10 : offsetPoint + 10;
 
-            labelPoint = this.position === 'left' ? offsetPoint - 10 : offsetPoint + 10;
+              if (options !== null && options !== void 0 && (_options$brush2 = options.brush) !== null && _options$brush2 !== void 0 && _options$brush2.showLabel || !(options !== null && options !== void 0 && options.brush)) {
+                ctx.fillText(labelText, labelPoint, labelCenter);
+              }
 
-            if (options !== null && options !== void 0 && (_options$brush2 = options.brush) !== null && _options$brush2 !== void 0 && _options$brush2.showLabel || !(options !== null && options !== void 0 && options.brush)) {
-              ctx.fillText(labelText, labelPoint, labelCenter);
-            }
+              if (ix === steps) {
+                linePosition -= 1;
+              }
 
-            if (ix === steps) {
-              linePosition -= 1;
+              if (ix !== 0 && this.showGrid) {
+                ctx.moveTo(offsetPoint, linePosition);
+                ctx.lineTo(offsetCounterPoint, linePosition);
+              }
             }
 
-            if (ix !== 0 && this.showGrid) {
-              ctx.moveTo(offsetPoint, linePosition);
-              ctx.lineTo(offsetCounterPoint, linePosition);
-            }
+            ctx.stroke();
+            ctx.closePath();
           }
-
-          ctx.stroke();
-          ctx.closePath();
         }
       } // Draw plot lines and plot bands
 
@@ -38470,7 +40403,7 @@ var scale_Scale = /*#__PURE__*/function () {
     }
     /**
      * Draw X Plot line
-     * @param {object} dataX         Data's X Position
+     * @param {number} dataX         Data's X Position
      * @param {number} minX          Min X Position
      * @param {number} maxX          Max X Position
      * @param {number} minY          Min Y Position
@@ -38490,15 +40423,17 @@ var scale_Scale = /*#__PURE__*/function () {
         return;
       }
 
-      ctx.moveTo(dataX, maxY);
-      ctx.lineTo(dataX, minY);
+      var dataXPos = dataX;
+      dataXPos += helpers_util.aliasPixel(ctx.lineWidth);
+      ctx.moveTo(dataXPos, maxY);
+      ctx.lineTo(dataXPos, minY);
       ctx.stroke();
       ctx.restore();
       ctx.closePath();
     }
     /**
      * Draw Y Plot line
-     * @param {object} dataY         Data's Y Position
+     * @param {number} dataY         Data's Y Position
      * @param {number} minX          Min X Position
      * @param {number} maxX          Max X Position
      * @param {number} minY          Min Y Position
@@ -38518,8 +40453,10 @@ var scale_Scale = /*#__PURE__*/function () {
         return;
       }
 
-      ctx.moveTo(minX, dataY);
-      ctx.lineTo(maxX, dataY);
+      var dataYPos = dataY;
+      dataYPos += helpers_util.aliasPixel(ctx.lineWidth);
+      ctx.moveTo(minX, dataYPos);
+      ctx.lineTo(maxX, dataYPos);
       ctx.stroke();
       ctx.restore();
       ctx.closePath();
@@ -39120,27 +41057,23 @@ var scale_step_StepScale = /*#__PURE__*/function (_Scale) {
 
   var _super = _createSuper(StepScale);
 
-  function StepScale(type, axisOpt, ctx, labels, options) {
-    var _this;
-
+  function StepScale() {
     _classCallCheck(this, StepScale);
 
-    _this = _super.call(this, type, axisOpt, ctx, options);
-    _this.labels = labels;
-    return _this;
+    return _super.apply(this, arguments);
   }
-  /**
-   * Calculate min/max value, label and size information for step scale
-   * @param {object} minMax       min/max information (unused on step scale)
-   * @param {object} scrollbarOpt    scroll bar option
-   * @param {object} chartRect    chart size information
-   *
-   * @returns {object} min/max value and label
-   */
-
 
   _createClass(StepScale, [{
     key: "calculateScaleRange",
+
+    /**
+     * Calculate min/max value, label and size information for step scale
+     * @param {object} minMax       min/max information (unused on step scale)
+     * @param {object} scrollbarOpt    scroll bar option
+     * @param {object} chartRect    chart size information
+     *
+     * @returns {object} min/max value and label
+     */
     value: function calculateScaleRange(minMax, scrollbarOpt, chartRect) {
       var stepMinMax = this.labelStyle.alignToGridLine ? minMax : helpers_util.getStringMinMax(this.labels);
       var maxValue = stepMinMax.max;
@@ -39237,7 +41170,7 @@ var scale_step_StepScale = /*#__PURE__*/function (_Scale) {
       var _this$labelStyle,
           _this$plotBands,
           _this$plotLines,
-          _this2 = this;
+          _this = this;
 
       var ctx = this.ctx;
       var labels = this.labels;
@@ -39432,20 +41365,20 @@ var scale_step_StepScale = /*#__PURE__*/function (_Scale) {
           var fromPos = Math.round(startPoint + _labelGap * from);
           var toPos = Math.round(startPoint + _labelGap * to);
 
-          _this2.setPlotBandStyle(mergedPlotBandOpt);
+          _this.setPlotBandStyle(mergedPlotBandOpt);
 
-          if (_this2.type === 'x') {
-            _this2.drawXPlotBand(fromPos, toPos, minX, maxX, minY, maxY);
+          if (_this.type === 'x') {
+            _this.drawXPlotBand(fromPos, toPos, minX, maxX, minY, maxY);
           } else {
-            _this2.drawYPlotBand(fromPos, toPos, minX, maxX, minY, maxY);
+            _this.drawYPlotBand(fromPos, toPos, minX, maxX, minY, maxY);
           }
 
           if (labelOpt.show) {
-            var labelOptions = _this2.getNormalizedLabelOptions(chartRect, labelOpt);
+            var labelOptions = _this.getNormalizedLabelOptions(chartRect, labelOpt);
 
-            var textXY = _this2.getPlotBandLabelPosition(fromPos, toPos, labelOptions, maxX, minY);
+            var textXY = _this.getPlotBandLabelPosition(fromPos, toPos, labelOptions, maxX, minY);
 
-            _this2.drawPlotLabel(labelOptions, textXY);
+            _this.drawPlotLabel(labelOptions, textXY);
           }
 
           ctx.restore();
@@ -39461,20 +41394,20 @@ var scale_step_StepScale = /*#__PURE__*/function (_Scale) {
 
           var dataPos = Math.round(startPoint + _labelGap * value) + _labelGap / 2;
 
-          _this2.setPlotLineStyle(mergedPlotLineOpt);
+          _this.setPlotLineStyle(mergedPlotLineOpt);
 
-          if (_this2.type === 'x') {
-            _this2.drawXPlotLine(dataPos, minX, maxX, minY, maxY);
+          if (_this.type === 'x') {
+            _this.drawXPlotLine(dataPos, minX, maxX, minY, maxY);
           } else {
-            _this2.drawYPlotLine(dataPos, minX, maxX, minY, maxY);
+            _this.drawYPlotLine(dataPos, minX, maxX, minY, maxY);
           }
 
           if (labelOpt.show) {
-            var labelOptions = _this2.getNormalizedLabelOptions(chartRect, labelOpt);
+            var labelOptions = _this.getNormalizedLabelOptions(chartRect, labelOpt);
 
-            var textXY = _this2.getPlotLineLabelPosition(dataPos, labelOptions, maxX, minY);
+            var textXY = _this.getPlotLineLabelPosition(dataPos, labelOptions, maxX, minY);
 
-            _this2.drawPlotLabel(labelOptions, textXY);
+            _this.drawPlotLabel(labelOptions, textXY);
           }
 
           ctx.restore();
@@ -39544,26 +41477,21 @@ var scale_time_category_TimeCategoryScale = /*#__PURE__*/function (_Scale) {
 
   var _super = _createSuper(TimeCategoryScale);
 
-  function TimeCategoryScale(type, axisOpt, ctx, labels, options) {
-    var _this;
-
+  function TimeCategoryScale() {
     _classCallCheck(this, TimeCategoryScale);
 
-    _this = _super.call(this, type, axisOpt, ctx);
-    _this.labels = labels;
-    _this.options = options;
-    return _this;
+    return _super.apply(this, arguments);
   }
-  /**
-   * Transforming label by designated format
-   * @param {number} value       label value
-   *
-   * @returns {string} formatted label
-   */
-
 
   _createClass(TimeCategoryScale, [{
     key: "getLabelFormat",
+
+    /**
+     * Transforming label by designated format
+     * @param {number} value       label value
+     *
+     * @returns {string} formatted label
+     */
     value: function getLabelFormat(value) {
       if (this.formatter) {
         var formattedLabel = this.formatter(value);
@@ -39665,7 +41593,7 @@ var scale_time_category_TimeCategoryScale = /*#__PURE__*/function (_Scale) {
   }, {
     key: "draw",
     value: function draw(chartRect, labelOffset, stepInfo, hitInfo, selectLabelInfo) {
-      var _this2 = this;
+      var _this = this;
 
       var ctx = this.ctx;
       var labels = this.labels;
@@ -39742,7 +41670,7 @@ var scale_time_category_TimeCategoryScale = /*#__PURE__*/function (_Scale) {
         linePosition = labelCenter + aliasPixel;
         labelText = this.getLabelFormat(Math.min(axisMax, ticks[ix]));
         var isBlurredLabel = ((_this$options = this.options) === null || _this$options === void 0 ? void 0 : (_this$options$selectL = _this$options.selectLabel) === null || _this$options$selectL === void 0 ? void 0 : _this$options$selectL.use) && ((_this$options2 = this.options) === null || _this$options2 === void 0 ? void 0 : (_this$options2$select = _this$options2.selectLabel) === null || _this$options2$select === void 0 ? void 0 : _this$options2$select.useLabelOpacity) && this.options.horizontal === (this.type === 'y') && (selectLabelInfo === null || selectLabelInfo === void 0 ? void 0 : (_selectLabelInfo$data = selectLabelInfo.dataIndex) === null || _selectLabelInfo$data === void 0 ? void 0 : _selectLabelInfo$data.length) && !(selectLabelInfo !== null && selectLabelInfo !== void 0 && selectLabelInfo.label.map(function (t) {
-          return _this2.getLabelFormat(Math.min(axisMax, t));
+          return _this.getLabelFormat(Math.min(axisMax, t));
         }).includes(labelText));
         var labelColor = this.labelStyle.color;
         var defaultOpacity = 1;
@@ -42551,7 +44479,7 @@ function baseInRange(number, start, end) {
 
 
 /** Used as references for various `Number` constants. */
-var INFINITY = 1 / 0,
+var toFinite_INFINITY = 1 / 0,
     MAX_INTEGER = 1.7976931348623157e+308;
 
 /**
@@ -42582,7 +44510,7 @@ function toFinite(value) {
     return value === 0 ? value : 0;
   }
   value = lodash_es_toNumber(value);
-  if (value === INFINITY || value === -INFINITY) {
+  if (value === toFinite_INFINITY || value === -toFinite_INFINITY) {
     var sign = (value < 0 ? -1 : 1);
     return sign * MAX_INTEGER;
   }
@@ -42687,7 +44615,7 @@ var plugins_interaction_modules = {
     this.onMouseMove = function (e) {
       var _this$dragInfo;
 
-      if ((_this$dragInfo = _this.dragInfo) !== null && _this$dragInfo !== void 0 && _this$dragInfo.isMove) {
+      if ((_this$dragInfo = _this.dragInfo) !== null && _this$dragInfo !== void 0 && _this$dragInfo.isMove || _this.isMobile) {
         return;
       }
 
@@ -42971,10 +44899,53 @@ var plugins_interaction_modules = {
           }
 
         case 'pie':
+          {
+            if (useSelectItem) {
+              setSelectedItemInfo();
+            }
+
+            break;
+          }
+
         case 'scatter':
           {
+            var _this$options$dragSel;
+
             if (useSelectItem) {
               setSelectedItemInfo();
+            } // 모바일용 dragSelection
+
+
+            if ((_this$options$dragSel = _this.options.dragSelection) !== null && _this$options$dragSel !== void 0 && _this$options$dragSel.use && _this.isMobile) {
+              var touchInfo = _this.setTouchInfo(e);
+
+              _this.overlayClear();
+
+              if (_this.options.dragSelection.keepDisplay && (e.layerX < touchInfo.range.x1 || e.layerY < touchInfo.range.y1 || e.layerX > touchInfo.range.x2 || e.layerY > touchInfo.range.y2)) {
+                _this.isTouchOverlay = false;
+              } else {
+                touchInfo = _this.setTouchBoxDimensions(touchInfo);
+                _this.isTouchOverlay = true;
+
+                _this.drawSelectionArea(touchInfo);
+              }
+
+              if (!_this.options.dragSelection.keepDisplay) {
+                setTimeout(function () {
+                  _this.isTouchOverlay = false;
+
+                  _this.overlayClear();
+                }, 100);
+              }
+
+              args.e = e;
+              args.touchInfo = touchInfo;
+              args.data = _this.findSelectedItems(touchInfo);
+              args.range = _this.getSelectionRange(touchInfo);
+
+              if (typeof _this.listeners['drag-select'] === 'function') {
+                _this.listeners['drag-select'](args);
+              }
             }
 
             break;
@@ -43026,6 +44997,12 @@ var plugins_interaction_modules = {
     this.overlayCanvas.addEventListener('dblclick', this.onDblClick);
     this.overlayCanvas.addEventListener('click', this.onClick);
     this.overlayCanvas.addEventListener('mousedown', this.onMouseDown);
+
+    this.dragTouchSelectionEvent = function (e) {
+      return _this.dragTouchSelectionDestroy(e);
+    };
+
+    window.addEventListener('click', this.dragTouchSelectionEvent);
   },
 
   /**
@@ -43204,9 +45181,9 @@ var plugins_interaction_modules = {
         width = _ref.width,
         height = _ref.height;
     var ctx = this.overlayCtx;
-    var _this$options$dragSel = this.options.dragSelection,
-        fillColor = _this$options$dragSel.fillColor,
-        opacity = _this$options$dragSel.opacity;
+    var _this$options$dragSel2 = this.options.dragSelection,
+        fillColor = _this$options$dragSel2.fillColor,
+        opacity = _this$options$dragSel2.opacity;
     ctx.fillStyle = fillColor;
     ctx.globalAlpha = opacity;
     ctx.fillRect(xsp, ysp, width, height);
@@ -43296,6 +45273,104 @@ var plugins_interaction_modules = {
     return curMouseTargetVal;
   },
 
+  /**
+   * Processes touch event to determine touch position within the chart.
+   *
+   * @param {TouchEvent} event - the touch event to process
+   * @returns {object} - the processed touch information
+   */
+  setTouchInfo: function setTouchInfo(event) {
+    var _this$getMousePositio3 = this.getMousePosition(event),
+        _this$getMousePositio4 = _slicedToArray(_this$getMousePositio3, 2),
+        offsetX = _this$getMousePositio4[0],
+        offsetY = _this$getMousePositio4[1];
+
+    var chartRect = this.chartRect;
+    var labelOffset = this.labelOffset;
+    var range = {
+      x1: chartRect.x1 + labelOffset.left,
+      x2: chartRect.x2 - labelOffset.right,
+      y1: chartRect.y1 + labelOffset.top,
+      y2: chartRect.y2 - labelOffset.bottom
+    };
+    offsetX = Math.max(range.x1, Math.min(offsetX, range.x2));
+    offsetY = Math.max(range.y1, Math.min(offsetY, range.y2));
+    return {
+      xcp: offsetX,
+      ycp: offsetY,
+      range: range
+    };
+  },
+
+  /**
+   * Adjusts the touch box dimensions based on the provided touch information.
+   *
+   * @param {object} touchInfo - The touch information including touch position and plotting range
+   * @returns {object} - The adjusted touch information
+   */
+  setTouchBoxDimensions: function setTouchBoxDimensions(touchInfo) {
+    var _this$options$dragSel3;
+
+    var boxSize = ((_this$options$dragSel3 = this.options.dragSelection) === null || _this$options$dragSel3 === void 0 ? void 0 : _this$options$dragSel3.size) || 50;
+    var halfBoxSize = boxSize / 2;
+    var xcp = touchInfo.xcp,
+        ycp = touchInfo.ycp,
+        range = touchInfo.range;
+    var xsp = xcp - halfBoxSize;
+    var ysp = ycp - halfBoxSize;
+    var width = boxSize;
+    var height = boxSize;
+    this.boxOverflow = {
+      x1: false,
+      x2: false,
+      y1: false,
+      y2: false
+    };
+
+    if (xcp < range.x1 + halfBoxSize) {
+      xsp = range.x1;
+      width = halfBoxSize - (range.x1 - xcp);
+      this.boxOverflow.x1 = true;
+    }
+
+    if (xcp > range.x2 - halfBoxSize) {
+      width = halfBoxSize - (xcp - range.x2);
+      this.boxOverflow.x2 = true;
+    }
+
+    if (ycp < range.y1 + halfBoxSize) {
+      ysp = range.y1;
+      height = halfBoxSize - (range.y1 - ycp);
+      this.boxOverflow.y1 = true;
+    }
+
+    if (ycp > range.y2 - halfBoxSize) {
+      height = halfBoxSize - (ycp - range.y2);
+      this.boxOverflow.y2 = true;
+    }
+
+    touchInfo.xsp = xsp;
+    touchInfo.ysp = ysp;
+    touchInfo.width = width;
+    touchInfo.height = height;
+    return touchInfo;
+  },
+
+  /**
+   * Remove a touch selection.
+   *
+   * @param {TouchEvent} e - the touch event to process
+   * @returns {undefined}
+   */
+  dragTouchSelectionDestroy: function dragTouchSelectionDestroy(e) {
+    var _this$options$dragSel4;
+
+    if ((_this$options$dragSel4 = this.options.dragSelection) !== null && _this$options$dragSel4 !== void 0 && _this$options$dragSel4.use && e.target !== this.overlayCanvas && this.isTouchOverlay) {
+      this.isTouchOverlay = false;
+      this.overlayClear();
+    }
+  },
+
   /**
    * Find graph item on mouse position
    * @param {array} offset    return value from getMousePosition()
@@ -43718,6 +45793,8 @@ var plugins_interaction_modules = {
    * @returns {object}
    */
   getSelectionRange: function getSelectionRange(_ref6) {
+    var _this$boxOverflow, _this$boxOverflow2, _this$boxOverflow3, _this$boxOverflow4;
+
     var xsp = _ref6.xsp,
         ysp = _ref6.ysp,
         width = _ref6.width,
@@ -43738,15 +45815,15 @@ var plugins_interaction_modules = {
     var xMaxRatio = this.getRatioInRange(range.x1, range.x2, xep);
     var yMinRatio = this.getRatioInRange(range.y1, range.y2, yep);
     var yMaxRatio = this.getRatioInRange(range.y1, range.y2, ysp);
-    var xMin = dataRangeX.graphMin + graphWidth * xMinRatio;
-    var xMax = dataRangeX.graphMin + graphWidth * xMaxRatio;
-    var yMin = dataRangeY.graphMin + graphHeight * (1 - yMinRatio);
-    var yMax = dataRangeY.graphMin + graphHeight * (1 - yMaxRatio);
+    var xMin = this.isMobile && (_this$boxOverflow = this.boxOverflow) !== null && _this$boxOverflow !== void 0 && _this$boxOverflow.x1 ? Math.min(this.minMax.x[0].min, dataRangeX.graphMin) : Math.max(dataRangeX.graphMin + graphWidth * xMinRatio, dataRangeX.graphMin);
+    var xMax = this.isMobile && (_this$boxOverflow2 = this.boxOverflow) !== null && _this$boxOverflow2 !== void 0 && _this$boxOverflow2.x2 ? Math.max(this.minMax.x[0].max, dataRangeX.graphMax) : Math.min(dataRangeX.graphMin + graphWidth * xMaxRatio, dataRangeX.graphMax);
+    var yMin = this.isMobile && (_this$boxOverflow3 = this.boxOverflow) !== null && _this$boxOverflow3 !== void 0 && _this$boxOverflow3.y2 ? Math.min(this.minMax.y[0].min, dataRangeY.graphMin) : Math.max(dataRangeY.graphMin + graphHeight * (1 - yMinRatio), dataRangeY.graphMin);
+    var yMax = this.isMobile && (_this$boxOverflow4 = this.boxOverflow) !== null && _this$boxOverflow4 !== void 0 && _this$boxOverflow4.y1 ? Math.max(this.minMax.y[0].max, dataRangeY.graphMax) : Math.min(dataRangeY.graphMin + graphHeight * (1 - yMaxRatio), dataRangeY.graphMax);
     return {
-      xMin: Math.max(+parseFloat(xMin).toFixed(3), dataRangeX.graphMin),
-      xMax: Math.min(+parseFloat(xMax).toFixed(3), dataRangeX.graphMax),
-      yMin: Math.max(+parseFloat(yMin).toFixed(3), dataRangeY.graphMin),
-      yMax: Math.min(+parseFloat(yMax).toFixed(3), dataRangeY.graphMax)
+      xMin: +xMin.toFixed(3),
+      xMax: +xMax.toFixed(3),
+      yMin: +yMin.toFixed(3),
+      yMax: +yMax.toFixed(3)
     };
   },
 
@@ -45668,6 +47745,7 @@ var element_tip_modules = {
 
 
 
+
 
 
 var chart_core_EvChart = /*#__PURE__*/function () {
@@ -45694,6 +47772,7 @@ var chart_core_EvChart = /*#__PURE__*/function () {
       Object.assign(this, plugins_legend_gradient);
     }
 
+    this.isMobile = mobileCheck();
     this.brushSeries = brushSeries;
     this.target = target;
     this.data = data;
@@ -46089,14 +48168,14 @@ var chart_core_EvChart = /*#__PURE__*/function () {
       return axes.map(function (axis) {
         switch (axis.type) {
           case 'linear':
-            return new scale_linear(dir, axis, ctx, options);
+            return new scale_linear(dir, axis, ctx, labels, options);
 
           case 'time':
             if (axis.categoryMode) {
               return new scale_time_category(dir, axis, ctx, labels, options);
             }
 
-            return new scale_time(dir, axis, ctx, options);
+            return new scale_time(dir, axis, ctx, labels, options);
 
           case 'log':
             return new scale_logarithmic(dir, axis, ctx);
@@ -46705,6 +48784,7 @@ var chart_core_EvChart = /*#__PURE__*/function () {
         this.overlayCanvas.removeEventListener('click', this.onClick);
         this.overlayCanvas.removeEventListener('mousedown', this.onMouseDown);
         this.overlayCanvas.removeEventListener('wheel', this.onWheel);
+        window.removeEventListener('click', this.dragTouchSelectionEvent);
       }
 
       if (this.options.tooltip.use) {
@@ -47547,6 +49627,7 @@ var DEFAULT_OPTIONS = {
   dragSelection: {
     use: false,
     keepDisplay: true,
+    size: 50,
     fillColor: '#38ACEC',
     opacity: 0.65
   },