@coreui/react-data-grid 0.1.0-rc.0 → 0.2.0-rc.0

package/dist/cjs/types.d.ts

@@ -4,28 +4,33 @@
  * License (https://coreui.io/pro/license/)
  * --------------------------------------------------------------------------
  */
-import type { DataGridColumn, DataGridColumnSizingOptions, DataGridDataRequest, DataGridDataResponse, DataGridEditCommitEvent, DataGridItem, DataGridLabels, DataGridPaginationOptions, DataGridRowSelectionOptions, DataGridSortingOptions } from '@coreui/data-grid';
-import type { CsvDownloadOptions } from '@coreui/data-grid/csv';
-import type { Column, ColumnFiltersState, ColumnOrderState, ColumnPinningState, ColumnSizingState, PaginationState, RowSelectionState, SortingState, Table, VisibilityState } from '@tanstack/react-table';
+import type { DataGridColumn, DataGridColumnSizingOptions, DataGridDataRequest, DataGridDataResponse, DataGridEditCommitEvent, DataGridExportOptions, DataGridInfiniteScrollOptions, DataGridItem, DataGridLabels, DataGridPaginationOptions, DataGridRowSelectionOptions, DataGridSortingOptions } from '@coreui/data-grid';
+import type { Column, ColumnFiltersState, ColumnOrderState, ColumnPinningState, ColumnSizingState, ColumnVisibilityState, PaginationState, ReactTable, Row, RowSelectionState, SortingState, TableFeatures } from '@tanstack/react-table';
 import type { ComponentType, CSSProperties, HTMLAttributes, ReactNode, Ref } from 'react';
-export interface CDataGridSlotProps {
-    table: Table<DataGridItem>;
+import type { DataGridFeatures } from './features';
+export type CDataGridTable<TFeatures extends TableFeatures = DataGridFeatures> = ReactTable<TFeatures, DataGridItem>;
+export type CDataGridRow<TFeatures extends TableFeatures = DataGridFeatures> = Row<TFeatures, DataGridItem>;
+export type CDataGridColumnInstance<TFeatures extends TableFeatures = DataGridFeatures> = Column<TFeatures, DataGridItem, unknown>;
+export type CDataGridColumnPinning = Partial<ColumnPinningState>;
+export interface CDataGridSlotProps<TFeatures extends TableFeatures = DataGridFeatures> {
+    table: CDataGridTable<TFeatures>;
     labels: DataGridLabels;
 }
-export interface CDataGridSlots {
-    toolbar: ComponentType<CDataGridSlotProps>;
-    pagination: ComponentType<CDataGridSlotProps>;
-    empty: ComponentType<CDataGridSlotProps>;
+export interface CDataGridSlots<TFeatures extends TableFeatures = DataGridFeatures> {
+    toolbar: ComponentType<CDataGridSlotProps<TFeatures>>;
+    pagination: ComponentType<CDataGridSlotProps<TFeatures>>;
+    empty: ComponentType<CDataGridSlotProps<TFeatures>>;
 }
 export interface CDataGridToolbarOptions {
     columns?: boolean;
-    export?: boolean | CsvDownloadOptions;
+    export?: boolean | DataGridExportOptions;
     history?: boolean;
+    print?: boolean;
     search?: boolean;
 }
-export interface CDataGridColumnFilterProps {
-    column: Column<DataGridItem, unknown>;
-    table: Table<DataGridItem>;
+export interface CDataGridColumnFilterProps<TFeatures extends TableFeatures = DataGridFeatures> {
+    column: CDataGridColumnInstance<TFeatures>;
+    table: CDataGridTable<TFeatures>;
     labels: DataGridLabels;
 }
 export interface CDataGridEditorHandle {
@@ -43,13 +48,19 @@ export interface CDataGridEditorProps {
     cancel: () => void;
     handleRef: (handle: CDataGridEditorHandle | null) => void;
 }
-export interface CDataGridColumn extends Omit<DataGridColumn, 'editor' | 'filter' | 'render' | 'style'> {
+export interface CDataGridColumn<TFeatures extends TableFeatures = DataGridFeatures> extends Omit<DataGridColumn, 'editor' | 'filter' | 'render' | 'style'> {
     editor?: ComponentType<CDataGridEditorProps>;
     editorPopup?: boolean;
-    filter?: ComponentType<CDataGridColumnFilterProps>;
+    filter?: ComponentType<CDataGridColumnFilterProps<TFeatures>>;
     render?: (item: DataGridItem, index: number) => ReactNode;
     style?: CSSProperties;
 }
+export interface CDataGridRowOrderEvent {
+    items: DataGridItem[];
+    item: DataGridItem;
+    oldIndex: number;
+    newIndex: number;
+}
 export interface CDataGridMenuAction {
     key: string;
     label: string;
@@ -63,11 +74,19 @@ export interface CDataGridColumnMenuContext {
     defaultActions: CDataGridMenuAction[];
 }
 export type CDataGridColumnMenuBuilder = (context: CDataGridColumnMenuContext) => CDataGridMenuAction[];
-export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
+export interface CDataGridProps<TFeatures extends TableFeatures = DataGridFeatures> extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Measures each rendered row instead of trusting `rowHeight`, so rows grow with their content (wrapping cells, custom renderers). `rowHeight` stays the estimate for rows that have not been rendered yet. Requires virtualization.
+     */
+    autoRowHeight?: boolean;
     /**
      * APG grid keyboard navigation — `role="grid"`, a roving-tabindex active cell, and arrow-key movement across header and data cells.
      */
     cellNavigation?: boolean;
+    /**
+     * Spreadsheet-style cell ranges — shift-click, drag and shift+arrows, with Ctrl/Cmd+C copying the range as TSV and Ctrl/Cmd+A selecting everything. Implies `cellNavigation`.
+     */
+    cellSelection?: boolean;
     /**
      * Renders a filter row in the header with an input per filterable column.
      */
@@ -85,9 +104,9 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
      */
     columnOrder?: boolean | ColumnOrderState;
     /**
-     * Freezes columns (by `key`) to the left/right edge with sticky positioning; `true` enables the feature with no initial pins.
+     * Freezes columns (by `key`) to the start/end edge with sticky positioning; `true` enables the feature with no initial pins.
      */
-    columnPinning?: boolean | ColumnPinningState;
+    columnPinning?: boolean | CDataGridColumnPinning;
     /**
      * Enables column resize handles; `mode` controls whether widths update while dragging (`'onChange'`, the default) or on release (`'onEnd'`).
      */
@@ -95,11 +114,11 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Enables hiding/showing columns via `column.toggleVisibility()`; an object sets the initial visibility.
      */
-    columnVisibility?: boolean | VisibilityState;
+    columnVisibility?: boolean | ColumnVisibilityState;
     /**
      * Column definitions.
      */
-    columns: CDataGridColumn[];
+    columns: Array<CDataGridColumn<TFeatures>>;
     /**
      * Server-side mode: the grid requests data on every sorting/filter/page change; implies pagination.
      */
@@ -112,6 +131,10 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
      * Content (ReactNode) shown when no rows match.
      */
     empty?: ReactNode;
+    /**
+     * The registered TanStack feature set — pass `dataGridLiteFeatures` (or a custom `tableFeatures({...})` set) so the app bundle only carries the features it uses; defaults to the full `dataGridFeatures`.
+     */
+    features?: TFeatures;
     /** Icon for the per-column filter button. */
     filterIcon?: ReactNode;
     /**
@@ -126,6 +149,10 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
      * Custom hide-column menu action icon (ReactNode) replacing the default one.
      */
     hideColumnIcon?: ReactNode;
+    /**
+     * Appends each loaded page to the rows already in view instead of replacing them; requires `dataProvider` and `virtualization`, cannot be combined with `pagination`.
+     */
+    infiniteScroll?: boolean | DataGridInfiniteScrollOptions;
     /**
      * Stable row id — required for selection to survive sorting and filtering.
      */
@@ -141,11 +168,11 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Custom move-left menu action icon (ReactNode) replacing the default one.
      */
-    moveLeftIcon?: ReactNode;
+    moveStartIcon?: ReactNode;
     /**
      * Custom move-right menu action icon (ReactNode) replacing the default one.
      */
-    moveRightIcon?: ReactNode;
+    moveEndIcon?: ReactNode;
     /**
      * Fires when the data provider rejects, with the error (server-side mode).
      */
@@ -189,6 +216,16 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Fires when a column is resized, with the TanStack columnSizing state.
      */
+    /**
+     * Fires when a row is dragged to a new position, with the reordered `items` array ready to assign — the grid never mutates `items` itself.
+     */
+    /**
+     * Fires after Ctrl/Cmd+C copies a cell selection, with the text written to the clipboard.
+     */
+    onCellCopy?: (event: {
+        text: string;
+    }) => void;
+    onRowOrderChange?: (event: CDataGridRowOrderEvent) => void;
     onSizingChange?: (columnSizing: ColumnSizingState) => void;
     /**
      * Fires when sorting changes, with the TanStack sorting state.
@@ -197,7 +234,7 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Fires when column visibility changes, with the TanStack columnVisibility state.
      */
-    onVisibilityChange?: (columnVisibility: VisibilityState) => void;
+    onVisibilityChange?: (columnVisibility: ColumnVisibilityState) => void;
     /**
      * Extra rows rendered above and below the visible window.
      */
@@ -209,15 +246,27 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Custom pin-left menu action icon (ReactNode) replacing the default one.
      */
-    pinLeftIcon?: ReactNode;
+    pinStartIcon?: ReactNode;
     /**
      * Custom pin-right menu action icon (ReactNode) replacing the default one.
      */
-    pinRightIcon?: ReactNode;
+    pinEndIcon?: ReactNode;
+    /**
+     * Heading printed above the table when the print action runs; omitted when unset.
+     */
+    printTitle?: string;
+    /**
+     * Custom row drag-handle icon (ReactNode) replacing the default grip.
+     */
+    rowHandleIcon?: ReactNode;
     /**
      * Estimated row height in px used by the virtualizer.
      */
     rowHeight?: number;
+    /**
+     * Adds a drag handle per row for reordering; the grid emits `onRowOrderChange` with the reordered array instead of mutating `items`.
+     */
+    rowOrder?: boolean;
     /**
      * Checkbox selection with select-all and shift+click ranges.
      */
@@ -225,7 +274,7 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Replaces built-in chrome — each slot is a component rendered with `{ table, labels }`.
      */
-    slots?: Partial<CDataGridSlots>;
+    slots?: Partial<CDataGridSlots<TFeatures>>;
     /**
      * Custom ascending sort indicator icon (ReactNode) replacing the default one.
      */
@@ -253,7 +302,7 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Ref that receives the TanStack table instance.
      */
-    tableRef?: Ref<Table<DataGridItem>>;
+    tableRef?: Ref<CDataGridTable<TFeatures>>;
     /**
      * Adds a built-in toolbar above the grid — `true` enables every action whose feature is on (column chooser, CSV export, global search); an object picks each individually.
      */
@@ -266,6 +315,8 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
      * Custom toolbar export button icon (ReactNode) replacing the default one.
      */
     toolbarExportIcon?: ReactNode;
+    /** Icon for the toolbar's print button. */
+    toolbarPrintIcon?: ReactNode;
     /**
      * Custom toolbar redo button icon (ReactNode) replacing the default one.
      */
@@ -283,5 +334,6 @@ export interface CDataGridProps extends HTMLAttributes<HTMLDivElement> {
      */
     virtualization?: boolean;
 }
-export { type Column, type ColumnFiltersState, type ColumnOrderState, type ColumnPinningState, type ColumnSizingState, type PaginationState, type RowSelectionState, type SortingState, type Table, type VisibilityState } from '@tanstack/react-table';
-export { type DataGridColumnFilterValue, type DataGridColumnSizingOptions, type DataGridDataRequest, type DataGridDataResponse, type DataGridEditableOptions, type DataGridEditCommitEvent, type DataGridEditorType, type DataGridFilterCondition, type DataGridFilterOperator, type DataGridFilterType, type DataGridItem, type DataGridLabels, type DataGridPaginationOptions, type DataGridRowSelectionOptions, type DataGridSortingOptions, type DataGridState } from '@coreui/data-grid';
+export { type Column, type ColumnFiltersState, type ColumnOrderState, type ColumnPinningPosition, type ColumnPinningState, type ColumnSizingState, type ColumnVisibilityState, type PaginationState, type Row, type RowSelectionState, type SortingState, type Table, type TableFeatures } from '@tanstack/react-table';
+export { type DataGridFeatures, type DataGridLiteFeatures } from './features';
+export { type DataGridColumnFilterValue, type DataGridColumnSizingOptions, type DataGridDataRequest, type DataGridDataResponse, type DataGridEditableOptions, type DataGridEditCommitEvent, type DataGridEditorType, type DataGridFilterCondition, type DataGridFilterOperator, type DataGridFilterType, type DataGridInfiniteScrollOptions, type DataGridItem, type DataGridLabels, type DataGridPaginationOptions, type DataGridRowSelectionOptions, type DataGridSortingOptions, type DataGridState } from '@coreui/data-grid';

package/dist/esm/CDataGrid.d.ts

@@ -4,5 +4,15 @@
  * License (https://coreui.io/pro/license/)
  * --------------------------------------------------------------------------
  */
+import { type TableFeatures } from '@tanstack/react-table';
+import { type ReactNode, type Ref } from 'react';
+import { type DataGridFeatures } from './features';
 import type { CDataGridProps } from './types';
-export declare const CDataGrid: import("react").ForwardRefExoticComponent<CDataGridProps & import("react").RefAttributes<HTMLDivElement>>;
+interface CDataGridComponent {
+    <TFeatures extends TableFeatures = DataGridFeatures>(props: CDataGridProps<TFeatures> & {
+        ref?: Ref<HTMLDivElement>;
+    }): ReactNode;
+    displayName?: string;
+}
+export declare const CDataGrid: CDataGridComponent;
+export {};