@redsift/table 11.0.0-muiv5-alpha.0 → 11.0.0-muiv5-alpha.2

package/index.d.ts

@@ -1,12 +1,23 @@
 import * as _mui_x_data_grid_pro from '@mui/x-data-grid-pro';
-import { GridFilterItem, GridCellParams, GridFilterOperator, GridFilterInputValue, GridFilterInputMultipleValue, DataGridProProps, GridPinnedColumns, GridFilterModel, 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 { Theme, Comp, IconProps, NotificationsColorPalette, ProductColorPalette, ShieldVariant } from '@redsift/design-system';
-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>;
 
+declare const getRsStringColumnType: () => {
+    extendType: GridNativeColTypes;
+    filterOperators: _mui_x_data_grid_pro.GridFilterOperator<any, string | number | null, any>[];
+};
+declare const getRsNumberColumnType: () => {
+    extendType: GridNativeColTypes;
+    filterOperators: _mui_x_data_grid_pro.GridFilterOperator<any, string | number | null, any>[];
+};
+declare const customColumnTypes: GridColumnTypesRecord;
+
 declare const IS_BETWEEN: {
     label: string;
     value: string;
@@ -89,6 +100,22 @@ declare const operatorList: {
 
 declare function getCompletion(text: string, role: string, openai_api_key: string | undefined, model?: string): Promise<string>;
 
+declare const PAGINATION_MODEL_KEY = "paginationModel";
+declare const FILTER_MODEL_KEY = "filterModel";
+declare const SORT_MODEL_KEY = "sortModel";
+declare const VISIBILITY_MODEL_KEY = "visibilityModel";
+declare const PINNED_COLUMNS = "pinnedColumns";
+declare const DIMENSION_MODEL_KEY = "dimension";
+declare const FILTER_SEARCH_KEY = "searchModel";
+declare const CATEGORIES: readonly ["paginationModel", "filterModel", "sortModel", "visibilityModel", "dimension", "searchModel", "pinnedColumns"];
+type Category = (typeof CATEGORIES)[number];
+declare const buildStorageKey: ({ id, version, category }: {
+    id: string;
+    version: number;
+    category: Category;
+}) => `${string}:${number}:paginationModel` | `${string}:${number}:filterModel` | `${string}:${number}:sortModel` | `${string}:${number}:visibilityModel` | `${string}:${number}:pinnedColumns` | `${string}:${number}:dimension` | `${string}:${number}:searchModel`;
+declare const clearPreviousVersionStorage: (id: string, currentVersion: number) => void;
+
 interface DataGridProps extends Partial<Pick<DataGridProProps, 'rows'>>, Omit<DataGridProProps, 'rows'> {
     /** License key for MUI Datagrid Pro. */
     license?: string;
@@ -130,6 +157,89 @@ 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;
+/** 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;
+declare const getSearchParamsFromPinnedColumns: (pinnedColumns: GridPinnedColumns) => URLSearchParams;
+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, paginationModel, columnsVisibilityModel, pinnedColumnsModel, columns, }: FinalSearchInput) => URLSearchParams;
+type PinnedColumns = {
+    left: string[];
+    right: string[];
+};
+type ModelsLocalStorage = {
+    localStorageFilters: string;
+    setLocalStorageFilters: (search: string) => void;
+    localStorageSorting: string;
+    setLocalStorageSorting: (search: string) => void;
+    localStoragePagination: string;
+    setLocalStoragePagination: (search: string) => void;
+    localStorageColumnsVisibility: string;
+    setLocalStorageColumnsVisibility: (search: string) => void;
+    localStoragePinnedColumns: string;
+    setLocalStoragePinnedColumns: (search: string) => void;
+};
+type ModelsTable = {
+    filterModel: GridFilterModel;
+    sortModel: GridSortModel;
+    paginationModel: ExtendedGridPaginationModel;
+    columnVisibilityModel: GridColumnVisibilityModel;
+    pinnedColumnsModel: PinnedColumns;
+};
+/** Return the state of the table given the URL and the local storage state */
+declare const getModelsParsedOrUpdateLocalStorage: (search: string, columns: DataGridProps['columns'], historyReplace: (newSearch: string) => void, localStorage: ModelsLocalStorage) => ModelsTable;
+type DataGridModel = {
+    filterModel: GridFilterModel;
+    sortModel: GridSortModel;
+    paginationModel: ExtendedGridPaginationModel;
+    columnsModel: GridColumnVisibilityModel;
+    pinnedColumnsModel: GridPinnedColumns;
+};
+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;
@@ -176,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'>;
@@ -225,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 { CONTAINS_ANY_OF, CONTAINS_ANY_OF_I, CompletionResponse, DEFAULT_OPERATORS, DETAIL_PANEL_TOGGLE_COL_DEF, DOES_NOT_CONTAIN, DOES_NOT_EQUAL, DataGrid, DataGridProps, ENDS_WITH_ANY_OF, FilterConfig, GridToolbarFilterSemanticField, GridToolbarFilterSemanticFieldProps, IS_ANY_OF, IS_BETWEEN, IS_NOT_ANY_OF, STARTS_WITH_ANY_OF, SelectionStatus, StyledDataGridProps, TextCell, Toolbar, getCompletion, getGridNumericOperators, getGridStringArrayOperators, getGridStringOperators, operatorList };
+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 };