@progress/kendo-vue-grid 8.1.0-develop.4 → 8.1.0-develop.6

package/header/HeaderRow.mjs

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

package/index.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 i=require("./RootGrid.js"),o=require("./columnMenu/GridColumnMenuSort.js"),t=require("./columnMenu/GridColumnMenuFilter.js"),l=require("./columnMenu/GridColumnMenuFilterUI.js"),u=require("./columnMenu/GridColumnMenuFilterCell.js"),n=require("./columnMenu/GridColumnMenuCheckboxFilter.js"),d=require("./cells/GridCell.js"),a=require("./cells/GridEditCell.js"),G=require("./cells/GridGroupCell.js"),C=require("./cells/GridHierarchyCell.js"),s=require("./cells/GridFilterCell.js"),m=require("./header/GridHeaderCell.js"),c=require("./footer/Footer.js"),p=require("./footer/FooterRow.js"),F=require("./rows/GridDetailRow.js"),M=require("./rows/GridRow.js"),q=require("./GridToolbar.js"),g=require("./components/noRecords/GridNoRecords.js");require("@progress/kendo-vue-data-tools");const S=require("./columnMenu/GridColumnMenuItem.js"),R=require("./columnMenu/GridColumnMenuItemContent.js"),f=require("./columnMenu/GridColumnMenuItemGroup.js"),h=require("./GridSearchBox.js"),e=require("./utils/main.js"),r=require("./StatusBar.js");exports.Grid=i.RootGrid;exports.GridColumnMenuSort=o.GridColumnMenuSort;exports.sortGroupByField=o.sortGroupByField;exports.GridColumnMenuFilter=t.GridColumnMenuFilter;exports.filterGroupByField=t.filterGroupByField;exports.GridColumnMenuFilterUI=l.GridColumnMenuFilterUI;exports.GridColumnMenuFilterCell=u.GridColumnMenuFilterCell;exports.GridColumnMenuCheckboxFilter=n.GridColumnMenuCheckboxFilter;exports.GridCell=d.GridCell;exports.GridEditCell=a.GridEditCell;exports.GridGroupCell=G.GridGroupCell;exports.GridHierarchyCell=C.GridHierarchyCell;exports.GridFilterCell=s.GridFilterCell;exports.GridHeaderCell=m.GridHeaderCell;exports.Footer=c.Footer;exports.FooterRow=p.FooterRow;exports.GridDetailRow=F.GridDetailRow;exports.GridRow=M.GridRow;exports.GridToolbar=q.GridToolbar;exports.GridNoRecords=g.GridNoRecords;exports.GridColumnMenuItem=S.GridColumnMenuItem;exports.GridColumnMenuItemContent=R.GridColumnMenuItemContent;exports.GridColumnMenuItemGroup=f.GridColumnMenuItemGroup;exports.GridSearchBox=h.GridSearchBox;exports.applyExpandedState=e.applyExpandedState;exports.autoGenerateColumns=e.autoGenerateColumns;exports.calcRowHeight=e.calcRowHeight;exports.checkPropCompatibility=e.checkPropCompatibility;exports.firefox=e.firefox;exports.firefoxMaxHeight=e.firefoxMaxHeight;exports.flatData=e.flatData;exports.footerColumns=e.footerColumns;exports.getColSpan=e.getColSpan;exports.getColumnWidth=e.getColumnWidth;exports.getDataAsArray=e.getDataAsArray;exports.getFlatColumnsState=e.getFlatColumnsState;exports.getIndex=e.getIndex;exports.getNestedValue=e.getNestedValue;exports.getRowSpanOptions=e.getRowSpanOptions;exports.groupedFirstItemValue=e.groupedFirstItemValue;exports.isRtl=e.isRtl;exports.isSorted=e.isSorted;exports.mapColumns=e.mapColumns;exports.parsers=e.parsers;exports.readColumns=e.readColumns;exports.sanitizeColumns=e.sanitizeColumns;exports.StatusBar=r.StatusBar;exports.getStatusData=r.getStatusData;exports.leafColumns=r.leafColumns;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./RootGrid.js"),o=require("./columnMenu/GridColumnMenuSort.js"),t=require("./columnMenu/GridColumnMenuFilter.js"),l=require("./columnMenu/GridColumnMenuFilterUI.js"),u=require("./columnMenu/GridColumnMenuFilterCell.js"),n=require("./columnMenu/GridColumnMenuCheckboxFilter.js"),d=require("./cells/GridCell.js"),a=require("./cells/GridEditCell.js"),C=require("./cells/GridGroupCell.js"),s=require("./cells/GridHierarchyCell.js"),G=require("./cells/GridFilterCell.js"),m=require("./header/GridHeaderCell.js"),c=require("./footer/Footer.js"),p=require("./footer/FooterRow.js"),F=require("./rows/GridDetailRow.js"),M=require("./rows/GridRow.js"),q=require("./GridToolbar.js"),g=require("./components/noRecords/GridNoRecords.js");require("@progress/kendo-vue-data-tools");const S=require("./columnMenu/GridColumnMenuItem.js"),R=require("./columnMenu/GridColumnMenuItemContent.js"),f=require("./columnMenu/GridColumnMenuItemGroup.js"),h=require("./GridSearchBox.js"),e=require("./utils/main.js"),r=require("./StatusBar.js");exports.Grid=i.RootGrid;exports.GridColumnMenuSort=o.GridColumnMenuSort;exports.sortGroupByField=o.sortGroupByField;exports.GridColumnMenuFilter=t.GridColumnMenuFilter;exports.filterGroupByField=t.filterGroupByField;exports.GridColumnMenuFilterUI=l.GridColumnMenuFilterUI;exports.GridColumnMenuFilterCell=u.GridColumnMenuFilterCell;exports.GridColumnMenuCheckboxFilter=n.GridColumnMenuCheckboxFilter;exports.GridCell=d.GridCell;exports.GridEditCell=a.GridEditCell;exports.GridGroupCell=C.GridGroupCell;exports.GridHierarchyCell=s.GridHierarchyCell;exports.GridFilterCell=G.GridFilterCell;exports.GridHeaderCell=m.GridHeaderCell;exports.Footer=c.Footer;exports.FooterRow=p.FooterRow;exports.GridDetailRow=F.GridDetailRow;exports.GridRow=M.GridRow;exports.GridToolbar=q.GridToolbar;exports.GridNoRecords=g.GridNoRecords;exports.GridColumnMenuItem=S.GridColumnMenuItem;exports.GridColumnMenuItemContent=R.GridColumnMenuItemContent;exports.GridColumnMenuItemGroup=f.GridColumnMenuItemGroup;exports.GridSearchBox=h.GridSearchBox;exports.applyExpandedState=e.applyExpandedState;exports.autoGenerateColumns=e.autoGenerateColumns;exports.calcRowHeight=e.calcRowHeight;exports.checkPropCompatibility=e.checkPropCompatibility;exports.firefox=e.firefox;exports.firefoxMaxHeight=e.firefoxMaxHeight;exports.flatData=e.flatData;exports.footerColumns=e.footerColumns;exports.getColSpan=e.getColSpan;exports.getColumnWidth=e.getColumnWidth;exports.getDataAsArray=e.getDataAsArray;exports.getFlatColumnsState=e.getFlatColumnsState;exports.getIndex=e.getIndex;exports.getNestedValue=e.getNestedValue;exports.getRowSpanOptions=e.getRowSpanOptions;exports.groupedFirstItemValue=e.groupedFirstItemValue;exports.isRtl=e.isRtl;exports.isSorted=e.isSorted;exports.mapColumns=e.mapColumns;exports.parsers=e.parsers;exports.readColumns=e.readColumns;exports.resolveCells=e.resolveCells;exports.sanitizeColumns=e.sanitizeColumns;exports.StatusBar=r.StatusBar;exports.getStatusData=r.getStatusData;exports.leafColumns=r.leafColumns;

package/index.mjs

@@ -21,15 +21,15 @@ import { Footer as H } from "./footer/Footer.mjs";
 import { FooterRow as k } from "./footer/FooterRow.mjs";
 import { GridDetailRow as E } from "./rows/GridDetailRow.mjs";
 import { GridRow as V } from "./rows/GridRow.mjs";
-import { GridToolbar as O } from "./GridToolbar.mjs";
-import { GridNoRecords as T } from "./components/noRecords/GridNoRecords.mjs";
+import { GridToolbar as z } from "./GridToolbar.mjs";
+import { GridNoRecords as P } from "./components/noRecords/GridNoRecords.mjs";
 import "@progress/kendo-vue-data-tools";
-import { GridColumnMenuItem as W } from "./columnMenu/GridColumnMenuItem.mjs";
-import { GridColumnMenuItemContent as q } from "./columnMenu/GridColumnMenuItemContent.mjs";
+import { GridColumnMenuItem as U } from "./columnMenu/GridColumnMenuItem.mjs";
+import { GridColumnMenuItemContent as j } from "./columnMenu/GridColumnMenuItemContent.mjs";
 import { GridColumnMenuItemGroup as J } from "./columnMenu/GridColumnMenuItemGroup.mjs";
 import { GridSearchBox as L } from "./GridSearchBox.mjs";
-import { applyExpandedState as X, autoGenerateColumns as Y, calcRowHeight as Z, checkPropCompatibility as _, firefox as $, firefoxMaxHeight as rr, flatData as or, footerColumns as er, getColSpan as tr, getColumnWidth as lr, getDataAsArray as ir, getFlatColumnsState as mr, getIndex as pr, getNestedValue as ar, getRowSpanOptions as dr, groupedFirstItemValue as ur, isRtl as nr, isSorted as fr, mapColumns as xr, parsers as Cr, readColumns as Gr, sanitizeColumns as sr } from "./utils/main.mjs";
-import { StatusBar as Fr, getStatusData as Mr, leafColumns as Sr } from "./StatusBar.mjs";
+import { applyExpandedState as X, autoGenerateColumns as Y, calcRowHeight as Z, checkPropCompatibility as _, firefox as $, firefoxMaxHeight as rr, flatData as or, footerColumns as er, getColSpan as tr, getColumnWidth as lr, getDataAsArray as ir, getFlatColumnsState as mr, getIndex as pr, getNestedValue as ar, getRowSpanOptions as dr, groupedFirstItemValue as ur, isRtl as nr, isSorted as fr, mapColumns as xr, parsers as Cr, readColumns as Gr, resolveCells as sr, sanitizeColumns as gr } from "./utils/main.mjs";
+import { StatusBar as Mr, getStatusData as Sr, leafColumns as cr } from "./StatusBar.mjs";
 export {
   H as Footer,
   k as FooterRow,
@@ -39,8 +39,8 @@ export {
   a as GridColumnMenuFilter,
   x as GridColumnMenuFilterCell,
   n as GridColumnMenuFilterUI,
-  W as GridColumnMenuItem,
-  q as GridColumnMenuItemContent,
+  U as GridColumnMenuItem,
+  j as GridColumnMenuItemContent,
   J as GridColumnMenuItemGroup,
   i as GridColumnMenuSort,
   E as GridDetailRow,
@@ -49,11 +49,11 @@ export {
   c as GridGroupCell,
   B as GridHeaderCell,
   h as GridHierarchyCell,
-  T as GridNoRecords,
+  P as GridNoRecords,
   V as GridRow,
   L as GridSearchBox,
-  O as GridToolbar,
-  Fr as StatusBar,
+  z as GridToolbar,
+  Mr as StatusBar,
   X as applyExpandedState,
   Y as autoGenerateColumns,
   Z as calcRowHeight,
@@ -70,14 +70,15 @@ export {
   pr as getIndex,
   ar as getNestedValue,
   dr as getRowSpanOptions,
-  Mr as getStatusData,
+  Sr as getStatusData,
   ur as groupedFirstItemValue,
   nr as isRtl,
   fr as isSorted,
-  Sr as leafColumns,
+  cr as leafColumns,
   xr as mapColumns,
   Cr as parsers,
   Gr as readColumns,
-  sr as sanitizeColumns,
+  sr as resolveCells,
+  gr as sanitizeColumns,
   m as sortGroupByField
 };

package/interfaces/ColumnType.d.ts

@@ -10,4 +10,4 @@
  *
  * @default "data"
  */
-export type GridColumnType = 'data' | 'reorder' | 'checkbox';
+export type GridColumnType = 'data' | 'reorder' | 'checkbox' | 'pin';

package/interfaces/GridCellProps.d.ts

@@ -7,6 +7,7 @@
  */
 import { GroupState } from '@progress/kendo-vue-data-tools';
 import { GridColumnType } from './ColumnType';
+import { GridCellsSettings } from './GridCellsSettings';
 /**
  * @hidden
  */
@@ -51,6 +52,10 @@ export interface GridCellProps {
      * The custom CSS classes of the cells.
      */
     className?: string;
+    /**
+     * Defines a set of custom cell components that the Grid will render instead of the default cell.
+     */
+    cells?: GridCellsSettings;
     /**
      * The index to be applied to the `aria-colindex` attribute.
      */

package/interfaces/GridCellsSettings.d.ts

@@ -271,6 +271,29 @@ export interface GridCellsSettings {
          */
         groupFooter?: Component<GridCustomCellProps> | string;
     };
+    /**
+    * Custom cell components for pin columns.
+    *
+    * @example
+    * ```tsx
+    * import { MyPinDataCell } from './MyPinDataCell';
+    * <Grid cells={{ pin: { data: MyPinDataCell } }} />
+    * ```
+    */
+    pin?: {
+        /**
+         * Custom component for rendering the group header cell in pin columns.
+         */
+        groupHeader?: Component<GridCustomCellProps> | string;
+        /**
+         * Custom component for rendering the data cell in pin columns.
+         */
+        data?: Component<GridCustomCellProps> | string;
+        /**
+         * Custom component for rendering the group footer cell in pin columns.
+         */
+        groupFooter?: Component<GridCustomCellProps> | string;
+    };
     /**
      * Custom cell components for edit columns.
      *

package/interfaces/GridColumnProps.d.ts

@@ -49,11 +49,11 @@ export interface GridColumnProps extends Omit<ColumnBaseProps, 'cell'> {
     /**
      * @hidden
      */
-    internalCell?: any;
+    defaultCell?: any;
     /**
      * @hidden
      */
-    internalHeaderCell?: any;
+    defaultHeaderCell?: any;
     /**
      * Defines the custom rendering of the filter cell. Accepts a Vue component, a `render` function, or a slot name.
      * If not set, a `GridFilterCell` will be rendered by default.