mcdis-vue-ui-library 1.1.314 → 1.1.317

package/dist/vue-ui-lib.common.js

@@ -116,20 +116,6 @@ test[TO_STRING_TAG] = 'z';
 module.exports = String(test) === '[object z]';
 
 
-/***/ }),
-
-/***/ "0114":
-/***/ (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, "*[data-v-93bf8134]{box-sizing:border-box}.data-grid[data-v-93bf8134]{width:100%;text-align:left;background-color:var(--back90);border-collapse:collapse}.data-grid__wrapper[data-v-93bf8134]{background-color:var(--back90);padding:20px 10px;border-radius:5px}.data-grid__head[data-v-93bf8134]{color:var(--text100);font-size:16px}.data-grid__head-title[data-v-93bf8134]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;padding:10px 20px 20px 10px}.data-grid__head-title[data-v-93bf8134]:first-child{padding-left:5px}.data-grid__head-options[data-v-93bf8134]{text-align:center}.data-grid__body[data-v-93bf8134],.data-grid__row[data-v-93bf8134]{background-color:var(--back100)}.data-grid__row[data-v-93bf8134]{border-bottom:5px solid var(--back90);border-radius:5px;color:var(--text80)}.data-grid__row>td[data-v-93bf8134]{padding:10px 20px;word-break:break-word}.data-grid__row>td[data-v-93bf8134]:first-child{border-top-left-radius:5px;border-bottom-left-radius:5px;padding-left:5px}.data-grid__row>td[data-v-93bf8134]:last-child{border-top-right-radius:5px;border-bottom-right-radius:5px}.data-grid__row[data-v-93bf8134]:hover{background-color:var(--hoverTable);cursor:pointer}.sort-arrow[data-v-93bf8134]{width:15px;margin-left:10px}.sort-arrow--active[data-v-93bf8134]{transform:rotate(180deg)}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "023d":
@@ -1699,22 +1685,6 @@ var update = add("632f1e84", content, true, {"sourceMap":false,"shadowMode":fals
 /* unused harmony reexport * */
 
 
-/***/ }),
-
-/***/ "3365":
-/***/ (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__("0114");
-if(content.__esModule) content = content.default;
-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("0952ef4a", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "342f":
@@ -2928,6 +2898,17 @@ module.exports = function (argument) {
 };
 
 
+/***/ }),
+
+/***/ "512a":
+/***/ (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_DataGrid_vue_vue_type_style_index_0_id_0b52af94_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("5ca2");
+/* 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_DataGrid_vue_vue_type_style_index_0_id_0b52af94_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_DataGrid_vue_vue_type_style_index_0_id_0b52af94_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "512c":
@@ -3275,6 +3256,22 @@ module.exports = function (bitmap, value) {
 };
 
 
+/***/ }),
+
+/***/ "5ca2":
+/***/ (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__("e6a6");
+if(content.__esModule) content = content.default;
+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("ae89f75a", content, true, {"sourceMap":false,"shadowMode":false});
+
 /***/ }),
 
 /***/ "5e77":
@@ -3429,17 +3426,6 @@ if(content.locals) module.exports = content.locals;
 var add = __webpack_require__("499e").default
 var update = add("cd4b7862", content, true, {"sourceMap":false,"shadowMode":false});
 
-/***/ }),
-
-/***/ "6365":
-/***/ (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_DataGrid_vue_vue_type_style_index_0_id_93bf8134_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("3365");
-/* 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_DataGrid_vue_vue_type_style_index_0_id_93bf8134_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_DataGrid_vue_vue_type_style_index_0_id_93bf8134_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
 /***/ }),
 
 /***/ "6547":
@@ -8500,6 +8486,20 @@ module.exports = function (exec) {
 };
 
 
+/***/ }),
+
+/***/ "e6a6":
+/***/ (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, "*[data-v-0b52af94]{box-sizing:border-box}.data-grid[data-v-0b52af94]{width:100%;display:grid;grid-auto-rows:minmax(50px,auto)}.data-grid__head[data-v-0b52af94]{display:contents;padding-bottom:1rem;color:var(--text100)}.data-grid__head-title[data-v-0b52af94]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:5px;display:flex;align-items:center}.data-grid__head-options[data-v-0b52af94]{display:flex;align-items:center;justify-content:center}.data-grid__wrapper[data-v-0b52af94]{background-color:var(--back90);padding:20px 10px;border-radius:5px}.data-grid__lazy[data-v-0b52af94]{width:100%;display:contents}.data-grid__body[data-v-0b52af94],.data-grid__row[data-v-0b52af94]{display:contents}.data-grid__row:hover .data-grid__cell[data-v-0b52af94]{cursor:pointer;background:var(--hoverTable)}.data-grid__cell[data-v-0b52af94]{padding:5px;color:var(--text100)}.data-grid__cell[data-v-0b52af94],.data-grid__cell>span[data-v-0b52af94]{display:flex;align-items:center;width:100%}.data-grid__cell>span[data-v-0b52af94]{height:100%}.data-grid__cell--context-menu[data-v-0b52af94]{justify-content:center}.sort-arrow[data-v-0b52af94]{width:15px;margin-left:10px;fill:var(--text100)}.sort-arrow--active[data-v-0b52af94]{transform:rotate(180deg)}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "e6cf":
@@ -14458,128 +14458,6 @@ const Combobox_exports_ = /*#__PURE__*/exportHelper_default()(Comboboxvue_type_s
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.sort.js
 var es_array_sort = __webpack_require__("4e82");
 
-// 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/DataGrid/parts/LazyObserver.vue?vue&type=template&id=1bf49add
-
-function LazyObservervue_type_template_id_1bf49add_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("tbody", {
-    style: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeStyle"])({
-      minHeight: "".concat($props.minHeightRow * $props.countRows, "px")
-    }),
-    class: "lazy-observer",
-    ref: "lazyElement"
-  }, [_ctx.isVisible ? Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "html", {
-    key: 0
-  }) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 4);
-}
-// CONCATENATED MODULE: ./src/components/DataGrid/parts/LazyObserver.vue?vue&type=template&id=1bf49add
-
-// 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/DataGrid/parts/LazyObserver.vue?vue&type=script&lang=js
-
-
-/* harmony default export */ var LazyObservervue_type_script_lang_js = ({
-  name: "LazyObserver",
-  props: {
-    minHeightRow: {
-      type: [String, Number],
-      default: 50,
-      required: false
-    },
-    countRows: {
-      type: [String, Number],
-      default: 25,
-      required: false
-    },
-    delayResolve: {
-      type: [Number, Boolean],
-      default: false
-    }
-  },
-  data: function data() {
-    return {
-      isVisible: false,
-      state: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["markRaw"])({
-        lazyElement: null,
-        skipScroll: null
-      }),
-      idTimeout: undefined
-    };
-  },
-  mounted: function mounted() {
-    var _this$state$lazyEleme,
-        _this = this;
-
-    this.state.lazyElement = this.$refs.lazyElement;
-
-    if (!((_this$state$lazyEleme = this.state.lazyElement.previousElementSibling) !== null && _this$state$lazyEleme !== void 0 && _this$state$lazyEleme.classList.contains("lazy-observer"))) {
-      this.isVisible = true;
-      return;
-    }
-
-    if (this.delayResolve !== false) {
-      var delay = this.delayResolve === true ? 0 : this.delayResolve;
-      this.idTimeout = setTimeout(function () {
-        _this.isVisible = true;
-
-        _this.clearHandlers();
-      }, delay);
-    }
-
-    this.state.skipScroll = this.throttle(this.isSeen, 200);
-    document.addEventListener("scroll", this.state.skipScroll);
-  },
-  beforeUnmount: function beforeUnmount() {
-    this.clearHandlers();
-  },
-  methods: {
-    isSeen: function isSeen() {
-      var offsetElementTop = this.state.lazyElement.offsetTop;
-      var heightScreen = document.documentElement.clientHeight;
-      var scrollWithTop = Math.ceil(document.documentElement.scrollTop);
-
-      if (scrollWithTop + heightScreen >= offsetElementTop) {
-        this.isVisible = true;
-        this.clearHandlers();
-      }
-    },
-    throttle: function throttle(fn, ms) {
-      var isOpen = true;
-      var self = null;
-      var args = null;
-      return function () {
-        if (isOpen) {
-          isOpen = false;
-          fn.apply(this, arguments);
-          setTimeout(function () {
-            if (self && args) {
-              fn.apply(self, args);
-              self = args = null;
-            }
-
-            isOpen = true;
-          }, ms);
-        } else {
-          self = this;
-          args = arguments;
-        }
-      };
-    },
-    clearHandlers: function clearHandlers() {
-      clearTimeout(this.idTimeout);
-      document.removeEventListener("scroll", this.state.skipScroll);
-    }
-  }
-});
-// CONCATENATED MODULE: ./src/components/DataGrid/parts/LazyObserver.vue?vue&type=script&lang=js
- 
-// CONCATENATED MODULE: ./src/components/DataGrid/parts/LazyObserver.vue
-
-
-
-
-
-const LazyObserver_exports_ = /*#__PURE__*/exportHelper_default()(LazyObservervue_type_script_lang_js, [['render',LazyObservervue_type_template_id_1bf49add_render]])
-
-/* harmony default export */ var LazyObserver = (LazyObserver_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/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/DataGrid/DataGrid.vue?vue&type=script&setup=true&lang=js
 
 
@@ -14589,28 +14467,38 @@ const LazyObserver_exports_ = /*#__PURE__*/exportHelper_default()(LazyObservervu
 
 
 var DataGridvue_type_script_setup_true_lang_js_withScopeId = function _withScopeId(n) {
-  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-93bf8134"), n = n(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])(), n;
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-0b52af94"), n = n(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])(), n;
 };
 
 var DataGridvue_type_script_setup_true_lang_js_hoisted_1 = {
   class: "data-grid__wrapper"
 };
-var DataGridvue_type_script_setup_true_lang_js_hoisted_2 = {
-  class: "data-grid"
-};
+var DataGridvue_type_script_setup_true_lang_js_hoisted_2 = ["onClick"];
 var DataGridvue_type_script_setup_true_lang_js_hoisted_3 = {
-  class: "data-grid__head"
-};
-var DataGridvue_type_script_setup_true_lang_js_hoisted_4 = ["onClick"];
-var DataGridvue_type_script_setup_true_lang_js_hoisted_5 = {
-  key: 0,
+  key: 3,
   class: "data-grid__head-title data-grid__head-options"
 };
+var DataGridvue_type_script_setup_true_lang_js_hoisted_4 = {
+  class: "data-grid__body"
+};
+var DataGridvue_type_script_setup_true_lang_js_hoisted_5 = ["onClick"];
 var DataGridvue_type_script_setup_true_lang_js_hoisted_6 = ["onClick"];
-var DataGridvue_type_script_setup_true_lang_js_hoisted_7 = ["onClick"];
+var DataGridvue_type_script_setup_true_lang_js_hoisted_7 = {
+  key: 1
+};
 var DataGridvue_type_script_setup_true_lang_js_hoisted_8 = {
+  key: 1,
+  class: "data-grid__cell data-grid__cell--context-menu"
+};
+var DataGridvue_type_script_setup_true_lang_js_hoisted_9 = ["onClick"];
+var DataGridvue_type_script_setup_true_lang_js_hoisted_10 = ["onClick"];
+var DataGridvue_type_script_setup_true_lang_js_hoisted_11 = {
   key: 1
 };
+var DataGridvue_type_script_setup_true_lang_js_hoisted_12 = {
+  key: 1,
+  class: "data-grid__cell data-grid__cell--context-menu"
+};
 
 
 
@@ -14625,11 +14513,14 @@ function DataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
   var props = __props;
   var sortedRows = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(props.rows);
   var rulesList = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])([]);
+  var loader = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(null);
+  var visibleChunks = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(1);
   Object(external_commonjs_vue_commonjs2_vue_root_Vue_["watch"])(function () {
     return props.rows;
   }, function () {
     sortedRows.value = props.rows;
   });
+  var selectedRows = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])([]);
   Object(external_commonjs_vue_commonjs2_vue_root_Vue_["onMounted"])(function () {
     if (props.sortHandlers) {
       var _iterator = _createForOfIteratorHelper(props.sortHandlers),
@@ -14649,6 +14540,11 @@ function DataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
         _iterator.f();
       }
     }
+
+    var observer = new IntersectionObserver(function () {
+      visibleChunks.value++;
+    });
+    observer.observe(loader.value);
   });
 
   var getSortRule = function getSortRule(idx) {
@@ -14716,30 +14612,52 @@ function DataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
   };
 
   var emitCellClick = function emitCellClick(_cell, _idx) {
-    if (props.cellClickHandler) {
-      emits(props.cellClickHandler, _cell, _idx, props.columns[_idx]);
-    }
+    emits("cell-click", _cell, _idx);
   };
 
   var emitRowClick = function emitRowClick(_row, _idx) {
-    if (props.rowClickHandler) {
-      emits(props.rowClickHandler, _row, _idx);
-    }
+    emits("row-click", _row, _idx);
   };
 
-  var isCustomColumn = function isCustomColumn(idx) {
-    if (!props.customColumns) return false;
+  var isCustomSlot = function isCustomSlot(_idx) {
+    if (!props.customSlotCols) return false;
+
+    var _iterator4 = _createForOfIteratorHelper(props.customSlotCols),
+        _step4;
 
-    for (var i = 0; i < props.customColumns.length; i++) {
-      if (props.customColumns[i].idx === idx) return true;
+    try {
+      for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+        var key = _step4.value;
+
+        if (key.idx == _idx) {
+          return true;
+        }
+      }
+    } catch (err) {
+      _iterator4.e(err);
+    } finally {
+      _iterator4.f();
     }
 
     return false;
   };
 
-  var getComponent = function getComponent(idx) {
-    for (var i = 0; i < props.customColumns.length; i++) {
-      if (props.customColumns[i].idx === idx) return props.customColumns[i].comp;
+  var getSlotName = function getSlotName(_idx) {
+    var _iterator5 = _createForOfIteratorHelper(props.customSlotCols),
+        _step5;
+
+    try {
+      for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+        var key = _step5.value;
+
+        if (key.idx == _idx) {
+          return key.name;
+        }
+      }
+    } catch (err) {
+      _iterator5.e(err);
+    } finally {
+      _iterator5.f();
     }
   };
 
@@ -14754,114 +14672,233 @@ function DataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
     return chunks;
   };
 
+  var isAllSelected = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+    if (selectedRows.value.length === sortedRows.value.length) {
+      return true;
+    }
+
+    return false;
+  });
+
   var isSortable = function isSortable(idx) {
     if (!props.sortHandlers) return false;
 
-    var _iterator4 = _createForOfIteratorHelper(props.sortHandlers),
-        _step4;
+    var _iterator6 = _createForOfIteratorHelper(props.sortHandlers),
+        _step6;
 
     try {
-      for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-        var el = _step4.value;
+      for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
+        var el = _step6.value;
         if (el.idx === idx) return true;
       }
     } catch (err) {
-      _iterator4.e(err);
+      _iterator6.e(err);
     } finally {
-      _iterator4.f();
+      _iterator6.f();
     }
 
     return false;
   };
 
   var isAscending = function isAscending(_idx) {
-    var _iterator5 = _createForOfIteratorHelper(rulesList.value),
-        _step5;
+    var _iterator7 = _createForOfIteratorHelper(rulesList.value),
+        _step7;
 
     try {
-      for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
-        var rule = _step5.value;
+      for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {
+        var rule = _step7.value;
 
         if (rule.idx === _idx) {
           return rule.rule === ASC;
         }
       }
     } catch (err) {
-      _iterator5.e(err);
+      _iterator7.e(err);
     } finally {
-      _iterator5.f();
+      _iterator7.f();
     }
 
     return false;
   };
 
-  return function (_ctx, _cache) {
-    var _component_flat_button = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("flat-button");
+  var lastToggleChoice = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(false);
+
+  var toggleAll = function toggleAll() {
+    if (lastToggleChoice.value === false) {
+      selectedRows.value = sortedRows.value;
+      lastToggleChoice.value = true;
+      emits("selection", selectedRows.value);
+    } else {
+      selectedRows.value = [];
+      lastToggleChoice.value = false;
+      emits("selection", selectedRows.value);
+    }
+  };
+
+  var computedColumnsWidth = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["computed"])(function () {
+    if (props.columnsWidth) {
+      return {
+        gridTemplateColumns: props.columnsWidth
+      };
+    }
+
+    var columnsCount = +props.columnsCount;
+
+    if (props.contextMenu) {
+      columnsCount += 1;
+    }
 
+    if (props.rowSelection) {
+      columnsCount += 1;
+    }
+
+    return {
+      gridTemplateColumns: "repeat(".concat(columnsCount, ", auto)")
+    };
+  });
+
+  var emitSelection = function emitSelection() {
+    emits("selection", selectedRows.value);
+  };
+
+  var isShow = function isShow(_idx) {
+    return _idx <= visibleChunks.value;
+  };
+
+  return function (_ctx, _cache) {
     var _component_context_menu = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("context-menu");
 
-    return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("table", DataGridvue_type_script_setup_true_lang_js_hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("thead", DataGridvue_type_script_setup_true_lang_js_hoisted_3, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("tr", null, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(props.columns, function (col, colIdx) {
-      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("th", {
+    return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", {
+      class: "data-grid",
+      style: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeStyle"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(computedColumnsWidth))
+    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", {
+      class: "data-grid__head",
+      style: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeStyle"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(computedColumnsWidth))
+    }, [__props.rowSelection ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(Checkbox), {
+      key: 0,
+      checked: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(isAllSelected),
+      onChange: toggleAll,
+      class: "data-grid__head-title"
+    }, null, 8, ["checked"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), props.columns ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+      key: 1
+    }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(props.columns, function (col, colIdx) {
+      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
         onClick: function onClick($event) {
           return sortRows(colIdx);
         },
         class: "data-grid__head-title",
+        style: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeStyle"])({
+          cursor: isSortable(colIdx) ? 'pointer' : ''
+        }),
         key: col
-      }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(col) + " ", 1), isSortable(colIdx) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(arrow_down), {
+      }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", null, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(col), 1), isSortable(colIdx) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(arrow_down), {
         key: 0,
         class: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeClass"])([{
           'sort-arrow--active': !isAscending(colIdx)
         }, "sort-arrow"])
-      }, null, 8, ["class"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_4);
-    }), 128)), props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("th", DataGridvue_type_script_setup_true_lang_js_hoisted_5, " Options ")) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])]), (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(chunkRowsList(), function (chunk, chunkIndex) {
-      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(LazyObserver), {
+      }, null, 8, ["class"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 12, DataGridvue_type_script_setup_true_lang_js_hoisted_2);
+    }), 128)) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+      key: 2
+    }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(props.columnsCount, function (i) {
+      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", {
+        key: i
+      });
+    }), 128)), props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_3, " Options ")) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 4), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_4, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(chunkRowsList().slice(0, 1), function (chunk, chunkIndex) {
+      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
         key: chunkIndex,
-        class: "data-grid__body"
-      }, {
-        html: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-          return [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(chunk, function (row, rowIdx) {
-            return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("tr", {
-              onClick: function onClick($event) {
-                return emitRowClick(row, rowIdx);
-              },
-              class: "data-grid__row",
-              key: rowIdx
-            }, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(row, function (cell, cellIdx) {
-              return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("td", {
-                onClick: function onClick($event) {
-                  return emitCellClick(cell, cellIdx);
-                },
-                key: cellIdx
-              }, [isCustomColumn(cellIdx) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveDynamicComponent"])(getComponent(cellIdx)), {
-                key: 0,
-                item: cell
-              }, null, 8, ["item"])) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", DataGridvue_type_script_setup_true_lang_js_hoisted_8, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(cell), 1))], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_7);
-            }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("td", null, [props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_context_menu, {
-              key: 0,
-              direction: "vertical"
-            }, {
-              default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-                return [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(props.contextMenuHandlers, function (handler, idx) {
-                  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_flat_button, {
-                    onClick: function onClick($event) {
-                      return _ctx.$emit(handler.eventName, row);
-                    },
-                    key: idx
-                  }, {
-                    label: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-                      return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createTextVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(handler.name), 1)];
-                    }),
-                    _: 2
-                  }, 1032, ["onClick"]);
-                }), 128))];
-              }),
-              _: 2
-            }, 1024)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_6);
-          }), 128))];
-        }),
-        _: 2
-      }, 1024);
-    }), 128))])]);
+        class: "data-grid__lazy",
+        style: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeStyle"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(computedColumnsWidth))
+      }, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(chunk, function (row, rowIdx) {
+        return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
+          onClick: function onClick($event) {
+            return emitRowClick(row, rowIdx);
+          },
+          class: "data-grid__row",
+          key: rowIdx
+        }, [__props.rowSelection ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(Checkbox), {
+          key: 0,
+          onClick: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(emitSelection, ["stop", "prevent"]),
+          "array-value": row,
+          modelValue: selectedRows.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) {
+            return selectedRows.value = $event;
+          }),
+          class: "data-grid__cell"
+        }, null, 8, ["onClick", "array-value", "modelValue"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(row, function (cell, cellIdx) {
+          return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
+            onClick: function onClick($event) {
+              return emitCellClick(cell, cellIdx);
+            },
+            key: cellIdx,
+            class: "data-grid__cell"
+          }, [isCustomSlot(cellIdx) ? Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, getSlotName(cellIdx), {
+            key: 0,
+            item: cell
+          }) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", DataGridvue_type_script_setup_true_lang_js_hoisted_7, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(cell), 1))], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_6);
+        }), 128)), props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_8, [props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_context_menu, {
+          key: 0,
+          direction: "vertical"
+        }, {
+          default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+            return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "menu", {
+              row: row
+            })];
+          }),
+          _: 2
+        }, 1024)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_5);
+      }), 128))], 4);
+    }), 128)), (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(chunkRowsList().slice(1), function (chunk, chunkIndex) {
+      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], {
+        key: chunkIndex
+      }, [isShow(chunkIndex) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
+        key: 0,
+        class: "data-grid__lazy",
+        style: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeStyle"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(computedColumnsWidth))
+      }, [(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(chunk, function (row, rowIdx) {
+        return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
+          onClick: function onClick($event) {
+            return emitRowClick(row, rowIdx);
+          },
+          class: "data-grid__row",
+          key: rowIdx
+        }, [__props.rowSelection ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(Checkbox), {
+          key: 0,
+          onClick: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withModifiers"])(emitSelection, ["stop", "prevent"]),
+          "array-value": row,
+          modelValue: selectedRows.value,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = function ($event) {
+            return selectedRows.value = $event;
+          }),
+          class: "data-grid__cell"
+        }, null, 8, ["onClick", "array-value", "modelValue"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(true), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])(external_commonjs_vue_commonjs2_vue_root_Vue_["Fragment"], null, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(row, function (cell, cellIdx) {
+          return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", {
+            onClick: function onClick($event) {
+              return emitCellClick(cell, cellIdx);
+            },
+            key: cellIdx,
+            class: "data-grid__cell"
+          }, [isCustomSlot(cellIdx) ? Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, getSlotName(cellIdx), {
+            key: 0,
+            item: cell
+          }) : (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("span", DataGridvue_type_script_setup_true_lang_js_hoisted_11, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(cell), 1))], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_10);
+        }), 128)), props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_12, [props.contextMenu ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_context_menu, {
+          key: 0,
+          direction: "vertical"
+        }, {
+          default: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
+            return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderSlot"])(_ctx.$slots, "menu", {
+              row: row
+            })];
+          }),
+          _: 2
+        }, 1024)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_9);
+      }), 128))], 4)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)], 64);
+    }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", {
+      ref: function ref(_value, _refs) {
+        _refs['loader'] = _value;
+        loader.value = _value;
+      }
+    }, null, 512)])], 4)]);
   };
 }
 
@@ -14880,32 +14917,33 @@ function DataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
       type: Boolean,
       default: false
     },
-    contextMenuHandlers: {
+    sortHandlers: {
       required: false,
       type: Array
     },
-    rowClickHandler: {
-      required: false,
-      type: String
-    },
-    cellClickHandler: {
-      required: false,
-      type: String
+    columnsCount: {
+      required: true
     },
-    sortHandlers: {
-      required: false,
-      type: Array
+    columnsWidth: {
+      required: false
     },
-    customColumns: {
+    customSlotCols: {
+      type: Array,
       required: false
+    },
+    rowSelection: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
+  emits: ["row-click", "cell-click", "selection"],
   setup: DataGridvue_type_script_setup_true_lang_js_setup
 }));
 // CONCATENATED MODULE: ./src/components/DataGrid/DataGrid.vue?vue&type=script&setup=true&lang=js
  
-// EXTERNAL MODULE: ./src/components/DataGrid/DataGrid.vue?vue&type=style&index=0&id=93bf8134&lang=scss&scoped=true
-var DataGridvue_type_style_index_0_id_93bf8134_lang_scss_scoped_true = __webpack_require__("6365");
+// EXTERNAL MODULE: ./src/components/DataGrid/DataGrid.vue?vue&type=style&index=0&id=0b52af94&lang=scss&scoped=true
+var DataGridvue_type_style_index_0_id_0b52af94_lang_scss_scoped_true = __webpack_require__("512a");
 
 // CONCATENATED MODULE: ./src/components/DataGrid/DataGrid.vue
 
@@ -14914,7 +14952,7 @@ var DataGridvue_type_style_index_0_id_93bf8134_lang_scss_scoped_true = __webpack
 
 
 
-const DataGrid_exports_ = /*#__PURE__*/exportHelper_default()(DataGridvue_type_script_setup_true_lang_js, [['__scopeId',"data-v-93bf8134"]])
+const DataGrid_exports_ = /*#__PURE__*/exportHelper_default()(DataGridvue_type_script_setup_true_lang_js, [['__scopeId',"data-v-0b52af94"]])
 
 /* harmony default export */ var DataGrid = (DataGrid_exports_);
 // CONCATENATED MODULE: ./src/components/DataGrid/index.js
@@ -14938,7 +14976,7 @@ function LazyObservervue_type_template_id_773c4e08_render(_ctx, _cache, $props,
 // 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/LazyObserver/LazyObserver.vue?vue&type=script&lang=js
 
 
-/* harmony default export */ var LazyObserver_LazyObservervue_type_script_lang_js = ({
+/* harmony default export */ var LazyObservervue_type_script_lang_js = ({
   name: "McLazyObserver",
   props: {
     minHeightRow: {
@@ -15039,12 +15077,12 @@ function LazyObservervue_type_template_id_773c4e08_render(_ctx, _cache, $props,
 
 
 
-const LazyObserver_LazyObserver_exports_ = /*#__PURE__*/exportHelper_default()(LazyObserver_LazyObservervue_type_script_lang_js, [['render',LazyObservervue_type_template_id_773c4e08_render]])
+const LazyObserver_exports_ = /*#__PURE__*/exportHelper_default()(LazyObservervue_type_script_lang_js, [['render',LazyObservervue_type_template_id_773c4e08_render]])
 
-/* harmony default export */ var LazyObserver_LazyObserver = (LazyObserver_LazyObserver_exports_);
+/* harmony default export */ var LazyObserver = (LazyObserver_exports_);
 // CONCATENATED MODULE: ./src/components/LazyObserver/index.js
 
-/* harmony default export */ var components_LazyObserver = (LazyObserver_LazyObserver);
+/* harmony default export */ var components_LazyObserver = (LazyObserver);
 // 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/PopupTooltip/PopupTooltip.vue?vue&type=script&setup=true&lang=js