@redsift/table 11.0.0-muiv5-alpha.1 → 11.0.0-muiv5-alpha.3

package/index.d.ts

@@ -1,9 +1,10 @@
 import * as _mui_x_data_grid_pro from '@mui/x-data-grid-pro';
-import { GridNativeColTypes, GridColumnTypesRecord, GridFilterItem, GridCellParams, GridFilterOperator, GridFilterInputValue, GridFilterInputMultipleValue, DataGridProProps, GridPinnedColumns, GridFilterModel, GridSortModel, GridSortItem, GridColumnVisibilityModel, GridToolbarExportProps, GridToolbarFilterButtonProps, GridToolbarColumnsButton, GridToolbarDensitySelector } from '@mui/x-data-grid-pro';
+import { GridNativeColTypes, GridColumnTypesRecord, GridFilterItem, GridCellParams, GridFilterOperator, GridFilterInputValue, GridFilterInputMultipleValue, DataGridProProps, GridPinnedColumns, GridFilterModel, GridSortModel, GridSortItem, GridColumnVisibilityModel, GridSlotsComponent, GridSelectionModel, GridRowParams, GridToolbarExportProps, GridToolbarFilterButtonProps, GridToolbarColumnsButton, GridToolbarDensitySelector } from '@mui/x-data-grid-pro';
 export { GridAlignment, GridColDef, GridColumns, GridFilterItem, GridFilterModel, GridSelectionModel, getGridBooleanOperators, getGridDateOperators, getGridSingleSelectOperators } from '@mui/x-data-grid-pro';
-import React, { ReactNode, ComponentProps, RefObject } from 'react';
+import React, { ReactNode, ComponentProps, MutableRefObject, RefObject } from 'react';
 import { TablePaginationProps } from '@mui/material';
 import { Theme, Comp, IconProps, NotificationsColorPalette, ProductColorPalette, ShieldVariant } from '@redsift/design-system';
+import { GridApiPro } from '@mui/x-data-grid-pro/models/gridApiPro';
 
 declare const DETAIL_PANEL_TOGGLE_COL_DEF: _mui_x_data_grid_pro.GridColDef<any, any, any>;
 
@@ -156,16 +157,28 @@ type StyledDataGridProps = {
 
 declare const DataGrid: Comp<DataGridProps, HTMLDivElement>;
 
+interface ExtendedGridPaginationModel {
+    page: number;
+    pageSize: number;
+    direction?: 'next' | 'back';
+}
+
 type OperatorValue = string | string[];
 declare const decodeValue: (value: string) => OperatorValue;
 declare const encodeValue: (value: string | undefined) => string;
 declare const urlSearchParamsToString: (searchParams: URLSearchParams) => string;
 declare const numberOperatorEncoder: Record<string, string>;
 declare const numberOperatorDecoder: Record<string, string>;
+/** FILTERS */
 declare const getFilterModelFromString: (searchString: string, columns: DataGridProps['columns']) => GridFilterModel;
 declare const getSearchParamsFromFilterModel: (filterModel: GridFilterModel) => URLSearchParams;
-declare const getSortingFromString: (notParsed: string, columns: DataGridProps['columns']) => GridSortModel | null;
+/** SORT */
+declare const getSortingFromString: (searchString: string, columns: DataGridProps['columns']) => GridSortModel | null;
 declare const getSearchParamsFromSorting: (sorting: GridSortItem[]) => URLSearchParams;
+/** PAGINATION */
+declare const getPaginationFromString: (searchString: string) => ExtendedGridPaginationModel | null;
+declare const getSearchParamsFromPagination: (pagination: ExtendedGridPaginationModel) => URLSearchParams;
+/** COLUMN VISIBILITY */
 declare const getSearchParamsFromColumnVisibility: (columnVisibility: GridColumnVisibilityModel, columns: DataGridProps['columns']) => URLSearchParams;
 declare const getColumnVisibilityFromString: (notParsed: string, tableColumns: DataGridProps['columns']) => GridColumnVisibilityModel | null;
 declare const getPinnedColumnsFromString: (notParsed: string, tableColumns: DataGridProps['columns']) => PinnedColumns | null;
@@ -174,12 +187,13 @@ declare const getSearchParamsFromTab: (search: string) => URLSearchParams;
 type FinalSearchInput = {
     filterModel: GridFilterModel;
     sortModel: GridSortModel;
+    paginationModel: ExtendedGridPaginationModel;
     columnsVisibilityModel: GridColumnVisibilityModel;
     pinnedColumnsModel: GridPinnedColumns;
     search: string;
     columns: DataGridProps['columns'];
 };
-declare const getFinalSearch: ({ search, filterModel, sortModel, columnsVisibilityModel, pinnedColumnsModel, columns, }: FinalSearchInput) => URLSearchParams;
+declare const getFinalSearch: ({ search, filterModel, sortModel, paginationModel, columnsVisibilityModel, pinnedColumnsModel, columns, }: FinalSearchInput) => URLSearchParams;
 type PinnedColumns = {
     left: string[];
     right: string[];
@@ -189,6 +203,8 @@ type ModelsLocalStorage = {
     setLocalStorageFilters: (search: string) => void;
     localStorageSorting: string;
     setLocalStorageSorting: (search: string) => void;
+    localStoragePagination: string;
+    setLocalStoragePagination: (search: string) => void;
     localStorageColumnsVisibility: string;
     setLocalStorageColumnsVisibility: (search: string) => void;
     localStoragePinnedColumns: string;
@@ -197,6 +213,7 @@ type ModelsLocalStorage = {
 type ModelsTable = {
     filterModel: GridFilterModel;
     sortModel: GridSortModel;
+    paginationModel: ExtendedGridPaginationModel;
     columnVisibilityModel: GridColumnVisibilityModel;
     pinnedColumnsModel: PinnedColumns;
 };
@@ -205,12 +222,24 @@ declare const getModelsParsedOrUpdateLocalStorage: (search: string, columns: Dat
 type DataGridModel = {
     filterModel: GridFilterModel;
     sortModel: GridSortModel;
+    paginationModel: ExtendedGridPaginationModel;
     columnsModel: GridColumnVisibilityModel;
     pinnedColumnsModel: GridPinnedColumns;
 };
-declare const updateUrl: ({ filterModel, sortModel, columnsModel: columnsVisibilityModel, pinnedColumnsModel }: DataGridModel, search: string, historyReplace: (newSearch: string) => void, columns: DataGridProps['columns']) => void;
+declare const updateUrl: ({ filterModel, sortModel, paginationModel, columnsModel: columnsVisibilityModel, pinnedColumnsModel }: DataGridModel, search: string, historyReplace: (newSearch: string) => void, columns: DataGridProps['columns']) => void;
 declare const areFilterModelsEquivalent: (filterModel: GridFilterModel, filterModelToMatch: GridFilterModel) => boolean;
 
+declare const BaseButton: React.JSXElementConstructor<any>;
+
+declare const BaseCheckbox: React.JSXElementConstructor<any>;
+
+declare const muiIconToDSIcon: Partial<Record<keyof GridSlotsComponent, string>>;
+declare const BaseIcon: React.JSXElementConstructor<any>;
+
+declare const BasePopper: React.JSXElementConstructor<any>;
+
+declare const BaseTextField: React.JSXElementConstructor<any>;
+
 interface CompletionResponseItem {
     columnField: string;
     operatorValue: string;
@@ -257,6 +286,78 @@ declare const DEFAULT_OPERATORS: {
  */
 declare const GridToolbarFilterSemanticField: Comp<GridToolbarFilterSemanticFieldProps, HTMLFormElement>;
 
+type ControlledPaginationProps = {
+    displaySelection?: boolean;
+    displayRowsPerPage?: boolean;
+    displayPagination?: boolean;
+    selectionStatus: SelectionStatus;
+    apiRef: MutableRefObject<GridApiPro>;
+    page: number;
+    onPageChange: (page: number) => void;
+    pageSize: number;
+    onPageSizeChange: (pageSize: number) => void;
+    rowsPerPageOptions?: number[];
+    isRowSelectable?: DataGridProps['isRowSelectable'];
+    paginationProps?: DataGridProps['paginationProps'];
+};
+declare const ControlledPagination: React.FC<ControlledPaginationProps>;
+
+type ServerSideControlledPaginationProps = {
+    displaySelection?: boolean;
+    displayRowsPerPage?: boolean;
+    displayPagination?: boolean;
+    selectionStatus: SelectionStatus;
+    page: number;
+    onPageChange: (page: number) => void;
+    pageSize: number;
+    onPageSizeChange: (pageSize: number) => void;
+    rowsPerPageOptions?: number[];
+    paginationProps?: DataGridProps['paginationProps'];
+    rowCount: number;
+    loading?: boolean;
+};
+declare const onServerSideSelectionStatusChange: (newSelectionModel: GridSelectionModel, apiRef: React.MutableRefObject<GridApiPro>, selectionStatus: React.MutableRefObject<SelectionStatus>, isRowSelectable: ((params: GridRowParams<any>) => boolean) | undefined, page: number, pageSize: number) => void;
+declare const ServerSideControlledPagination: React.FC<ServerSideControlledPaginationProps>;
+
+interface StatefulDataGridProps extends DataGridProps {
+    /** Hook returning pathname, search params and a method to update query params. */
+    useRouter: () => {
+        pathname: string;
+        search: string;
+        historyReplace: (newSearch: string) => void;
+    };
+    /** Pinned custom columns. */
+    pinnedCustomColumns?: Required<GridPinnedColumns>;
+}
+
+declare const StatefulDataGrid: Comp<StatefulDataGridProps, HTMLDivElement>;
+
+interface TextCellProps extends ComponentProps<'div'> {
+    /** Including Badge Component. */
+    badge?: ReactNode;
+    /**
+     * Can be a string or an array of strings containing `d` property of the `path` SVG element.<br />
+     * Can also be a ReactElement.
+     */
+    leftIcon?: IconProps['icon'];
+    /** Left Icon Color variant. */
+    leftIconColor?: NotificationsColorPalette | ProductColorPalette | (string & {});
+    /**
+     * Can be a string or an array of strings containing `d` property of the `path` SVG element.<br />
+     * Can also be a ReactElement.
+     */
+    rightIcon?: IconProps['icon'];
+    /** Right Icon Color variant. */
+    rightIconColor?: NotificationsColorPalette | ProductColorPalette | (string & {});
+    /** Shield variant. */
+    shieldVariant?: ShieldVariant;
+}
+
+/**
+ * The Cell component.
+ */
+declare const TextCell: Comp<TextCellProps, HTMLDivElement>;
+
 type GridToolbarColumnsProps = Omit<typeof GridToolbarColumnsButton, 'ref'>;
 type GridToolbarDensityProps = Omit<typeof GridToolbarDensitySelector, 'ref'>;
 type GridToolbarFilterSemanticProps = Omit<GridToolbarFilterSemanticFieldProps, 'ref'>;
@@ -306,30 +407,25 @@ declare global {
 /** ------ */
 declare const Toolbar: React.FC<ToolbarProps>;
 
-interface TextCellProps extends ComponentProps<'div'> {
-    /** Including Badge Component. */
-    badge?: ReactNode;
-    /**
-     * Can be a string or an array of strings containing `d` property of the `path` SVG element.<br />
-     * Can also be a ReactElement.
-     */
-    leftIcon?: IconProps['icon'];
-    /** Left Icon Color variant. */
-    leftIconColor?: NotificationsColorPalette | ProductColorPalette | (string & {});
-    /**
-     * Can be a string or an array of strings containing `d` property of the `path` SVG element.<br />
-     * Can also be a ReactElement.
-     */
-    rightIcon?: IconProps['icon'];
-    /** Right Icon Color variant. */
-    rightIconColor?: NotificationsColorPalette | ProductColorPalette | (string & {});
-    /** Shield variant. */
-    shieldVariant?: ShieldVariant;
-}
-
-/**
- * The Cell component.
- */
-declare const TextCell: Comp<TextCellProps, HTMLDivElement>;
+type ToolbarWrapperProps = {
+    hideToolbar: DataGridProps['hideToolbar'];
+    RenderedToolbar: React.JSXElementConstructor<any>;
+    filterModel: DataGridProps['filterModel'];
+    onFilterModelChange: DataGridProps['onFilterModelChange'];
+    pagination: DataGridProps['pagination'];
+    paginationPlacement: DataGridProps['paginationPlacement'];
+    selectionStatus: React.MutableRefObject<SelectionStatus>;
+    apiRef: DataGridProps['apiRef'];
+    isRowSelectable: DataGridProps['isRowSelectable'];
+    page: DataGridProps['page'];
+    onPageChange: DataGridProps['onPageChange'];
+    pageSize: DataGridProps['pageSize'];
+    onPageSizeChange: DataGridProps['onPageSizeChange'];
+    rowsPerPageOptions: DataGridProps['rowsPerPageOptions'];
+    paginationProps: DataGridProps['paginationProps'];
+    paginationMode?: DataGridProps['paginationMode'];
+    rowCount?: DataGridProps['rowCount'];
+};
+declare const ToolbarWrapper: React.FC<ToolbarWrapperProps>;
 
-export { CATEGORIES, CONTAINS_ANY_OF, CONTAINS_ANY_OF_I, Category, CompletionResponse, DEFAULT_OPERATORS, DETAIL_PANEL_TOGGLE_COL_DEF, DIMENSION_MODEL_KEY, DOES_NOT_CONTAIN, DOES_NOT_EQUAL, DataGrid, DataGridModel, DataGridProps, ENDS_WITH_ANY_OF, FILTER_MODEL_KEY, FILTER_SEARCH_KEY, FilterConfig, GridToolbarFilterSemanticField, GridToolbarFilterSemanticFieldProps, IS_ANY_OF, IS_BETWEEN, IS_NOT_ANY_OF, PAGINATION_MODEL_KEY, PINNED_COLUMNS, PinnedColumns, SORT_MODEL_KEY, STARTS_WITH_ANY_OF, SelectionStatus, StyledDataGridProps, TextCell, Toolbar, VISIBILITY_MODEL_KEY, areFilterModelsEquivalent, buildStorageKey, clearPreviousVersionStorage, customColumnTypes, decodeValue, encodeValue, getColumnVisibilityFromString, getCompletion, getFilterModelFromString, getFinalSearch, getGridNumericOperators, getGridStringArrayOperators, getGridStringOperators, getModelsParsedOrUpdateLocalStorage, getPinnedColumnsFromString, getRsNumberColumnType, getRsStringColumnType, getSearchParamsFromColumnVisibility, getSearchParamsFromFilterModel, getSearchParamsFromPinnedColumns, getSearchParamsFromSorting, getSearchParamsFromTab, getSortingFromString, numberOperatorDecoder, numberOperatorEncoder, operatorList, updateUrl, urlSearchParamsToString };
+export { BaseButton, BaseCheckbox, BaseIcon, BasePopper, BaseTextField, CATEGORIES, CONTAINS_ANY_OF, CONTAINS_ANY_OF_I, Category, CompletionResponse, ControlledPagination, ControlledPaginationProps, DEFAULT_OPERATORS, DETAIL_PANEL_TOGGLE_COL_DEF, DIMENSION_MODEL_KEY, DOES_NOT_CONTAIN, DOES_NOT_EQUAL, DataGrid, DataGridModel, DataGridProps, ENDS_WITH_ANY_OF, FILTER_MODEL_KEY, FILTER_SEARCH_KEY, FilterConfig, GridToolbarFilterSemanticField, GridToolbarFilterSemanticFieldProps, IS_ANY_OF, IS_BETWEEN, IS_NOT_ANY_OF, PAGINATION_MODEL_KEY, PINNED_COLUMNS, PinnedColumns, SORT_MODEL_KEY, STARTS_WITH_ANY_OF, SelectionStatus, ServerSideControlledPagination, ServerSideControlledPaginationProps, StatefulDataGrid, StatefulDataGridProps, StyledDataGridProps, TextCell, Toolbar, ToolbarWrapper, ToolbarWrapperProps, VISIBILITY_MODEL_KEY, areFilterModelsEquivalent, buildStorageKey, clearPreviousVersionStorage, customColumnTypes, decodeValue, encodeValue, getColumnVisibilityFromString, getCompletion, getFilterModelFromString, getFinalSearch, getGridNumericOperators, getGridStringArrayOperators, getGridStringOperators, getModelsParsedOrUpdateLocalStorage, getPaginationFromString, getPinnedColumnsFromString, getRsNumberColumnType, getRsStringColumnType, getSearchParamsFromColumnVisibility, getSearchParamsFromFilterModel, getSearchParamsFromPagination, getSearchParamsFromPinnedColumns, getSearchParamsFromSorting, getSearchParamsFromTab, getSortingFromString, muiIconToDSIcon, numberOperatorDecoder, numberOperatorEncoder, onServerSideSelectionStatusChange, operatorList, updateUrl, urlSearchParamsToString };