@progress/kendo-vue-grid 6.4.2-develop.3 → 6.5.0-develop.2

package/index.d.mts

@@ -216,6 +216,11 @@ filterCellRender: PropType<any>;
 headerCellRender: PropType<any>;
 loader: PropType<string | boolean | Object | Function>;
 filter: PropType<CompositeFilterDescriptor>;
+highlight: PropType<{
+[id: string]: boolean | {
+[id: string]: boolean;
+};
+}>;
 pageable: PropType<any>;
 pageSize: PropType<number>;
 total: PropType<number>;
@@ -464,6 +469,11 @@ filterCellRender: PropType<any>;
 headerCellRender: PropType<any>;
 loader: PropType<string | boolean | Object | Function>;
 filter: PropType<CompositeFilterDescriptor>;
+highlight: PropType<{
+[id: string]: boolean | {
+[id: string]: boolean;
+};
+}>;
 pageable: PropType<any>;
 pageSize: PropType<number>;
 total: PropType<number>;
@@ -611,6 +621,7 @@ expanded: PropType<boolean>;
 type: PropType<string>;
 editor: PropType<string>;
 isSelected: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 ariaColumnIndex: PropType<number>;
 render: PropType<any>;
 isRtl: PropType<boolean>;
@@ -639,6 +650,7 @@ kendoIntlService: {};
 tdClass(): {
 [x: number]: any;
 'k-table-td': boolean;
+'k-highlighted': any;
 };
 }, {
 triggerClick(): void;
@@ -668,6 +680,7 @@ expanded: PropType<boolean>;
 type: PropType<string>;
 editor: PropType<string>;
 isSelected: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 ariaColumnIndex: PropType<number>;
 render: PropType<any>;
 isRtl: PropType<boolean>;
@@ -782,6 +795,10 @@ export declare interface GridCellProps {
      * Indicates if the cell is selected.
      */
     isSelected: boolean;
+    /**
+     * Indicates if the cell is highlighted.
+     */
+    isHighlighted: boolean;
     /**
      * Indicates if the cell is in rtl direction.
      */
@@ -2314,6 +2331,16 @@ export declare interface GridProps {
      * ([see example]({% slug selection_grid %})).
      */
     onSelectionchange?: (event: GridSelectionChangeEvent) => void;
+    /**
+     *  The descriptor by which the highlight state of an item is defined.
+     * Passing a boolean value will highlight the whole row, while passing an object will highlight individual cells by their field.
+     *
+     */
+    highlight?: {
+        [id: string]: boolean | {
+            [id: string]: boolean;
+        };
+    };
     /**
      * Fires when the user clicks the checkbox of a column header whose `field` matches `selectedField`.
      * ([see example]({% slug selection_grid %})).
@@ -2522,6 +2549,7 @@ rowType: PropType<string>;
 dataItem: PropType<any>;
 isAltRow: PropType<boolean>;
 isHidden: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 onClick: PropType<any>;
 isInEdit: PropType<boolean>;
 isSelected: PropType<boolean>;
@@ -2532,7 +2560,20 @@ dataIndex: PropType<Number>;
 render: PropType<any>;
 onRowclick: PropType<any>;
 onRowdblclick: PropType<Function>;
-}>, {}, {}, {}, {
+}>, {}, {}, {
+trClass(): {
+'k-table-row': boolean;
+'k-selected': any;
+'k-highlighted': any;
+'k-table-group-row': boolean;
+'k-grouping-row': boolean;
+'k-group-footer': boolean;
+'k-master-row': boolean;
+'k-alt': any;
+'k-table-alt-row': any;
+'k-edit-row': any;
+};
+}, {
 handleClick(e: any): void;
 handleDoubleClick(e: any): void;
 }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
@@ -2540,6 +2581,7 @@ rowType: PropType<string>;
 dataItem: PropType<any>;
 isAltRow: PropType<boolean>;
 isHidden: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 onClick: PropType<any>;
 isInEdit: PropType<boolean>;
 isSelected: PropType<boolean>;
@@ -2588,6 +2630,10 @@ export declare interface GridRowProps {
      * the row is on the current page. When `rowHeight` is set, `isHidden` is always `true`.
      */
     isHidden: boolean;
+    /**
+     * @hidden
+     */
+    isHighlighted?: boolean;
     /**
      * The event that is fired when the row is clicked.
      */

package/index.d.ts

@@ -216,6 +216,11 @@ filterCellRender: PropType<any>;
 headerCellRender: PropType<any>;
 loader: PropType<string | boolean | Object | Function>;
 filter: PropType<CompositeFilterDescriptor>;
+highlight: PropType<{
+[id: string]: boolean | {
+[id: string]: boolean;
+};
+}>;
 pageable: PropType<any>;
 pageSize: PropType<number>;
 total: PropType<number>;
@@ -464,6 +469,11 @@ filterCellRender: PropType<any>;
 headerCellRender: PropType<any>;
 loader: PropType<string | boolean | Object | Function>;
 filter: PropType<CompositeFilterDescriptor>;
+highlight: PropType<{
+[id: string]: boolean | {
+[id: string]: boolean;
+};
+}>;
 pageable: PropType<any>;
 pageSize: PropType<number>;
 total: PropType<number>;
@@ -611,6 +621,7 @@ expanded: PropType<boolean>;
 type: PropType<string>;
 editor: PropType<string>;
 isSelected: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 ariaColumnIndex: PropType<number>;
 render: PropType<any>;
 isRtl: PropType<boolean>;
@@ -639,6 +650,7 @@ kendoIntlService: {};
 tdClass(): {
 [x: number]: any;
 'k-table-td': boolean;
+'k-highlighted': any;
 };
 }, {
 triggerClick(): void;
@@ -668,6 +680,7 @@ expanded: PropType<boolean>;
 type: PropType<string>;
 editor: PropType<string>;
 isSelected: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 ariaColumnIndex: PropType<number>;
 render: PropType<any>;
 isRtl: PropType<boolean>;
@@ -782,6 +795,10 @@ export declare interface GridCellProps {
      * Indicates if the cell is selected.
      */
     isSelected: boolean;
+    /**
+     * Indicates if the cell is highlighted.
+     */
+    isHighlighted: boolean;
     /**
      * Indicates if the cell is in rtl direction.
      */
@@ -2314,6 +2331,16 @@ export declare interface GridProps {
      * ([see example]({% slug selection_grid %})).
      */
     onSelectionchange?: (event: GridSelectionChangeEvent) => void;
+    /**
+     *  The descriptor by which the highlight state of an item is defined.
+     * Passing a boolean value will highlight the whole row, while passing an object will highlight individual cells by their field.
+     *
+     */
+    highlight?: {
+        [id: string]: boolean | {
+            [id: string]: boolean;
+        };
+    };
     /**
      * Fires when the user clicks the checkbox of a column header whose `field` matches `selectedField`.
      * ([see example]({% slug selection_grid %})).
@@ -2522,6 +2549,7 @@ rowType: PropType<string>;
 dataItem: PropType<any>;
 isAltRow: PropType<boolean>;
 isHidden: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 onClick: PropType<any>;
 isInEdit: PropType<boolean>;
 isSelected: PropType<boolean>;
@@ -2532,7 +2560,20 @@ dataIndex: PropType<Number>;
 render: PropType<any>;
 onRowclick: PropType<any>;
 onRowdblclick: PropType<Function>;
-}>, {}, {}, {}, {
+}>, {}, {}, {
+trClass(): {
+'k-table-row': boolean;
+'k-selected': any;
+'k-highlighted': any;
+'k-table-group-row': boolean;
+'k-grouping-row': boolean;
+'k-group-footer': boolean;
+'k-master-row': boolean;
+'k-alt': any;
+'k-table-alt-row': any;
+'k-edit-row': any;
+};
+}, {
 handleClick(e: any): void;
 handleDoubleClick(e: any): void;
 }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
@@ -2540,6 +2581,7 @@ rowType: PropType<string>;
 dataItem: PropType<any>;
 isAltRow: PropType<boolean>;
 isHidden: PropType<boolean>;
+isHighlighted: PropType<boolean>;
 onClick: PropType<any>;
 isInEdit: PropType<boolean>;
 isSelected: PropType<boolean>;
@@ -2588,6 +2630,10 @@ export declare interface GridRowProps {
      * the row is on the current page. When `rowHeight` is set, `isHidden` is always `true`.
      */
     isHidden: boolean;
+    /**
+     * @hidden
+     */
+    isHighlighted?: boolean;
     /**
      * The event that is fired when the row is clicked.
      */

package/package-metadata.js

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

package/package-metadata.mjs

@@ -10,8 +10,8 @@ const e = {
   productName: "Kendo UI for Vue",
   productCode: "KENDOUIVUE",
   productCodes: ["KENDOUIVUE"],
-  publishDate: 1750422028,
-  version: "6.4.2-develop.3",
+  publishDate: 1752067298,
+  version: "6.5.0-develop.2",
   licensingDocsUrl: "https://www.telerik.com/kendo-vue-ui/my-license/"
 };
 export {

package/package.json

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

package/rows/GridRow.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"),s=require("../utils/main.js"),o=require("@progress/kendo-vue-common"),n=t.defineComponent({name:"KendoGridRow",props:{rowType:String,dataItem:Object,isAltRow:Boolean,isHidden:Boolean,onClick:Function,isInEdit:Boolean,isSelected:Boolean,selectedField:String,rowHeight:Number,ariaRowIndex:Number,dataIndex:Number,render:[String,Function,Object],onRowclick:Function,onRowdblclick:Function},methods:{handleClick(e){this.$emit("rowclick",e)},handleDoubleClick(e){this.$emit("rowdblclick",e)}},render(){const e=o.getDefaultSlots(this),i=this.$props.rowType==="groupFooter"||this.$props.rowType==="groupHeader"?this.$props.rowType==="groupFooter"&&"k-group-footer"||"k-table-group-row k-grouping-row":(this.$props.isAltRow?"k-table-alt-row k-master-row k-alt":"k-master-row")+(this.$props.selectedField!==void 0&&s.getNestedValue(this.$props.selectedField,this.$props.dataItem)?" k-selected":""),r=t.createVNode("tr",{onClick:this.handleClick,onDblclick:this.handleDoubleClick,class:"k-table-row "+i,style:{height:this.$props.rowHeight?this.$props.rowHeight+"px":"",visibility:this.$props.isHidden?"hidden":""},role:"row","aria-rowindex":this.$props.ariaRowIndex,"data-grid-row-index":this.$props.rowType==="data"?this.$props.dataIndex:void 0},[e]);return o.getTemplate.call(this,{h:t.h,template:this.$props.render,defaultRendering:r,additionalProps:this.$props,additionalListeners:{click:this.handleClick},defaultSlots:e,swapDefaultSlots:!0})}});exports.GridRow=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),l=require("../utils/main.js"),r=require("@progress/kendo-vue-common"),s=o.defineComponent({name:"KendoGridRow",props:{rowType:String,dataItem:Object,isAltRow:Boolean,isHidden:Boolean,isHighlighted:Boolean,onClick:Function,isInEdit:Boolean,isSelected:Boolean,selectedField:String,rowHeight:Number,ariaRowIndex:Number,dataIndex:Number,render:[String,Function,Object],onRowclick:Function,onRowdblclick:Function},methods:{handleClick(e){this.$emit("rowclick",e)},handleDoubleClick(e){this.$emit("rowdblclick",e)}},computed:{trClass(){const{rowType:e,isAltRow:t,isInEdit:n,selectedField:i,isHighlighted:d}=this.$props;return{"k-table-row":!0,"k-selected":i!==void 0&&l.getNestedValue(i,this.$props.dataItem),"k-highlighted":d,"k-table-group-row":e==="groupHeader","k-grouping-row":e==="groupHeader","k-group-footer":e==="groupFooter","k-master-row":e!=="groupHeader"&&e!=="groupFooter","k-alt":t,"k-table-alt-row":t,"k-edit-row":n}}},render(){const e=r.getDefaultSlots(this),t=o.createVNode("tr",{onClick:this.handleClick,onDblclick:this.handleDoubleClick,class:this.trClass,style:{height:this.$props.rowHeight?this.$props.rowHeight+"px":"",visibility:this.$props.isHidden?"hidden":""},role:"row","aria-rowindex":this.$props.ariaRowIndex,"data-grid-row-index":this.$props.rowType==="data"?this.$props.dataIndex:void 0},[e]);return r.getTemplate.call(this,{h:o.h,template:this.$props.render,defaultRendering:t,additionalProps:this.$props,additionalListeners:{click:this.handleClick},defaultSlots:e,swapDefaultSlots:!0})}});exports.GridRow=s;

package/rows/GridRow.mjs

@@ -5,16 +5,17 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as i, createVNode as r, h as s } from "vue";
-import { getNestedValue as l } from "../utils/main.mjs";
-import { getDefaultSlots as d, getTemplate as n } from "@progress/kendo-vue-common";
-const h = /* @__PURE__ */ i({
+import { defineComponent as l, createVNode as d, h as n } from "vue";
+import { getNestedValue as s } from "../utils/main.mjs";
+import { getDefaultSlots as a, getTemplate as p } from "@progress/kendo-vue-common";
+const g = /* @__PURE__ */ l({
   name: "KendoGridRow",
   props: {
     rowType: String,
     dataItem: Object,
     isAltRow: Boolean,
     isHidden: Boolean,
+    isHighlighted: Boolean,
     onClick: Function,
     isInEdit: Boolean,
     isSelected: Boolean,
@@ -34,11 +35,34 @@ const h = /* @__PURE__ */ i({
       this.$emit("rowdblclick", e);
     }
   },
+  computed: {
+    trClass() {
+      const {
+        rowType: e,
+        isAltRow: t,
+        isInEdit: i,
+        selectedField: o,
+        isHighlighted: r
+      } = this.$props;
+      return {
+        "k-table-row": !0,
+        "k-selected": o !== void 0 && s(o, this.$props.dataItem),
+        "k-highlighted": r,
+        "k-table-group-row": e === "groupHeader",
+        "k-grouping-row": e === "groupHeader",
+        "k-group-footer": e === "groupFooter",
+        "k-master-row": e !== "groupHeader" && e !== "groupFooter",
+        "k-alt": t,
+        "k-table-alt-row": t,
+        "k-edit-row": i
+      };
+    }
+  },
   render() {
-    const e = d(this), t = this.$props.rowType === "groupFooter" || this.$props.rowType === "groupHeader" ? this.$props.rowType === "groupFooter" && "k-group-footer" || "k-table-group-row k-grouping-row" : (this.$props.isAltRow ? "k-table-alt-row k-master-row k-alt" : "k-master-row") + (this.$props.selectedField !== void 0 && l(this.$props.selectedField, this.$props.dataItem) ? " k-selected" : ""), o = r("tr", {
+    const e = a(this), t = d("tr", {
       onClick: this.handleClick,
       onDblclick: this.handleDoubleClick,
-      class: "k-table-row " + t,
+      class: this.trClass,
       style: {
         height: this.$props.rowHeight ? this.$props.rowHeight + "px" : "",
         visibility: this.$props.isHidden ? "hidden" : ""
@@ -47,10 +71,10 @@ const h = /* @__PURE__ */ i({
       "aria-rowindex": this.$props.ariaRowIndex,
       "data-grid-row-index": this.$props.rowType === "data" ? this.$props.dataIndex : void 0
     }, [e]);
-    return n.call(this, {
-      h: s,
+    return p.call(this, {
+      h: n,
       template: this.$props.render,
-      defaultRendering: o,
+      defaultRendering: t,
       additionalProps: this.$props,
       additionalListeners: {
         click: this.handleClick
@@ -61,5 +85,5 @@ const h = /* @__PURE__ */ i({
   }
 });
 export {
-  h as GridRow
+  g as GridRow
 };