diff --git a/src/DataTable/Pagination.tsx b/src/DataTable/Pagination.tsx index 9e07b687..36d51868 100644 --- a/src/DataTable/Pagination.tsx +++ b/src/DataTable/Pagination.tsx @@ -95,7 +95,9 @@ function Pagination({ }: PaginationProps): JSX.Element { const windowSize = useWindowSize(); const isRTL = useRTL(direction); - const shouldShow = windowSize.width && windowSize.width > SMALL; + const { minWindowWidth = SMALL } = paginationComponentOptions; + const windowWidth = windowSize.width; + const shouldShow = !minWindowWidth || (windowWidth && windowWidth > minWindowWidth); // const isRTL = detectRTL(direction); const numPages = getNumberOfPages(rowCount, rowsPerPage); const lastIndex = currentPage * rowsPerPage; diff --git a/src/DataTable/types.ts b/src/DataTable/types.ts index 66a7ecb9..f5d5e1c1 100644 --- a/src/DataTable/types.ts +++ b/src/DataTable/types.ts @@ -218,6 +218,10 @@ export interface TableStyles { export interface PaginationOptions { noRowsPerPage?: boolean; + // If non-null, the "rows per page" dropdown will be hidden when the window width is less than + // this value. SMALL == 599 is the default (if this property is undefined); pass `null` to always + // show the dropdown (useful for ensuring SSR matches client). + minWindowWidth?: number | null; rowsPerPageText?: string; rangeSeparatorText?: string; selectAllRowsItem?: boolean;