@mui/x-data-grid 5.4.0 → 5.6.0

package/models/gridFilterItem.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Filter item definition interface.
+ */
+export interface GridFilterItem {
+    /**
+     * Must be unique.
+     * Only useful when the model contains several items.
+     */
+    id?: number | string;
+    /**
+     * The column from which we want to filter the rows.
+     */
+    columnField: string;
+    /**
+     * The filtering value.
+     * The operator filtering function will decide for each row if the row values is correct compared to this value.
+     */
+    value?: any;
+    /**
+     * The name of the operator we want to apply.
+     * Will become required on `@mui/x-data-grid@6.X`.
+     */
+    operatorValue?: string;
+}
+declare enum GridLinkOperator {
+    And = "and",
+    Or = "or"
+}
+export { GridLinkOperator };

package/models/gridFilterItem.js

@@ -0,0 +1,11 @@
+/**
+ * Filter item definition interface.
+ */
+var GridLinkOperator;
+
+(function (GridLinkOperator) {
+  GridLinkOperator["And"] = "and";
+  GridLinkOperator["Or"] = "or";
+})(GridLinkOperator || (GridLinkOperator = {}));
+
+export { GridLinkOperator };

package/models/gridFilterModel.d.ts

@@ -0,0 +1,16 @@
+import { GridFilterItem, GridLinkOperator } from './gridFilterItem';
+/**
+ * Model describing the filters to apply to the grid.
+ */
+export interface GridFilterModel {
+    /**
+     * @default []
+     */
+    items: GridFilterItem[];
+    /**
+     * - `GridLinkOperator.And`: the row must pass all the filter items.
+     * - `GridLinkOperator.Or`: the row must pass at least on filter item.
+     * @default `GridLinkOperator.Or`
+     */
+    linkOperator?: GridLinkOperator;
+}

package/models/gridFilterModel.js

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

package/models/gridFilterOperator.d.ts

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { GridFilterInputValueProps } from '../components/panel/filterPanel/GridFilterInputValueProps';
+import { GridFilterInputMultipleValueProps } from '../components/panel/filterPanel/GridFilterInputMultipleValue';
+import { GridFilterInputMultipleSingleSelectProps } from '../components/panel/filterPanel/GridFilterInputMultipleSingleSelect';
+import { GridFilterItem } from './gridFilterItem';
+import { GridCellParams } from './params/gridCellParams';
+import type { GridStateColDef } from './colDef/gridColDef';
+/**
+ * Filter operator definition interface.
+ */
+export interface GridFilterOperator {
+    /**
+     * The label of the filter operator.
+     */
+    label?: string;
+    /**
+     * The name of the filter operator.
+     * It will be matched with the `operatorValue` property of the filter items.
+     */
+    value: string;
+    /**
+     * The callback that generates a filtering function for a given filter item and column.
+     * This function can return `null` to skip filtering for this item and column.
+     * @param {GridFilterItem} filterItem The filter item with which we want to filter the column.
+     * @param {GridStateColDef} column The column from which we want to filter the rows.
+     * @returns {null | ((params: GridCellParams) => boolean)} The function to call to check if a row poss this filter item or not.
+     */
+    getApplyFilterFn: (filterItem: GridFilterItem, column: GridStateColDef) => null | ((params: GridCellParams) => boolean);
+    /**
+     * The input component to render in the filter panel for this filter operator.
+     */
+    InputComponent?: React.JSXElementConstructor<GridFilterInputValueProps> | React.JSXElementConstructor<GridFilterInputMultipleValueProps> | React.JSXElementConstructor<GridFilterInputMultipleSingleSelectProps>;
+    /**
+     * The props to pass to the input component in the filter panel for this filter operator.
+     */
+    InputComponentProps?: Record<string, any>;
+}

package/models/gridFilterOperator.js

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

package/models/gridIconSlotsComponent.d.ts

@@ -0,0 +1,117 @@
+import * as React from 'react';
+/**
+ * Set of icons used in the grid component UI.
+ * TODO: Differentiate community and pro interface
+ */
+export interface GridIconSlotsComponent {
+    /**
+     * Icon displayed on the boolean cell to represent the true value.
+     * @default GridCheckIcon
+     */
+    BooleanCellTrueIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the boolean cell to represent the false value.
+     * @default GridCloseIcon
+     */
+    BooleanCellFalseIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the side of the column header title to display the filter input component.
+     * @default GridTripleDotsVerticalIcon
+     */
+    ColumnMenuIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the open filter button present in the toolbar by default.
+     * @default GridFilterListIcon
+     */
+    OpenFilterButtonIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the column header menu to show that a filter has been applied to the column.
+     * @default GridFilterAltIcon
+     */
+    ColumnFilteredIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the column menu selector tab.
+     * @default GridColumnIcon
+     */
+    ColumnSelectorIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the side of the column header title when unsorted.
+     * @default GridColumnUnsortedIcon
+     */
+    ColumnUnsortedIcon: React.JSXElementConstructor<any> | null;
+    /**
+     * Icon displayed on the side of the column header title when sorted in ascending order.
+     * @default GridArrowUpwardIcon
+     */
+    ColumnSortedAscendingIcon: React.JSXElementConstructor<any> | null;
+    /**
+     * Icon displayed on the side of the column header title when sorted in descending order.
+     * @default GridArrowDownwardIcon
+     */
+    ColumnSortedDescendingIcon: React.JSXElementConstructor<any> | null;
+    /**
+     * Icon displayed in between two column headers that allows to resize the column header.
+     * @default GridSeparatorIcon
+     */
+    ColumnResizeIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the compact density option in the toolbar.
+     * @default GridViewHeadlineIcon
+     */
+    DensityCompactIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the standard density option in the toolbar.
+     * @default GridTableRowsIcon
+     */
+    DensityStandardIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the "comfortable" density option in the toolbar.
+     * @default GridViewStreamIcon
+     */
+    DensityComfortableIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the open export button present in the toolbar by default.
+     * @default GridSaveAltIcon
+     */
+    ExportIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the `actions` column type to open the menu.
+     * @default GridMoreVertIcon
+     */
+    MoreActionsIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the tree data toggling column when the children are collapsed
+     * @default GridKeyboardArrowRight
+     */
+    TreeDataExpandIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the tree data toggling column when the children are expanded
+     * @default GridExpandMoreIcon
+     */
+    TreeDataCollapseIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the grouping column when the children are collapsed
+     * @default GridKeyboardArrowRight
+     */
+    GroupingCriteriaExpandIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the grouping column when the children are expanded
+     * @default GridExpandMoreIcon
+     */
+    GroupingCriteriaCollapseIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the detail panel toggle column when collapsed.
+     * @default GridAddIcon
+     */
+    DetailPanelExpandIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed on the detail panel toggle column when expanded.
+     * @default GridRemoveIcon
+     */
+    DetailPanelCollapseIcon: React.JSXElementConstructor<any>;
+    /**
+     * Icon displayed for deleting the filter from filter Panel.
+     * @default GridCloseIcon
+     */
+    FilterPanelDeleteIcon: React.JSXElementConstructor<any>;
+}

package/models/gridIconSlotsComponent.js

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

package/models/gridPaginationProps.d.ts

@@ -0,0 +1,8 @@
+export interface GridPaginationProps {
+    page: number;
+    pageCount: number;
+    pageSize: number;
+    rowCount: number;
+    setPage: (page: number) => void;
+    setPageSize: (pageSize: number) => void;
+}

package/models/gridPaginationProps.js

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

package/models/gridRenderContextProps.d.ts

@@ -0,0 +1,55 @@
+/**
+ * The object containing the column properties of the rendering state.
+ */
+export interface GridRenderColumnsProps {
+    /**
+     * The index of the first rendered column.
+     */
+    firstColIdx: number;
+    /**
+     * The index of the last rendered column.
+     */
+    lastColIdx: number;
+    /**
+     * The left offset required to position the viewport at the beginning of the first rendered column.
+     */
+    leftEmptyWidth: number;
+    /**
+     * The right offset required to position the viewport to the end of the last rendered column.
+     */
+    rightEmptyWidth: number;
+}
+/**
+ * The object containing the row properties of the rendering state.
+ */
+export interface GridRenderRowProps {
+    /**
+     * The rendering zone page calculated from the scroll position.
+     */
+    page: number;
+    /**
+     * The index of the first rendered row.
+     */
+    firstRowIdx: number;
+    /**
+     * The index of the last rendered row.
+     */
+    lastRowIdx: number;
+}
+/**
+ * The object containing the pagination properties of the rendering state.
+ */
+export interface GridRenderPaginationProps {
+    /**
+     * The current page if pagination is enabled.
+     */
+    paginationCurrentPage?: number;
+    /**
+     * The page size if pagination is enabled.
+     */
+    pageSize?: number;
+}
+/**
+ * The full rendering state.
+ */
+export declare type GridRenderContextProps = GridRenderColumnsProps & GridRenderRowProps & GridRenderPaginationProps;

package/models/gridRenderContextProps.js

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

package/models/gridRootContainerRef.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+/**
+ * The ref type of the inner grid root container.
+ */
+export declare type GridRootContainerRef = React.RefObject<HTMLDivElement>;

package/models/gridRootContainerRef.js

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

package/models/gridRows.d.ts

@@ -0,0 +1,90 @@
+import type { GridKeyValue } from './colDef/gridColDef';
+export declare type GridRowsProp = Readonly<GridRowModel[]>;
+/**
+ * @deprecated prefer GridRowModel.
+ */
+export declare type GridRowData<T = {
+    [key: string]: any;
+}> = T;
+/**
+ * The key value object representing the data of a row.
+ */
+export declare type GridRowModel<T = {
+    [key: string]: any;
+}> = T;
+export declare type GridUpdateAction = 'delete';
+export interface GridRowModelUpdate extends GridRowModel {
+    _action?: GridUpdateAction;
+}
+export interface GridRowTreeNodeConfig {
+    /**
+     * The grid row id.
+     */
+    id: GridRowId;
+    /**
+     * The id of the row children.
+     * @default []
+     */
+    children?: GridRowId[];
+    /**
+     * The row id of the parent (null if this row is a top level row).
+     */
+    parent: GridRowId | null;
+    /**
+     * Current expansion status of the row.
+     * @default false
+     */
+    childrenExpanded?: boolean;
+    /**
+     * 0-based depth of the row in the tree.
+     */
+    depth: number;
+    /**
+     * The key used to group the children of this row.
+     */
+    groupingKey: GridKeyValue;
+    /**
+     * The field used to group the children of this row.
+     * Is `null` if no field has been used to group the children of this row.
+     */
+    groupingField: string | null;
+    /**
+     * If `true`, this node has been automatically added to fill a gap in the tree structure.
+     * @default false
+     */
+    isAutoGenerated?: boolean;
+}
+/**
+ * The grid rows total height and row positions.
+ */
+export interface GridRowsMeta {
+    /**
+     * The sum of all grid rows.
+     */
+    totalHeight: number;
+    /**
+     * The grid rows positions.
+     */
+    positions: number[];
+}
+export declare type GridRowTreeConfig = Record<GridRowId, GridRowTreeNodeConfig>;
+export declare type GridRowsLookup = Record<GridRowId, GridRowModel>;
+/**
+ * The type of Id supported by the grid.
+ */
+export declare type GridRowId = string | number;
+export declare type GridRowEntry = {
+    id: GridRowId;
+    model: GridRowModel;
+};
+/**
+ * The function to retrieve the id of a [[GridRowModel]].
+ */
+export declare type GridRowIdGetter = (row: GridRowModel) => GridRowId;
+/**
+ * An helper function to check if the id provided is valid.
+ * @param {GridRowId} id Id as [[GridRowId]].
+ * @param {GridRowModel | Partial<GridRowModel>} row Row as [[GridRowModel]].
+ * @param {string} detailErrorMessage A custom error message to display for invalid IDs
+ */
+export declare function checkGridRowIdIsValid(id: GridRowId, row: GridRowModel | Partial<GridRowModel>, detailErrorMessage?: string): void;

package/models/gridRows.js

@@ -0,0 +1,31 @@
+/**
+ * @deprecated prefer GridRowModel.
+ */
+
+/**
+ * The key value object representing the data of a row.
+ */
+
+/**
+ * The grid rows total height and row positions.
+ */
+
+/**
+ * The type of Id supported by the grid.
+ */
+
+/**
+ * The function to retrieve the id of a [[GridRowModel]].
+ */
+
+/**
+ * An helper function to check if the id provided is valid.
+ * @param {GridRowId} id Id as [[GridRowId]].
+ * @param {GridRowModel | Partial<GridRowModel>} row Row as [[GridRowModel]].
+ * @param {string} detailErrorMessage A custom error message to display for invalid IDs
+ */
+export function checkGridRowIdIsValid(id, row, detailErrorMessage = 'A row was provided without id in the rows prop:') {
+  if (id == null) {
+    throw new Error(['MUI: The data grid component requires all rows to have a unique `id` property.', 'Alternatively, you can use the `getRowId` prop to specify a custom id for each row.', detailErrorMessage, JSON.stringify(row)].join('\n'));
+  }
+}

package/models/gridSelectionModel.d.ts

@@ -0,0 +1,3 @@
+import { GridRowId } from './gridRows';
+export declare type GridInputSelectionModel = GridRowId[] | GridRowId;
+export declare type GridSelectionModel = GridRowId[];

package/models/gridSelectionModel.js

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

package/models/gridSlotsComponent.d.ts

@@ -0,0 +1,124 @@
+import * as React from 'react';
+import { GridIconSlotsComponent } from './gridIconSlotsComponent';
+/**
+ * Grid components React prop interface containing all the overridable components.
+ * TODO: Differentiate community and pro interface
+ */
+export interface GridSlotsComponent extends GridIconSlotsComponent {
+    /**
+     * The custom Checkbox component used in the grid for both header and cells.
+     * @default Checkbox
+     */
+    BaseCheckbox: React.JSXElementConstructor<any>;
+    /**
+     * The custom TextField component used in the grid.
+     * @default TextField
+     */
+    BaseTextField: React.JSXElementConstructor<any>;
+    /**
+     * The custom FormControl component used in the grid.
+     * @default FormControl
+     */
+    BaseFormControl: React.JSXElementConstructor<any>;
+    /**
+     * The custom Select component used in the grid.
+     * @default Select
+     */
+    BaseSelect: React.JSXElementConstructor<any>;
+    /**
+     * The custom Switch component used in the grid.
+     * @default Switch
+     */
+    BaseSwitch: React.JSXElementConstructor<any>;
+    /**
+     * The custom Button component used in the grid.
+     * @default Button
+     */
+    BaseButton: React.JSXElementConstructor<any>;
+    /**
+     * The custom Tooltip component used in the grid.
+     * @default Tooltip
+     */
+    BaseTooltip: React.JSXElementConstructor<any>;
+    /**
+     * The custom Popper component used in the grid.
+     * @default Popper
+     */
+    BasePopper: React.JSXElementConstructor<any>;
+    /**
+     * Component rendered for each cell.
+     * @default GridCell
+     */
+    Cell: React.JSXElementConstructor<any>;
+    /**
+     * Column menu component rendered by clicking on the 3 dots "kebab" icon in column headers.
+     * @default GridColumnMenu
+     */
+    ColumnMenu: React.JSXElementConstructor<any>;
+    /**
+     * Error overlay component rendered above the grid when an error is caught.
+     * @default ErrorOverlay
+     */
+    ErrorOverlay: React.JSXElementConstructor<any>;
+    /**
+     * Footer component rendered at the bottom of the grid viewport.
+     * @default GridFooter
+     */
+    Footer: React.JSXElementConstructor<any>;
+    /**
+     * Header component rendered above the grid column header bar.
+     * Prefer using the `Toolbar` slot. You should never need to use this slot.
+     * @default GridHeader
+     */
+    Header: React.JSXElementConstructor<any>;
+    /**
+     * Toolbar component rendered inside the Header component.
+     * @default null
+     */
+    Toolbar: React.JSXElementConstructor<any> | null;
+    /**
+     * PreferencesPanel component rendered inside the Header component.
+     * @default GridPreferencesPanel
+     */
+    PreferencesPanel: React.JSXElementConstructor<any>;
+    /**
+     * Loading overlay component rendered when the grid is in a loading state.
+     * @default GridLoadingOverlay
+     */
+    LoadingOverlay: React.JSXElementConstructor<any>;
+    /**
+     * No results overlay component rendered when the grid has no results after filtering.
+     * @default GridNoResultsOverlay
+     */
+    NoResultsOverlay: React.JSXElementConstructor<any>;
+    /**
+     * No rows overlay component rendered when the grid has no rows.
+     * @default GridNoRowsOverlay
+     */
+    NoRowsOverlay: React.JSXElementConstructor<any>;
+    /**
+     * Pagination component rendered in the grid footer by default.
+     * @default Pagination
+     */
+    Pagination: React.JSXElementConstructor<any> | null;
+    /**
+     * Filter panel component rendered when clicking the filter button.
+     * @default GridFilterPanel
+     */
+    FilterPanel: React.JSXElementConstructor<any>;
+    /**
+     * GridColumns panel component rendered when clicking the columns button.
+     * @default GridColumnsPanel
+     */
+    ColumnsPanel: React.JSXElementConstructor<any>;
+    /**
+     * Panel component wrapping the filters and columns panels.
+     * @default GridPanel
+     */
+    Panel: React.JSXElementConstructor<any>;
+    /**
+     * Component rendered for each row.
+     * @default GridRow
+     */
+    Row: React.JSXElementConstructor<any>;
+}

package/models/gridSlotsComponent.js

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

package/models/gridSlotsComponentsProps.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Overrideable components props dynamically passed to the component at rendering.
+ */
+export interface GridSlotsComponentsProps {
+    baseCheckbox?: any;
+    baseTextField?: any;
+    baseFormControl?: any;
+    baseSelect?: any;
+    baseSwitch?: any;
+    baseButton?: any;
+    basePopper?: any;
+    baseTooltip?: any;
+    cell?: any;
+    columnMenu?: any;
+    columnsPanel?: any;
+    errorOverlay?: any;
+    filterPanel?: any;
+    footer?: any;
+    header?: any;
+    loadingOverlay?: any;
+    noResultsOverlay?: any;
+    noRowsOverlay?: any;
+    pagination?: any;
+    panel?: any;
+    preferencesPanel?: any;
+    row?: any;
+    toolbar?: any;
+}

package/models/gridSlotsComponentsProps.js

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

package/models/gridSortModel.d.ts

@@ -0,0 +1,34 @@
+import { GridCellValue } from './gridCell';
+import { GridRowId, GridRowTreeNodeConfig } from './gridRows';
+export declare type GridSortDirection = 'asc' | 'desc' | null | undefined;
+export interface GridSortCellParams {
+    id: GridRowId;
+    field: string;
+    value: GridCellValue;
+    rowNode: GridRowTreeNodeConfig;
+    /**
+     * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)
+     */
+    api: any;
+}
+/**
+ * The type of the sort comparison function.
+ */
+export declare type GridComparatorFn = (v1: GridCellValue, v2: GridCellValue, cellParams1: GridSortCellParams, cellParams2: GridSortCellParams) => number;
+/**
+ * Object that represents the column sorted data, part of the [[GridSortModel]].
+ */
+export interface GridSortItem {
+    /**
+     * The column field identifier.
+     */
+    field: string;
+    /**
+     * The direction of the column that the grid should sort.
+     */
+    sort: GridSortDirection;
+}
+/**
+ * The model used for sorting the grid.
+ */
+export declare type GridSortModel = GridSortItem[];

package/models/gridSortModel.js

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

package/models/gridStateCommunity.d.ts

@@ -0,0 +1,35 @@
+import type { GridColumnMenuState, GridColumnsInitialState, GridColumnsState, GridDensityState, GridFilterInitialState, GridFilterState, GridFocusState, GridPaginationInitialState, GridPaginationState, GridPreferencePanelInitialState, GridPreferencePanelState, GridRowsState, GridSortingInitialState, GridSortingState, GridTabIndexState } from '../hooks';
+import type { GridRowsMetaState } from '../hooks/features/rows/gridRowsMetaState';
+import type { GridRowsInternalCache } from '../hooks/features/rows/gridRowsState';
+import type { GridEditRowsModel } from './gridEditRowModel';
+import type { GridSelectionModel } from './gridSelectionModel';
+/**
+ * The state of `DataGrid`.
+ */
+export interface GridStateCommunity {
+    rows: GridRowsState;
+    rowsCache: GridRowsInternalCache;
+    rowsMeta: GridRowsMetaState;
+    editRows: GridEditRowsModel;
+    pagination: GridPaginationState;
+    columns: GridColumnsState;
+    columnMenu: GridColumnMenuState;
+    sorting: GridSortingState;
+    focus: GridFocusState;
+    tabIndex: GridTabIndexState;
+    selection: GridSelectionModel;
+    filter: GridFilterState;
+    preferencePanel: GridPreferencePanelState;
+    density: GridDensityState;
+    error?: any;
+}
+/**
+ * The initial state of `DataGrid`.
+ */
+export interface GridInitialStateCommunity {
+    pagination?: GridPaginationInitialState;
+    sorting?: GridSortingInitialState;
+    filter?: GridFilterInitialState;
+    columns?: GridColumnsInitialState;
+    preferencePanel?: GridPreferencePanelInitialState;
+}

package/models/gridStateCommunity.js

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