Any Data Export

Grids can be represented in many different data formats. While LyteNyte Grid includes built-in CSV export, it can't cover every export format without significantly increasing its bundle size. Instead, it provides the exportDataRect API method that enables you to export grid data in any format.

Export Data Rect

The exportDataRect method in the grid's API lets you export selected rows and columns or the entire grid. This method returns either a DataRectResult or a Promise<DataRectResult>.

A DataRectResult has the following structure:

interface DataRectResult {
  readonly header: string[];
  readonly groupHeaders: (string | null)[][];
  readonly data: unknown[][];
  readonly columns: ColumnPro[];
}

• header - Contains the header label values for each column in the export rectangle
• groupHeaders - Contains the header labels of column groups in the export rectangle
• data - Contains a two-dimensional array of the exported data
• columns - Contains the actual definitions of the exported columns

You can call the exportDataRect API method like this:

grid.api.exportDataRect({
  dataRect: { rowStart: 0, rowEnd: 10, columnStart: 0, columnEnd: 20 },
});

Uniform Group Headers

When exporting columns with header groups that span multiple columns, exportDataRect by default only returns the header group for the first column in the group. Set the uniformGroupHeaders property to true to repeat the header group across all columns it spans:

grid.api.exportDataRect({
  dataRect: { rowStart: 0, rowEnd: 10, columnEnd: 20, columnStart: 0 },
  uniformGroupHeaders: true,
});

Transform Before Export

The exportDataRect method also accepts a transform property that lets you modify rows before they appear in the final result. This function processes each row of data before export:

grid.api.exportDataRect({
  dataRect: { rowStart: 0, rowEnd: 10, columnEnd: 20, columnStart: 0 },
  uniformGroupHeaders: true,
  transform: ({ data }) => {
    return data.map((c) => (c as number) * 2);
  },
});