@progress/kendo-vue-grid 8.1.2-develop.2 → 8.2.0-develop.1

package/cells/GridGroupCell.mjs

@@ -5,16 +5,16 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as x, createVNode as n, mergeProps as A, h as v } from "vue";
+import { defineComponent as S, createVNode as a, mergeProps as A, h as v } from "vue";
 import { noop as N, Icon as L, getTemplate as w, Keys as K } from "@progress/kendo-vue-common";
 import { KEYBOARD_NAV_DATA_ID as R, KEYBOARD_NAV_DATA_LEVEL as T, GROUP_EXPAND_ACTION as D } from "@progress/kendo-vue-data-tools";
-import { groupCaretAriaLabelCollapse as y, messages as b, groupCaretAriaLabelExpand as I } from "../messages/main.mjs";
-import { provideLocalizationService as C } from "@progress/kendo-vue-intl";
+import { groupCaretAriaLabelCollapse as x, messages as y, groupCaretAriaLabelExpand as C } from "../messages/main.mjs";
+import { provideLocalizationService as b } 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({
+  return (l = (t = e.cells) == null ? void 0 : t.group) == null ? void 0 : l[e.rowType || "data"];
+}, M = /* @__PURE__ */ S({
   name: "KendoGridGroupCell",
   inheritAttrs: !1,
   props: {
@@ -45,7 +45,7 @@ const _ = (e) => {
     cellkeydown: null
   },
   inject: {
-    kendo: {
+    gridContext: {
       default: null
     },
     kendoIntlService: {
@@ -98,7 +98,7 @@ const _ = (e) => {
   methods: {
     triggerStateChange() {
       var t;
-      const e = this.kendo;
+      const e = this.gridContext;
       (t = e == null ? void 0 : e.dispatchGroupExpand) == null || t.call(e, {
         type: D.TOGGLE,
         group: this.$props.group
@@ -129,70 +129,74 @@ const _ = (e) => {
         field: void 0,
         value: !l
       }), this.triggerStateChange();
+    },
+    triggerContextMenu(e) {
+      var t, l;
+      (l = (t = this.gridContext) == null ? void 0 : t.onContextMenu) == null || l.call(t, e, this.$props.dataItem, this.$props.field);
     }
   },
   render() {
-    let e = null, t, l, o = null;
+    let e = null, t, l, d = null;
     const {
       columnIndex: r,
-      level: d,
-      columnsCount: s,
-      rowType: S,
+      level: s,
+      columnsCount: p,
+      rowType: I,
       dataItem: i,
-      field: p,
-      expanded: a,
+      field: c,
+      expanded: n,
       render: $,
-      locked: c
-    } = this.$props, u = this.getKeyboardNavigationAttributes(this.$props.id), h = C(this).toLanguageString(y, b[y]), m = C(this).toLanguageString(I, b[I]);
-    if (r === void 0 || d === void 0 || r < d || s === void 0 || S !== "groupHeader" || i[p] === void 0)
+      locked: o
+    } = this.$props, u = this.getKeyboardNavigationAttributes(this.$props.id), h = b(this).toLanguageString(x, y[x]), m = b(this).toLanguageString(C, y[C]);
+    if (r === void 0 || s === void 0 || r < s || p === void 0 || I !== "groupHeader" || i[c] === void 0)
       t = {
         style: this.$attrs.style,
         key: "g" + r,
         class: this.groupTdClass
-      }, e = n("td", t, null);
-    else if (r <= d) {
+      }, e = a("td", t, null);
+    else if (r <= s) {
       t = {
         style: this.tdStyle,
         key: "g-colspan",
-        class: c ? "k-table-td" : this.tdClass,
-        colspan: c ? 0 : s - r,
+        class: o ? "k-table-td" : this.tdClass,
+        colspan: o ? 0 : p - r,
         role: "gridcell",
         "aria-colindex": this.$props.ariaColumnIndex,
         "aria-selected": this.$props.isSelected,
-        "aria-expanded": a,
+        "aria-expanded": n,
         "data-grid-col-index": this.$props.columnIndex,
         tabindex: u.tabIndex,
         "data-keyboardnavlevel": u[T],
         "data-keyboardnavid": u[R]
-      }, o = n("p", {
+      }, d = a("p", {
         class: "k-reset"
-      }, [n("a", {
+      }, [a("a", {
         onClick: (g) => {
-          this.clickHandler(g, i, a);
+          this.clickHandler(g, i, n);
         },
         href: "#",
         tabindex: -1,
-        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 ? E : this.isRtl ? G : O
-      }, null)]), i[p] ? i[p].toString() : ""]);
-      const f = n("td", A(t, {
+        title: n ? h : m,
+        "aria-label": n ? h : m
+      }, [a(L, {
+        name: n ? "caret-alt-down" : this.isRtl ? "caret-alt-left" : "caret-alt-right",
+        icon: n ? E : this.isRtl ? G : O
+      }, null)]), i[c] ? i[c].toString() : ""]);
+      const f = a("td", A(t, {
         onKeydown: (g) => {
-          this.triggerKeydown(g, a);
+          this.triggerKeydown(g, n);
         }
-      }), [o]);
-      l = {
+      }), [d]);
+      o && (l = {
         className: "k-table-td",
         role: "gridcell",
-        colSpan: s - r,
+        colSpan: p - r,
         style: {
           borderLeftWidth: 0,
           borderRightWidth: 0
         }
-      };
-      const k = c ? n("td", l, null) : null;
+      });
+      const k = o ? a("td", l, null) : null;
       e = k ? [f, k] : f;
     }
     return w.call(this, {
@@ -206,12 +210,13 @@ const _ = (e) => {
       },
       additionalListeners: {
         keydown: this.triggerKeydown,
-        click: this.clickHandler
+        click: this.clickHandler,
+        contextmenu: this.triggerContextMenu
       },
-      defaultSlots: o
+      defaultSlots: d
     });
   }
 });
 export {
-  W as GridGroupCell
+  M as GridGroupCell
 };

package/cells/GridHierarchyCell.d.ts

@@ -39,6 +39,7 @@ declare const GridHierarchyCell: import('vue').DefineComponent<import('vue').Ext
     triggerStateChange(): void;
     triggerKeydown(event: any, expanded: boolean | undefined): void;
     clickHandler(e: any, dataItem: any, expanded: boolean | undefined): void;
+    triggerContextMenu(e: MouseEvent): void;
 }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     change: any;
     cellkeydown: 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"),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"]},y=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})}});exports.GridHierarchyCell=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("vue"),l=require("@progress/kendo-vue-common"),d=require("@progress/kendo-vue-data-tools"),h=require("@progress/kendo-vue-intl"),n=require("../messages/main.js"),g=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=r.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:{gridContext:{default:null},kendoIntlService:{default:null},kendoLocalizationService:{default:null},getKeyboardNavigationAttributes:{default:l.noop}},methods:{triggerStateChange(){const e=this.gridContext;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()},triggerContextMenu(e){var t,a;(a=(t=this.gridContext)==null?void 0:t.onContextMenu)==null||a.call(t,e,this.$props.dataItem,this.$props.field)}},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=h.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=r.createVNode("td",t,null);else if(this.$props.rowType!=="groupHeader"){const i=this.$props.expanded;t={style:this.$attrs.style,class:this.wrapperClass,"aria-expanded":i?"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=r.createVNode("a",{onClick:o=>{this.clickHandler(o,this.$props.dataItem,i)},href:"#",tabindex:-1,title:i?p:u,"aria-label":i?p:u},[r.createVNode(l.Icon,{name:i?"minus":"plus",icon:i?g.minusIcon:g.plusIcon},null)]),e=r.createVNode("td",r.mergeProps(t,{onKeydown:o=>{this.triggerKeydown(o,i)}}),[a])}return l.getTemplate.call(this,{h:r.h,template:this.$props.render||m(this.$props),defaultRendering:e,additionalProps:{...this.$props,tdProps:t},additionalListeners:{keydown:this.triggerKeydown,click:this.clickHandler,contextmenu:this.triggerContextMenu},defaultSlots:a})}});exports.GridHierarchyCell=f;

package/cells/GridHierarchyCell.mjs

@@ -5,16 +5,16 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as m, createVNode as r, 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 { defineComponent as h, createVNode as r, mergeProps as m, h as g } from "vue";
+import { noop as f, Icon as y, getTemplate as I, Keys as x } from "@progress/kendo-vue-common";
+import { KEYBOARD_NAV_DATA_ID as C, KEYBOARD_NAV_DATA_LEVEL as b, DETAIL_EXPAND_ACTION as $ } from "@progress/kendo-vue-data-tools";
+import { provideLocalizationService as S } 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) => {
+import { minusIcon as A, plusIcon as v } from "@progress/kendo-svg-icons";
+const N = (e) => {
   var t, a;
   return (a = (t = e.cells) == null ? void 0 : t.hierarchy) == null ? void 0 : a[e.rowType || "data"];
-}, E = /* @__PURE__ */ m({
+}, E = /* @__PURE__ */ h({
   name: "KendoGridHierarchyCell",
   inheritAttrs: !1,
   props: {
@@ -43,7 +43,7 @@ const v = (e) => {
     cellkeydown: null
   },
   inject: {
-    kendo: {
+    gridContext: {
       default: null
     },
     kendoIntlService: {
@@ -58,9 +58,9 @@ const v = (e) => {
   },
   methods: {
     triggerStateChange() {
-      const e = this.kendo;
+      const e = this.gridContext;
       e.dataItemKey && this.$props.dataItem[e.dataItemKey] !== void 0 && (e == null || e.dispatchDetailExpand({
-        type: k.TOGGLE,
+        type: $.TOGGLE,
         id: this.$props.dataItem[e.dataItemKey]
       }));
     },
@@ -70,7 +70,7 @@ const v = (e) => {
         dataItem: this.$props.dataItem,
         field: this.$props.field,
         expanded: t
-      }), !e.defaultPrevented && e.keyCode === b.enter && (e.preventDefault(), this.$emit("change", {
+      }), !e.defaultPrevented && e.keyCode === x.enter && (e.preventDefault(), this.$emit("change", {
         dataItem: this.$props.dataItem,
         dataIndex: this.$props.dataIndex,
         event: e,
@@ -85,6 +85,10 @@ const v = (e) => {
         field: void 0,
         value: !a
       }), this.triggerStateChange();
+    },
+    triggerContextMenu(e) {
+      var t, a;
+      (a = (t = this.gridContext) == null ? void 0 : t.onContextMenu) == null || a.call(t, e, this.$props.dataItem, this.$props.field);
     }
   },
   computed: {
@@ -98,7 +102,7 @@ const v = (e) => {
   },
   render() {
     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]);
+    const n = this.getKeyboardNavigationAttributes(this.$props.id), o = S(this), s = o.toLanguageString(p, c[p]), d = o.toLanguageString(u, c[u]);
     if (this.$props.rowType === "groupFooter")
       t = {
         class: this.wrapperClass
@@ -112,20 +116,20 @@ const v = (e) => {
         role: "gridcell",
         "aria-colindex": this.$props.ariaColumnIndex,
         tabindex: n.tabIndex,
-        "data-keyboardnavlevel": n[$],
-        "data-keyboardnavid": n[S]
+        "data-keyboardnavlevel": n[b],
+        "data-keyboardnavid": n[C]
       }, a = r("a", {
         onClick: (l) => {
           this.clickHandler(l, this.$props.dataItem, i);
         },
         href: "#",
         tabindex: -1,
-        title: i ? o : d,
-        "aria-label": i ? o : d
+        title: i ? s : d,
+        "aria-label": i ? s : d
       }, [r(y, {
         name: i ? "minus" : "plus",
-        icon: i ? A : C
-      }, null)]), e = r("td", h(t, {
+        icon: i ? A : v
+      }, null)]), e = r("td", m(t, {
         onKeydown: (l) => {
           this.triggerKeydown(l, i);
         }
@@ -133,7 +137,7 @@ const v = (e) => {
     }
     return I.call(this, {
       h: g,
-      template: this.$props.render || v(this.$props),
+      template: this.$props.render || N(this.$props),
       defaultRendering: e,
       additionalProps: {
         ...this.$props,
@@ -141,7 +145,8 @@ const v = (e) => {
       },
       additionalListeners: {
         keydown: this.triggerKeydown,
-        click: this.clickHandler
+        click: this.clickHandler,
+        contextmenu: this.triggerContextMenu
       },
       defaultSlots: a
     });

package/cells/GridSelectionCell.d.ts

@@ -28,7 +28,9 @@ declare const GridSelectionCell: import('vue').DefineComponent<import('vue').Ext
     editor: PropType<string>;
     isRtl: PropType<boolean>;
     cells: PropType<import('..').GridCellsSettings>;
-}>, {}, {
+}>, {
+    gridContext: any;
+}, {
     inputId: any;
 }, {
     tdClass(): {
@@ -38,6 +40,7 @@ declare const GridSelectionCell: import('vue').DefineComponent<import('vue').Ext
 }, {
     triggerKeydown(e: any): void;
     handleOnChange(event: any): void;
+    triggerContextMenu(e: MouseEvent): void;
 }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     selectionchange: any;
     cellkeydown: any;

package/cells/GridSelectionCell.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 t=require("vue"),c=require("../utils/main.js"),r=require("@progress/kendo-vue-common"),a=require("@progress/kendo-vue-data-tools"),p=e=>{var n,o;return(o=(n=e.cells)==null?void 0:n.select)==null?void 0:o[e.rowType||"data"]},u=t.defineComponent({name:"KendoGridSelectionCell",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,render:[String,Function,Object],isSelected:Boolean,ariaColumnIndex:Number,editor:String,isRtl:Boolean,cells:Object},emits:{selectionchange:null,cellkeydown:null},inject:{kendoIntlService:{default:null},getKeyboardNavigationAttributes:{default:r.noop}},data(){return{inputId:r.guid()}},computed:{tdClass(){const{className:e}=this.$props;return{"k-table-td":!0,[e]:e}}},methods:{triggerKeydown(e){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,field:this.$props.field})},handleOnChange(e){this.$emit("selectionchange",{event:e,dataItem:this.$props.dataItem})}},render(){let e,n=null;const o=this.$props.isSelected||c.getNestedValue(this.$props.field,this.$props.dataItem),s=typeof o=="boolean"&&o,i=this.$props.render,l=this.getKeyboardNavigationAttributes(this.$props.id),d=this.$props.rowType!=="groupHeader"?(e={style:this.$attrs.style,colspan:this.$props.colSpan,class:this.tdClass,"aria-colindex":this.$props.ariaColumnIndex,role:"gridcell",tabindex:l.tabIndex,"data-keyboardnavlevel":l[a.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":l[a.KEYBOARD_NAV_DATA_ID]},n=t.createVNode(t.Fragment,null,[t.createVNode("span",{class:"k-checkbox-wrap"},[t.createVNode("input",{checked:s,id:this.inputId,type:"checkbox",class:"k-checkbox k-checkbox-md k-rounded-md",onChange:this.handleOnChange},null)]),t.createVNode("label",{class:"k-checkbox-label",for:this.inputId},null)]),t.createVNode("td",t.mergeProps(e,{onKeydown:this.triggerKeydown}),[n])):null;return r.getTemplate.call(this,{h:t.h,template:i||p(this.$props),defaultRendering:d,additionalProps:{...this.$props,tdProps:e},additionalListeners:{keydown:this.triggerKeydown,change:this.handleOnChange},defaultSlots:n})}});exports.GridSelectionCell=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),c=require("../utils/main.js"),l=require("@progress/kendo-vue-common"),i=require("@progress/kendo-vue-data-tools"),u=e=>{var t,o;return(o=(t=e.cells)==null?void 0:t.select)==null?void 0:o[e.rowType||"data"]},p=n.defineComponent({name:"KendoGridSelectionCell",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,render:[String,Function,Object],isSelected:Boolean,ariaColumnIndex:Number,editor:String,isRtl:Boolean,cells:Object},emits:{selectionchange:null,cellkeydown:null},inject:{kendoIntlService:{default:null},getKeyboardNavigationAttributes:{default:l.noop}},data(){return{inputId:l.guid()}},computed:{tdClass(){const{className:e}=this.$props;return{"k-table-td":!0,[e]:e}}},methods:{triggerKeydown(e){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,field:this.$props.field})},handleOnChange(e){this.$emit("selectionchange",{event:e,dataItem:this.$props.dataItem})},triggerContextMenu(e){var t,o;(o=(t=this.gridContext)==null?void 0:t.onContextMenu)==null||o.call(t,e,this.$props.dataItem,this.$props.field)}},setup(){return{gridContext:n.inject("gridContext",null)}},render(){let e,t=null;const o=this.$props.isSelected||c.getNestedValue(this.$props.field,this.$props.dataItem),s=typeof o=="boolean"&&o,a=this.$props.render,r=this.getKeyboardNavigationAttributes(this.$props.id),d=this.$props.rowType!=="groupHeader"?(e={style:this.$attrs.style,colspan:this.$props.colSpan,class:this.tdClass,"aria-colindex":this.$props.ariaColumnIndex,role:"gridcell",tabindex:r.tabIndex,"data-keyboardnavlevel":r[i.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":r[i.KEYBOARD_NAV_DATA_ID]},t=n.createVNode(n.Fragment,null,[n.createVNode("span",{class:"k-checkbox-wrap"},[n.createVNode("input",{checked:s,id:this.inputId,type:"checkbox",class:"k-checkbox k-checkbox-md k-rounded-md",onChange:this.handleOnChange},null)]),n.createVNode("label",{class:"k-checkbox-label",for:this.inputId},null)]),n.createVNode("td",n.mergeProps(e,{onKeydown:this.triggerKeydown}),[t])):null;return l.getTemplate.call(this,{h:n.h,template:a||u(this.$props),defaultRendering:d,additionalProps:{...this.$props,tdProps:e},additionalListeners:{keydown:this.triggerKeydown,change:this.handleOnChange,contextmenu:this.triggerContextMenu},defaultSlots:t})}});exports.GridSelectionCell=p;

package/cells/GridSelectionCell.mjs

@@ -5,14 +5,14 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as i, createVNode as l, Fragment as d, mergeProps as c, h as p } from "vue";
+import { defineComponent as a, createVNode as o, Fragment as d, mergeProps as p, h as c, inject as u } from "vue";
 import { getNestedValue as h } from "../utils/main.mjs";
-import { noop as u, getTemplate as m, guid as g } from "@progress/kendo-vue-common";
-import { KEYBOARD_NAV_DATA_ID as b, KEYBOARD_NAV_DATA_LEVEL as f } from "@progress/kendo-vue-data-tools";
-const y = (e) => {
+import { noop as g, getTemplate as m, guid as b } from "@progress/kendo-vue-common";
+import { KEYBOARD_NAV_DATA_ID as C, KEYBOARD_NAV_DATA_LEVEL as x } from "@progress/kendo-vue-data-tools";
+const f = (e) => {
   var t, n;
   return (n = (t = e.cells) == null ? void 0 : t.select) == null ? void 0 : n[e.rowType || "data"];
-}, I = /* @__PURE__ */ i({
+}, S = /* @__PURE__ */ a({
   name: "KendoGridSelectionCell",
   inheritAttrs: !1,
   props: {
@@ -44,12 +44,12 @@ const y = (e) => {
       default: null
     },
     getKeyboardNavigationAttributes: {
-      default: u
+      default: g
     }
   },
   data() {
     return {
-      inputId: g()
+      inputId: b()
     };
   },
   computed: {
@@ -76,49 +76,59 @@ const y = (e) => {
         event: e,
         dataItem: this.$props.dataItem
       });
+    },
+    triggerContextMenu(e) {
+      var t, n;
+      (n = (t = this.gridContext) == null ? void 0 : t.onContextMenu) == null || n.call(t, e, this.$props.dataItem, this.$props.field);
     }
   },
+  setup() {
+    return {
+      gridContext: u("gridContext", null)
+    };
+  },
   render() {
     let e, t = null;
-    const n = this.$props.isSelected || h(this.$props.field, this.$props.dataItem), r = typeof n == "boolean" && n, s = this.$props.render, o = this.getKeyboardNavigationAttributes(this.$props.id), a = this.$props.rowType !== "groupHeader" ? (e = {
+    const n = this.$props.isSelected || h(this.$props.field, this.$props.dataItem), i = typeof n == "boolean" && n, l = this.$props.render, r = this.getKeyboardNavigationAttributes(this.$props.id), s = this.$props.rowType !== "groupHeader" ? (e = {
       style: this.$attrs.style,
       colspan: this.$props.colSpan,
       class: this.tdClass,
       "aria-colindex": this.$props.ariaColumnIndex,
       role: "gridcell",
-      tabindex: o.tabIndex,
-      "data-keyboardnavlevel": o[f],
-      "data-keyboardnavid": o[b]
-    }, t = l(d, null, [l("span", {
+      tabindex: r.tabIndex,
+      "data-keyboardnavlevel": r[x],
+      "data-keyboardnavid": r[C]
+    }, t = o(d, null, [o("span", {
       class: "k-checkbox-wrap"
-    }, [l("input", {
-      checked: r,
+    }, [o("input", {
+      checked: i,
       id: this.inputId,
       type: "checkbox",
       class: "k-checkbox k-checkbox-md k-rounded-md",
       onChange: this.handleOnChange
-    }, null)]), l("label", {
+    }, null)]), o("label", {
       class: "k-checkbox-label",
       for: this.inputId
-    }, null)]), l("td", c(e, {
+    }, null)]), o("td", p(e, {
       onKeydown: this.triggerKeydown
     }), [t])) : null;
     return m.call(this, {
-      h: p,
-      template: s || y(this.$props),
-      defaultRendering: a,
+      h: c,
+      template: l || f(this.$props),
+      defaultRendering: s,
       additionalProps: {
         ...this.$props,
         tdProps: e
       },
       additionalListeners: {
         keydown: this.triggerKeydown,
-        change: this.handleOnChange
+        change: this.handleOnChange,
+        contextmenu: this.triggerContextMenu
       },
       defaultSlots: t
     });
   }
 });
 export {
-  I as GridSelectionCell
+  S as GridSelectionCell
 };

package/cells/pincell/GridPinCell.d.ts

@@ -42,8 +42,12 @@ export declare const GridPinCell: import('vue').DefineComponent<import('vue').Ex
     isRtl: PropType<boolean>;
 }>, {
     getKeyboardNavigationAttributes: () => void;
-    triggerCellContextMenu: () => void;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    gridContext: any;
+}, {}, {}, {
+    triggerClick(): void;
+    triggerKeydown(e: any): void;
+    triggerContextMenu(e: MouseEvent): void;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     id: PropType<string>;
     field: PropType<string>;
     dataItem: PropType<any>;

package/cells/pincell/GridPinCell.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 o=require("vue"),i=require("@progress/kendo-vue-data-tools"),r=require("@progress/kendo-vue-common"),p=require("./GridPinDropdownButton.js"),s=e=>{var n,t;return(t=(n=e.cells)==null?void 0:n.pin)==null?void 0:t[e.rowType||"data"]},b=o.defineComponent({name:"GridPinCell",inheritAttrs:!1,props:{id:String,field:String,dataItem:Object,format:String,readFormat:String,className:String,columnType:String,colSpan:Number,columnIndex:Number,columnsCount:Number,dataIndex:Number,rowType:String,level:Number,expanded:Boolean,type:String,editor:String,rowSpan:[Number,Object],isSelected:Boolean,isHighlighted:Boolean,ariaColumnIndex:Number,render:[String,Function,Object],isRtl:Boolean},inject:{getKeyboardNavigationAttributes:{default:r.noop},triggerCellContextMenu:{default:r.noop}},setup(){const e=o.inject("getKeyboardNavigationAttributes",r.noop),n=o.inject("triggerCellContextMenu",r.noop);return{getKeyboardNavigationAttributes:e,triggerCellContextMenu:n}},render(){var l,d;const e=this.$props;let n=null;const t=this.getKeyboardNavigationAttributes(e.id);let a={};if(e.rowType==="groupFooter")a={class:e.className,tabindex:t.tabIndex,"data-keyboardnavlevel":t[i.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":t[i.KEYBOARD_NAV_DATA_ID]},n=o.createVNode("td",a,null);else if(e.rowType!=="groupHeader"){const c=(d=(l=e.unstyled)==null?void 0:l.uGrid)!=null?d:r.uGrid,g=r.classNames(c.td({selected:e.isSelected,highlighted:e.isHighlighted,sorted:e.isSorted,alt:e.isAlt}),e.className);a={style:this.$attrs.style,colspan:e.colSpan,class:g,role:"gridcell","aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,[i.TABLE_COL_INDEX_ATTRIBUTE]:e.columnIndex,tabindex:t.tabIndex,"data-keyboardnavlevel":t[i.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":t[i.KEYBOARD_NAV_DATA_ID],onContextmenu:m=>{this.triggerCellContextMenu(m,e.dataItem,e.field)}},n=o.createVNode("td",a,[o.createVNode(p.GridPinDropdownButton,{dataItem:e.dataItem},null)])}const u=s(e);return r.getTemplate.call(this,{h:o.h,template:u,defaultRendering:n,additionalProps:{...e,tdProps:a},additionalListeners:{}})}});exports.GridPinCell=b;exports.getCustomCell=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),o=require("@progress/kendo-vue-data-tools"),a=require("@progress/kendo-vue-common"),m=require("./GridPinDropdownButton.js"),s=e=>{var t,i;return(i=(t=e.cells)==null?void 0:t.pin)==null?void 0:i[e.rowType||"data"]},p=n.defineComponent({name:"GridPinCell",inheritAttrs:!1,props:{id:String,field:String,dataItem:Object,format:String,readFormat:String,className:String,columnType:String,colSpan:Number,columnIndex:Number,columnsCount:Number,dataIndex:Number,rowType:String,level:Number,expanded:Boolean,type:String,editor:String,rowSpan:[Number,Object],isSelected:Boolean,isHighlighted:Boolean,ariaColumnIndex:Number,render:[String,Function,Object],isRtl:Boolean},inject:{getKeyboardNavigationAttributes:{default:a.noop}},setup(){const e=n.inject("getKeyboardNavigationAttributes",a.noop),t=n.inject("gridContext",null);return{getKeyboardNavigationAttributes:e,gridContext:t}},methods:{triggerClick(){this.$emit("cellclick",{dataItem:this.$props.dataItem,field:this.$props.field})},triggerKeydown(e){this.$emit("cellkeydown",{event:e,dataItem:this.$props.dataItem,field:this.$props.field})},triggerContextMenu(e){var t,i;(i=(t=this.gridContext)==null?void 0:t.onContextMenu)==null||i.call(t,e,this.$props.dataItem,this.$props.field)}},render(){var l,d;const e=this.$props;let t=null;const i=this.getKeyboardNavigationAttributes(e.id);let r={};if(e.rowType==="groupFooter")r={class:e.className,tabindex:i.tabIndex,"data-keyboardnavlevel":i[o.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":i[o.KEYBOARD_NAV_DATA_ID]},t=n.createVNode("td",n.mergeProps(r,{onClick:this.triggerClick,onKeydown:this.triggerKeydown,onContextmenu:this.triggerContextMenu}),null);else if(e.rowType!=="groupHeader"){const c=(d=(l=e.unstyled)==null?void 0:l.uGrid)!=null?d:a.uGrid,u=a.classNames(c.td({selected:e.isSelected,highlighted:e.isHighlighted,sorted:e.isSorted,alt:e.isAlt}),e.className);r={style:this.$attrs.style,colspan:e.colSpan,class:u,role:"gridcell","aria-colindex":e.ariaColumnIndex,"aria-selected":e.isSelected,[o.TABLE_COL_INDEX_ATTRIBUTE]:e.columnIndex,tabindex:i.tabIndex,"data-keyboardnavlevel":i[o.KEYBOARD_NAV_DATA_LEVEL],"data-keyboardnavid":i[o.KEYBOARD_NAV_DATA_ID]},t=n.createVNode("td",n.mergeProps(r,{onClick:this.triggerClick,onKeydown:this.triggerKeydown,onContextmenu:this.triggerContextMenu}),[n.createVNode(m.GridPinDropdownButton,{dataItem:e.dataItem},null)])}const g=s(e);return a.getTemplate.call(this,{h:n.h,template:g,defaultRendering:t,additionalProps:{...e,tdProps:r},additionalListeners:{click:this.triggerClick,keydown:this.triggerKeydown,contextmenu:this.triggerContextMenu}})}});exports.GridPinCell=p;exports.getCustomCell=s;

package/cells/pincell/GridPinCell.mjs

@@ -5,14 +5,14 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as b, createVNode as i, h as C, inject as d } from "vue";
-import { KEYBOARD_NAV_DATA_ID as s, KEYBOARD_NAV_DATA_LEVEL as u, TABLE_COL_INDEX_ATTRIBUTE as N } from "@progress/kendo-vue-data-tools";
-import { noop as a, uGrid as x, classNames as y, getTemplate as A } from "@progress/kendo-vue-common";
-import { GridPinDropdownButton as S } from "./GridPinDropdownButton.mjs";
-const f = (e) => {
-  var n, t;
-  return (t = (n = e.cells) == null ? void 0 : n.pin) == null ? void 0 : t[e.rowType || "data"];
-}, B = /* @__PURE__ */ b({
+import { defineComponent as h, createVNode as r, mergeProps as l, h as C, inject as d } from "vue";
+import { KEYBOARD_NAV_DATA_ID as s, KEYBOARD_NAV_DATA_LEVEL as g, TABLE_COL_INDEX_ATTRIBUTE as b } from "@progress/kendo-vue-data-tools";
+import { noop as c, uGrid as y, classNames as x, getTemplate as N } from "@progress/kendo-vue-common";
+import { GridPinDropdownButton as f } from "./GridPinDropdownButton.mjs";
+const I = (e) => {
+  var t, i;
+  return (i = (t = e.cells) == null ? void 0 : t.pin) == null ? void 0 : i[e.rowType || "data"];
+}, v = /* @__PURE__ */ h({
   name: "GridPinCell",
   inheritAttrs: !1,
   props: {
@@ -41,71 +41,96 @@ const f = (e) => {
   },
   inject: {
     getKeyboardNavigationAttributes: {
-      default: a
-    },
-    triggerCellContextMenu: {
-      default: a
+      default: c
     }
   },
   setup() {
-    const e = d("getKeyboardNavigationAttributes", a), n = d("triggerCellContextMenu", a);
+    const e = d("getKeyboardNavigationAttributes", c), t = d("gridContext", null);
     return {
       getKeyboardNavigationAttributes: e,
-      triggerCellContextMenu: n
+      gridContext: t
     };
   },
+  methods: {
+    triggerClick() {
+      this.$emit("cellclick", {
+        dataItem: this.$props.dataItem,
+        field: this.$props.field
+      });
+    },
+    triggerKeydown(e) {
+      this.$emit("cellkeydown", {
+        event: e,
+        dataItem: this.$props.dataItem,
+        field: this.$props.field
+      });
+    },
+    triggerContextMenu(e) {
+      var t, i;
+      (i = (t = this.gridContext) == null ? void 0 : t.onContextMenu) == null || i.call(t, e, this.$props.dataItem, this.$props.field);
+    }
+  },
   render() {
-    var l, o;
+    var o, a;
     const e = this.$props;
-    let n = null;
-    const t = this.getKeyboardNavigationAttributes(e.id);
-    let r = {};
+    let t = null;
+    const i = this.getKeyboardNavigationAttributes(e.id);
+    let n = {};
     if (e.rowType === "groupFooter")
-      r = {
+      n = {
         class: e.className,
-        tabindex: t.tabIndex,
-        "data-keyboardnavlevel": t[u],
-        "data-keyboardnavid": t[s]
-      }, n = i("td", r, null);
+        tabindex: i.tabIndex,
+        "data-keyboardnavlevel": i[g],
+        "data-keyboardnavid": i[s]
+      }, t = r("td", l(n, {
+        onClick: this.triggerClick,
+        onKeydown: this.triggerKeydown,
+        onContextmenu: this.triggerContextMenu
+      }), null);
     else if (e.rowType !== "groupHeader") {
-      const c = (o = (l = e.unstyled) == null ? void 0 : l.uGrid) != null ? o : x, m = y(c.td({
+      const u = (a = (o = e.unstyled) == null ? void 0 : o.uGrid) != null ? a : y, p = x(u.td({
         selected: e.isSelected,
         highlighted: e.isHighlighted,
         sorted: e.isSorted,
         alt: e.isAlt
       }), e.className);
-      r = {
+      n = {
         style: this.$attrs.style,
         colspan: e.colSpan,
-        class: m,
+        class: p,
         role: "gridcell",
         "aria-colindex": e.ariaColumnIndex,
         "aria-selected": e.isSelected,
-        [N]: e.columnIndex,
-        tabindex: t.tabIndex,
-        "data-keyboardnavlevel": t[u],
-        "data-keyboardnavid": t[s],
-        onContextmenu: (p) => {
-          this.triggerCellContextMenu(p, e.dataItem, e.field);
-        }
-      }, n = i("td", r, [i(S, {
+        [b]: e.columnIndex,
+        tabindex: i.tabIndex,
+        "data-keyboardnavlevel": i[g],
+        "data-keyboardnavid": i[s]
+      }, t = r("td", l(n, {
+        onClick: this.triggerClick,
+        onKeydown: this.triggerKeydown,
+        onContextmenu: this.triggerContextMenu
+      }), [r(f, {
         dataItem: e.dataItem
       }, null)]);
     }
-    const g = f(e);
-    return A.call(this, {
+    const m = I(e);
+    return N.call(this, {
       h: C,
-      template: g,
-      defaultRendering: n,
+      template: m,
+      defaultRendering: t,
       additionalProps: {
         ...e,
-        tdProps: r
+        tdProps: n
       },
-      additionalListeners: {}
+      additionalListeners: {
+        click: this.triggerClick,
+        keydown: this.triggerKeydown,
+        contextmenu: this.triggerContextMenu
+      }
     });
   }
 });
 export {
-  B as GridPinCell,
-  f as getCustomCell
+  v as GridPinCell,
+  I as getCustomCell
 };