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

package/cells/GridFilterCell.mjs

@@ -5,17 +5,17 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as v, createVNode as i, createTextVNode as b, h as $, inject as s } from "vue";
-import { Button as S } from "@progress/kendo-vue-buttons";
-import { filterClearButton as p, messages as c, filterChooseOperator as h } from "../messages/main.mjs";
-import { DropDownList as g } from "@progress/kendo-vue-dropdowns";
+import { defineComponent as v, createVNode as i, createTextVNode as b, h as S, inject as c } from "vue";
+import { Button as $ } from "@progress/kendo-vue-buttons";
+import { filterClearButton as h, messages as u, filterChooseOperator as g } from "../messages/main.mjs";
+import { DropDownList as d } from "@progress/kendo-vue-dropdowns";
 import { TextBox as L, NumericTextBox as k } from "@progress/kendo-vue-inputs";
 import { DatePicker as z } from "@progress/kendo-vue-dateinputs";
-import { filterClearIcon as x, filterIcon as I } from "@progress/kendo-svg-icons";
-import { provideLocalizationService as w } from "@progress/kendo-vue-intl";
-import { cellBoolDropdownChange as y, cellOperatorChange as D, cellInputChange as F } from "../filterCommon.mjs";
-import { getListeners as T, templateRendering as B, getTemplate as N } from "@progress/kendo-vue-common";
-const H = /* @__PURE__ */ v({
+import { filterClearIcon as x, filterIcon as w } from "@progress/kendo-svg-icons";
+import { provideLocalizationService as D } from "@progress/kendo-vue-intl";
+import { cellBoolDropdownChange as I, cellOperatorChange as y, cellInputChange as F } from "../filterCommon.mjs";
+import { getTemplate as T } from "@progress/kendo-vue-common";
+const K = /* @__PURE__ */ v({
   name: "KendoGridFilterCell",
   inheritAttrs: !1,
   props: {
@@ -48,11 +48,11 @@ const H = /* @__PURE__ */ v({
       this.triggerChange(o);
     },
     operatorChange(e, t) {
-      const o = D(e.value.operator, t, this.$props.value);
+      const o = y(e.value.operator, t, this.$props.value);
       this.triggerChange(o);
     },
     boolDropdownChange(e, t) {
-      const o = y(e.value.operator, t);
+      const o = I(e.value.operator, t);
       this.triggerChange(o);
     },
     clear(e) {
@@ -67,41 +67,41 @@ const H = /* @__PURE__ */ v({
     }
   },
   setup() {
-    const e = s("kendoIntlService", {}), t = s("kendoLocalizationService", {});
+    const e = c("kendoIntlService", {}), t = c("kendoLocalizationService", {});
     return {
       kendoIntlService: e,
       kendoLocalizationService: t
     };
   },
   render() {
-    const e = w(this), {
+    const e = D(this), {
       size: t
-    } = this.$props, o = this.$props.operators.find((a) => a.operator === this.$props.operator) || null, u = function() {
+    } = this.$props, o = this.$props.operators.find((n) => n.operator === this.$props.operator) || null, f = function() {
       if (this.$props.filterType !== "boolean")
-        return i(g, {
+        return i(d, {
           onChange: this.operatorChange,
           value: o,
           size: t,
           class: "k-dropdown-operator",
           icon: "filter",
-          svgIcon: I,
+          svgIcon: w,
           iconClassName: "filter k-button-icon",
           "data-items": this.$props.operators,
           textField: "text",
-          title: e.toLanguageString(h, c[h]),
+          title: e.toLanguageString(g, u[g]),
           popupSettings: {
             width: "",
             anchor: ""
           },
           ariaLabel: this.ariaLabel
         }, null);
-    }, d = function(a, n) {
+    }, m = function(n, a) {
       let l;
-      switch (a) {
+      switch (n) {
         case "numeric":
           return i(k, {
             size: t,
-            value: n,
+            value: a,
             onChange: (r) => {
               this.inputChange(r.value, r.event);
             },
@@ -111,7 +111,7 @@ const H = /* @__PURE__ */ v({
         case "date":
           return i(z, {
             size: t,
-            value: n,
+            value: a,
             onChange: (r) => {
               this.inputChange(r.value, r);
             },
@@ -119,10 +119,10 @@ const H = /* @__PURE__ */ v({
             ariaLabel: this.ariaLabel
           }, null);
         case "boolean":
-          return l = this.$props.booleanValues, i(g, {
+          return l = this.$props.booleanValues, i(d, {
             onChange: this.boolDropdownChange,
             size: t,
-            value: l.find((r) => r.operator === (n !== null ? n : "")),
+            value: l.find((r) => r.operator === (a !== null ? a : "")),
             "data-items": l,
             textField: "text",
             title: this.$props.title,
@@ -130,7 +130,7 @@ const H = /* @__PURE__ */ v({
           }, null);
         default:
           return i(L, {
-            value: n || "",
+            value: a || "",
             size: t,
             onInput: (r) => {
               this.inputChange(r.target.value, r);
@@ -139,14 +139,14 @@ const H = /* @__PURE__ */ v({
             "aria-label": this.ariaLabel
           }, null);
       }
-    }, f = i("div", {
+    }, s = {
       class: "k-filtercell",
       style: this.$attrs.style
-    }, [i("div", {
+    }, p = i("div", {
       class: "k-filtercell-wrapper"
-    }, [d.call(this, this.$props.filterType, this.$props.value), i("div", {
+    }, [m.call(this, this.$props.filterType, this.$props.value), i("div", {
       class: "k-filtercell-operator"
-    }, [u.call(this), b(" "), i(S, {
+    }, [f.call(this), b(" "), i($, {
       type: "button",
       size: t,
       icon: "filter-clear",
@@ -155,20 +155,25 @@ const H = /* @__PURE__ */ v({
         /* button is always visible if there is either value or operator */
         "k-disabled": !(!(this.$props.value === null || this.$props.value === "") || this.$props.operator)
       },
-      title: e.toLanguageString(p, c[p]),
+      title: e.toLanguageString(h, u[h]),
       onClick: this.clear
-    }, null)])])]), m = this.$props.grid ? T.call(this.$props.grid) : null, C = B.call(this.$props.grid, this.$props.render, m);
-    return N.call(this, {
-      h: $,
-      template: C,
-      defaultRendering: f,
-      additionalProps: this.$props,
+    }, null)])]), C = i("div", s, [p]);
+    return T.call(this, {
+      h: S,
+      template: this.$props.render,
+      defaultRendering: C,
+      additionalProps: {
+        ...this.$props,
+        tdProps: s
+      },
       additionalListeners: {
         change: this.triggerChange
-      }
+      },
+      defaultSlots: p,
+      swapDefaultSlots: !0
     });
   }
 });
 export {
-  H as GridFilterCell
+  K as GridFilterCell
 };

package/cells/GridGroupCell.d.ts

@@ -30,6 +30,7 @@ declare const GridGroupCell: import('vue').DefineComponent<import('vue').Extract
     ariaColumnIndex: PropType<number>;
     group: PropType<import('@progress/kendo-vue-data-tools').GroupState>;
     render: PropType<any>;
+    cells: PropType<import('..').GridCellsSettings>;
 }>, {}, {}, {
     tdClass(): {
         [x: number]: any;
@@ -71,6 +72,7 @@ declare const GridGroupCell: import('vue').DefineComponent<import('vue').Extract
     ariaColumnIndex: PropType<number>;
     group: PropType<import('@progress/kendo-vue-data-tools').GroupState>;
     render: PropType<any>;
+    cells: PropType<import('..').GridCellsSettings>;
 }>> & Readonly<{
     onChange?: (...args: any[] | unknown[]) => any;
     onCellkeydown?: (...args: any[] | unknown[]) => any;

package/cells/GridGroupCell.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 a=require("vue"),i=require("@progress/kendo-vue-common"),g=require("@progress/kendo-vue-data-tools"),n=require("../messages/main.js"),y=require("@progress/kendo-vue-intl"),h=require("@progress/kendo-svg-icons"),v=a.defineComponent({name:"KendoGridGroupCell",inheritAttrs:!1,props:{id:String,field:String,dataItem:Object,format:String,type:String,colSpan:Number,className:String,columnIndex:Number,columnsCount:Number,rowType:String,level:Number,locked:Boolean,expanded:Boolean,editor:String,dataIndex:Number,isSelected:Boolean,isRtl:Boolean,ariaColumnIndex:Number,group:Object,render:[String,Function,Object]},emits:{change:null,cellkeydown:null},inject:{kendo:{default:null},kendoIntlService:{default:null},kendoLocalizationService:{default:null},getKeyboardNavigationAttributes:{default:i.noop}},computed:{tdClass(){const{className:e,locked:t}=this.$props;return{"k-table-td":!0,"k-grid-content-sticky":t,[e]:e}},tdStyle(){const{locked:e}=this.$props,t=e?{position:"sticky",zIndex:2}:{};return{...this.$attrs.style,...t}},groupTdClass(){const{className:e,locked:t}=this.$props;return{"k-table-td":!0,"k-group-cell":!0,"k-grid-content-sticky":t,[e]:e}}},methods:{triggerStateChange(){var t;const e=this.kendo;(t=e==null?void 0:e.dispatchGroupExpand)==null||t.call(e,{type:g.GROUP_EXPAND_ACTION.TOGGLE,group:this.$props.group})},triggerKeydown(e,t){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,dataIndex:this.$props.dataIndex,field:this.$props.field,expanded:this.$props.expanded}),!e.defaultPrevented&&e.keyCode===i.Keys.enter&&(e.preventDefault(),this.$emit("change",{dataItem:this.$props.dataItem,dataIndex:this.$props.dataIndex,event:e,level:this.$props.level,field:void 0,value:!t}),this.triggerStateChange())},clickHandler(e,t,l){e.preventDefault(),this.$emit("change",{dataItem:t,dataIndex:this.$props.dataIndex,event:e,level:this.$props.level,field:void 0,value:!l}),this.triggerStateChange()}},render(){let e=null;const{columnIndex:t,level:l,columnsCount:d,rowType:I,dataItem:o,field:s,expanded:r,render:S,locked:c}=this.$props,p=this.getKeyboardNavigationAttributes(this.$props.id),m=y.provideLocalizationService(this).toLanguageString(n.groupCaretAriaLabelCollapse,n.messages[n.groupCaretAriaLabelCollapse]),k=y.provideLocalizationService(this).toLanguageString(n.groupCaretAriaLabelExpand,n.messages[n.groupCaretAriaLabelExpand]);if(t===void 0||l===void 0||t<l||d===void 0||I!=="groupHeader"||o[s]===void 0)e=a.createVNode("td",{style:this.$attrs.style,key:"g"+t,class:this.groupTdClass},null);else if(t<=l){const f=a.createVNode("td",{style:this.tdStyle,onKeydown:u=>{this.triggerKeydown(u,r)},key:"g-colspan",class:c?"k-table-td":this.tdClass,colspan:c?0:d-t,role:"gridcell","aria-colindex":this.$props.ariaColumnIndex,"aria-selected":this.$props.isSelected,"aria-expanded":r,"data-grid-col-index":this.$props.columnIndex,tabindex:p.tabIndex,"data-keyboardnavlevel":p[g.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":p[g.KEYBOARD_NAV_DATA_ID]},[a.createVNode("p",{class:"k-reset"},[a.createVNode("a",{onClick:u=>{this.clickHandler(u,o,r)},href:"#",tabindex:-1,title:r?m:k,"aria-label":r?m:k},[a.createVNode(i.Icon,{name:r?"caret-alt-down":this.isRtl?"caret-alt-left":"caret-alt-right",icon:r?h.caretAltDownIcon:this.isRtl?h.caretAltLeftIcon:h.caretAltRightIcon},null)]),o[s]?o[s].toString():""])]),C={className:"k-table-td",role:"gridcell",colSpan:d-t,style:{borderLeftWidth:0,borderRightWidth:0}},b=c?a.createVNode("td",C,null):null;e=b?[f,b]:f}return i.getTemplate.call(this,{h:a.h,template:S,defaultRendering:e,additionalProps:this.$props,additionalListeners:{keydown:this.triggerKeydown,click:this.clickHandler}})}});exports.GridGroupCell=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue"),i=require("@progress/kendo-vue-common"),f=require("@progress/kendo-vue-data-tools"),o=require("../messages/main.js"),S=require("@progress/kendo-vue-intl"),k=require("@progress/kendo-svg-icons"),x=e=>{var t,l;return(l=(t=e.cells)==null?void 0:t.groupHeader)==null?void 0:l[e.rowType||"data"]},A=a.defineComponent({name:"KendoGridGroupCell",inheritAttrs:!1,props:{id:String,field:String,dataItem:Object,format:String,type:String,colSpan:Number,className:String,columnIndex:Number,columnsCount:Number,rowType:String,level:Number,locked:Boolean,expanded:Boolean,editor:String,dataIndex:Number,isSelected:Boolean,isRtl:Boolean,ariaColumnIndex:Number,group:Object,render:[String,Function,Object],cells:Object},emits:{change:null,cellkeydown:null},inject:{kendo:{default:null},kendoIntlService:{default:null},kendoLocalizationService:{default:null},getKeyboardNavigationAttributes:{default:i.noop}},computed:{tdClass(){const{className:e,locked:t}=this.$props;return{"k-table-td":!0,"k-grid-content-sticky":t,[e]:e}},tdStyle(){const{locked:e}=this.$props,t=e?{position:"sticky",zIndex:2}:{};return{...this.$attrs.style,...t}},groupTdClass(){const{className:e,locked:t}=this.$props;return{"k-table-td":!0,"k-group-cell":!0,"k-grid-content-sticky":t,[e]:e}}},methods:{triggerStateChange(){var t;const e=this.kendo;(t=e==null?void 0:e.dispatchGroupExpand)==null||t.call(e,{type:f.GROUP_EXPAND_ACTION.TOGGLE,group:this.$props.group})},triggerKeydown(e,t){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,dataIndex:this.$props.dataIndex,field:this.$props.field,expanded:this.$props.expanded}),!e.defaultPrevented&&e.keyCode===i.Keys.enter&&(e.preventDefault(),this.$emit("change",{dataItem:this.$props.dataItem,dataIndex:this.$props.dataIndex,event:e,level:this.$props.level,field:void 0,value:!t}),this.triggerStateChange())},clickHandler(e,t,l){e.preventDefault(),this.$emit("change",{dataItem:t,dataIndex:this.$props.dataIndex,event:e,level:this.$props.level,field:void 0,value:!l}),this.triggerStateChange()}},render(){let e=null,t,l,s=null;const{columnIndex:n,level:c,columnsCount:p,rowType:v,dataItem:d,field:u,expanded:r,render:$,locked:g}=this.$props,h=this.getKeyboardNavigationAttributes(this.$props.id),b=S.provideLocalizationService(this).toLanguageString(o.groupCaretAriaLabelCollapse,o.messages[o.groupCaretAriaLabelCollapse]),y=S.provideLocalizationService(this).toLanguageString(o.groupCaretAriaLabelExpand,o.messages[o.groupCaretAriaLabelExpand]);if(n===void 0||c===void 0||n<c||p===void 0||v!=="groupHeader"||d[u]===void 0)t={style:this.$attrs.style,key:"g"+n,class:this.groupTdClass},e=a.createVNode("td",t,null);else if(n<=c){t={style:this.tdStyle,key:"g-colspan",class:g?"k-table-td":this.tdClass,colspan:g?0:p-n,role:"gridcell","aria-colindex":this.$props.ariaColumnIndex,"aria-selected":this.$props.isSelected,"aria-expanded":r,"data-grid-col-index":this.$props.columnIndex,tabindex:h.tabIndex,"data-keyboardnavlevel":h[f.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":h[f.KEYBOARD_NAV_DATA_ID]},s=a.createVNode("p",{class:"k-reset"},[a.createVNode("a",{onClick:m=>{this.clickHandler(m,d,r)},href:"#",tabindex:-1,title:r?b:y,"aria-label":r?b:y},[a.createVNode(i.Icon,{name:r?"caret-alt-down":this.isRtl?"caret-alt-left":"caret-alt-right",icon:r?k.caretAltDownIcon:this.isRtl?k.caretAltLeftIcon:k.caretAltRightIcon},null)]),d[u]?d[u].toString():""]);const C=a.createVNode("td",a.mergeProps(t,{onKeydown:m=>{this.triggerKeydown(m,r)}}),[s]);l={className:"k-table-td",role:"gridcell",colSpan:p-n,style:{borderLeftWidth:0,borderRightWidth:0}};const I=g?a.createVNode("td",l,null):null;e=I?[C,I]:C}return i.getTemplate.call(this,{h:a.h,template:$||x(this.$props),defaultRendering:e,additionalProps:{...this.$props,tdProps:t,td2Props:l},additionalListeners:{keydown:this.triggerKeydown,click:this.clickHandler},defaultSlots:s,swapDefaultSlots:!0})}});exports.GridGroupCell=A;

package/cells/GridGroupCell.mjs

@@ -5,13 +5,16 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as S, createVNode as l, h as $ } from "vue";
-import { noop as C, Icon as A, getTemplate as v, Keys as N } from "@progress/kendo-vue-common";
-import { KEYBOARD_NAV_DATA_ID as L, KEYBOARD_NAV_DATA_LEVEL as w, GROUP_EXPAND_ACTION as K } from "@progress/kendo-vue-data-tools";
-import { groupCaretAriaLabelCollapse as m, messages as f, groupCaretAriaLabelExpand as k } from "../messages/main.mjs";
-import { provideLocalizationService as y } from "@progress/kendo-vue-intl";
-import { caretAltDownIcon as R, caretAltRightIcon as D, caretAltLeftIcon as E } from "@progress/kendo-svg-icons";
-const P = /* @__PURE__ */ S({
+import { defineComponent as x, createVNode as n, mergeProps as A, h as v } from "vue";
+import { noop as N, Icon as L, getTemplate as w, Keys as D } from "@progress/kendo-vue-common";
+import { KEYBOARD_NAV_DATA_ID as K, KEYBOARD_NAV_DATA_LEVEL as R, GROUP_EXPAND_ACTION as T } from "@progress/kendo-vue-data-tools";
+import { groupCaretAriaLabelCollapse as y, messages as b, groupCaretAriaLabelExpand as I } from "../messages/main.mjs";
+import { provideLocalizationService as S } from "@progress/kendo-vue-intl";
+import { caretAltDownIcon as E, caretAltRightIcon as O, caretAltLeftIcon as G } from "@progress/kendo-svg-icons";
+const _ = (e) => {
+  var t, l;
+  return (l = (t = e.cells) == null ? void 0 : t.groupHeader) == null ? void 0 : l[e.rowType || "data"];
+}, W = /* @__PURE__ */ x({
   name: "KendoGridGroupCell",
   inheritAttrs: !1,
   props: {
@@ -34,7 +37,8 @@ const P = /* @__PURE__ */ S({
     isRtl: Boolean,
     ariaColumnIndex: Number,
     group: Object,
-    render: [String, Function, Object]
+    render: [String, Function, Object],
+    cells: Object
   },
   emits: {
     change: null,
@@ -51,7 +55,7 @@ const P = /* @__PURE__ */ S({
       default: null
     },
     getKeyboardNavigationAttributes: {
-      default: C
+      default: N
     }
   },
   computed: {
@@ -96,7 +100,7 @@ const P = /* @__PURE__ */ S({
       var t;
       const e = this.kendo;
       (t = e == null ? void 0 : e.dispatchGroupExpand) == null || t.call(e, {
-        type: K.TOGGLE,
+        type: T.TOGGLE,
         group: this.$props.group
       });
     },
@@ -107,7 +111,7 @@ const P = /* @__PURE__ */ S({
         dataIndex: this.$props.dataIndex,
         field: this.$props.field,
         expanded: this.$props.expanded
-      }), !e.defaultPrevented && e.keyCode === N.enter && (e.preventDefault(), this.$emit("change", {
+      }), !e.defaultPrevented && e.keyCode === D.enter && (e.preventDefault(), this.$emit("change", {
         dataItem: this.$props.dataItem,
         dataIndex: this.$props.dataIndex,
         event: e,
@@ -116,89 +120,99 @@ const P = /* @__PURE__ */ S({
         value: !t
       }), this.triggerStateChange());
     },
-    clickHandler(e, t, r) {
+    clickHandler(e, t, l) {
       e.preventDefault(), this.$emit("change", {
         dataItem: t,
         dataIndex: this.$props.dataIndex,
         event: e,
         level: this.$props.level,
         field: void 0,
-        value: !r
+        value: !l
       }), this.triggerStateChange();
     }
   },
   render() {
-    let e = null;
+    let e = null, t, l, o = null;
     const {
-      columnIndex: t,
-      level: r,
-      columnsCount: i,
-      rowType: b,
-      dataItem: n,
-      field: o,
+      columnIndex: r,
+      level: d,
+      columnsCount: s,
+      rowType: C,
+      dataItem: i,
+      field: p,
       expanded: a,
-      render: I,
-      locked: d
-    } = this.$props, s = this.getKeyboardNavigationAttributes(this.$props.id), c = y(this).toLanguageString(m, f[m]), u = y(this).toLanguageString(k, f[k]);
-    if (t === void 0 || r === void 0 || t < r || i === void 0 || b !== "groupHeader" || n[o] === void 0)
-      e = l("td", {
+      render: $,
+      locked: c
+    } = this.$props, u = this.getKeyboardNavigationAttributes(this.$props.id), h = S(this).toLanguageString(y, b[y]), m = S(this).toLanguageString(I, b[I]);
+    if (r === void 0 || d === void 0 || r < d || s === void 0 || C !== "groupHeader" || i[p] === void 0)
+      t = {
         style: this.$attrs.style,
-        key: "g" + t,
+        key: "g" + r,
         class: this.groupTdClass
-      }, null);
-    else if (t <= r) {
-      const g = l("td", {
+      }, e = n("td", t, null);
+    else if (r <= d) {
+      t = {
         style: this.tdStyle,
-        onKeydown: (p) => {
-          this.triggerKeydown(p, a);
-        },
         key: "g-colspan",
-        class: d ? "k-table-td" : this.tdClass,
-        colspan: d ? 0 : i - t,
+        class: c ? "k-table-td" : this.tdClass,
+        colspan: c ? 0 : s - r,
         role: "gridcell",
         "aria-colindex": this.$props.ariaColumnIndex,
         "aria-selected": this.$props.isSelected,
         "aria-expanded": a,
         "data-grid-col-index": this.$props.columnIndex,
-        tabindex: s.tabIndex,
-        "data-keyboardnavlevel": s[w],
-        "data-keyboardnavid": s[L]
-      }, [l("p", {
+        tabindex: u.tabIndex,
+        "data-keyboardnavlevel": u[R],
+        "data-keyboardnavid": u[K]
+      }, o = n("p", {
         class: "k-reset"
-      }, [l("a", {
-        onClick: (p) => {
-          this.clickHandler(p, n, a);
+      }, [n("a", {
+        onClick: (g) => {
+          this.clickHandler(g, i, a);
         },
         href: "#",
         tabindex: -1,
-        title: a ? c : u,
-        "aria-label": a ? c : u
-      }, [l(A, {
+        title: a ? h : m,
+        "aria-label": a ? h : m
+      }, [n(L, {
         name: a ? "caret-alt-down" : this.isRtl ? "caret-alt-left" : "caret-alt-right",
-        icon: a ? R : this.isRtl ? E : D
-      }, null)]), n[o] ? n[o].toString() : ""])]), x = {
+        icon: a ? E : this.isRtl ? G : O
+      }, null)]), i[p] ? i[p].toString() : ""]);
+      const f = n("td", A(t, {
+        onKeydown: (g) => {
+          this.triggerKeydown(g, a);
+        }
+      }), [o]);
+      l = {
         className: "k-table-td",
         role: "gridcell",
-        colSpan: i - t,
+        colSpan: s - r,
         style: {
           borderLeftWidth: 0,
           borderRightWidth: 0
         }
-      }, h = d ? l("td", x, null) : null;
-      e = h ? [g, h] : g;
+      };
+      const k = c ? n("td", l, null) : null;
+      e = k ? [f, k] : f;
     }
-    return v.call(this, {
-      h: $,
-      template: I,
+    return w.call(this, {
+      h: v,
+      template: $ || _(this.$props),
       defaultRendering: e,
-      additionalProps: this.$props,
+      additionalProps: {
+        ...this.$props,
+        tdProps: t,
+        td2Props: l
+      },
       additionalListeners: {
         keydown: this.triggerKeydown,
         click: this.clickHandler
-      }
+      },
+      defaultSlots: o,
+      swapDefaultSlots: !0
     });
   }
 });
 export {
-  P as GridGroupCell
+  W as GridGroupCell
 };

package/cells/GridHierarchyCell.d.ts

@@ -28,6 +28,7 @@ declare const GridHierarchyCell: import('vue').DefineComponent<import('vue').Ext
     ariaColumnIndex: PropType<number>;
     render: PropType<any>;
     isRtl: PropType<boolean>;
+    cells: PropType<import('..').GridCellsSettings>;
 }>, {}, {}, {
     wrapperClass(): {
         [x: number]: any;
@@ -60,6 +61,7 @@ declare const GridHierarchyCell: import('vue').DefineComponent<import('vue').Ext
     ariaColumnIndex: PropType<number>;
     render: PropType<any>;
     isRtl: PropType<boolean>;
+    cells: PropType<import('..').GridCellsSettings>;
 }>> & Readonly<{
     onChange?: (...args: any[] | unknown[]) => any;
     onCellkeydown?: (...args: any[] | unknown[]) => any;

package/cells/GridHierarchyCell.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("vue"),l=require("@progress/kendo-vue-common"),o=require("@progress/kendo-vue-data-tools"),u=require("@progress/kendo-vue-intl"),r=require("../messages/main.js"),p=require("@progress/kendo-svg-icons"),h=i.defineComponent({name:"KendoGridHierarchyCell",inheritAttrs:!1,props:{id:String,field:String,dataItem:Object,format:String,type:String,className:String,colSpan:Number,columnIndex:Number,columnsCount:Number,rowType:String,level:Number,expanded:Boolean,editor:String,isSelected:Boolean,dataIndex:Number,ariaColumnIndex:Number,render:[String,Function,Object],isRtl:Boolean},emits:{change:null,cellkeydown:null},inject:{kendo:{default:null},kendoIntlService:{default:null},kendoLocalizationService:{default:null},getKeyboardNavigationAttributes:{default:l.noop}},methods:{triggerStateChange(){const e=this.kendo;e.dataItemKey&&this.$props.dataItem[e.dataItemKey]!==void 0&&(e==null||e.dispatchDetailExpand({type:o.DETAIL_EXPAND_ACTION.TOGGLE,id:this.$props.dataItem[e.dataItemKey]}))},triggerKeydown(e,t){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,field:this.$props.field,expanded:t}),!e.defaultPrevented&&e.keyCode===l.Keys.enter&&(e.preventDefault(),this.$emit("change",{dataItem:this.$props.dataItem,dataIndex:this.$props.dataIndex,event:e,field:this.$props.field,value:!t}),this.triggerStateChange())},clickHandler(e,t,n){e.preventDefault(),this.$emit("change",{dataItem:t,event:e,field:void 0,value:!n}),this.triggerStateChange()}},computed:{wrapperClass(){return{"k-table-td":!0,"k-hierarchy-cell":!0,[this.className||""]:this.className}}},render(){let e=null;const t=this.getKeyboardNavigationAttributes(this.$props.id),n=u.provideLocalizationService(this),d=n.toLanguageString(r.collapseDetailAriaLabel,r.messages[r.collapseDetailAriaLabel]),c=n.toLanguageString(r.expandDetailAriaLabel,r.messages[r.expandDetailAriaLabel]);if(this.$props.rowType==="groupFooter")e=i.createVNode("td",{class:this.wrapperClass},null);else if(this.$props.rowType!=="groupHeader"){const a=this.$props.expanded;e=i.createVNode("td",{style:this.$attrs.style,onKeydown:s=>{this.triggerKeydown(s,a)},class:this.wrapperClass,"aria-expanded":a?"true":"false",role:"gridcell","aria-colindex":this.$props.ariaColumnIndex,tabindex:t.tabIndex,"data-keyboardnavlevel":t[o.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":t[o.KEYBOARD_NAV_DATA_ID]},[i.createVNode("a",{onClick:s=>{this.clickHandler(s,this.$props.dataItem,a)},href:"#",tabindex:-1,title:a?d:c,"aria-label":a?d:c},[i.createVNode(l.Icon,{name:a?"minus":"plus",icon:a?p.minusIcon:p.plusIcon},null)])])}return l.getTemplate.call(this,{h:i.h,template:this.$props.render,defaultRendering:e,additionalProps:this.$props,additionalListeners:{keydown:this.triggerKeydown,click:this.clickHandler}})}});exports.GridHierarchyCell=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("vue"),l=require("@progress/kendo-vue-common"),d=require("@progress/kendo-vue-data-tools"),g=require("@progress/kendo-vue-intl"),n=require("../messages/main.js"),h=require("@progress/kendo-svg-icons"),m=e=>{var t,a;return(a=(t=e.cells)==null?void 0:t.hierarchy)==null?void 0:a[e.rowType||"data"]},f=i.defineComponent({name:"KendoGridHierarchyCell",inheritAttrs:!1,props:{id:String,field:String,dataItem:Object,format:String,type:String,className:String,colSpan:Number,columnIndex:Number,columnsCount:Number,rowType:String,level:Number,expanded:Boolean,editor:String,isSelected:Boolean,dataIndex:Number,ariaColumnIndex:Number,render:[String,Function,Object],isRtl:Boolean,cells:Object},emits:{change:null,cellkeydown:null},inject:{kendo:{default:null},kendoIntlService:{default:null},kendoLocalizationService:{default:null},getKeyboardNavigationAttributes:{default:l.noop}},methods:{triggerStateChange(){const e=this.kendo;e.dataItemKey&&this.$props.dataItem[e.dataItemKey]!==void 0&&(e==null||e.dispatchDetailExpand({type:d.DETAIL_EXPAND_ACTION.TOGGLE,id:this.$props.dataItem[e.dataItemKey]}))},triggerKeydown(e,t){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,field:this.$props.field,expanded:t}),!e.defaultPrevented&&e.keyCode===l.Keys.enter&&(e.preventDefault(),this.$emit("change",{dataItem:this.$props.dataItem,dataIndex:this.$props.dataIndex,event:e,field:this.$props.field,value:!t}),this.triggerStateChange())},clickHandler(e,t,a){e.preventDefault(),this.$emit("change",{dataItem:t,event:e,field:void 0,value:!a}),this.triggerStateChange()}},computed:{wrapperClass(){return{"k-table-td":!0,"k-hierarchy-cell":!0,[this.className||""]:this.className}}},render(){let e=null,t,a=null;const s=this.getKeyboardNavigationAttributes(this.$props.id),c=g.provideLocalizationService(this),p=c.toLanguageString(n.collapseDetailAriaLabel,n.messages[n.collapseDetailAriaLabel]),u=c.toLanguageString(n.expandDetailAriaLabel,n.messages[n.expandDetailAriaLabel]);if(this.$props.rowType==="groupFooter")t={class:this.wrapperClass},e=i.createVNode("td",t,null);else if(this.$props.rowType!=="groupHeader"){const r=this.$props.expanded;t={style:this.$attrs.style,class:this.wrapperClass,"aria-expanded":r?"true":"false",role:"gridcell","aria-colindex":this.$props.ariaColumnIndex,tabindex:s.tabIndex,"data-keyboardnavlevel":s[d.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":s[d.KEYBOARD_NAV_DATA_ID]},a=i.createVNode("a",{onClick:o=>{this.clickHandler(o,this.$props.dataItem,r)},href:"#",tabindex:-1,title:r?p:u,"aria-label":r?p:u},[i.createVNode(l.Icon,{name:r?"minus":"plus",icon:r?h.minusIcon:h.plusIcon},null)]),e=i.createVNode("td",i.mergeProps(t,{onKeydown:o=>{this.triggerKeydown(o,r)}}),[a])}return l.getTemplate.call(this,{h:i.h,template:this.$props.render||m(this.$props),defaultRendering:e,additionalProps:{...this.$props,tdProps:t},additionalListeners:{keydown:this.triggerKeydown,click:this.clickHandler},defaultSlots:a,swapDefaultSlots:!0})}});exports.GridHierarchyCell=f;

package/cells/GridHierarchyCell.mjs

@@ -5,13 +5,16 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as c, createVNode as r, h as m } from "vue";
-import { noop as u, Icon as h, getTemplate as g, Keys as f } from "@progress/kendo-vue-common";
-import { KEYBOARD_NAV_DATA_ID as y, KEYBOARD_NAV_DATA_LEVEL as I, DETAIL_EXPAND_ACTION as b } from "@progress/kendo-vue-data-tools";
-import { provideLocalizationService as S } from "@progress/kendo-vue-intl";
-import { collapseDetailAriaLabel as s, messages as d, expandDetailAriaLabel as p } from "../messages/main.mjs";
-import { minusIcon as $, plusIcon as k } from "@progress/kendo-svg-icons";
-const K = /* @__PURE__ */ c({
+import { defineComponent as m, createVNode as i, mergeProps as h, h as g } from "vue";
+import { noop as f, Icon as y, getTemplate as I, Keys as b } from "@progress/kendo-vue-common";
+import { KEYBOARD_NAV_DATA_ID as S, KEYBOARD_NAV_DATA_LEVEL as $, DETAIL_EXPAND_ACTION as k } from "@progress/kendo-vue-data-tools";
+import { provideLocalizationService as x } from "@progress/kendo-vue-intl";
+import { collapseDetailAriaLabel as p, messages as c, expandDetailAriaLabel as u } from "../messages/main.mjs";
+import { minusIcon as A, plusIcon as C } from "@progress/kendo-svg-icons";
+const v = (e) => {
+  var t, a;
+  return (a = (t = e.cells) == null ? void 0 : t.hierarchy) == null ? void 0 : a[e.rowType || "data"];
+}, E = /* @__PURE__ */ m({
   name: "KendoGridHierarchyCell",
   inheritAttrs: !1,
   props: {
@@ -32,7 +35,8 @@ const K = /* @__PURE__ */ c({
     dataIndex: Number,
     ariaColumnIndex: Number,
     render: [String, Function, Object],
-    isRtl: Boolean
+    isRtl: Boolean,
+    cells: Object
   },
   emits: {
     change: null,
@@ -49,14 +53,14 @@ const K = /* @__PURE__ */ c({
       default: null
     },
     getKeyboardNavigationAttributes: {
-      default: u
+      default: f
     }
   },
   methods: {
     triggerStateChange() {
       const e = this.kendo;
       e.dataItemKey && this.$props.dataItem[e.dataItemKey] !== void 0 && (e == null || e.dispatchDetailExpand({
-        type: b.TOGGLE,
+        type: k.TOGGLE,
         id: this.$props.dataItem[e.dataItemKey]
       }));
     },
@@ -66,7 +70,7 @@ const K = /* @__PURE__ */ c({
         dataItem: this.$props.dataItem,
         field: this.$props.field,
         expanded: t
-      }), !e.defaultPrevented && e.keyCode === f.enter && (e.preventDefault(), this.$emit("change", {
+      }), !e.defaultPrevented && e.keyCode === b.enter && (e.preventDefault(), this.$emit("change", {
         dataItem: this.$props.dataItem,
         dataIndex: this.$props.dataIndex,
         event: e,
@@ -74,12 +78,12 @@ const K = /* @__PURE__ */ c({
         value: !t
       }), this.triggerStateChange());
     },
-    clickHandler(e, t, i) {
+    clickHandler(e, t, a) {
       e.preventDefault(), this.$emit("change", {
         dataItem: t,
         event: e,
         field: void 0,
-        value: !i
+        value: !a
       }), this.triggerStateChange();
     }
   },
@@ -93,51 +97,57 @@ const K = /* @__PURE__ */ c({
     }
   },
   render() {
-    let e = null;
-    const t = this.getKeyboardNavigationAttributes(this.$props.id), i = S(this), l = i.toLanguageString(s, d[s]), o = i.toLanguageString(p, d[p]);
+    let e = null, t, a = null;
+    const n = this.getKeyboardNavigationAttributes(this.$props.id), s = x(this), o = s.toLanguageString(p, c[p]), d = s.toLanguageString(u, c[u]);
     if (this.$props.rowType === "groupFooter")
-      e = r("td", {
+      t = {
         class: this.wrapperClass
-      }, null);
+      }, e = i("td", t, null);
     else if (this.$props.rowType !== "groupHeader") {
-      const a = this.$props.expanded;
-      e = r("td", {
+      const r = this.$props.expanded;
+      t = {
         style: this.$attrs.style,
-        onKeydown: (n) => {
-          this.triggerKeydown(n, a);
-        },
         class: this.wrapperClass,
-        "aria-expanded": a ? "true" : "false",
+        "aria-expanded": r ? "true" : "false",
         role: "gridcell",
         "aria-colindex": this.$props.ariaColumnIndex,
-        tabindex: t.tabIndex,
-        "data-keyboardnavlevel": t[I],
-        "data-keyboardnavid": t[y]
-      }, [r("a", {
-        onClick: (n) => {
-          this.clickHandler(n, this.$props.dataItem, a);
+        tabindex: n.tabIndex,
+        "data-keyboardnavlevel": n[$],
+        "data-keyboardnavid": n[S]
+      }, a = i("a", {
+        onClick: (l) => {
+          this.clickHandler(l, this.$props.dataItem, r);
         },
         href: "#",
         tabindex: -1,
-        title: a ? l : o,
-        "aria-label": a ? l : o
-      }, [r(h, {
-        name: a ? "minus" : "plus",
-        icon: a ? $ : k
-      }, null)])]);
+        title: r ? o : d,
+        "aria-label": r ? o : d
+      }, [i(y, {
+        name: r ? "minus" : "plus",
+        icon: r ? A : C
+      }, null)]), e = i("td", h(t, {
+        onKeydown: (l) => {
+          this.triggerKeydown(l, r);
+        }
+      }), [a]);
     }
-    return g.call(this, {
-      h: m,
-      template: this.$props.render,
+    return I.call(this, {
+      h: g,
+      template: this.$props.render || v(this.$props),
       defaultRendering: e,
-      additionalProps: this.$props,
+      additionalProps: {
+        ...this.$props,
+        tdProps: t
+      },
       additionalListeners: {
         keydown: this.triggerKeydown,
         click: this.clickHandler
-      }
+      },
+      defaultSlots: a,
+      swapDefaultSlots: !0
     });
   }
 });
 export {
-  K as GridHierarchyCell
+  E as GridHierarchyCell
 };

package/cells/GridSelectionCell.d.ts

@@ -27,6 +27,7 @@ declare const GridSelectionCell: import('vue').DefineComponent<import('vue').Ext
     ariaColumnIndex: PropType<number>;
     editor: PropType<string>;
     isRtl: PropType<boolean>;
+    cells: PropType<import('..').GridCellsSettings>;
 }>, {}, {
     inputId: any;
 }, {
@@ -58,6 +59,7 @@ declare const GridSelectionCell: import('vue').DefineComponent<import('vue').Ext
     ariaColumnIndex: PropType<number>;
     editor: PropType<string>;
     isRtl: PropType<boolean>;
+    cells: PropType<import('..').GridCellsSettings>;
 }>> & Readonly<{
     onSelectionchange?: (...args: any[] | unknown[]) => any;
     onCellkeydown?: (...args: any[] | unknown[]) => any;