@mui/x-data-grid 5.4.0 → 5.6.0

package/models/colDef/gridColDef.d.ts

@@ -0,0 +1,241 @@
+import * as React from 'react';
+import { GridCellValue } from '../gridCell';
+import { GridCellClassNamePropType } from '../gridCellClass';
+import { GridColumnHeaderClassNamePropType } from '../gridColumnHeaderClass';
+import { GridFilterOperator } from '../gridFilterOperator';
+import { GridCellParams, GridRenderCellParams, GridRenderEditCellParams, GridValueFormatterParams, GridValueGetterParams, GridValueSetterParams, GridPreProcessEditCellProps } from '../params/gridCellParams';
+import { GridColumnHeaderParams } from '../params/gridColumnHeaderParams';
+import { GridComparatorFn, GridSortDirection } from '../gridSortModel';
+import { GridColType, GridNativeColTypes } from './gridColType';
+import { GridRowParams } from '../params/gridRowParams';
+import { GridValueOptionsParams } from '../params/gridValueOptionsParams';
+import { GridActionsCellItemProps } from '../../components/cell/GridActionsCellItem';
+import { GridRowModel } from '../gridRows';
+import { GridEditCellProps } from '../gridEditRowModel';
+/**
+ * Alignment used in position elements in Cells.
+ */
+export declare type GridAlignment = 'left' | 'right' | 'center';
+declare type ValueOptions = string | number | {
+    value: any;
+    label: string;
+};
+/**
+ * Value that can be used as a key for grouping rows
+ */
+export declare type GridKeyValue = string | number | boolean;
+/**
+ * Column Definition interface.
+ */
+export interface GridColDef {
+    /**
+     * The column identifier. It's used to map with [[GridRowModel]] values.
+     */
+    field: string;
+    /**
+     * The title of the column rendered in the column header cell.
+     */
+    headerName?: string;
+    /**
+     * The description of the column rendered as tooltip if the column header name is not fully displayed.
+     */
+    description?: string;
+    /**
+     * Set the width of the column.
+     * @default 100
+     */
+    width?: number;
+    /**
+     * If set, it indicates that a column has fluid width. Range [0, ∞).
+     */
+    flex?: number;
+    /**
+     * Sets the minimum width of a column.
+     * @default 50
+     */
+    minWidth?: number;
+    /**
+     * Sets the maximum width of a column.
+     * @default Infinity
+     */
+    maxWidth?: number;
+    /**
+     * If `true`, hide the column.
+     * @deprecated Use the `columnVisibility` prop instead.
+     * @default false
+     */
+    hide?: boolean;
+    /**
+     * If `false`, removes the buttons for hiding this column.
+     * @default true
+     */
+    hideable?: boolean;
+    /**
+     * If `true`, the column is sortable.
+     * @default true
+     */
+    sortable?: boolean;
+    /**
+     * The order of the sorting sequence.
+     */
+    sortingOrder?: GridSortDirection[];
+    /**
+     * If `true`, the column is resizable.
+     * @default true
+     */
+    resizable?: boolean;
+    /**
+     * If `true`, the cells of the column are editable.
+     * @default false
+     */
+    editable?: boolean;
+    /**
+     * If `true`, the rows can be grouped based on this column values (pro-plan only).
+     * @default true
+     */
+    groupable?: boolean;
+    /**
+     * If `false`, the menu items for column pinning menu will not be rendered.
+     * Only available in DataGridPro.
+     * @default true
+     */
+    pinnable?: boolean;
+    /**
+     * A comparator function used to sort rows.
+     */
+    sortComparator?: GridComparatorFn;
+    /**
+     * Type allows to merge this object with a default definition [[GridColDef]].
+     * @default 'string'
+     */
+    type?: GridColType;
+    /**
+     * To be used in combination with `type: 'singleSelect'`. This is an array (or a function returning an array) of the possible cell values and labels.
+     */
+    valueOptions?: Array<ValueOptions> | ((params: GridValueOptionsParams) => Array<ValueOptions>);
+    /**
+     * Allows to align the column values in cells.
+     */
+    align?: GridAlignment;
+    /**
+     * Function that allows to get a specific data instead of field to render in the cell.
+     * @param {GridValueGetterParams} params Object containing parameters for the getter.
+     * @returns {GridCellValue} The cell value.
+     */
+    valueGetter?: (params: GridValueGetterParams) => GridCellValue;
+    /**
+     * Function that allows to customize how the entered value is stored in the row.
+     * It only works with cell/row editing.
+     * @param {GridValueSetterParams} params Object containing parameters for the setter.
+     * @returns {GridRowModel} The row with the updated field.
+     */
+    valueSetter?: (params: GridValueSetterParams) => GridRowModel;
+    /**
+     * Function that allows to apply a formatter before rendering its value.
+     * @param {GridValueFormatterParams} params Object containing parameters for the formatter.
+     * @returns {GridCellValue} The formatted value.
+     */
+    valueFormatter?: (params: GridValueFormatterParams) => GridCellValue;
+    /**
+     * Function that takes the user-entered value and converts it to a value used internally.
+     * @param {GridCellValue} value The user-entered value.
+     * @param {GridCellParams} params The params when called before saving the value.
+     * @returns {GridCellValue} The converted value to use internally.
+     */
+    valueParser?: (value: GridCellValue, params?: GridCellParams) => GridCellValue;
+    /**
+     * Class name that will be added in cells for that column.
+     */
+    cellClassName?: GridCellClassNamePropType;
+    /**
+     * Allows to override the component rendered as cell for this column.
+     * @param {GridRenderCellParams} params Object containing parameters for the renderer.
+     * @returns {React.ReactNode} The element to be rendered.
+     */
+    renderCell?: (params: GridRenderCellParams) => React.ReactNode;
+    /**
+     * Allows to override the component rendered in edit cell mode for this column.
+     * @param {GridRenderEditCellParams} params Object containing parameters for the renderer.
+     * @returns {React.ReactNode} The element to be rendered.
+     */
+    renderEditCell?: (params: GridRenderEditCellParams) => React.ReactNode;
+    /**
+     * Callback fired when the edit props of the cell changes.
+     * It allows to process the props that saved into the state.
+     * @param {GridPreProcessEditCellProps} params Object containing parameters of the cell being edited.
+     * @returns {GridEditCellProps | Promise<GridEditCellProps>} The new edit cell props.
+     */
+    preProcessEditCellProps?: (params: GridPreProcessEditCellProps) => GridEditCellProps | Promise<GridEditCellProps>;
+    /**
+     * Class name that will be added in the column header cell.
+     */
+    headerClassName?: GridColumnHeaderClassNamePropType;
+    /**
+     * Allows to render a component in the column header cell.
+     * @param {GridColumnHeaderParams} params Object containing parameters for the renderer.
+     * @returns {React.ReactNode} The element to be rendered.
+     */
+    renderHeader?: (params: GridColumnHeaderParams) => React.ReactNode;
+    /**
+     * Header cell element alignment.
+     */
+    headerAlign?: GridAlignment;
+    /**
+     * Toggle the visibility of the sort icons.
+     * @default false
+     */
+    hideSortIcons?: boolean;
+    /**
+     * If `true`, the column menu is disabled for this column.
+     * @default false
+     */
+    disableColumnMenu?: boolean;
+    /**
+     * If `true`, the column is filterable.
+     * @default true
+     */
+    filterable?: boolean;
+    /**
+     * Allows setting the filter operators for this column.
+     */
+    filterOperators?: GridFilterOperator[];
+    /**
+     * If `true`, this column cannot be reordered.
+     * @default false
+     */
+    disableReorder?: boolean;
+    /**
+     * If `true`, this column will not be included in exports.
+     * @default false
+     */
+    disableExport?: boolean;
+}
+export interface GridActionsColDef extends GridColDef {
+    /**
+     * Type allows to merge this object with a default definition [[GridColDef]].
+     * @default 'actions'
+     */
+    type: 'actions';
+    /**
+     * Function that returns the actions to be shown.
+     * @param {GridRowParams} params The params for each row.
+     * @returns {React.ReactElement<GridActionsCellItemProps>[]} An array of [[GridActionsCell]] elements.
+     */
+    getActions: (params: GridRowParams) => React.ReactElement<GridActionsCellItemProps>[];
+}
+export declare type GridEnrichedColDef = GridColDef | GridActionsColDef;
+export declare type GridColumns = GridEnrichedColDef[];
+export declare type GridColTypeDef = Omit<GridColDef, 'field'> & {
+    extendType?: GridNativeColTypes;
+};
+export declare type GridStateColDef = GridEnrichedColDef & {
+    computedWidth: number;
+};
+/**
+ * Meta Info about columns.
+ */
+export interface GridColumnsMeta {
+    totalWidth: number;
+    positions: number[];
+}
+export {};

package/models/colDef/gridColDef.js

@@ -0,0 +1 @@
+export {};

package/models/colDef/gridColType.d.ts

@@ -0,0 +1,2 @@
+export declare type GridNativeColTypes = 'string' | 'number' | 'date' | 'dateTime' | 'boolean' | 'singleSelect' | 'actions';
+export declare type GridColType = GridNativeColTypes | string;

package/models/colDef/gridColType.js

@@ -0,0 +1 @@
+export {};

package/models/colDef/gridColumnTypesRecord.d.ts

@@ -0,0 +1,3 @@
+import { GridColTypeDef } from './gridColDef';
+import { GridColType } from './gridColType';
+export declare type GridColumnTypesRecord = Record<GridColType, GridColTypeDef>;

package/models/colDef/gridColumnTypesRecord.js

@@ -0,0 +1 @@
+export {};

package/models/colDef/gridDefaultColumnTypes.d.ts

@@ -0,0 +1,3 @@
+import { GridColumnTypesRecord } from './gridColumnTypesRecord';
+export declare const DEFAULT_GRID_COL_TYPE_KEY = "__default__";
+export declare const getGridDefaultColumnTypes: () => GridColumnTypesRecord;

package/models/colDef/gridDefaultColumnTypes.js

@@ -0,0 +1,20 @@
+import { GRID_STRING_COL_DEF } from '../../colDef/gridStringColDef';
+import { GRID_NUMERIC_COL_DEF } from '../../colDef/gridNumericColDef';
+import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '../../colDef/gridDateColDef';
+import { GRID_BOOLEAN_COL_DEF } from '../../colDef/gridBooleanColDef';
+import { GRID_SINGLE_SELECT_COL_DEF } from '../../colDef/gridSingleSelectColDef';
+import { GRID_ACTIONS_COL_DEF, GRID_ACTIONS_COLUMN_TYPE } from '../../colDef/gridActionsColDef';
+export const DEFAULT_GRID_COL_TYPE_KEY = '__default__';
+export const getGridDefaultColumnTypes = () => {
+  const nativeColumnTypes = {
+    string: GRID_STRING_COL_DEF,
+    number: GRID_NUMERIC_COL_DEF,
+    date: GRID_DATE_COL_DEF,
+    dateTime: GRID_DATETIME_COL_DEF,
+    boolean: GRID_BOOLEAN_COL_DEF,
+    singleSelect: GRID_SINGLE_SELECT_COL_DEF,
+    [GRID_ACTIONS_COLUMN_TYPE]: GRID_ACTIONS_COL_DEF
+  };
+  nativeColumnTypes[DEFAULT_GRID_COL_TYPE_KEY] = GRID_STRING_COL_DEF;
+  return nativeColumnTypes;
+};

package/models/colDef/index.d.ts

@@ -0,0 +1,4 @@
+export * from './gridColDef';
+export * from './gridColType';
+export * from './gridColumnTypesRecord';
+export * from './gridDefaultColumnTypes';

package/models/colDef/index.js

@@ -0,0 +1,6 @@
+// ColDef
+export * from './gridColDef'; // Other types
+
+export * from './gridColType';
+export * from './gridColumnTypesRecord';
+export * from './gridDefaultColumnTypes';

package/models/controlStateItem.d.ts

@@ -0,0 +1,14 @@
+import { GridCallbackDetails } from './api/gridCallbackDetails';
+import type { GridEventLookup, GridControlledStateEventLookup } from './events';
+import type { OutputSelector } from '../utils/createSelector';
+import { GridStateCommunity } from './gridStateCommunity';
+export interface GridControlStateItem<State extends GridStateCommunity, E extends keyof GridControlledStateEventLookup> {
+    stateId: string;
+    propModel?: GridEventLookup[E]['params'];
+    stateSelector: OutputSelector<{
+        state: State;
+        instanceId: string;
+    }, GridControlledStateEventLookup[E]['params']> | ((state: State) => GridControlledStateEventLookup[E]['params']);
+    propOnChange?: (model: GridControlledStateEventLookup[E]['params'], details: GridCallbackDetails) => void;
+    changeEvent: E;
+}

package/models/controlStateItem.js

@@ -0,0 +1 @@
+export {};

package/models/cursorCoordinates.d.ts

@@ -0,0 +1,4 @@
+export interface CursorCoordinates {
+    x: number;
+    y: number;
+}

package/models/cursorCoordinates.js

@@ -0,0 +1 @@
+export {};

package/models/elementSize.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The size of a container.
+ */
+export interface ElementSize {
+    /**
+     * The height of a container or HTMLElement.
+     */
+    height: number;
+    /**
+     * The width of a container or HTMLElement.
+     */
+    width: number;
+}

package/models/elementSize.js

@@ -0,0 +1 @@
+export {};

package/models/events/gridEventListener.d.ts

@@ -0,0 +1,9 @@
+import { MuiBaseEvent, MuiEvent } from '../muiEvent';
+import { GridCallbackDetails } from '../api/gridCallbackDetails';
+import { GridEventsStr } from './gridEvents';
+import { GridEventLookup } from './gridEventLookup';
+export declare type GridEventListener<E extends GridEventsStr> = (params: GridEventLookup[E] extends {
+    params: any;
+} ? GridEventLookup[E]['params'] : undefined, event: GridEventLookup[E] extends {
+    event: MuiBaseEvent;
+} ? MuiEvent<GridEventLookup[E]['event']> : MuiEvent<{}>, details: GridCallbackDetails) => void;

package/models/events/gridEventListener.js

@@ -0,0 +1 @@
+export {};

package/models/events/gridEventLookup.d.ts

@@ -0,0 +1,258 @@
+import * as React from 'react';
+import type { GridCellEditCommitParams, GridColumnHeaderParams, GridColumnOrderChangeParams, GridColumnResizeParams, GridColumnVisibilityChangeParams, GridEditCellPropsParams, GridHeaderSelectionCheckboxParams, GridRowParams, GridRowSelectionCheckboxParams, GridScrollParams } from '../params';
+import { GridCellParams } from '../params/gridCellParams';
+import type { GridFilterModel } from '../gridFilterModel';
+import type { GridSortModel } from '../gridSortModel';
+import type { GridEditRowsModel } from '../gridEditRowModel';
+import type { GridSelectionModel } from '../gridSelectionModel';
+import type { ElementSize } from '../elementSize';
+import type { MuiBaseEvent } from '../muiEvent';
+import type { GridRowId, GridRowTreeNodeConfig } from '../gridRows';
+import type { GridPreProcessingGroup } from '../../hooks/core/preProcessing';
+import type { GridColumnVisibilityModel } from '../../hooks/features/columns';
+export interface GridRowEventLookup {
+    rowClick: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    rowDoubleClick: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    rowMouseEnter: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    rowMouseLeave: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+}
+export interface GridColumnHeaderEventLookup {
+    columnHeaderClick: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnHeaderDoubleClick: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnHeaderOver: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnHeaderOut: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnHeaderEnter: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnHeaderLeave: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnHeaderKeyDown: {
+        params: GridColumnHeaderParams;
+        event: React.KeyboardEvent<HTMLElement>;
+    };
+    columnHeaderFocus: {
+        params: GridColumnHeaderParams;
+        event: React.FocusEvent<HTMLElement>;
+    };
+    columnHeaderBlur: {
+        params: GridColumnHeaderParams;
+        event: React.FocusEvent<HTMLElement>;
+    };
+    columnHeaderDragStart: {
+        params: GridColumnHeaderParams;
+        event: React.DragEvent<HTMLElement>;
+    };
+    columnHeaderDragEnter: {
+        params: GridColumnHeaderParams;
+        event: React.DragEvent<HTMLElement>;
+    };
+    columnHeaderDragOver: {
+        params: GridColumnHeaderParams;
+        event: React.DragEvent<HTMLElement>;
+    };
+    columnHeaderDragEnd: {
+        params: GridColumnHeaderParams;
+        event: React.DragEvent<HTMLElement>;
+    };
+    columnSeparatorMouseDown: {
+        params: GridColumnHeaderParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+}
+export interface GridCellEventLookup {
+    cellClick: {
+        params: GridCellParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    cellDoubleClick: {
+        params: GridCellParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    cellMouseDown: {
+        params: GridCellParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    cellMouseUp: {
+        params: GridCellParams;
+        event: React.MouseEvent<HTMLElement>;
+    };
+    cellKeyDown: {
+        params: GridCellParams;
+        event: React.KeyboardEvent<HTMLElement>;
+    };
+    cellDragEnter: {
+        params: GridCellParams;
+        event: React.DragEvent<HTMLElement>;
+    };
+    cellDragOver: {
+        params: GridCellParams;
+        event: React.DragEvent<HTMLElement>;
+    };
+}
+export interface GridControlledStateEventLookup {
+    pageSizeChange: {
+        params: number;
+    };
+    pageChange: {
+        params: number;
+    };
+    filterModelChange: {
+        params: GridFilterModel;
+    };
+    sortModelChange: {
+        params: GridSortModel;
+    };
+    editRowsModelChange: {
+        params: GridEditRowsModel;
+    };
+    selectionChange: {
+        params: GridSelectionModel;
+    };
+    columnVisibilityModelChange: {
+        params: GridColumnVisibilityModel;
+    };
+    detailPanelsExpandedRowIdsChange: {
+        params: GridRowId[];
+    };
+}
+export interface GridEventLookup extends GridRowEventLookup, GridColumnHeaderEventLookup, GridCellEventLookup, GridControlledStateEventLookup {
+    unmount: {};
+    componentError: {
+        params: any;
+    };
+    stateChange: {
+        params: any;
+    };
+    resize: {
+        params: ElementSize;
+    };
+    viewportInnerSizeChange: {
+        params: ElementSize;
+    };
+    debouncedResize: {
+        params: ElementSize;
+    };
+    rowGroupsPreProcessingChange: {};
+    preProcessorRegister: {
+        params: GridPreProcessingGroup;
+    };
+    preProcessorUnregister: {
+        params: GridPreProcessingGroup;
+    };
+    columnsChange: {
+        params: string[];
+    };
+    columnWidthChange: {
+        params: GridColumnResizeParams;
+        event: MouseEvent | {};
+    };
+    columnResizeStart: {
+        params: {
+            field: string;
+        };
+        event: React.MouseEvent<HTMLElement>;
+    };
+    columnResizeStop: {
+        params: null;
+        event: MouseEvent;
+    };
+    columnVisibilityChange: {
+        params: GridColumnVisibilityChangeParams;
+    };
+    columnResize: {
+        params: GridColumnResizeParams;
+        event: MouseEvent;
+    };
+    columnOrderChange: {
+        params: GridColumnOrderChangeParams;
+    };
+    rowsSet: {};
+    visibleRowsSet: {};
+    rowExpansionChange: {
+        params: GridRowTreeNodeConfig;
+    };
+    cellModeChange: {
+        params: GridCellParams;
+    };
+    cellEditStart: {
+        params: GridCellParams;
+        event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
+    };
+    cellEditStop: {
+        params: GridCellParams;
+        event: MuiBaseEvent;
+    };
+    cellEditCommit: {
+        params: GridCellEditCommitParams;
+        event: MuiBaseEvent;
+    };
+    editCellPropsChange: {
+        params: GridEditCellPropsParams;
+        event: React.SyntheticEvent<HTMLElement> | {};
+    };
+    rowEditStart: {
+        params: GridRowParams;
+        event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
+    };
+    rowEditStop: {
+        params: GridRowParams;
+        event: MuiBaseEvent;
+    };
+    rowEditCommit: {
+        params: GridRowId;
+        event: MuiBaseEvent;
+    };
+    cellFocusIn: {
+        params: GridCellParams;
+    };
+    cellFocusOut: {
+        params: GridCellParams;
+        event: MuiBaseEvent;
+    };
+    cellNavigationKeyDown: {
+        params: GridCellParams | GridRowParams;
+        event: React.KeyboardEvent<HTMLElement>;
+    };
+    columnHeaderNavigationKeyDown: {
+        params: GridColumnHeaderParams;
+        event: React.KeyboardEvent<HTMLElement>;
+    };
+    rowsScroll: {
+        params: GridScrollParams;
+    };
+    virtualScrollerContentSizeChange: {};
+    headerSelectionCheckboxChange: {
+        params: GridHeaderSelectionCheckboxParams;
+    };
+    rowSelectionCheckboxChange: {
+        params: GridRowSelectionCheckboxParams;
+        event: React.ChangeEvent<HTMLElement>;
+    };
+}

package/models/events/gridEventLookup.js

@@ -0,0 +1 @@
+export {};

package/models/events/gridEventPublisher.d.ts

@@ -0,0 +1,30 @@
+import { MuiBaseEvent } from '../muiEvent';
+import { GridEventLookup } from './gridEventLookup';
+import { GridEventsStr } from './gridEvents';
+declare type PublisherArgsNoEvent<E extends GridEventsStr, T extends {
+    params: any;
+}> = [E, T['params']];
+declare type PublisherArgsRequiredEvent<E extends GridEventsStr, T extends {
+    params: any;
+    event: MuiBaseEvent;
+}> = [E, T['params'], T['event']];
+declare type PublisherArgsOptionalEvent<E extends GridEventsStr, T extends {
+    params: any;
+    event: MuiBaseEvent;
+}> = PublisherArgsRequiredEvent<E, T> | PublisherArgsNoEvent<E, T>;
+declare type PublisherArgsEvent<E extends GridEventsStr, T extends {
+    params: any;
+    event: MuiBaseEvent;
+}> = {} extends T['event'] ? PublisherArgsOptionalEvent<E, T> : PublisherArgsRequiredEvent<E, T>;
+declare type PublisherArgsParams<E extends GridEventsStr, T extends {
+    params: any;
+}> = [E, T['params']];
+declare type PublisherArgsNoParams<E extends GridEventsStr> = [E];
+declare type GridEventPublisherArg<E extends GridEventsStr, T> = T extends {
+    params: any;
+    event: MuiBaseEvent;
+} ? PublisherArgsEvent<E, T> : T extends {
+    params: any;
+} ? PublisherArgsParams<E, T> : PublisherArgsNoParams<E>;
+export declare type GridEventPublisher = <E extends GridEventsStr>(...params: GridEventPublisherArg<E, GridEventLookup[E]>) => void;
+export {};

package/models/events/gridEventPublisher.js

@@ -0,0 +1 @@
+export {};