@progress/kendo-vue-grid 7.1.0-develop.7 → 8.0.0-develop.1

package/header/HeaderRow.mjs

@@ -5,25 +5,26 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as A, createVNode as r, isVNode as F } from "vue";
-import { normalize as z } from "../interfaces/GridSortSettings.mjs";
-import { ColumnResizer as v } from "../drag/ColumnResizer.mjs";
-import { ColumnDraggable as B } from "../drag/ColumnDraggable.mjs";
-import { GridHeaderCell as K } from "./GridHeaderCell.mjs";
-import { ColumnMenu as V } from "../columnMenu/ColumnMenu.mjs";
-import { noop as N, templateRendering as T, getListeners as _, Keys as H, hasListener as P, Icon as E } from "@progress/kendo-vue-common";
-import { HeaderThElement as q } from "@progress/kendo-vue-data-tools";
-import { sortableColumnAriaLabel as S, messages as C, sortableColumnAscendingAriaLabel as y, sortableColumnDescendingAriaLabel as M } from "../messages/main.mjs";
-import { provideLocalizationService as G } from "@progress/kendo-vue-intl";
-import { sortAscSmallIcon as U, sortDescSmallIcon as J } from "@progress/kendo-svg-icons";
-function $(t) {
-  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !F(t);
+import { defineComponent as _, createVNode as r, isVNode as P } from "vue";
+import { normalize as q } from "../interfaces/GridSortSettings.mjs";
+import { ColumnResizer as E } from "../drag/ColumnResizer.mjs";
+import { ColumnDraggable as G } from "../drag/ColumnDraggable.mjs";
+import { GridHeaderCell as U } from "./GridHeaderCell.mjs";
+import { ColumnMenu as J } from "../columnMenu/ColumnMenu.mjs";
+import { noop as Q, templateRendering as W, getListeners as X, Keys as M, hasListener as Y, Icon as Z } from "@progress/kendo-vue-common";
+import { HeaderThElement as ee } from "@progress/kendo-vue-data-tools";
+import { sortableColumnAriaLabel as O, messages as k, sortableColumnAscendingAriaLabel as I, sortableColumnDescendingAriaLabel as z } from "../messages/main.mjs";
+import { provideLocalizationService as ne } from "@progress/kendo-vue-intl";
+import { sortAscSmallIcon as te, sortDescSmallIcon as le } from "@progress/kendo-svg-icons";
+import { getVirtualHeaderCellsToRender as re } from "../utils/virtualColumns.mjs";
+function H(n) {
+  return typeof n == "function" || Object.prototype.toString.call(n) === "[object Object]" && !P(n);
 }
-const k = {
+const S = {
   none: "none",
   asc: "ascending",
   desc: "descending"
-}, Q = {
+}, oe = {
   true: {
     asc: "desc",
     desc: "",
@@ -34,7 +35,7 @@ const k = {
     desc: "asc",
     "": "asc"
   }
-}, ae = /* @__PURE__ */ A({
+}, $e = /* @__PURE__ */ _({
   name: "KendoHeaderRow",
   props: {
     grid: Object,
@@ -51,6 +52,8 @@ const k = {
     filterChange: Function,
     filterRow: Object,
     columns: Array,
+    cellsToRender: Array,
+    columnVirtualization: Boolean,
     columnsMap: Array,
     columnResize: Object,
     columnMenu: [Boolean, String, Function, Object],
@@ -75,7 +78,7 @@ const k = {
   },
   inject: {
     onNavFocus: {
-      default: N
+      default: Q
     },
     kendoLocalizationService: {
       default: null
@@ -90,51 +93,51 @@ const k = {
     this.serviceIndex = 0, this.index = -1, this._element = null, this.cellClick = this.cellClick.bind(this);
   },
   methods: {
-    pressHandler(t, n) {
-      this.$emit("pressHandler", t, n);
+    pressHandler(n, t) {
+      this.$emit("pressHandler", n, t);
     },
-    dragHandler(t, n) {
-      this.$emit("dragHandler", t, n);
+    dragHandler(n, t) {
+      this.$emit("dragHandler", n, t);
     },
-    releaseHandler(t) {
-      this.$emit("releaseHandler", t);
+    releaseHandler(n) {
+      this.$emit("releaseHandler", n);
     },
-    selectionChangeHandler(t) {
-      this.$emit("selectionchange", t);
+    selectionChangeHandler(n) {
+      this.$emit("selectionchange", n);
     },
-    cellClick(t, n) {
-      if (t.preventDefault(), !P.call(this, "sortChange"))
+    cellClick(n, t) {
+      if (n.preventDefault(), !Y.call(this, "sortChange"))
         return;
       const {
         allowUnsort: u,
         mode: h
-      } = z(this.$props.sortable || !1, n.sortable || !1), o = (this.$props.sort || []).filter((a) => a.field === n.field)[0], s = Q[u][o && o.dir || ""], i = h === "single" ? [] : (this.$props.sort || []).filter((a) => a.field !== n.field);
-      s !== "" && n.field && i.push({
-        field: n.field,
-        dir: s
-      }), this.sortChangeHandler(i, {
-        event: t,
-        field: n.field
+      } = q(this.$props.sortable || !1, t.sortable || !1), s = (this.$props.sort || []).filter((o) => o.field === t.field)[0], c = oe[u][s && s.dir || ""], f = h === "single" ? [] : (this.$props.sort || []).filter((o) => o.field !== t.field);
+      c !== "" && t.field && f.push({
+        field: t.field,
+        dir: c
+      }), this.sortChangeHandler(f, {
+        event: n,
+        field: t.field
       });
     },
-    sortChangeHandler(t, n) {
-      this.$emit("sortChange", t, n);
+    sortChangeHandler(n, t) {
+      this.$emit("sortChange", n, t);
     },
-    filterChangeHandler(t, n) {
-      this.$emit("filterChange", t, n);
+    filterChangeHandler(n, t) {
+      this.$emit("filterChange", n, t);
     },
-    cellClass(t, n, u) {
-      const h = n ? " " + n : "";
-      let o = "k-header" + (u ? " k-grid-header-sticky" : "") + h;
-      return this.$props.sort && this.$props.sort.filter((s) => s.field === t).length > 0 && (o += " k-sorted"), o;
+    cellClass(n, t, u) {
+      const h = t ? " " + t : "";
+      let s = "k-header" + (u ? " k-grid-header-sticky" : "") + h;
+      return this.$props.sort && this.$props.sort.filter((c) => c.field === n).length > 0 && (s += " k-sorted"), s;
     },
-    cellKeyDown(t, n) {
-      t.defaultPrevented || (t.keyCode === H.enter && this.cellClick(t, n), t.altKey && t.keyCode === H.down && n.field && (t.preventDefault(), this.columnMenuOpened = {
-        [n.field]: !0
+    cellKeyDown(n, t) {
+      n.defaultPrevented || (n.keyCode === M.enter && this.cellClick(n, t), n.altKey && n.keyCode === M.down && t.field && (n.preventDefault(), this.columnMenuOpened = {
+        [t.field]: !0
       }));
     },
-    getTemplate(t) {
-      return T.call(this.$props.grid, t, _.call(this.$props.grid));
+    getTemplate(n) {
+      return W.call(this.$props.grid, n, X.call(this.$props.grid));
     },
     columnMenuClose() {
       this.onNavFocus({}), this.columnMenuOpened = {};
@@ -150,70 +153,77 @@ const k = {
       };
     }
   },
-  render(t) {
-    const n = G(this), u = n.toLanguageString(S, C[S]), h = n.toLanguageString(y, C[y]), o = n.toLanguageString(M, C[M]);
+  render() {
+    const n = ne(this), t = n.toLanguageString(O, k[O]), u = n.toLanguageString(I, k[I]), h = n.toLanguageString(z, k[z]);
     this.serviceIndex = 0, this.index = -1;
-    const s = function(i) {
-      return i.map(function(a) {
-        const e = this.$props.columns[a], f = this.$props.sortable && e.sortable, g = this.$props.sort ? this.$props.sort.findIndex((l) => l.field === e.field) : -1, b = g >= 0 && this.$props.sort[g].dir || "none", d = function(l) {
+    const s = this.$props.columnsMap && this.$props.columnsMap.length === 1, c = this.$props.columnVirtualization && s, f = function(o, m) {
+      const i = re({
+        cellsToRender: this.$props.cellsToRender || [],
+        columns: this.$props.columns,
+        rowIndex: m,
+        enableVirtualization: c
+      }), R = i.columnsToRender.length > 0, L = R ? i.columnsToRender : o, w = R ? i.colSpans : [];
+      return L.map(function(A, D) {
+        var y;
+        const e = this.$props.columns[A], g = this.$props.sortable && e.sortable, C = this.$props.sort ? this.$props.sort.findIndex((l) => l.field === e.field) : -1, $ = C >= 0 && this.$props.sort[C].dir || "none", d = function(l) {
           if (!this.$props.sort)
             return null;
-          const m = l >= 0 ? this.$props.sort[l].dir : "";
+          const b = l >= 0 ? this.$props.sort[l].dir : "";
           return l >= 0 && [r("span", {
             key: 1,
             class: "k-sort-icon"
-          }, [r(E, {
-            name: "sort-" + m + "-small",
-            icon: m === "asc" ? U : J
+          }, [r(Z, {
+            name: "sort-" + b + "-small",
+            icon: b === "asc" ? te : le
           }, null)]), this.$props.sort.length > 1 && r("span", {
             key: 2,
             class: "k-sort-icon"
           }, [r("span", {
             class: "k-sort-order"
           }, [l + 1])])];
-        }.call(this, g), c = e.columnMenu || e.columnMenu === !1 ? e.columnMenu : this.$props.columnMenu, R = e.menuIcon || this.$props.columnMenuIcon, O = (e.kFirst ? "k-first " : "") + this.cellClass(e.field, e.headerClassName, e.locked) + (c ? " k-filterable" : ""), I = !c || typeof c == "boolean" ? !!c : this.getTemplate(c), L = e.left !== void 0 ? this.$props.isRtl ? {
+        }.call(this, C), a = e.columnMenu || e.columnMenu === !1 ? e.columnMenu : this.$props.columnMenu, j = e.menuIcon || this.$props.columnMenuIcon, x = (e.kFirst ? "k-first " : "") + this.cellClass(e.field, e.headerClassName, e.locked) + (a ? " k-filterable" : ""), F = !a || typeof a == "boolean" ? !!a : this.getTemplate(a), v = e.locked && e.left !== void 0 ? this.$props.isRtl ? {
           left: e.right + "px",
           right: e.left + "px"
         } : {
           left: e.left + "px",
           right: e.right + "px"
-        } : {}, D = k[b] === "none" ? u : k[b] === "ascending" ? h : o;
+        } : void 0, T = S[$] === "none" ? t : S[$] === "ascending" ? u : h;
         let p = e.isAccessible ? {
-          ariaSort: k[b],
-          ariaLabel: D,
+          ariaSort: S[$],
+          ariaLabel: T,
           role: "columnheader",
           ariaColumnIndex: this.$props.isColCountDefined ? this.$props.columnsInitial.findIndex((l) => l.field === e.field) + 1 : void 0,
           ariaSelected: !1,
-          ariaHaspopup: c ? "menu" : this.$props.filterable && e.filterable ? "dialog" : void 0
+          ariaHaspopup: a ? "menu" : this.$props.filterable && e.filterable ? "dialog" : void 0
         } : {
           role: "columnheader"
         };
-        const j = e.declarationIndex >= 0 ? ++this.index : --this.serviceIndex, w = e.columnMenuOpened !== void 0 ? e.columnMenuOpened : this.columnMenuOpened[e.field];
-        return r(q, {
-          ariaSort: f ? p.ariaSort : void 0,
-          ariaLabel: f ? p.ariaLabel : void 0,
+        const V = e.declarationIndex >= 0 ? ++this.index : --this.serviceIndex, B = e.columnMenuOpened !== void 0 ? e.columnMenuOpened : this.columnMenuOpened[e.field], K = (y = w[D]) != null ? y : e.headerColSpan;
+        return r(ee, {
+          ariaSort: g ? p.ariaSort : void 0,
+          ariaLabel: g ? p.ariaLabel : void 0,
           role: p.role,
           ariaColumnIndex: p.ariaColumnIndex,
           ariaSelected: p.ariaSelected,
           ariaHaspopup: p.ariaHaspopup,
-          key: j,
-          colSpan: e.headerColSpan,
+          key: V,
+          colSpan: K,
           rowSpan: e.rowSpan,
-          class: O,
-          style: L,
+          class: x,
+          style: v,
           columnId: e.id,
           navigatable: e.navigatable,
           onKeydown: (l) => this.cellKeyDown(l, e)
         }, {
-          default: () => [[e.children.length === 0 && c && r(V, {
+          default: () => [[e.children.length === 0 && a && r(J, {
             key: 0,
             column: {
               field: e.field,
               filter: e.filter
             },
-            opened: w,
+            opened: B,
             animate: this.$props.columnMenuAnimate,
-            sortable: f,
+            sortable: g,
             sort: this.$props.sort,
             onClose: this.columnMenuClose,
             onSortchange: this.sortChangeHandler,
@@ -221,36 +231,36 @@ const k = {
             filterable: this.$props.filterable && e.filterable,
             filterOperators: this.$props.filterOperators,
             onFilterchange: this.filterChangeHandler,
-            render: I,
-            columnMenuIcon: R
+            render: F,
+            columnMenuIcon: j
           }, null), e.internalHeaderCell && r("span", {
             class: "k-cell-inner"
           }, [r(e.internalHeaderCell, {
             key: 1,
             field: e.field,
-            sortable: f,
+            sortable: g,
             onHeadercellclick: (l) => this.cellClick(l, e),
             onSelectionchange: this.selectionChangeHandler,
             selectionValue: e.headerSelectionValue,
             title: e.title,
             render: (e.headerCell || this.$props.cellRender) && this.getTemplate(e.headerCell || this.$props.cellRender)
-          }, $(d) ? d : {
+          }, H(d) ? d : {
             default: () => [d]
           })]) || r("span", {
             class: "k-cell-inner"
-          }, [r(K, {
+          }, [r(U, {
             key: 1,
             field: e.field,
-            sortable: f,
+            sortable: g,
             onHeadercellclick: (l) => this.cellClick(l, e),
             selectionValue: e.headerSelectionValue,
             title: e.title,
             render: (e.headerCell || this.$props.cellRender) && this.getTemplate(e.headerCell || this.$props.cellRender)
-          }, $(d) ? d : {
+          }, H(d) ? d : {
             default: () => [d]
-          })]), this.$props.columnResize && this.$props.columnResize.resizable && e.resizable && r(v, {
+          })]), this.$props.columnResize && this.$props.columnResize.resizable && e.resizable && r(E, {
             key: 2,
-            onResize: (l, m, x) => this.$props.columnResize && this.$props.columnResize.dragHandler(l, e, m, x)
+            onResize: (l, b, N) => this.$props.columnResize && this.$props.columnResize.dragHandler(l, e, b, N)
           }, null)]]
         });
       }, this);
@@ -259,23 +269,23 @@ const k = {
       role: "rowgroup",
       class: this.theadClasses,
       "data-keyboardnavheader": !0
-    }, [this.$props.columnsMap.map(function(i, a) {
-      let e;
-      return (this.$props.groupable || this.$props.reorderable) && r(B, {
-        key: a,
+    }, [this.$props.columnsMap.map(function(o, m) {
+      let i;
+      return (this.$props.groupable || this.$props.reorderable) && r(G, {
+        key: m,
         onPressHandler: this.pressHandler,
         onDragHandler: this.dragHandler,
         onReleaseHandler: this.releaseHandler
-      }, $(e = s.call(this, i)) ? e : {
-        default: () => [e]
+      }, H(i = f.call(this, o, m)) ? i : {
+        default: () => [i]
       }) || r("tr", {
         class: "k-table-row",
         role: "row",
         "aria-rowindex": this.columnsMap.length
-      }, [s.call(this, i)]);
+      }, [f.call(this, o, m)]);
     }, this), this.$props.filterRow]);
   }
 });
 export {
-  ae as HeaderRow
+  $e as HeaderRow
 };

package/index.d.mts

@@ -190,9 +190,6 @@ rowIndex: PropType<number>;
 columnStyles(column: ExtendedColumnProps): {
 left: string;
 right: string;
-} | {
-left?: undefined;
-right?: undefined;
 };
 }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
 isRtl: PropType<boolean>;
@@ -326,8 +323,8 @@ defaultGroup: PropType<GroupDescriptor[]>;
 groupable: PropType<boolean | GridGroupableSettings_2>;
 groupExpand: PropType<GroupExpandDescriptor[]>;
 defaultGroupExpand: PropType<GroupExpandDescriptor[]>;
-detailExpand: PropType<GroupExpandDescriptor>;
-defaultDetailExpand: PropType<GroupExpandDescriptor>;
+detailExpand: PropType<DetailExpandDescriptor>;
+defaultDetailExpand: PropType<DetailExpandDescriptor>;
 editField: PropType<string>;
 rowClass: PropType<Function>;
 scrollable: {
@@ -508,8 +505,8 @@ defaultGroup: PropType<GroupDescriptor[]>;
 groupable: PropType<boolean | GridGroupableSettings_2>;
 groupExpand: PropType<GroupExpandDescriptor[]>;
 defaultGroupExpand: PropType<GroupExpandDescriptor[]>;
-detailExpand: PropType<GroupExpandDescriptor>;
-defaultDetailExpand: PropType<GroupExpandDescriptor>;
+detailExpand: PropType<DetailExpandDescriptor>;
+defaultDetailExpand: PropType<DetailExpandDescriptor>;
 editField: PropType<string>;
 rowClass: PropType<Function>;
 scrollable: {
@@ -2600,7 +2597,7 @@ export declare interface GridProps {
      * <Grid :detail-expand="{ 1: true, 3: true }" />
      * ```
      */
-    detailExpand?: GroupExpandDescriptor;
+    detailExpand?: DetailExpandDescriptor;
     /**
      * The default `detailExpand` state applied to the Grid when using uncontrolled mode.
      *
@@ -2609,7 +2606,7 @@ export declare interface GridProps {
      * <Grid :default-detail-expand="{ 2: true, 4: true }" />
      * ```
      */
-    defaultDetailExpand?: GroupExpandDescriptor;
+    defaultDetailExpand?: DetailExpandDescriptor;
     /**
      * Fires when the user expands or collapses a detail row.
      */
@@ -3271,6 +3268,7 @@ export declare function mapColumns(columns: Array<{
     right: number;
     rightBorder: boolean;
     ariaColumnIndex: number;
+    virtualColumnOffset?: number;
 }>, changedColumnLength?: boolean): number[][];
 
 /**

package/index.d.ts

@@ -190,9 +190,6 @@ rowIndex: PropType<number>;
 columnStyles(column: ExtendedColumnProps): {
 left: string;
 right: string;
-} | {
-left?: undefined;
-right?: undefined;
 };
 }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
 isRtl: PropType<boolean>;
@@ -326,8 +323,8 @@ defaultGroup: PropType<GroupDescriptor[]>;
 groupable: PropType<boolean | GridGroupableSettings_2>;
 groupExpand: PropType<GroupExpandDescriptor[]>;
 defaultGroupExpand: PropType<GroupExpandDescriptor[]>;
-detailExpand: PropType<GroupExpandDescriptor>;
-defaultDetailExpand: PropType<GroupExpandDescriptor>;
+detailExpand: PropType<DetailExpandDescriptor>;
+defaultDetailExpand: PropType<DetailExpandDescriptor>;
 editField: PropType<string>;
 rowClass: PropType<Function>;
 scrollable: {
@@ -508,8 +505,8 @@ defaultGroup: PropType<GroupDescriptor[]>;
 groupable: PropType<boolean | GridGroupableSettings_2>;
 groupExpand: PropType<GroupExpandDescriptor[]>;
 defaultGroupExpand: PropType<GroupExpandDescriptor[]>;
-detailExpand: PropType<GroupExpandDescriptor>;
-defaultDetailExpand: PropType<GroupExpandDescriptor>;
+detailExpand: PropType<DetailExpandDescriptor>;
+defaultDetailExpand: PropType<DetailExpandDescriptor>;
 editField: PropType<string>;
 rowClass: PropType<Function>;
 scrollable: {
@@ -2600,7 +2597,7 @@ export declare interface GridProps {
      * <Grid :detail-expand="{ 1: true, 3: true }" />
      * ```
      */
-    detailExpand?: GroupExpandDescriptor;
+    detailExpand?: DetailExpandDescriptor;
     /**
      * The default `detailExpand` state applied to the Grid when using uncontrolled mode.
      *
@@ -2609,7 +2606,7 @@ export declare interface GridProps {
      * <Grid :default-detail-expand="{ 2: true, 4: true }" />
      * ```
      */
-    defaultDetailExpand?: GroupExpandDescriptor;
+    defaultDetailExpand?: DetailExpandDescriptor;
     /**
      * Fires when the user expands or collapses a detail row.
      */
@@ -3271,6 +3268,7 @@ export declare function mapColumns(columns: Array<{
     right: number;
     rightBorder: boolean;
     ariaColumnIndex: number;
+    virtualColumnOffset?: number;
 }>, changedColumnLength?: boolean): number[][];
 
 /**

package/package-metadata.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-grid",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1770355607,version:"7.1.0-develop.7",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/"};exports.packageMetadata=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-grid",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1770361088,version:"8.0.0-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/"};exports.packageMetadata=e;

package/package-metadata.mjs

@@ -10,8 +10,8 @@ const e = {
   productName: "Kendo UI for Vue",
   productCode: "KENDOUIVUE",
   productCodes: ["KENDOUIVUE"],
-  publishDate: 1770355607,
-  version: "7.1.0-develop.7",
+  publishDate: 1770361088,
+  version: "8.0.0-develop.1",
   licensingDocsUrl: "https://www.telerik.com/kendo-vue-ui/my-license/"
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-vue-grid",
-  "version": "7.1.0-develop.7",
+  "version": "8.0.0-develop.1",
   "description": "TODO",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -21,16 +21,16 @@
     "@progress/kendo-data-query": "^1.7.0",
     "@progress/kendo-drawing": "^1.21.1",
     "@progress/kendo-licensing": "^1.7.2",
-    "@progress/kendo-vue-animation": "7.1.0-develop.7",
-    "@progress/kendo-vue-buttons": "7.1.0-develop.7",
-    "@progress/kendo-vue-common": "7.1.0-develop.7",
-    "@progress/kendo-vue-data-tools": "7.1.0-develop.7",
-    "@progress/kendo-vue-dateinputs": "7.1.0-develop.7",
-    "@progress/kendo-vue-indicators": "7.1.0-develop.7",
-    "@progress/kendo-vue-dropdowns": "7.1.0-develop.7",
-    "@progress/kendo-vue-inputs": "7.1.0-develop.7",
-    "@progress/kendo-vue-intl": "7.1.0-develop.7",
-    "@progress/kendo-vue-popup": "7.1.0-develop.7",
+    "@progress/kendo-vue-animation": "8.0.0-develop.1",
+    "@progress/kendo-vue-buttons": "8.0.0-develop.1",
+    "@progress/kendo-vue-common": "8.0.0-develop.1",
+    "@progress/kendo-vue-data-tools": "8.0.0-develop.1",
+    "@progress/kendo-vue-dateinputs": "8.0.0-develop.1",
+    "@progress/kendo-vue-indicators": "8.0.0-develop.1",
+    "@progress/kendo-vue-dropdowns": "8.0.0-develop.1",
+    "@progress/kendo-vue-inputs": "8.0.0-develop.1",
+    "@progress/kendo-vue-intl": "8.0.0-develop.1",
+    "@progress/kendo-vue-popup": "8.0.0-develop.1",
     "@progress/kendo-svg-icons": "^4.4.0",
     "vue": "^3.0.2"
   },
@@ -51,7 +51,7 @@
     "package": {
       "productName": "Kendo UI for Vue",
       "productCode": "KENDOUIVUE",
-      "publishDate": 1770355607,
+      "publishDate": 1770361088,
       "licensingDocsUrl": "https://www.telerik.com/kendo-vue-ui/my-license/"
     }
   },

package/utils/main.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("@progress/kendo-vue-data-tools"),w=require("@progress/kendo-vue-common"),v=require("../GridColumn.js"),y="string";function I(e,t){const n=e.split(".");let r=t;return n.forEach(a=>{r=r?r[a]:void 0}),r}function M(e,t,n,r,a,l,i,o,d,s,c=0,f){let g=c;for(let h=0;h<t.length;h++){let u;if(!a||t[h].value===void 0||t[h].items===void 0){const p=d?!!(l!=null&&l[w.getter(d)(t[h])]):!1;e[e.length]={dataIndex:r.index,dataItem:t[h],rowType:"data",level:c,group:f,expanded:s!==void 0?I(s,t[h]):p!=null?p:!1},r.index++;continue}else{let p;f!=null&&f.parents?p=[{field:f.field,value:f.value},...f.parents]:f?p=[f]:p=[],u={field:t[h].field,value:t[h].value,parents:p}}g=Math.max(g,c+1);let C=!1;const m=x.findGroupExpand(i||[],u);s?C=s===void 0||I(s,t[h])===void 0||I(s,t[h]):C=m?m.expanded!==!1:o!==!1,e[e.length]={dataIndex:-1,dataItem:t[h],level:c,group:u,rowType:"groupHeader",expanded:C},C&&(u.expanded=C,g=Math.max(M(e,t[h].items,n,r,a,l,i,o,d,s,c+1,u),g)),(n==="always"||C&&n==="visible")&&(e[e.length]={dataIndex:-1,dataItem:t[h],rowType:"groupFooter",level:c,expanded:C})}return g}function F(e){return e&&getComputedStyle(e).direction==="rtl"||!1}function A(e,t){if(!t||!e||!e.originalEvent||!w.canUseDOM)return-1;let n=document.elementFromPoint(e.clientX,e.originalEvent.clientY);for(;n&&n.parentElement!==t;)n=n.parentElement;const r=t.children;for(let a=0;a<r.length;a++)if(r[a]===n)return a;return-1}const E=["sortChange","filterChange","groupChange","pageChange","expandChange","selectionChange","headerSelectionChange","rowClick","itemChange","dataStateChange","columnResize","columnReorder"],k=(e,t)=>`The ${e} event handler property is deprecated, use https://www.telerik.com/kendo-vue-ui/components/grid/api/GridProps/#toc-${t} instead`;function N(e){for(let t=0;t<E.length;t++){const n=E[t];if(e[n]!==void 0){const r="on"+n.charAt(0).toUpperCase()+n.slice(1);console.warn(k(n,r))}}}function H(e,t){const n=[[]];let r=0;for(let i=e.length-1;i>=0;i--)r=Math.max(r,e[i].depth),e[i].headerColSpan=e[i].headerColSpan||1,e[i].children.length>0&&(e[i].headerColSpan=e[i].children.reduce((o,d)=>d.hidden?o:o+d.headerColSpan,0));const a=[];let l=1;return e.forEach((i,o)=>{n[i.depth]=n[i.depth]||[];let d=!1;n[i.depth].length===0&&(l<=1?l=1+(i.children.length>0?0:r-i.depth):(l--,d=!0)),i.rowSpan=1+(i.children.length>0?0:r-i.depth),i.kFirst=d,i.index=n[i.depth].length,n[i.depth].push(o),i.ariaColumnIndex=a[i.depth]?a[i.depth]+1:1;for(let s=i.depth;s<i.depth+i.rowSpan;s++)a[s]=(a[s]||0)+i.headerColSpan}),x.updateLeft(n,e,t),x.updateRight(n,e,t),n}function R(e,t,n,r=0,a=!1){const l=[];if(!e)return[];e&&e.length===void 0&&(e=[e]),e.forEach((o,d)=>{o=o;const s=o.id?o.id:x.tableKeyboardNavigationTools.generateNavigatableId(`${n.prevId++}`,n.idPrefix,"column"),c=w.canUseDOM&&o.media&&window.matchMedia?!window.matchMedia(o.media).matches:!1,f=a||c||o.hidden,g=t==null?void 0:t.find(u=>u.id===s),h=R(o.children,(g==null?void 0:g.children)||[],n,r+1,f);l.push({depth:r,...v.gridDefaultProps,...h.length?{cell:()=>null,filterCell:()=>null}:{},...o,id:s,declarationIndex:l.length,children:h,headerColSpan:0,rowSpan:0,columnType:o.columnType||"data",colSpan:o.colSpan||1,isAccessible:!0,hidden:f,left:null,right:null,rowSpannable:o.rowSpannable,...g?{width:g.width,orderIndex:g.orderIndex}:{}})});const i=(o,d)=>o.orderIndex===d.orderIndex?o.declarationIndex-d.declarationIndex:(o.orderIndex||0)-(d.orderIndex||0);if(l.sort(i),r===0){const o=[],d=(s,c)=>s.forEach(f=>{f.parentIndex=c,d(f.children,o.push(f)-1)});return d(l,-1),o}return l}const b=e=>Array.isArray(e)?e:e?e.data:[];function L(e,t,n,r){const a=b(e),l=[];if(a.length>0){let i=a[0];if(t)for(let d=0;d<t.length;d++)i=i.items&&i.items[0];Object.getOwnPropertyNames(i).forEach(d=>{d!==n.column&&l.push({id:x.tableKeyboardNavigationTools.generateNavigatableId(`${r.prevId++}`,r.idPrefix,"column"),declarationIndex:-1,parentIndex:-1,depth:0,colSpan:0,headerColSpan:0,rowSpan:0,index:0,columnType:"data",left:0,right:0,rightBorder:!1,children:[],ariaColumnIndex:0,isAccessible:!0,...v.gridDefaultProps,field:d})})}return l}const O=(e,t)=>{let n=e[t.parentIndex];for(;n;){if(n.footerCell)return!0;n=e[n.parentIndex]}return!1},V=e=>e.filter(t=>O(e,t)?!1:!!t.footerCell||!(t.children&&t.children.length>0)),j={number:function(e,t,n){return typeof e===y&&e.toLowerCase()==="null"?null:t.parseNumber(e,n)},date:function(e,t,n){return typeof e===y&&e.toLowerCase()==="null"?null:t.parseDate(e,n)},boolean:function(e){return typeof e===y?e.toLowerCase()==="null"?null:e.toLowerCase()==="true":e!=null?!!e:e},string:function(e){return typeof e===y&&e.toLowerCase()==="null"?null:e!=null?e+"":e},default:function(e){return e}};function T(e,t,n,r){return e.forEach(a=>{a.expanded=t[r]&&!t[r].includes(S(a,n)),a.items&&a.items.length&&(a.items=T(a.items,t,n,r+1))}),e}function K(e,t,n){return t&&t.length&&e.data.forEach(r=>{r.expanded=r.expanded!==void 0?r.expanded:t[0]&&!t[0].includes(S(r,n)),r.items&&r.items.length&&(r.items=T(r.items,t,n,1))}),e}function S(e,t){let n=e;for(;n.items&&n.items.length;)n=n.items[0];return t?n[t]:e.value}const $=e=>{const t=[],n=r=>r==null?void 0:r.forEach(a=>{t.push(a),n(a.children)});return n(e),t},z=typeof window!="undefined"&&/Firefox/.test(window.navigator.userAgent),B=17895697,U=e=>e.width!==void 0?Math.floor(parseFloat(e.width.toString()))+"px":void 0,q=(e,t)=>t&&t.filter(n=>n.field===e).length>0,D=e=>(e.sort((t,n)=>t.declarationIndex-n.declarationIndex),e.map(t=>{const{declarationIndex:n,parentIndex:r,depth:a,headerColSpan:l,rowSpan:i,index:o,kFirst:d,children:s,...c}=t;return s.length?{children:D(s),...c}:c})),W=(e,t)=>typeof e.colSpan=="function"?e.colSpan({dataItem:t,column:e}):e.colSpan||1,X=e=>{var r,a;const t=typeof e=="object"?(r=e.enabled)!=null?r:!0:e!=null?e:!1,n=typeof e=="object"?(a=e.valueGetter)!=null?a:(l,i)=>w.getter(i)(l):(l,i)=>w.getter(i)(l);return{enabled:t,valueGetter:n}},Y=e=>{let t=0;if(e){const n=e.insertRow(0),r=n.insertCell(0);r.textContent="&nbsp;",t=n.getBoundingClientRect().height,e.deleteRow(0)}return t};exports.applyExpandedState=K;exports.autoGenerateColumns=L;exports.calcRowHeight=Y;exports.checkPropCompatibility=N;exports.firefox=z;exports.firefoxMaxHeight=B;exports.flatData=M;exports.footerColumns=V;exports.getColSpan=W;exports.getColumnWidth=U;exports.getDataAsArray=b;exports.getFlatColumnsState=$;exports.getIndex=A;exports.getNestedValue=I;exports.getRowSpanOptions=X;exports.groupedFirstItemValue=S;exports.isRtl=F;exports.isSorted=q;exports.mapColumns=H;exports.parsers=j;exports.readColumns=R;exports.sanitizeColumns=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("@progress/kendo-vue-data-tools"),I=require("@progress/kendo-vue-common"),D=require("../GridColumn.js"),S="string";function v(e,t){const n=e.split(".");let i=t;return n.forEach(o=>{i=i?i[o]:void 0}),i}function R(e,t,n,i,o,l,r,d,s,f,c=0,h){let p=c;for(let a=0;a<t.length;a++){let x;if(!o||t[a].value===void 0||t[a].items===void 0){const C=s?!!(l!=null&&l[I.getter(s)(t[a])]):!1;e[e.length]={dataIndex:i.index,dataItem:t[a],rowType:"data",level:c,group:h,expanded:f!==void 0?v(f,t[a]):C!=null?C:!1},i.index++;continue}else{let C;h!=null&&h.parents?C=[{field:h.field,value:h.value},...h.parents]:h?C=[h]:C=[],x={field:t[a].field,value:t[a].value,parents:C}}p=Math.max(p,c+1);let g=!1;const u=w.findGroupExpand(r||[],x);f?g=f===void 0||v(f,t[a])===void 0||v(f,t[a]):g=u?u.expanded!==!1:d!==!1,e[e.length]={dataIndex:-1,dataItem:t[a],level:c,group:x,rowType:"groupHeader",expanded:g},g&&(x.expanded=g,p=Math.max(R(e,t[a].items,n,i,o,l,r,d,s,f,c+1,x),p)),(n==="always"||g&&n==="visible")&&(e[e.length]={dataIndex:-1,dataItem:t[a],rowType:"groupFooter",level:c,expanded:g})}return p}function O(e){return e&&getComputedStyle(e).direction==="rtl"||!1}function k(e,t){if(!t||!e||!e.originalEvent||!I.canUseDOM)return-1;let n=document.elementFromPoint(e.clientX,e.originalEvent.clientY);for(;n&&n.parentElement!==t;)n=n.parentElement;const i=t.children;for(let o=0;o<i.length;o++)if(i[o]===n)return o;return-1}const A=["sortChange","filterChange","groupChange","pageChange","expandChange","selectionChange","headerSelectionChange","rowClick","itemChange","dataStateChange","columnResize","columnReorder"],N=(e,t)=>`The ${e} event handler property is deprecated, use https://www.telerik.com/kendo-vue-ui/components/grid/api/GridProps/#toc-${t} instead`;function H(e){for(let t=0;t<A.length;t++){const n=A[t];if(e[n]!==void 0){const i="on"+n.charAt(0).toUpperCase()+n.slice(1);console.warn(N(n,i))}}}function j(e,t){const n=[[]];let i=0;for(let r=e.length-1;r>=0;r--)i=Math.max(i,e[r].depth),e[r].headerColSpan=e[r].headerColSpan||1,e[r].children.length>0&&(e[r].headerColSpan=e[r].children.reduce((d,s)=>s.hidden?d:d+s.headerColSpan,0));const o=[];let l=1;return e.forEach((r,d)=>{n[r.depth]=n[r.depth]||[];let s=!1;n[r.depth].length===0&&(l<=1?l=1+(r.children.length>0?0:i-r.depth):(l--,s=!0)),r.rowSpan=1+(r.children.length>0?0:i-r.depth),r.kFirst=s,r.index=n[r.depth].length,r.ariaColumnIndex=o[r.depth]?o[r.depth]+1:1;let f=0;const c=[];let h=r.parentIndex;for(;h>=0;)c.unshift(h),h=e[h].parentIndex;for(let a=0;a<c.length;a++){const x=c[a],g=e[x],u=n[g.depth],C=u.indexOf(x);for(let y=0;y<C;y++){const b=u[y];f+=e[b].headerColSpan}}for(let a=0;a<r.depth;a++){const x=n[a]||[];for(let g=0;g<x.length;g++){const u=x[g],C=e[u];C.depth+C.rowSpan-1>=r.depth&&(c.includes(u)||(f+=C.headerColSpan))}}const p=n[r.depth];for(let a=0;a<p.length;a++){const x=p[a],g=e[x];g.parentIndex===r.parentIndex&&(f+=g.headerColSpan)}r.virtualColumnOffset=f,n[r.depth].push(d);for(let a=r.depth;a<r.depth+r.rowSpan;a++)o[a]=(o[a]||0)+r.headerColSpan}),w.updateLeft(n,e,t),w.updateRight(n,e,t),n}function M(e,t,n,i=0,o=!1){const l=[];if(!e)return[];e&&e.length===void 0&&(e=[e]),e.forEach((d,s)=>{d=d;const f=d.id?d.id:w.tableKeyboardNavigationTools.generateNavigatableId(`${n.prevId++}`,n.idPrefix,"column"),c=I.canUseDOM&&d.media&&window.matchMedia?!window.matchMedia(d.media).matches:!1,h=o||c||d.hidden,p=t==null?void 0:t.find(x=>x.id===f),a=M(d.children,(p==null?void 0:p.children)||[],n,i+1,h);l.push({depth:i,...D.gridDefaultProps,...a.length?{cell:()=>null,filterCell:()=>null}:{},...d,id:f,declarationIndex:l.length,children:a,headerColSpan:0,rowSpan:0,columnType:d.columnType||"data",colSpan:d.colSpan||1,isAccessible:!0,hidden:h,left:null,right:null,rowSpannable:d.rowSpannable,...p?{width:p.width,orderIndex:p.orderIndex}:{}})});const r=(d,s)=>d.orderIndex===s.orderIndex?d.declarationIndex-s.declarationIndex:(d.orderIndex||0)-(s.orderIndex||0);if(l.sort(r),i===0){const d=[],s=(f,c)=>f.forEach(h=>{h.parentIndex=c,s(h.children,d.push(h)-1)});return s(l,-1),d}return l}const T=e=>Array.isArray(e)?e:e?e.data:[];function L(e,t,n,i){const o=T(e),l=[];if(o.length>0){let r=o[0];if(t)for(let s=0;s<t.length;s++)r=r.items&&r.items[0];Object.getOwnPropertyNames(r).forEach(s=>{s!==n.column&&l.push({id:w.tableKeyboardNavigationTools.generateNavigatableId(`${i.prevId++}`,i.idPrefix,"column"),declarationIndex:-1,parentIndex:-1,depth:0,colSpan:0,headerColSpan:0,rowSpan:0,index:0,columnType:"data",left:0,right:0,rightBorder:!1,children:[],ariaColumnIndex:0,isAccessible:!0,...D.gridDefaultProps,field:s})})}return l}const V=(e,t)=>{let n=e[t.parentIndex];for(;n;){if(n.footerCell)return!0;n=e[n.parentIndex]}return!1},K=e=>e.filter(t=>V(e,t)?!1:!!t.footerCell||!(t.children&&t.children.length>0)),$={number:function(e,t,n){return typeof e===S&&e.toLowerCase()==="null"?null:t.parseNumber(e,n)},date:function(e,t,n){return typeof e===S&&e.toLowerCase()==="null"?null:t.parseDate(e,n)},boolean:function(e){return typeof e===S?e.toLowerCase()==="null"?null:e.toLowerCase()==="true":e!=null?!!e:e},string:function(e){return typeof e===S&&e.toLowerCase()==="null"?null:e!=null?e+"":e},default:function(e){return e}};function F(e,t,n,i){return e.forEach(o=>{o.expanded=t[i]&&!t[i].includes(E(o,n)),o.items&&o.items.length&&(o.items=F(o.items,t,n,i+1))}),e}function z(e,t,n){return t&&t.length&&e.data.forEach(i=>{i.expanded=i.expanded!==void 0?i.expanded:t[0]&&!t[0].includes(E(i,n)),i.items&&i.items.length&&(i.items=F(i.items,t,n,1))}),e}function E(e,t){let n=e;for(;n.items&&n.items.length;)n=n.items[0];return t?n[t]:e.value}const B=e=>{const t=[],n=i=>i==null?void 0:i.forEach(o=>{t.push(o),n(o.children)});return n(e),t},P=typeof window!="undefined"&&/Firefox/.test(window.navigator.userAgent),U=17895697,q=e=>e.width!==void 0?Math.floor(parseFloat(e.width.toString()))+"px":void 0,W=(e,t)=>t&&t.filter(n=>n.field===e).length>0,m=e=>(e.sort((t,n)=>t.declarationIndex-n.declarationIndex),e.map(t=>{const{declarationIndex:n,parentIndex:i,depth:o,headerColSpan:l,rowSpan:r,index:d,kFirst:s,children:f,...c}=t;return f.length?{children:m(f),...c}:c})),X=(e,t)=>typeof e.colSpan=="function"?e.colSpan({dataItem:t,column:e}):e.colSpan||1,Y=e=>{var i,o;const t=typeof e=="object"?(i=e.enabled)!=null?i:!0:e!=null?e:!1,n=typeof e=="object"?(o=e.valueGetter)!=null?o:(l,r)=>I.getter(r)(l):(l,r)=>I.getter(r)(l);return{enabled:t,valueGetter:n}},J=e=>{let t=0;if(e){const n=e.insertRow(0),i=n.insertCell(0);i.textContent="&nbsp;",t=n.getBoundingClientRect().height,e.deleteRow(0)}return t};exports.applyExpandedState=z;exports.autoGenerateColumns=L;exports.calcRowHeight=J;exports.checkPropCompatibility=H;exports.firefox=P;exports.firefoxMaxHeight=U;exports.flatData=R;exports.footerColumns=K;exports.getColSpan=X;exports.getColumnWidth=q;exports.getDataAsArray=T;exports.getFlatColumnsState=B;exports.getIndex=k;exports.getNestedValue=v;exports.getRowSpanOptions=Y;exports.groupedFirstItemValue=E;exports.isRtl=O;exports.isSorted=W;exports.mapColumns=j;exports.parsers=$;exports.readColumns=M;exports.sanitizeColumns=m;