@progress/kendo-vue-grid 3.0.2-dev.202201260931 → 3.0.4-dev.202202010701

package/dist/es/Grid.d.ts

@@ -10,7 +10,7 @@ import { VirtualScroll } from './VirtualScroll';
 import { ColumnResize } from './drag/ColumnResize';
 import { CommonDragLogic } from './drag/CommonDragLogic';
 import { DataItemWrapper } from './utils/index';
-import { GridProps } from './interfaces/GridProps';
+import { GridProps, GridEmits } from './interfaces/GridProps';
 import { GridColumnProps } from './interfaces/GridColumnProps';
 /**
  * Represents the [native Vue Grid component by Kendo UI]({% slug overview_grid_native %}).
@@ -141,5 +141,5 @@ export interface GridAll extends GridMethods, GridData, GridState, GridComputed,
  * Represents the default `Grid` component.
  */
 declare let GridVue2: ComponentOptions<Vue2type, DefaultData<GridData>, DefaultMethods<GridAll>, GridComputed, RecordPropsDefinition<GridProps>>;
-declare const Grid: DefineComponent<GridProps, any, GridData, GridComputed, GridMethods, {}, {}, {}, string, GridProps, GridProps, {}>;
+declare const Grid: DefineComponent<GridProps, any, GridData, GridComputed, GridMethods, {}, {}, GridEmits, string, GridProps, GridProps, {}>;
 export { Grid, GridVue2 };

package/dist/es/Grid.js

@@ -270,6 +270,7 @@ var GridVue2 = {
         this.dragLogic.dropElementClue.$el.remove();
       }
 
+      this.currentData = [];
       this._columns = [];
     },
     resetVirtual: function resetVirtual() {
@@ -694,6 +695,27 @@ var GridVue2 = {
       }).map(function (item) {
         return item.dataItem;
       });
+    },
+    totalGroupedRows: function totalGroupedRows(gridData) {
+      var allRowsCount = 0;
+
+      if (gridData) {
+        allRowsCount = this.addSubItems(gridData, allRowsCount);
+      }
+
+      return allRowsCount;
+    },
+    addSubItems: function addSubItems(gridData, allRowsCount) {
+      var _this = this;
+
+      gridData.forEach(function (item) {
+        allRowsCount++;
+
+        if (item.expanded !== false && item.items) {
+          allRowsCount = _this.addSubItems(item.items, allRowsCount);
+        }
+      });
+      return allRowsCount;
     }
   },
   // @ts-ignore
@@ -752,7 +774,7 @@ var GridVue2 = {
     if (this.$props.rowHeight !== undefined && this.$props.rowHeight > 0 && !groupable) {
       this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * (total || 0));
     } else {
-      this.vs.containerHeight = 1533915;
+      this.vs.containerHeight = 1533915; // this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * this.totalGroupedRows(gridData));
     }
 
     var children = defaultSlot || [];

package/dist/es/VirtualScroll.d.ts

@@ -16,6 +16,8 @@ export declare class VirtualScroll {
     PageChange: (page: Page, event: any) => void;
     tableBody: any;
     heightContainer: any;
+    fixedScroll: boolean;
+    askedSkip: number | undefined;
     private prevScrollPos;
     private syncTimeout;
     private tableTranslate;

package/dist/es/VirtualScroll.js

@@ -12,6 +12,8 @@ var VirtualScroll = /** @class */ (function () {
         this.realSkip = 0;
         this.pageSize = 0;
         this.heightContainer = null;
+        this.fixedScroll = false;
+        this.askedSkip = undefined;
         this.prevScrollPos = 0;
         this.tableTranslate = 0;
         this.scrollSyncing = false;
@@ -59,7 +61,7 @@ var VirtualScroll = /** @class */ (function () {
     };
     VirtualScroll.prototype.translate = function (dY) {
         this.tableTranslate = dY;
-        if (this.table) {
+        if (this.scrollableVirtual && this.table) {
             this.table.style.transform = 'translateY(' + dY + 'px)';
         }
     };
@@ -81,6 +83,9 @@ var VirtualScroll = /** @class */ (function () {
     };
     VirtualScroll.prototype.reset = function () {
         this.scrollSyncing = true;
+        if (this.fixedScroll) {
+            return;
+        }
         if (this.container) {
             this.container.scrollTop = 0;
         }
@@ -179,10 +184,17 @@ var VirtualScroll = /** @class */ (function () {
         }
         var grid = this;
         clearTimeout(this.syncTimeout);
-        this.syncTimeout = setTimeout(function () { grid.syncScroll(); }, 200);
+        this.syncTimeout = window.setTimeout(function () { grid.syncScroll(); }, 200);
         var scrollTop = this.container.scrollTop;
         var prev = this.prevScrollPos;
         this.prevScrollPos = scrollTop;
+        if (this.askedSkip !== undefined) {
+            this.translate(this.containerHeight * this.askedSkip / this.total);
+            this.changePage(this.askedSkip, e);
+            this.prevScrollPos = scrollTop;
+            this.askedSkip = undefined;
+            return;
+        }
         if (scrollTop - prev < 0 && scrollTop > this.tableTranslate - this.table.scrollHeight / 10) {
             this.localScrollUp(e);
         }

package/dist/es/cells/GridCell.js

@@ -102,7 +102,7 @@ var GridCellVue2 = {
       var dataAsString = '';
 
       if (data !== undefined && data !== null) {
-        dataAsString = this.$props.format ? this.$props.type ? this._intl.format(this.$props.format, parsers[this.$props.type](data, this._intl)) : this._intl.format(this.$props.format, data) : data.toString();
+        dataAsString = this.$props.format ? this.$props.type ? this._intl.format(this.$props.format, parsers[this.$props.type](data, this._intl, this.$props.format)) : this._intl.format(this.$props.format, data) : data.toString();
       }
 
       defaultRendering = h("td", {

package/dist/es/cells/GridFilterCell.js

@@ -220,11 +220,13 @@ var GridFilterCellVue2 = {
       "class": "k-filtercell-wrapper"
     }, [filterComponent.call(this, this.$props.filterType, this.$props.value), renderOperatorEditor.call(this), // @ts-ignore function children 
     h(Button, {
-      icon: 'filter-clear',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         icon: 'filter-clear',
         title: localizationService.toLanguageString(filterClearButton, messages[filterClearButton])
       },
+      icon: 'filter-clear',
       "class": {
         /* button is always visible if there is either value or operator */
         'k-disabled': !(!(this.$props.value === null || this.$props.value === '') || this.$props.operator)

package/dist/es/columnMenu/ColumnMenuContent.js

@@ -108,7 +108,8 @@ var ColumnMenuContentVue2 = {
         closemenu: this.closeMenu,
         filterchange: this.filterChange,
         sortchange: this.sortChange,
-        expandchange: this.expandChange
+        expandchange: this.expandChange,
+        contentfocus: this.handleFocus
       }
     });
   }

package/dist/es/columnMenu/GridColumnMenuCheckboxFilter.js

@@ -180,9 +180,9 @@ var GridColumnMenuCheckboxFilterVue2 = {
         on: this.v3 ? undefined : {
           "input": this.handleSearchChange
         }
-      })]), h("span", {
-        "class": "k-icon k-i-search"
-      })]);
+      }), h("span", {
+        "class": "k-input-icon k-icon k-i-search"
+      })])]);
     };
 
     var uniqueFilterValues = filterValues.filter(function (item, index) {

package/dist/es/columnMenu/GridColumnMenuFilterCell.js

@@ -21,7 +21,8 @@ var GridColumnMenuFilterCellVue2 = {
   },
   // @ts-ignore
   emits: {
-    change: null
+    change: null,
+    filtercellfocus: null
   },
   methods: {
     handleFocus: function handleFocus(e) {

package/dist/es/columnMenu/GridColumnMenuFilterUI.js

@@ -21,7 +21,9 @@ var GridColumnMenuFilterUIVue2 = {
   },
   // @ts-ignore
   emits: {
-    change: null
+    change: null,
+    filteruifocus: null,
+    logicChange: null
   },
   methods: {
     handleFocus: function handleFocus(e) {

package/dist/es/interfaces/GridProps.d.ts

@@ -276,6 +276,8 @@ export interface GridProps {
      * By default, navigation is disabled and the Grid content is accessible in the normal tab sequence.
      */
     navigatable?: boolean;
+}
+export interface GridEmits {
     /**
      * Fires when Grid keyboard navigation position is changed.
      */

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-grid',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1643189124,
+    publishDate: 1643698567,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/npm/Grid.d.ts

@@ -10,7 +10,7 @@ import { VirtualScroll } from './VirtualScroll';
 import { ColumnResize } from './drag/ColumnResize';
 import { CommonDragLogic } from './drag/CommonDragLogic';
 import { DataItemWrapper } from './utils/index';
-import { GridProps } from './interfaces/GridProps';
+import { GridProps, GridEmits } from './interfaces/GridProps';
 import { GridColumnProps } from './interfaces/GridColumnProps';
 /**
  * Represents the [native Vue Grid component by Kendo UI]({% slug overview_grid_native %}).
@@ -141,5 +141,5 @@ export interface GridAll extends GridMethods, GridData, GridState, GridComputed,
  * Represents the default `Grid` component.
  */
 declare let GridVue2: ComponentOptions<Vue2type, DefaultData<GridData>, DefaultMethods<GridAll>, GridComputed, RecordPropsDefinition<GridProps>>;
-declare const Grid: DefineComponent<GridProps, any, GridData, GridComputed, GridMethods, {}, {}, {}, string, GridProps, GridProps, {}>;
+declare const Grid: DefineComponent<GridProps, any, GridData, GridComputed, GridMethods, {}, {}, GridEmits, string, GridProps, GridProps, {}>;
 export { Grid, GridVue2 };

package/dist/npm/Grid.js

@@ -306,6 +306,7 @@ var GridVue2 = {
         this.dragLogic.dropElementClue.$el.remove();
       }
 
+      this.currentData = [];
       this._columns = [];
     },
     resetVirtual: function resetVirtual() {
@@ -730,6 +731,27 @@ var GridVue2 = {
       }).map(function (item) {
         return item.dataItem;
       });
+    },
+    totalGroupedRows: function totalGroupedRows(gridData) {
+      var allRowsCount = 0;
+
+      if (gridData) {
+        allRowsCount = this.addSubItems(gridData, allRowsCount);
+      }
+
+      return allRowsCount;
+    },
+    addSubItems: function addSubItems(gridData, allRowsCount) {
+      var _this = this;
+
+      gridData.forEach(function (item) {
+        allRowsCount++;
+
+        if (item.expanded !== false && item.items) {
+          allRowsCount = _this.addSubItems(item.items, allRowsCount);
+        }
+      });
+      return allRowsCount;
     }
   },
   // @ts-ignore
@@ -788,7 +810,7 @@ var GridVue2 = {
     if (this.$props.rowHeight !== undefined && this.$props.rowHeight > 0 && !groupable) {
       this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * (total || 0));
     } else {
-      this.vs.containerHeight = 1533915;
+      this.vs.containerHeight = 1533915; // this.vs.containerHeight = Math.min(1533915, this.$props.rowHeight * this.totalGroupedRows(gridData));
     }
 
     var children = defaultSlot || [];

package/dist/npm/VirtualScroll.d.ts

@@ -16,6 +16,8 @@ export declare class VirtualScroll {
     PageChange: (page: Page, event: any) => void;
     tableBody: any;
     heightContainer: any;
+    fixedScroll: boolean;
+    askedSkip: number | undefined;
     private prevScrollPos;
     private syncTimeout;
     private tableTranslate;

package/dist/npm/VirtualScroll.js

@@ -15,6 +15,8 @@ var VirtualScroll = /** @class */ (function () {
         this.realSkip = 0;
         this.pageSize = 0;
         this.heightContainer = null;
+        this.fixedScroll = false;
+        this.askedSkip = undefined;
         this.prevScrollPos = 0;
         this.tableTranslate = 0;
         this.scrollSyncing = false;
@@ -62,7 +64,7 @@ var VirtualScroll = /** @class */ (function () {
     };
     VirtualScroll.prototype.translate = function (dY) {
         this.tableTranslate = dY;
-        if (this.table) {
+        if (this.scrollableVirtual && this.table) {
             this.table.style.transform = 'translateY(' + dY + 'px)';
         }
     };
@@ -84,6 +86,9 @@ var VirtualScroll = /** @class */ (function () {
     };
     VirtualScroll.prototype.reset = function () {
         this.scrollSyncing = true;
+        if (this.fixedScroll) {
+            return;
+        }
         if (this.container) {
             this.container.scrollTop = 0;
         }
@@ -182,10 +187,17 @@ var VirtualScroll = /** @class */ (function () {
         }
         var grid = this;
         clearTimeout(this.syncTimeout);
-        this.syncTimeout = setTimeout(function () { grid.syncScroll(); }, 200);
+        this.syncTimeout = window.setTimeout(function () { grid.syncScroll(); }, 200);
         var scrollTop = this.container.scrollTop;
         var prev = this.prevScrollPos;
         this.prevScrollPos = scrollTop;
+        if (this.askedSkip !== undefined) {
+            this.translate(this.containerHeight * this.askedSkip / this.total);
+            this.changePage(this.askedSkip, e);
+            this.prevScrollPos = scrollTop;
+            this.askedSkip = undefined;
+            return;
+        }
         if (scrollTop - prev < 0 && scrollTop > this.tableTranslate - this.table.scrollHeight / 10) {
             this.localScrollUp(e);
         }

package/dist/npm/cells/GridCell.js

@@ -114,7 +114,7 @@ var GridCellVue2 = {
       var dataAsString = '';
 
       if (data !== undefined && data !== null) {
-        dataAsString = this.$props.format ? this.$props.type ? this._intl.format(this.$props.format, utils_1.parsers[this.$props.type](data, this._intl)) : this._intl.format(this.$props.format, data) : data.toString();
+        dataAsString = this.$props.format ? this.$props.type ? this._intl.format(this.$props.format, utils_1.parsers[this.$props.type](data, this._intl, this.$props.format)) : this._intl.format(this.$props.format, data) : data.toString();
       }
 
       defaultRendering = h("td", {

package/dist/npm/cells/GridFilterCell.js

@@ -236,11 +236,13 @@ var GridFilterCellVue2 = {
       "class": "k-filtercell-wrapper"
     }, [filterComponent.call(this, this.$props.filterType, this.$props.value), renderOperatorEditor.call(this), // @ts-ignore function children 
     h(kendo_vue_buttons_1.Button, {
-      icon: 'filter-clear',
+      type: "button",
       attrs: this.v3 ? undefined : {
+        type: "button",
         icon: 'filter-clear',
         title: localizationService.toLanguageString(messages_1.filterClearButton, messages_1.messages[messages_1.filterClearButton])
       },
+      icon: 'filter-clear',
       "class": {
         /* button is always visible if there is either value or operator */
         'k-disabled': !(!(this.$props.value === null || this.$props.value === '') || this.$props.operator)

package/dist/npm/columnMenu/ColumnMenuContent.js

@@ -119,7 +119,8 @@ var ColumnMenuContentVue2 = {
         closemenu: this.closeMenu,
         filterchange: this.filterChange,
         sortchange: this.sortChange,
-        expandchange: this.expandChange
+        expandchange: this.expandChange,
+        contentfocus: this.handleFocus
       }
     });
   }

package/dist/npm/columnMenu/GridColumnMenuCheckboxFilter.js

@@ -198,9 +198,9 @@ var GridColumnMenuCheckboxFilterVue2 = {
         on: this.v3 ? undefined : {
           "input": this.handleSearchChange
         }
-      })]), h("span", {
-        "class": "k-icon k-i-search"
-      })]);
+      }), h("span", {
+        "class": "k-input-icon k-icon k-i-search"
+      })])]);
     };
 
     var uniqueFilterValues = filterValues.filter(function (item, index) {

package/dist/npm/columnMenu/GridColumnMenuFilterCell.js

@@ -33,7 +33,8 @@ var GridColumnMenuFilterCellVue2 = {
   },
   // @ts-ignore
   emits: {
-    change: null
+    change: null,
+    filtercellfocus: null
   },
   methods: {
     handleFocus: function handleFocus(e) {

package/dist/npm/columnMenu/GridColumnMenuFilterUI.js

@@ -32,7 +32,9 @@ var GridColumnMenuFilterUIVue2 = {
   },
   // @ts-ignore
   emits: {
-    change: null
+    change: null,
+    filteruifocus: null,
+    logicChange: null
   },
   methods: {
     handleFocus: function handleFocus(e) {

package/dist/npm/interfaces/GridProps.d.ts

@@ -276,6 +276,8 @@ export interface GridProps {
      * By default, navigation is disabled and the Grid content is accessible in the normal tab sequence.
      */
     navigatable?: boolean;
+}
+export interface GridEmits {
     /**
      * Fires when Grid keyboard navigation position is changed.
      */

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-vue-grid',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1643189124,
+    publishDate: 1643698567,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-vue-grid",
-  "version": "3.0.2-dev.202201260931",
+  "version": "3.0.4-dev.202202010701",
   "description": "Kendo UI for Vue Grid package",
   "repository": {
     "type": "git",
@@ -34,23 +34,23 @@
     "vue": "^2.6.12 || ^3.0.2"
   },
   "dependencies": {
-    "@progress/kendo-vue-common": "3.0.2-dev.202201260931"
+    "@progress/kendo-vue-common": "3.0.4-dev.202202010701"
   },
   "devDependencies": {
     "@progress/kendo-data-query": "^1.5.4",
     "@progress/kendo-drawing": "^1.9.3",
     "@progress/kendo-licensing": "^1.1.0",
-    "@progress/kendo-vue-animation": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-buttons": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-charts": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-data-tools": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-dateinputs": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-dropdowns": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-excel-export": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-inputs": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-intl": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-pdf": "3.0.2-dev.202201260931",
-    "@progress/kendo-vue-popup": "3.0.2-dev.202201260931",
+    "@progress/kendo-vue-animation": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-buttons": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-charts": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-data-tools": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-dateinputs": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-dropdowns": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-excel-export": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-inputs": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-intl": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-pdf": "3.0.4-dev.202202010701",
+    "@progress/kendo-vue-popup": "3.0.4-dev.202202010701",
     "cldr-core": "^34.0.0",
     "cldr-dates-full": "^34.0.0",
     "cldr-numbers-full": "^34.0.0",