@progress/kendo-vue-grid 8.3.0 → 8.4.0-develop.1

package/GridCsvExportButton.d.ts

@@ -0,0 +1,98 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { PropType } from 'vue';
+import { SVGIcon } from '@progress/kendo-vue-common';
+import { ButtonProps } from '@progress/kendo-vue-buttons';
+/**
+ * Represents the props of the GridCsvExportButton component.
+ * Extends the [ButtonProps]({% slug api_buttons_buttonprops %}) interface,
+ * forwarding all Button props to the underlying Button component.
+ */
+export interface GridCsvExportButtonProps extends ButtonProps {
+}
+/**
+ * @hidden
+ * Shared props definition object matching ButtonProps for reuse in toolbar button components.
+ */
+export declare const buttonPropsDefinition: {
+    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "inverse">;
+    size: PropType<"small" | "medium" | "large">;
+    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
+    disabled: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    icon: PropType<string>;
+    svgIcon: PropType<SVGIcon>;
+    title: PropType<string>;
+    togglable: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    selected: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    tabIndex: PropType<number>;
+    type: PropType<string>;
+};
+/**
+ * Represents the GridCsvExportButton component.
+ * Renders a button that triggers CSV export of the Grid data.
+ */
+declare const GridCsvExportButton: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "inverse">;
+    size: PropType<"small" | "medium" | "large">;
+    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
+    disabled: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    icon: PropType<string>;
+    svgIcon: PropType<SVGIcon>;
+    title: PropType<string>;
+    togglable: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    selected: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    tabIndex: PropType<number>;
+    type: PropType<string>;
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    themeColor: PropType<"base" | "primary" | "secondary" | "tertiary" | "info" | "success" | "warning" | "dark" | "light" | "inverse">;
+    size: PropType<"small" | "medium" | "large">;
+    rounded: PropType<"small" | "medium" | "large" | "full" | "none">;
+    fillMode: PropType<"flat" | "link" | "solid" | "outline">;
+    disabled: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    icon: PropType<string>;
+    svgIcon: PropType<SVGIcon>;
+    title: PropType<string>;
+    togglable: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    selected: {
+        type: PropType<boolean>;
+        default: any;
+    };
+    tabIndex: PropType<number>;
+    type: PropType<string>;
+}>> & Readonly<{}>, {
+    selected: boolean;
+    disabled: boolean;
+    togglable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export { GridCsvExportButton };

package/GridCsvExportButton.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),g=require("@progress/kendo-svg-icons"),f=require("@progress/kendo-vue-common"),o=require("./messages/main.js"),C=require("@progress/kendo-vue-buttons"),u={themeColor:String,size:String,rounded:String,fillMode:String,disabled:{type:Boolean,default:void 0},icon:String,svgIcon:Object,title:String,togglable:{type:Boolean,default:!1},selected:{type:Boolean,default:void 0},tabIndex:Number,type:String},m=n.defineComponent({name:"GridCsvExportButton",inheritAttrs:!1,props:u,setup(e,{attrs:i,slots:r}){const l=n.inject("gridContext",{}),t=n.inject("kendoLocalizationService",null),c=s=>{l.exportAsCsv&&l.exportAsCsv(),i.onClick&&i.onClick(s)};return()=>{var d;const s=((d=t==null?void 0:t.toLanguageString)==null?void 0:d.call(t,o.exportCSV,o.messages[o.exportCSV]))||o.messages[o.exportCSV],a=f.classNames("k-grid-csv",i.class);return n.createVNode(C.Button,n.mergeProps({type:"button"},i,{themeColor:e.themeColor,size:e.size,rounded:e.rounded,fillMode:e.fillMode,disabled:e.disabled,title:e.title||s,icon:e.icon||"file-csv",svgIcon:e.svgIcon||g.fileCsvIcon,class:a,onClick:c}),{default:()=>[r.default?r.default():s]})}}});exports.GridCsvExportButton=m;exports.buttonPropsDefinition=u;

package/GridCsvExportButton.mjs

@@ -0,0 +1,71 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as a, inject as d, createVNode as g, mergeProps as m } from "vue";
+import { fileCsvIcon as C } from "@progress/kendo-svg-icons";
+import { classNames as x } from "@progress/kendo-vue-common";
+import { exportCSV as i, messages as c } from "./messages/main.mjs";
+import { Button as b } from "@progress/kendo-vue-buttons";
+const v = {
+  themeColor: String,
+  size: String,
+  rounded: String,
+  fillMode: String,
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  icon: String,
+  svgIcon: Object,
+  title: String,
+  togglable: {
+    type: Boolean,
+    default: !1
+  },
+  selected: {
+    type: Boolean,
+    default: void 0
+  },
+  tabIndex: Number,
+  type: String
+}, I = /* @__PURE__ */ a({
+  name: "GridCsvExportButton",
+  inheritAttrs: !1,
+  props: v,
+  setup(e, {
+    attrs: o,
+    slots: l
+  }) {
+    const r = d("gridContext", {}), t = d("kendoLocalizationService", null), f = (n) => {
+      r.exportAsCsv && r.exportAsCsv(), o.onClick && o.onClick(n);
+    };
+    return () => {
+      var s;
+      const n = ((s = t == null ? void 0 : t.toLanguageString) == null ? void 0 : s.call(t, i, c[i])) || c[i], u = x("k-grid-csv", o.class);
+      return g(b, m({
+        type: "button"
+      }, o, {
+        themeColor: e.themeColor,
+        size: e.size,
+        rounded: e.rounded,
+        fillMode: e.fillMode,
+        disabled: e.disabled,
+        title: e.title || n,
+        icon: e.icon || "file-csv",
+        svgIcon: e.svgIcon || C,
+        class: u,
+        onClick: f
+      }), {
+        default: () => [l.default ? l.default() : n]
+      });
+    };
+  }
+});
+export {
+  I as GridCsvExportButton,
+  v as buttonPropsDefinition
+};

package/GridState.d.ts

@@ -25,13 +25,7 @@ export type GridState = {
 };
 declare const GridStateProvider: import('vue').DefineComponent<{
     id?: string;
-    autoProcessData?: boolean | {
-        filter?: boolean;
-        search?: boolean;
-        sort?: boolean;
-        group?: boolean;
-        page?: boolean;
-    };
+    autoProcessData?: boolean | import('./utils/dataProcessing').AutoProcessDataConfig;
     dataItemKey?: string;
     alternatePerGroup?: boolean;
     columns?: import('.').GridColumnProps[];
@@ -141,15 +135,11 @@ declare const GridStateProvider: import('vue').DefineComponent<{
     uniqueField?: string;
     onNavigationaction?: (event: import('./interfaces/events').GridNavigationActionEvent) => void;
     onKeydown?: (event: import('./interfaces/events').GridKeyDownEvent) => void;
+    csv?: boolean | import('./interfaces/GridProps').GridCSVExportOptions;
+    onCsvexport?: (data: any[]) => any[];
 }, void, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
     id?: string;
-    autoProcessData?: boolean | {
-        filter?: boolean;
-        search?: boolean;
-        sort?: boolean;
-        group?: boolean;
-        page?: boolean;
-    };
+    autoProcessData?: boolean | import('./utils/dataProcessing').AutoProcessDataConfig;
     dataItemKey?: string;
     alternatePerGroup?: boolean;
     columns?: import('.').GridColumnProps[];
@@ -259,6 +249,8 @@ declare const GridStateProvider: import('vue').DefineComponent<{
     uniqueField?: string;
     onNavigationaction?: (event: import('./interfaces/events').GridNavigationActionEvent) => void;
     onKeydown?: (event: import('./interfaces/events').GridKeyDownEvent) => void;
+    csv?: boolean | import('./interfaces/GridProps').GridCSVExportOptions;
+    onCsvexport?: (data: any[]) => any[];
 }> & Readonly<{}>, {
     size: string;
     scrollable: string;

package/RootGrid.d.ts

@@ -55,13 +55,7 @@ export interface GridHandle {
  */
 export declare const RootGrid: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     id: import('vue').PropType<string>;
-    autoProcessData: import('vue').PropType<boolean | {
-        filter?: boolean;
-        search?: boolean;
-        sort?: boolean;
-        group?: boolean;
-        page?: boolean;
-    }>;
+    autoProcessData: import('vue').PropType<boolean | import('./utils/dataProcessing').AutoProcessDataConfig>;
     topCacheCount: {
         type: import('vue').PropType<number>; /**
          * Represent the `ref` of the Grid component.
@@ -246,6 +240,8 @@ export declare const RootGrid: import('vue').DefineComponent<import('vue').Extra
     onContextmenuitemclick: import('vue').PropType<(event: import('.').GridContextMenuItemClickEvent) => void>;
     clipboard: import('vue').PropType<boolean | import('@progress/kendo-vue-data-tools').ClipboardSettings>;
     onClipboard: import('vue').PropType<(event: import('@progress/kendo-vue-data-tools').GridClipboardEvent) => void>;
+    csv: import('vue').PropType<boolean | import('./interfaces/GridProps').GridCSVExportOptions>;
+    onCsvexport: import('vue').PropType<(data: any[]) => any[]>;
 }>, void, {}, {
     columnsWithTemplates(): any[];
     cellsWithTemplates(): any;
@@ -282,13 +278,7 @@ export declare const RootGrid: import('vue').DefineComponent<import('vue').Extra
     };
 }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     id: import('vue').PropType<string>;
-    autoProcessData: import('vue').PropType<boolean | {
-        filter?: boolean;
-        search?: boolean;
-        sort?: boolean;
-        group?: boolean;
-        page?: boolean;
-    }>;
+    autoProcessData: import('vue').PropType<boolean | import('./utils/dataProcessing').AutoProcessDataConfig>;
     topCacheCount: {
         type: import('vue').PropType<number>; /**
          * Represent the `ref` of the Grid component.
@@ -473,6 +463,8 @@ export declare const RootGrid: import('vue').DefineComponent<import('vue').Extra
     onContextmenuitemclick: import('vue').PropType<(event: import('.').GridContextMenuItemClickEvent) => void>;
     clipboard: import('vue').PropType<boolean | import('@progress/kendo-vue-data-tools').ClipboardSettings>;
     onClipboard: import('vue').PropType<(event: import('@progress/kendo-vue-data-tools').GridClipboardEvent) => void>;
+    csv: import('vue').PropType<boolean | import('./interfaces/GridProps').GridCSVExportOptions>;
+    onCsvexport: import('vue').PropType<(data: any[]) => any[]>;
 }>> & Readonly<{}>, {
     size: string;
     scrollable: string;

package/common.d.ts

@@ -8,13 +8,7 @@
 import { PropType } from 'vue';
 declare const gridProps: {
     id: PropType<string>;
-    autoProcessData: PropType<boolean | {
-        filter?: boolean;
-        search?: boolean;
-        sort?: boolean;
-        group?: boolean;
-        page?: boolean;
-    }>;
+    autoProcessData: PropType<boolean | import('./utils/dataProcessing').AutoProcessDataConfig>;
     topCacheCount: {
         type: PropType<number>;
         default: number;
@@ -197,5 +191,7 @@ declare const gridProps: {
     onContextmenuitemclick: PropType<(event: import('.').GridContextMenuItemClickEvent) => void>;
     clipboard: PropType<boolean | import('@progress/kendo-vue-data-tools').ClipboardSettings>;
     onClipboard: PropType<(event: import('@progress/kendo-vue-data-tools').GridClipboardEvent) => void>;
+    csv: PropType<boolean | import('./interfaces/GridProps').GridCSVExportOptions>;
+    onCsvexport: PropType<(data: any[]) => any[]>;
 };
 export { gridProps };

package/common.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"});require("vue");const t=require("@progress/kendo-vue-common"),n={id:String,autoProcessData:[Boolean,Object],topCacheCount:{type:Number,default:0},collapsedGroups:{type:Array,default:function(){return[]}},uniqueField:String,totalGroupedHeight:Number,allGroupedItems:Object,alternatePerGroup:Boolean,columns:Array,columnsState:{type:Array,default:function(){}},cells:Object,contextMenu:[Boolean,Object,Function],rows:Object,defaultColumnsState:{type:Array,default:function(){}},columnVirtualization:Boolean,dataItems:[Array,Object],sortable:[Boolean,Object],defaultSort:Array,sort:Array,filterable:Boolean,filterOperators:Object,filterCellRender:[String,Function,Object],headerCellRender:[String,Function,Object],showLoader:{type:Boolean,default:void 0},loader:[String,Function,Object],lockGroups:Boolean,pinnable:Boolean,defaultPinnedTopRows:Array,defaultPinnedBottomRows:Array,pinnedTopRows:Array,pinnedBottomRows:Array,defaultFilter:Object,filter:Object,defaultSearch:Object,search:Object,searchFields:Array,highlight:Object,pageable:[Boolean,Object],pageSize:Number,total:Number,fixedScroll:Boolean,skip:Number,defaultSkip:Number,take:Number,defaultTake:Number,expandField:String,expandColumn:Object,selectedField:String,cellRender:[String,Function,Object],rowRender:[String,Function,Object],rowSpannable:[Boolean,Object],resizable:Boolean,reorderable:Boolean,group:Array,defaultGroup:Array,groupable:[Boolean,Object],groupExpand:Array,defaultGroupExpand:Array,detailExpand:Object,defaultDetailExpand:Object,editField:String,rowClass:Function,select:Object,defaultSelect:Object,selectable:[Boolean,Object],scrollable:{type:String,default:"scrollable"},size:{type:String,default:"medium",validator:function(e){return["small","medium"].includes(e)}},dir:String,pager:[String,Function,Object],rowHeight:Number,detailRowHeight:Number,detail:[String,Function,Object],columnMenu:[Boolean,String,Function,Object],columnMenuAnimate:{type:[Boolean,Object],default:function(){return!0}},columnMenuIcon:t.SvgIcon,dataItemKey:String,navigatable:{type:Boolean,default:!1},onItemchange:Function,onExpandchange:Function,onDatastatechange:Function,onPagechange:Function,onSortchange:Function,onFilterchange:Function,onGroupchange:Function,onSearchchange:Function,onGroupexpandchange:Function,onDetailexpandchange:Function,onContextmenu:Function,onContextmenuitemclick:Function,clipboard:[Boolean,Object],onClipboard:Function};exports.gridProps=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("vue");const t=require("@progress/kendo-vue-common"),n={id:String,autoProcessData:[Boolean,Object],topCacheCount:{type:Number,default:0},collapsedGroups:{type:Array,default:function(){return[]}},uniqueField:String,totalGroupedHeight:Number,allGroupedItems:Object,alternatePerGroup:Boolean,columns:Array,columnsState:{type:Array,default:function(){}},cells:Object,contextMenu:[Boolean,Object,Function],rows:Object,defaultColumnsState:{type:Array,default:function(){}},columnVirtualization:Boolean,dataItems:[Array,Object],sortable:[Boolean,Object],defaultSort:Array,sort:Array,filterable:Boolean,filterOperators:Object,filterCellRender:[String,Function,Object],headerCellRender:[String,Function,Object],showLoader:{type:Boolean,default:void 0},loader:[String,Function,Object],lockGroups:Boolean,pinnable:Boolean,defaultPinnedTopRows:Array,defaultPinnedBottomRows:Array,pinnedTopRows:Array,pinnedBottomRows:Array,defaultFilter:Object,filter:Object,defaultSearch:Object,search:Object,searchFields:Array,highlight:Object,pageable:[Boolean,Object],pageSize:Number,total:Number,fixedScroll:Boolean,skip:Number,defaultSkip:Number,take:Number,defaultTake:Number,expandField:String,expandColumn:Object,selectedField:String,cellRender:[String,Function,Object],rowRender:[String,Function,Object],rowSpannable:[Boolean,Object],resizable:Boolean,reorderable:Boolean,group:Array,defaultGroup:Array,groupable:[Boolean,Object],groupExpand:Array,defaultGroupExpand:Array,detailExpand:Object,defaultDetailExpand:Object,editField:String,rowClass:Function,select:Object,defaultSelect:Object,selectable:[Boolean,Object],scrollable:{type:String,default:"scrollable"},size:{type:String,default:"medium",validator:function(e){return["small","medium"].includes(e)}},dir:String,pager:[String,Function,Object],rowHeight:Number,detailRowHeight:Number,detail:[String,Function,Object],columnMenu:[Boolean,String,Function,Object],columnMenuAnimate:{type:[Boolean,Object],default:function(){return!0}},columnMenuIcon:t.SvgIcon,dataItemKey:String,navigatable:{type:Boolean,default:!1},onItemchange:Function,onExpandchange:Function,onDatastatechange:Function,onPagechange:Function,onSortchange:Function,onFilterchange:Function,onGroupchange:Function,onSearchchange:Function,onGroupexpandchange:Function,onDetailexpandchange:Function,onContextmenu:Function,onContextmenuitemclick:Function,clipboard:[Boolean,Object],onClipboard:Function,csv:[Boolean,Object],onCsvexport:Function};exports.gridProps=n;

package/common.mjs

@@ -134,7 +134,9 @@ const a = {
   onContextmenu: Function,
   onContextmenuitemclick: Function,
   clipboard: [Boolean, Object],
-  onClipboard: Function
+  onClipboard: Function,
+  csv: [Boolean, Object],
+  onCsvexport: Function
 };
 export {
   a as gridProps