mcdis-vue-ui-library 1.1.206 → 1.1.214

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

@@ -1271,20 +1271,6 @@ module.exports = function (CONSTRUCTOR_NAME) {
 };
 
 
-/***/ }),
-
-/***/ "27b4":
-/***/ (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, ".datagrid[data-v-ec71aef6]{font-family:Roboto,sans-serif;box-sizing:border-box;border-radius:5px;width:100%;overflow-x:auto;max-width:100vw;background-color:var(--back100)}.datagrid__body[data-v-ec71aef6]{background-color:var(--back90)}.datagrid--hover[data-v-ec71aef6]{border-collapse:collapse}.datagrid__col-name[data-v-ec71aef6]{padding-bottom:20px}.datagrid__col-name[data-v-ec71aef6]:first-child{padding-left:10px}.datagrid__col-name[data-v-ec71aef6]:last-child{padding-right:10px}.datagrid__menu-label[data-v-ec71aef6]{font-size:14px;color:var(--text100);font-weight:400}.datagrid__header[data-v-ec71aef6]{text-align:left;font-weight:700;color:var(--text100)}.datagrid__row[data-v-ec71aef6]{border-bottom:solid 5px var(--back100);border-radius:5px}.datagrid__row>td[data-v-ec71aef6]{padding:10px 0;width:170.5px;max-width:170.5px;overflow-x:hidden;padding-right:5px}.datagrid__row>td[data-v-ec71aef6]:first-child{border-top-left-radius:5px;border-bottom-left-radius:5px;padding-left:10px;overflow-x:visible}.datagrid__row>td[data-v-ec71aef6]:last-child{border-top-right-radius:5px;border-bottom-right-radius:5px;padding-right:10px;overflow-x:visible}.datagrid__row--hover[data-v-ec71aef6]{cursor:pointer}.datagrid__row--hover[data-v-ec71aef6]:hover{background-color:rgba(61,155,232,.1)}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "287b":
@@ -1514,22 +1500,6 @@ exports.push([module.i, ".pulse[data-v-7af9d562]{background-color:var(--primary1
 module.exports = exports;
 
 
-/***/ }),
-
-/***/ "3b2f":
-/***/ (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__("27b4");
-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("723131d4", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "3bbe":
@@ -2353,20 +2323,6 @@ module.exports = {
 };
 
 
-/***/ }),
-
-/***/ "4dad":
-/***/ (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-281ff745]{box-sizing:border-box}.data-grid[data-v-281ff745]{width:100%;text-align:left;background-color:var(--back90);border-collapse:collapse}.data-grid__wrapper[data-v-281ff745]{background-color:var(--back90);padding:20px 10px;border-radius:5px}.data-grid__head[data-v-281ff745]{color:var(--text100);font-size:16px}.data-grid__head-title[data-v-281ff745]{padding-bottom:20px}.data-grid__head-title[data-v-281ff745]:first-child{padding-left:5px}.data-grid__head-title[data-v-281ff745]:last-child{text-align:center}.data-grid__body[data-v-281ff745],.data-grid__row[data-v-281ff745]{background-color:var(--back100)}.data-grid__row[data-v-281ff745]{border-bottom:5px solid var(--back90);border-radius:5px;color:var(--text80)}.data-grid__row>td[data-v-281ff745]{padding:10px 0;word-break:break-word}.data-grid__row>td[data-v-281ff745]:first-child{border-top-left-radius:5px;border-bottom-left-radius:5px;padding-left:5px}.data-grid__row>td[data-v-281ff745]:last-child{border-top-right-radius:5px;border-bottom-right-radius:5px}.data-grid__row[data-v-281ff745]:hover{background-color:var(--hoverTable);cursor:pointer}", ""]);
-// Exports
-module.exports = exports;
-
-
 /***/ }),
 
 /***/ "4de4":
@@ -3118,6 +3074,22 @@ var update = add("2648c45e", content, true, {"sourceMap":false,"shadowMode":fals
 
 /***/ }),
 
+/***/ "6402":
+/***/ (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__("cdb5");
+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("e3bfb964", content, true, {"sourceMap":false,"shadowMode":false});
+
+/***/ }),
+
 /***/ "6547":
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -3212,22 +3184,6 @@ module.exports = !construct || fails(function () {
 }) ? isConstructorLegacy : isConstructorModern;
 
 
-/***/ }),
-
-/***/ "6955":
-/***/ (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__("4dad");
-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("6d69f307", content, true, {"sourceMap":false,"shadowMode":false});
-
 /***/ }),
 
 /***/ "69f3":
@@ -5879,12 +5835,12 @@ module.exports = function (input, pref) {
 
 /***/ }),
 
-/***/ "c40d":
+/***/ "c07b":
 /***/ (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_SimpleDataGrid_vue_vue_type_style_index_0_id_281ff745_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("6955");
-/* 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_SimpleDataGrid_vue_vue_type_style_index_0_id_281ff745_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_SimpleDataGrid_vue_vue_type_style_index_0_id_281ff745_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
+/* 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_c79f67cc_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("6402");
+/* 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_c79f67cc_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_c79f67cc_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
 /* unused harmony reexport * */
 
 
@@ -6120,6 +6076,20 @@ $({ target: 'Object', stat: true, forced: Object.assign !== assign }, {
 });
 
 
+/***/ }),
+
+/***/ "cdb5":
+/***/ (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-c79f67cc]{box-sizing:border-box}.data-grid[data-v-c79f67cc]{width:100%;text-align:left;background-color:var(--back90);border-collapse:collapse}.data-grid__wrapper[data-v-c79f67cc]{background-color:var(--back90);padding:20px 10px;border-radius:5px}.data-grid__head[data-v-c79f67cc]{color:var(--text100);font-size:16px}.data-grid__head-title[data-v-c79f67cc]{padding-bottom:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.data-grid__head-title[data-v-c79f67cc]:first-child{padding-left:5px}.data-grid__head-title[data-v-c79f67cc]:last-child{text-align:center}.data-grid__body[data-v-c79f67cc],.data-grid__row[data-v-c79f67cc]{background-color:var(--back100)}.data-grid__row[data-v-c79f67cc]{border-bottom:5px solid var(--back90);border-radius:5px;color:var(--text80)}.data-grid__row>td[data-v-c79f67cc]{padding:10px 0;word-break:break-word}.data-grid__row>td[data-v-c79f67cc]:first-child{border-top-left-radius:5px;border-bottom-left-radius:5px;padding-left:5px}.data-grid__row>td[data-v-c79f67cc]:last-child{border-top-right-radius:5px;border-bottom-right-radius:5px}.data-grid__row[data-v-c79f67cc]:hover{background-color:var(--hoverTable);cursor:pointer}.sort-arrow[data-v-c79f67cc]{width:15px;margin-left:10px}.sort-arrow--active[data-v-c79f67cc]{transform:rotate(180deg)}", ""]);
+// Exports
+module.exports = exports;
+
+
 /***/ }),
 
 /***/ "ce4e":
@@ -7166,8 +7136,8 @@ __webpack_require__.d(components_namespaceObject, "BlockSwitcher", function() {
 __webpack_require__.d(components_namespaceObject, "DenyBlockSwitcher", function() { return DenyBlockSwithcer; });
 __webpack_require__.d(components_namespaceObject, "HorizontalProgressBar", function() { return components_HorizontalProgressBar; });
 __webpack_require__.d(components_namespaceObject, "Combobox", function() { return components_Combobox; });
-__webpack_require__.d(components_namespaceObject, "DataGrid", function() { return components_DataGrid; });
-__webpack_require__.d(components_namespaceObject, "SimpleDataGrid", function() { return components_SimpleDataGrid; });
+__webpack_require__.d(components_namespaceObject, "DataGrid", function() { return SimpleDataGrid; });
+__webpack_require__.d(components_namespaceObject, "McLazyObserver", function() { return components_LazyObserver; });
 __webpack_require__.d(components_namespaceObject, "PopupTooltip", function() { return components_PopupTooltip; });
 
 // CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
@@ -12316,416 +12286,403 @@ const Combobox_exports_ = /*#__PURE__*/exportHelper_default()(Comboboxvue_type_s
 // CONCATENATED MODULE: ./src/components/Combobox/index.js
 
 /* harmony default export */ var components_Combobox = (Combobox);
-// 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
-
-
-
-
-var DataGridvue_type_script_setup_true_lang_js_withScopeId = function _withScopeId(n) {
-  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-ec71aef6"), n = n(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])(), n;
-};
-
-var DataGridvue_type_script_setup_true_lang_js_hoisted_1 = {
-  class: "datagrid__header"
-};
-var DataGridvue_type_script_setup_true_lang_js_hoisted_2 = {
-  class: "datagrid__body"
-};
-var DataGridvue_type_script_setup_true_lang_js_hoisted_3 = ["onClick"];
-var DataGridvue_type_script_setup_true_lang_js_hoisted_4 = ["onUpdate:modelValue"];
-var DataGridvue_type_script_setup_true_lang_js_hoisted_5 = ["onClick", "onDblclick"];
-var DataGridvue_type_script_setup_true_lang_js_hoisted_6 = {
-  style: {
-    "display": "flex",
-    "flex-direction": "column"
-  }
-};
-var DataGridvue_type_script_setup_true_lang_js_hoisted_7 = ["onUpdate:modelValue"];
-
-var DataGridvue_type_script_setup_true_lang_js_hoisted_8 = /*#__PURE__*/DataGridvue_type_script_setup_true_lang_js_withScopeId(function () {
-  return /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", null, "Save", -1);
-});
-
-var DataGridvue_type_script_setup_true_lang_js_hoisted_9 = {
-  class: "datagrid__menu-label"
-};
-
-var DataGridvue_type_script_setup_true_lang_js_hoisted_10 = /*#__PURE__*/DataGridvue_type_script_setup_true_lang_js_withScopeId(function () {
-  return /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", null, "Remove", -1);
-});
-
-var DataGridvue_type_script_setup_true_lang_js_hoisted_11 = /*#__PURE__*/DataGridvue_type_script_setup_true_lang_js_withScopeId(function () {
-  return /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", null, "Save", -1);
-});
-
-var DataGridvue_type_script_setup_true_lang_js_hoisted_12 = /*#__PURE__*/DataGridvue_type_script_setup_true_lang_js_withScopeId(function () {
-  return /*#__PURE__*/Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", null, "Edit", -1);
-});
-
-
-
-var DataGridvue_type_script_setup_true_lang_js_default_ = {
-  name: "DataGrid"
-};
-
-function DataGridvue_type_script_setup_true_lang_js_setup(__props) {
-  var _this = this;
-
-  var props = __props; //const isShow = ref(false);
-
-  var rowsData = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(props.rows); // const isSortable = (_el) => {
-  //   if(typeof  _el === 'object') {
-  //     if(_el.sortable) {
-  //       return true;
-  //     }
-  //   }
-  //   return false;
-  // };
-
-  var isSmall = window.innerWidth < 500 ? true : false;
-  console.log(isSmall);
-
-  var removeRow = function removeRow(idx) {
-    //заглушка
-    rowsData.value.splice(idx, 1);
-  };
-
-  var isEdit = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(false);
-  var editRowIndex = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(null);
-
-  var editRow = function editRow(_row, _idx) {
-    isEdit.value = true;
-    editRowIndex.value = _idx;
-  };
-
-  var saveRow = function saveRow() {
-    console.log("saved");
-    isEdit.value = false;
-    editRowIndex.value = null;
-  }; // const updateValue = (_x,_y,_z, evt) => {
-  //   console.log(_x,_y,_z,evt);
-  // };
+// 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/SimpleDataGrid/parts/LazyObserver.vue?vue&type=template&id=00f625af
 
-  return function (_ctx, _cache) {
-    var _component_popup_modal = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("popup-modal");
+function LazyObservervue_type_template_id_00f625af_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/SimpleDataGrid/parts/LazyObserver.vue?vue&type=template&id=00f625af
 
-    var _component_context_menu = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("context-menu");
+// 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/SimpleDataGrid/parts/LazyObserver.vue?vue&type=script&lang=js
 
-    return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("table", {
-      class: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeClass"])(["datagrid", {
-        'datagrid--hover': __props.allowRowSelect
-      }])
-    }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("thead", DataGridvue_type_script_setup_true_lang_js_hoisted_1, [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) {
-      return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("th", {
-        class: "datagrid__col-name",
-        key: col
-      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(col), 1);
-    }), 128))])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("tbody", DataGridvue_type_script_setup_true_lang_js_hoisted_2, [(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"])(rowsData.value, function (row, idx) {
-      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 props.rowClickHandler.call(_this, row);
-        },
-        class: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["normalizeClass"])(["datagrid__row", {
-          'datagrid__row--hover': __props.allowRowSelect
-        }]),
-        key: idx
-      }, [isEdit.value && idx === editRowIndex.value && !Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(isSmall) ? (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: 0
-      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(row, function (el, index) {
-        return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("td", {
-          key: index
-        }, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("input", {
-          type: "text",
-          "onUpdate:modelValue": function onUpdateModelValue($event) {
-            return rowsData.value[idx][index] = $event;
-          }
-        }, null, 8, DataGridvue_type_script_setup_true_lang_js_hoisted_4), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vModelText"], rowsData.value[idx][index]]])]);
-      }), 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: 1
-      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["renderList"])(row, function (el, index) {
-        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 props.cellClickHandler.call(_this, el);
-          },
-          onDblclick: function onDblclick($event) {
-            return editRow(row, idx);
-          },
-          key: index
-        }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(el), 41, DataGridvue_type_script_setup_true_lang_js_hoisted_5);
-      }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(isSmall) ? (Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createBlock"])(_component_popup_modal, {
-        key: 2,
-        "min-width": '100px',
-        "max-width": '100vw',
-        "is-show-popup": isEdit.value,
-        "closing-esc": true
-      }, {
-        content: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-          return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("div", DataGridvue_type_script_setup_true_lang_js_hoisted_6, [(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 (el, index) {
-            return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withDirectives"])((Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("input", {
-              key: index,
-              type: "text",
-              style: {
-                "margin-bottom": "20px",
-                "width": "100px"
-              },
-              "onUpdate:modelValue": function onUpdateModelValue($event) {
-                return rowsData.value[idx][index] = $event;
-              }
-            }, null, 8, DataGridvue_type_script_setup_true_lang_js_hoisted_7)), [[external_commonjs_vue_commonjs2_vue_root_Vue_["vModelText"], rowsData.value[idx][index]]]);
-          }), 128)), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createVNode"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(FlatButton), {
-            onClick: saveRow
-          }, {
-            label: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-              return [DataGridvue_type_script_setup_true_lang_js_hoisted_8];
-            }),
-            _: 1
-          })])];
-        }),
-        _: 2
-      }, 1032, ["is-show-popup"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), 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",
-        style: {
-          "justify-content": "left"
-        }
-      }, {
-        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) {
-            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"])(FlatButton), {
-              onClick: function onClick($event) {
-                return handler.fn.call(_this, row);
-              },
-              key: handler.title
-            }, {
-              label: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-                return [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("span", DataGridvue_type_script_setup_true_lang_js_hoisted_9, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(handler.title), 1)];
-              }),
-              _: 2
-            }, 1032, ["onClick"]);
-          }), 128)), props.allowRemoveRow ? (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"])(FlatButton), {
-            key: 0,
-            onClick: function onClick($event) {
-              return removeRow(idx);
-            }
-          }, {
-            label: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-              return [DataGridvue_type_script_setup_true_lang_js_hoisted_10];
-            }),
-            _: 2
-          }, 1032, ["onClick"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true), isEdit.value && editRowIndex.value === idx ? (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"])(FlatButton), {
-            key: 1,
-            onClick: saveRow
-          }, {
-            label: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-              return [DataGridvue_type_script_setup_true_lang_js_hoisted_11];
-            }),
-            _: 1
-          })) : props.allowEditRow ? (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"])(FlatButton), {
-            key: 2,
-            onClick: function onClick($event) {
-              return editRow(row, idx);
-            }
-          }, {
-            label: Object(external_commonjs_vue_commonjs2_vue_root_Vue_["withCtx"])(function () {
-              return [DataGridvue_type_script_setup_true_lang_js_hoisted_12];
-            }),
-            _: 2
-          }, 1032, ["onClick"])) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)];
-        }),
-        _: 2
-      }, 1024)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 10, DataGridvue_type_script_setup_true_lang_js_hoisted_3);
-    }), 128))])], 2);
-  };
-}
 
-/* harmony default export */ var DataGridvue_type_script_setup_true_lang_js = (/*#__PURE__*/Object.assign(DataGridvue_type_script_setup_true_lang_js_default_, {
+/* harmony default export */ var LazyObservervue_type_script_lang_js = ({
+  name: "LazyObserver",
   props: {
-    columns: {
-      required: false,
-      type: Array
-    },
-    rows: {
-      required: false,
-      type: Array
-    },
-    allowRowSelect: {
-      required: false,
-      default: true
-    },
-    rowClickHandler: {
+    minHeightRow: {
+      type: [String, Number],
+      default: 50,
       required: false
     },
-    cellClickHandler: {
+    countRows: {
+      type: [String, Number],
+      default: 25,
       required: false
     },
-    contextMenu: {
-      required: false,
-      default: false
-    },
-    contextMenuHandlers: {
-      type: Array
-    },
-    allowRemoveRow: {
-      required: false,
-      default: false
-    },
-    allowEditRow: {
-      required: false,
-      default: false
-    },
-    allowSelectRows: {
-      required: false,
+    delayResolve: {
+      type: [Number, Boolean],
       default: false
     }
   },
-  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=ec71aef6&lang=scss&scoped=true
-var DataGridvue_type_style_index_0_id_ec71aef6_lang_scss_scoped_true = __webpack_require__("fd54");
+  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;
+    }
 
-// CONCATENATED MODULE: ./src/components/DataGrid/DataGrid.vue
+    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/SimpleDataGrid/parts/LazyObserver.vue?vue&type=script&lang=js
+ 
+// CONCATENATED MODULE: ./src/components/SimpleDataGrid/parts/LazyObserver.vue
 
 
 
 
 
-const DataGrid_exports_ = /*#__PURE__*/exportHelper_default()(DataGridvue_type_script_setup_true_lang_js, [['__scopeId',"data-v-ec71aef6"]])
+const LazyObserver_exports_ = /*#__PURE__*/exportHelper_default()(LazyObservervue_type_script_lang_js, [['render',LazyObservervue_type_template_id_00f625af_render]])
 
-/* harmony default export */ var DataGrid = (DataGrid_exports_);
-// CONCATENATED MODULE: ./src/components/DataGrid/index.js
+/* 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/SimpleDataGrid/DataGrid.vue?vue&type=script&setup=true&lang=js
 
-/* harmony default export */ var components_DataGrid = (DataGrid);
-// 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/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/components/SimpleDataGrid/SimpleDataGrid.vue?vue&type=script&setup=true&lang=js
 
 
 
 
 
-var SimpleDataGridvue_type_script_setup_true_lang_js_withScopeId = function _withScopeId(n) {
-  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-281ff745"), n = n(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])(), n;
+var DataGridvue_type_script_setup_true_lang_js_withScopeId = function _withScopeId(n) {
+  return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["pushScopeId"])("data-v-c79f67cc"), n = n(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["popScopeId"])(), n;
 };
 
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_1 = {
+var DataGridvue_type_script_setup_true_lang_js_hoisted_1 = {
   class: "data-grid__wrapper"
 };
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_2 = {
+var DataGridvue_type_script_setup_true_lang_js_hoisted_2 = {
   class: "data-grid"
 };
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_3 = {
+var DataGridvue_type_script_setup_true_lang_js_hoisted_3 = {
   class: "data-grid__head"
 };
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_4 = ["onClick"];
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_5 = {
-  class: "data-grid__body"
+var DataGridvue_type_script_setup_true_lang_js_hoisted_4 = ["onClick"];
+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 = {
+  key: 1
 };
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_6 = ["onClick"];
-var SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_7 = ["onClick"];
 
 
 
-var SimpleDataGridvue_type_script_setup_true_lang_js_default_ = {
-  name: "SimpleDataGrid"
+var DataGridvue_type_script_setup_true_lang_js_default_ = {
+  name: "DataGrid"
 };
 var ASC = "ASC";
 var DESC = "DESC";
 
-function SimpleDataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
+function DataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
   var emits = _ref.emit;
   var props = __props;
   var sortedRows = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])(props.rows);
+  var sortRules = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["ref"])([]);
+  Object(external_commonjs_vue_commonjs2_vue_root_Vue_["onMounted"])(function () {
+    var _iterator = _createForOfIteratorHelper(props.sortHandlers),
+        _step;
+
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var el = _step.value;
+        sortRules.value.push({
+          idx: el.idx,
+          rule: ASC
+        });
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  });
+
+  var getSortRule = function getSortRule(idx) {
+    var _iterator2 = _createForOfIteratorHelper(sortRules.value),
+        _step2;
+
+    try {
+      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+        var rule = _step2.value;
+        if (rule.idx === idx) return rule.rule;
+      }
+    } catch (err) {
+      _iterator2.e(err);
+    } finally {
+      _iterator2.f();
+    }
+  };
+
+  var setSortRule = function setSortRule(_idx, _rule) {
+    var _iterator3 = _createForOfIteratorHelper(sortRules.value),
+        _step3;
+
+    try {
+      for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+        var rule = _step3.value;
+        console.log(_idx);
+
+        if (rule.idx == _idx) {
+          console.log("kek", rule, _rule);
+          rule.rule = _rule;
+        }
+      }
+    } catch (err) {
+      _iterator3.e(err);
+    } finally {
+      _iterator3.f();
+    }
+  };
 
   var sortRows = function sortRows(idx) {
-    if (sortType === null || sortType === ASC) {
-      sortType = DESC;
+    var rule = getSortRule(idx);
+    var func = null;
+
+    for (var i = 0; i < props.sortHandlers.length; i++) {
+      if (props.sortHandlers[i].idx === idx) {
+        func = props.sortHandlers[i].fn;
+      }
+    }
+
+    if (!func) return;
+
+    if (rule === ASC) {
+      setSortRule(idx, DESC);
       sortedRows.value.sort(function (_x, _y) {
-        return props.sortHandler(_x[idx], _y[idx]);
+        return func(_x[idx], _y[idx]);
       });
       return;
     }
 
-    if (sortType === DESC) {
-      sortType = ASC;
+    if (rule === DESC) {
+      setSortRule(idx, ASC);
       sortedRows.value.sort(function (_x, _y) {
-        return props.sortHandler(_y[idx], _x[idx]);
+        return func(_y[idx], _x[idx]);
       });
-      return;
     }
   };
 
-  var sortType = null;
-
   var emitCellClick = function emitCellClick(_cell, _idx) {
     if (props.cellClickHandler) {
       emits(props.cellClickHandler, _cell, _idx, props.columns[_idx]);
-    } else {
-      return;
     }
   };
 
   var emitRowClick = function emitRowClick(_row, _idx) {
     if (props.rowClickHandler) {
       emits(props.rowClickHandler, _row, _idx);
-    } else {
-      return;
     }
   };
 
+  var isCustomColumn = function isCustomColumn(idx) {
+    for (var i = 0; i < props.customColumns.length; i++) {
+      if (props.customColumns[i].idx === idx) return true;
+    }
+
+    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 chunkRowsList = function chunkRowsList() {
+    var chunks = [];
+
+    for (var i = 0; i < Math.ceil(sortedRows.value.length / 25); i++) {
+      var chunk = sortedRows.value.slice(i * 25, (i + 1) * 25);
+      chunks.push(chunk);
+    }
+
+    return chunks;
+  };
+
+  var isSortable = function isSortable(idx) {
+    var _iterator4 = _createForOfIteratorHelper(props.sortHandlers),
+        _step4;
+
+    try {
+      for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+        var el = _step4.value;
+        if (el.idx === idx) return true;
+      }
+    } catch (err) {
+      _iterator4.e(err);
+    } finally {
+      _iterator4.f();
+    }
+
+    return false;
+  };
+
+  var isAscending = function isAscending(_idx) {
+    var _iterator5 = _createForOfIteratorHelper(sortRules.value),
+        _step5;
+
+    try {
+      for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+        var rule = _step5.value;
+
+        if (rule.idx === _idx) {
+          return rule.rule === ASC;
+        }
+      }
+    } catch (err) {
+      _iterator5.e(err);
+    } finally {
+      _iterator5.f();
+    }
+
+    return false;
+  };
+
   return function (_ctx, _cache) {
-    return Object(external_commonjs_vue_commonjs2_vue_root_Vue_["openBlock"])(), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementBlock"])("div", SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_1, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("table", SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_2, [Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("thead", SimpleDataGridvue_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) {
+    var _component_flat_button = Object(external_commonjs_vue_commonjs2_vue_root_Vue_["resolveComponent"])("flat-button");
+
+    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", {
         onClick: function onClick($event) {
           return sortRows(colIdx);
         },
         class: "data-grid__head-title",
         key: col
-      }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(col), 9, SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_4);
-    }), 128))])]), Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createElementVNode"])("tbody", SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_5, [(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"])(sortedRows.value, 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
-        }, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(cell), 9, SimpleDataGridvue_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"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(ContextMenu), {
+      }, [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), {
         key: 0,
-        direction: "vertical"
+        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))])]), (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), {
+        key: chunkIndex,
+        class: "data-grid__body"
       }, {
-        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"])(Object(external_commonjs_vue_commonjs2_vue_root_Vue_["unref"])(Buttons_FlatButton), {
+        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 _ctx.$emit(handler.eventName, row);
+                return emitRowClick(row, rowIdx);
               },
-              key: idx
+              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_7, Object(external_commonjs_vue_commonjs2_vue_root_Vue_["toDisplayString"])(cell), 1))], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_6);
+            }), 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"
             }, {
-              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)];
+              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
-            }, 1032, ["onClick"]);
+            }, 1024)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 8, DataGridvue_type_script_setup_true_lang_js_hoisted_5);
           }), 128))];
         }),
         _: 2
-      }, 1024)) : Object(external_commonjs_vue_commonjs2_vue_root_Vue_["createCommentVNode"])("", true)])], 8, SimpleDataGridvue_type_script_setup_true_lang_js_hoisted_6);
-    }), 128))])])]);
+      }, 1024);
+    }), 128))])]);
   };
 }
 
-/* harmony default export */ var SimpleDataGridvue_type_script_setup_true_lang_js = (/*#__PURE__*/Object.assign(SimpleDataGridvue_type_script_setup_true_lang_js_default_, {
+/* harmony default export */ var DataGridvue_type_script_setup_true_lang_js = (/*#__PURE__*/Object.assign(DataGridvue_type_script_setup_true_lang_js_default_, {
   props: {
     columns: {
       required: false,
@@ -12752,30 +12709,159 @@ function SimpleDataGridvue_type_script_setup_true_lang_js_setup(__props, _ref) {
       required: false,
       type: String
     },
-    sortHandler: {
+    sortHandlers: {
+      required: false,
+      type: Array
+    },
+    customColumns: {
       required: false
     }
   },
-  setup: SimpleDataGridvue_type_script_setup_true_lang_js_setup
+  setup: DataGridvue_type_script_setup_true_lang_js_setup
 }));
-// CONCATENATED MODULE: ./src/components/SimpleDataGrid/SimpleDataGrid.vue?vue&type=script&setup=true&lang=js
+// CONCATENATED MODULE: ./src/components/SimpleDataGrid/DataGrid.vue?vue&type=script&setup=true&lang=js
  
-// EXTERNAL MODULE: ./src/components/SimpleDataGrid/SimpleDataGrid.vue?vue&type=style&index=0&id=281ff745&lang=scss&scoped=true
-var SimpleDataGridvue_type_style_index_0_id_281ff745_lang_scss_scoped_true = __webpack_require__("c40d");
+// EXTERNAL MODULE: ./src/components/SimpleDataGrid/DataGrid.vue?vue&type=style&index=0&id=c79f67cc&lang=scss&scoped=true
+var DataGridvue_type_style_index_0_id_c79f67cc_lang_scss_scoped_true = __webpack_require__("c07b");
 
-// CONCATENATED MODULE: ./src/components/SimpleDataGrid/SimpleDataGrid.vue
+// CONCATENATED MODULE: ./src/components/SimpleDataGrid/DataGrid.vue
 
 
 
 
 
 
-const SimpleDataGrid_exports_ = /*#__PURE__*/exportHelper_default()(SimpleDataGridvue_type_script_setup_true_lang_js, [['__scopeId',"data-v-281ff745"]])
+const DataGrid_exports_ = /*#__PURE__*/exportHelper_default()(DataGridvue_type_script_setup_true_lang_js, [['__scopeId',"data-v-c79f67cc"]])
 
-/* harmony default export */ var SimpleDataGrid = (SimpleDataGrid_exports_);
+/* harmony default export */ var DataGrid = (DataGrid_exports_);
 // CONCATENATED MODULE: ./src/components/SimpleDataGrid/index.js
 
-/* harmony default export */ var components_SimpleDataGrid = (SimpleDataGrid);
+/* harmony default export */ var SimpleDataGrid = (DataGrid);
+// 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/LazyObserver/LazyObserver.vue?vue&type=template&id=773c4e08
+
+function LazyObservervue_type_template_id_773c4e08_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"])("div", {
+    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/LazyObserver/LazyObserver.vue?vue&type=template&id=773c4e08
+
+// 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 = ({
+  name: "McLazyObserver",
+  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/LazyObserver/LazyObserver.vue?vue&type=script&lang=js
+ 
+// CONCATENATED MODULE: ./src/components/LazyObserver/LazyObserver.vue
+
+
+
+
+
+const LazyObserver_LazyObserver_exports_ = /*#__PURE__*/exportHelper_default()(LazyObserver_LazyObservervue_type_script_lang_js, [['render',LazyObservervue_type_template_id_773c4e08_render]])
+
+/* harmony default export */ var LazyObserver_LazyObserver = (LazyObserver_LazyObserver_exports_);
+// CONCATENATED MODULE: ./src/components/LazyObserver/index.js
+
+/* harmony default export */ var components_LazyObserver = (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
 
 
@@ -12883,6 +12969,7 @@ const PopupTooltip_exports_ = /*#__PURE__*/exportHelper_default()(PopupTooltipvu
 
 
 
+ // export {default as DataGrid} from "./DataGrid";
 
 
 
@@ -13056,17 +13143,6 @@ module.exports = fails(function () {
 /* unused harmony reexport * */
 
 
-/***/ }),
-
-/***/ "fd54":
-/***/ (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_ec71aef6_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("3b2f");
-/* 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_ec71aef6_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_ec71aef6_lang_scss_scoped_true__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
-
-
 /***/ }),
 
 /***/ "fdbc":