@progress/kendo-angular-grid
Version:
Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.
132 lines (131 loc) • 7.04 kB
TypeScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { OnDestroy, NgZone } from '@angular/core';
import { Observable } from 'rxjs';
import { type CSVExportOptions, type CSVRow } from '@progress/kendo-csv';
import { DataResult } from '@progress/kendo-data-query';
import { GridComponent } from '../grid.component';
import { CSVService } from './csv.service';
import { ContextService } from '../common/provider.service';
import * as i0 from "@angular/core";
/**
* Defines a function that returns the data for CSV export.
* @param component The Grid component.
* @returns The data to export - can be an array of rows, a DataResult, or a Promise/Observable of the same types.
*/
export type CSVFetchDataCallback = (component: GridComponent) => CSVRow[] | DataResult | Promise<CSVRow[] | DataResult> | Observable<CSVRow[] | DataResult>;
/**
* The component is required when exporting the data to a CSV file. The component provides different options to customize the exported file and its content.
*
* @example
* ```html
* <kendo-grid>
* <kendo-grid-csv fileName="Export.csv"></kendo-grid-csv>
* </kendo-grid>
* ```
*/
export declare class CSVComponent implements OnDestroy {
private ctx;
private zone;
/**
* Sets the file name for the exported CSV file.
* @default "Export.csv"
*/
fileName: string;
/**
* Provides a function to get the exported data. By default, uses the data displayed in the Grid in accordance with the currently applied `State`. Supply a custom function to export a different data set. Typically used to export all data, not just the current page.
*/
fetchData: CSVFetchDataCallback;
/**
* Sets optional column headers to render on the first line. By default, column names are extracted from each column's `title` or `field` properties.
*/
names: string[] | null;
/**
* Sets property names to extract from object or Map rows, in order. By default, these are the properties used as `field` binding values in the Grid's column definitions.
*/
keys: string[] | null;
/**
* Sets the character used to separate values in a row. Must be a single character.
* @default ","
*/
delimiter: string;
/**
* Sets the string used to terminate each line.
* @default "\r\n"
*/
lineSeparator: string;
/**
* When `true`, prefixes potentially dangerous formula characters (`=`, `+`, `-`, `@`, tab, `\r`) with a single quote (`'`) to prevent formula injection attacks in spreadsheet applications.
* @default true
*/
preventFormulaInjection: boolean;
/**
* Sets the maximum number of characters allowed per cell. Values exceeding this limit are truncated.
* @default 32767
*/
maxCellLength: number;
/**
* Maximum number of rows to export.
* Data exceeding this limit is automatically truncated.
* Default: 1000000 (prevents memory exhaustion and DoS attacks).
*
* @default 1000000
*/
maxRows: number;
/**
* Maximum number of columns to export.
* Keys/columns exceeding this limit are automatically truncated.
* Default: 1000 (prevents memory exhaustion and DoS attacks).
*
* @default 1000
*/
maxColumns: number;
/**
* When `true`, adds a UTF-8 Byte Order Mark (BOM) at the beginning of the file. Helps applications like Microsoft Excel correctly recognize UTF-8 encoding.
* @default false
*/
includeUTF8BOM: boolean;
/**
* Provides a custom formatter for group headers in grouped data exports. Receives the display names of grouped fields and returns the formatted header.
* @default Joins display names with '/' separator
*/
groupHeaderFormatter: ((displayNames: string[]) => string) | undefined;
/**
* Provides a custom formatter for group value rows in grouped data exports. Receives the values and field names, and returns the formatted group value.
* @default Joins values with '/' separator
*/
groupValueFormatter: ((values: any[], groupNames: string[]) => string) | undefined;
/**
* Forwards the content to [`proxyURL`](#toc-proxyurl) even if the browser supports local file saving when set to `true`.
*/
forceProxy: boolean;
/**
* Sets the URL of the server-side proxy that streams the file to the user. Use a proxy if the browser cannot save files locally.
* Set [`forceProxy`](#toc-forceproxy) to `true` to skip client-side saving.
* The proxy receives a POST request with specific parameters and returns the decoded file with the `"Content-Disposition"` header set to `attachment; filename="<fileName.csv>"`.
* For more details, see the [File Saver](https://www.telerik.com/kendo-angular-ui/components/file-saver) documentation.
*/
proxyURL: string;
private saveSubscription;
private dataSubscription;
constructor(csvService: CSVService, ctx: ContextService, zone: NgZone);
ngOnDestroy(): void;
/**
* @hidden
*/
toCSVString(component: GridComponent): string | Promise<string>;
/**
* @hidden
*/
saveAsCSV(component: GridComponent): void;
protected save(component: GridComponent): void;
protected exportData(component: GridComponent, result: any): void;
protected getCSVOptions(component: GridComponent): Omit<CSVExportOptions, 'data'>;
protected extractColumnNames(component: GridComponent): string[];
protected extractColumnKeys(component: GridComponent): string[];
protected saveFile(csvString: string): void;
static ɵfac: i0.ɵɵFactoryDeclaration<CSVComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<CSVComponent, "kendo-grid-csv", never, { "fileName": { "alias": "fileName"; "required": false; }; "fetchData": { "alias": "fetchData"; "required": false; }; "names": { "alias": "names"; "required": false; }; "keys": { "alias": "keys"; "required": false; }; "delimiter": { "alias": "delimiter"; "required": false; }; "lineSeparator": { "alias": "lineSeparator"; "required": false; }; "preventFormulaInjection": { "alias": "preventFormulaInjection"; "required": false; }; "maxCellLength": { "alias": "maxCellLength"; "required": false; }; "maxRows": { "alias": "maxRows"; "required": false; }; "maxColumns": { "alias": "maxColumns"; "required": false; }; "includeUTF8BOM": { "alias": "includeUTF8BOM"; "required": false; }; "groupHeaderFormatter": { "alias": "groupHeaderFormatter"; "required": false; }; "groupValueFormatter": { "alias": "groupValueFormatter"; "required": false; }; "forceProxy": { "alias": "forceProxy"; "required": false; }; "proxyURL": { "alias": "proxyURL"; "required": false; }; }, {}, never, never, true, never>;
}