From 3ecdff5ae70240eab6596b538c6eed53a29584ae Mon Sep 17 00:00:00 2001 From: Kevin Van Cott Date: Fri, 9 Feb 2024 00:59:30 -0600 Subject: [PATCH] release v2.11.2 - row pinning fixes --- .../pages/changelog.mdx | 6 + .../pages/docs/guides/row-selection.mdx | 2 +- .../public/sitemap-0.xml | 202 +++++++++--------- packages/material-react-table/package.json | 2 +- .../src/components/body/MRT_TableBody.tsx | 2 +- .../components/inputs/MRT_SelectCheckbox.tsx | 31 +-- .../toolbar/MRT_ToolbarAlertBanner.tsx | 10 +- .../src/hooks/useMRT_Rows.ts | 3 +- .../src/utils/row.utils.ts | 80 ++++--- .../features/ColumnGrouping.stories.tsx | 1 - .../stories/features/RowPinning.stories.tsx | 1 + .../stories/features/Selection.stories.tsx | 2 +- 12 files changed, 184 insertions(+), 158 deletions(-) diff --git a/apps/material-react-table-docs/pages/changelog.mdx b/apps/material-react-table-docs/pages/changelog.mdx index ba95bfdf5..136942a0c 100644 --- a/apps/material-react-table-docs/pages/changelog.mdx +++ b/apps/material-react-table-docs/pages/changelog.mdx @@ -7,6 +7,12 @@ import Head from 'next/head'; ## MRT V2 Changelog +### Version 2.11.3 - 2024-02-08 + +- Fixed bugs with batch row selection and row pinning together +- Fixed duplicate pinned rows when global filter is present for non-sticky row pinning modes +- Fixed selected row count in toolbar alert banner with sub row selection + ### Version 2.11.1 - 2024-02-05 - Fixed bug where new batch row selection feature did not account for `manualPagination` diff --git a/apps/material-react-table-docs/pages/docs/guides/row-selection.mdx b/apps/material-react-table-docs/pages/docs/guides/row-selection.mdx index 2fd15c803..bd80940eb 100644 --- a/apps/material-react-table-docs/pages/docs/guides/row-selection.mdx +++ b/apps/material-react-table-docs/pages/docs/guides/row-selection.mdx @@ -176,7 +176,7 @@ const table = useMaterialReactTable({ //clicking anywhere on the row will select it muiTableBodyRowProps: ({ row, staticRowIndex, table }) => ({ onClick: (event) => - getMRT_RowSelectionHandler()({ event, row, staticRowIndex, table }), //import this helper function from material-react-table + getMRT_RowSelectionHandler({ row, staticRowIndex, table })(event), //import this helper function from material-react-table sx: { cursor: 'pointer' }, }), }); diff --git a/apps/material-react-table-docs/public/sitemap-0.xml b/apps/material-react-table-docs/public/sitemap-0.xml index 66df8ad33..f2448f0cf 100644 --- a/apps/material-react-table-docs/public/sitemap-0.xml +++ b/apps/material-react-table-docs/public/sitemap-0.xml @@ -1,104 +1,104 @@ -https://www.material-react-table.com2024-02-05T09:45:55.366Z -https://www.material-react-table.com/about2024-02-05T09:45:55.367Z -https://www.material-react-table.com/blog2024-02-05T09:45:55.367Z -https://www.material-react-table.com/blog/announcing-material-react-table-v22024-02-05T09:45:55.367Z -https://www.material-react-table.com/blog/the-best-react-data-grid-table-libraries-with-material-design-in-20232024-02-05T09:45:55.367Z -https://www.material-react-table.com/changelog2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/cell-instance-apis2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/column-instance-apis2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/column-options2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/mrt-components2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/mrt-hooks2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/row-instance-apis2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/state-options2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/table-instance-apis2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/api/table-options2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/advanced2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/aggregation-and-grouping2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/basic2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/chart-detail-panel2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/column-grouping2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/column-ordering2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/column-pinning2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/column-virtualization2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/custom-filter-ui2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/custom-headless2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/customized-grouping2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/detail-panel2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/dynamic-columns2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/editing-crud2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/editing-crud-inline-cell2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/editing-crud-inline-row2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/editing-crud-inline-table2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/editing-crud-tree2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/expanding-tree2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/expanding-tree-flat-parse2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/export-csv2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/export-pdf2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/faceted-values2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/filter-switching2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/filter-variants2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/infinite-scrolling2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/lazy-detail-panel2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/lazy-sub-rows2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/minimal2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/popover-filters2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/react-query2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/remote2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/row-dragging2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/row-ordering2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/row-virtualization2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/static-row-pinning2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/sticky-header2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/sticky-row-pinning2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/sticky-row-selection2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/examples/virtualized2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/getting-started2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/getting-started/install2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/getting-started/migrating-to-v22024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/getting-started/usage2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/aggregation2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/async-loading2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/best-practices2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/cell-actions2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/click-to-copy2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-actions2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-filtering2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-grouping2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-hiding2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-ordering-dnd2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-pinning2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-resizing2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/column-size2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/customize-components2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/customize-icons2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/data-columns2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/density-toggle2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/detail-panel2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/display-columns2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/editing2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/expanding-sub-rows2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/full-screen-toggle2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/global-filtering2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/localization2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/memoization2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/pagination2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/row-actions2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/row-numbers2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/row-ordering-dnd2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/row-pinning2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/row-selection2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/sorting2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/state-management2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/sticky-header2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/table-event-listeners2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/toolbar-customization2024-02-05T09:45:55.367Z -https://www.material-react-table.com/docs/guides/virtualization2024-02-05T09:45:55.367Z -https://www.material-react-table.com/roadmap2024-02-05T09:45:55.367Z +https://www.material-react-table.com2024-02-09T05:53:54.471Z +https://www.material-react-table.com/about2024-02-09T05:53:54.471Z +https://www.material-react-table.com/blog2024-02-09T05:53:54.471Z +https://www.material-react-table.com/blog/announcing-material-react-table-v22024-02-09T05:53:54.471Z +https://www.material-react-table.com/blog/the-best-react-data-grid-table-libraries-with-material-design-in-20232024-02-09T05:53:54.471Z +https://www.material-react-table.com/changelog2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/cell-instance-apis2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/column-instance-apis2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/column-options2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/mrt-components2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/mrt-hooks2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/row-instance-apis2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/state-options2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/table-instance-apis2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/api/table-options2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/advanced2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/aggregation-and-grouping2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/basic2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/chart-detail-panel2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/column-grouping2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/column-ordering2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/column-pinning2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/column-virtualization2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/custom-filter-ui2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/custom-headless2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/customized-grouping2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/detail-panel2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/dynamic-columns2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/editing-crud2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/editing-crud-inline-cell2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/editing-crud-inline-row2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/editing-crud-inline-table2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/editing-crud-tree2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/expanding-tree2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/expanding-tree-flat-parse2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/export-csv2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/export-pdf2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/faceted-values2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/filter-switching2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/filter-variants2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/infinite-scrolling2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/lazy-detail-panel2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/lazy-sub-rows2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/minimal2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/popover-filters2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/react-query2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/remote2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/row-dragging2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/row-ordering2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/row-virtualization2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/static-row-pinning2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/sticky-header2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/sticky-row-pinning2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/sticky-row-selection2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/examples/virtualized2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/getting-started2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/getting-started/install2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/getting-started/migrating-to-v22024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/getting-started/usage2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/aggregation2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/async-loading2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/best-practices2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/cell-actions2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/click-to-copy2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-actions2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-filtering2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-grouping2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-hiding2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-ordering-dnd2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-pinning2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-resizing2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/column-size2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/customize-components2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/customize-icons2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/data-columns2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/density-toggle2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/detail-panel2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/display-columns2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/editing2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/expanding-sub-rows2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/full-screen-toggle2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/global-filtering2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/localization2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/memoization2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/pagination2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/row-actions2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/row-numbers2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/row-ordering-dnd2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/row-pinning2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/row-selection2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/sorting2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/state-management2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/sticky-header2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/table-event-listeners2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/toolbar-customization2024-02-09T05:53:54.471Z +https://www.material-react-table.com/docs/guides/virtualization2024-02-09T05:53:54.471Z +https://www.material-react-table.com/roadmap2024-02-09T05:53:54.471Z \ No newline at end of file diff --git a/packages/material-react-table/package.json b/packages/material-react-table/package.json index 31b573fec..ce70c12ed 100644 --- a/packages/material-react-table/package.json +++ b/packages/material-react-table/package.json @@ -1,5 +1,5 @@ { - "version": "2.11.1", + "version": "2.11.2", "license": "MIT", "name": "material-react-table", "description": "A fully featured Material UI V5 implementation of TanStack React Table V8, written from the ground up in TypeScript.", diff --git a/packages/material-react-table/src/components/body/MRT_TableBody.tsx b/packages/material-react-table/src/components/body/MRT_TableBody.tsx index 8011a9b7f..1f6edae72 100644 --- a/packages/material-react-table/src/components/body/MRT_TableBody.tsx +++ b/packages/material-react-table/src/components/body/MRT_TableBody.tsx @@ -64,7 +64,7 @@ export const MRT_TableBody = ({ .map((r) => r.id); }, [rowPinning, getRowModel().rows]); - const rows = useMRT_Rows(table, pinnedRowIds); + const rows = useMRT_Rows(table); const rowVirtualizer = useMRT_RowVirtualizer(table, rows); diff --git a/packages/material-react-table/src/components/inputs/MRT_SelectCheckbox.tsx b/packages/material-react-table/src/components/inputs/MRT_SelectCheckbox.tsx index b1eda34cb..1683abd7c 100644 --- a/packages/material-react-table/src/components/inputs/MRT_SelectCheckbox.tsx +++ b/packages/material-react-table/src/components/inputs/MRT_SelectCheckbox.tsx @@ -1,4 +1,4 @@ -import { type ChangeEvent, type MouseEvent } from 'react'; +import { type MouseEvent } from 'react'; import Checkbox, { type CheckboxProps } from '@mui/material/Checkbox'; import Radio, { type RadioProps } from '@mui/material/Radio'; import Tooltip from '@mui/material/Tooltip'; @@ -11,6 +11,7 @@ import { import { getIsRowSelected, getMRT_RowSelectionHandler, + getMRT_SelectAllHandler, } from '../../utils/row.utils'; import { getCommonTooltipProps } from '../../utils/style.utils'; import { parseFromValuesOrFunc } from '../../utils/utils'; @@ -32,22 +33,16 @@ export const MRT_SelectCheckbox = ({ getState, options: { enableMultiRowSelection, - enableRowPinning, localization, muiSelectAllCheckboxProps, muiSelectCheckboxProps, - rowPinningDisplayMode, selectAllMode, }, - refs: { lastSelectedRowId }, } = table; const { density, isLoading } = getState(); const selectAll = !row; - const isStickySelection = - enableRowPinning && rowPinningDisplayMode?.includes('select'); - const allRowsSelected = selectAll ? selectAllMode === 'page' ? table.getIsAllPageRowsSelected() @@ -68,17 +63,15 @@ export const MRT_SelectCheckbox = ({ ...rest, }; - const onSelectionChange = getMRT_RowSelectionHandler(); + const onSelectionChange = row + ? getMRT_RowSelectionHandler({ + row, + staticRowIndex, + table, + }) + : undefined; - const onSelectAllChange = (event: ChangeEvent) => { - selectAllMode === 'all' - ? table.getToggleAllRowsSelectedHandler()(event) - : table.getToggleAllPageRowsSelectedHandler()(event); - if (isStickySelection) { - table.setRowPinning({ bottom: [], top: [] }); - } - lastSelectedRowId.current = null; - }; + const onSelectAllChange = getMRT_SelectAllHandler({ table }); const commonProps = { 'aria-label': selectAll @@ -94,9 +87,7 @@ export const MRT_SelectCheckbox = ({ }, onChange: (event) => { event.stopPropagation(); - row - ? onSelectionChange({ event, row, staticRowIndex, table }) - : onSelectAllChange(event); + row ? onSelectionChange!(event) : onSelectAllChange(event); }, size: (density === 'compact' ? 'small' : 'medium') as 'medium' | 'small', ...checkboxProps, diff --git a/packages/material-react-table/src/components/toolbar/MRT_ToolbarAlertBanner.tsx b/packages/material-react-table/src/components/toolbar/MRT_ToolbarAlertBanner.tsx index 700ded570..806d523de 100644 --- a/packages/material-react-table/src/components/toolbar/MRT_ToolbarAlertBanner.tsx +++ b/packages/material-react-table/src/components/toolbar/MRT_ToolbarAlertBanner.tsx @@ -7,6 +7,7 @@ import Chip from '@mui/material/Chip'; import Collapse from '@mui/material/Collapse'; import Stack from '@mui/material/Stack'; import { type MRT_RowData, type MRT_TableInstance } from '../../types'; +import { getMRT_SelectAllHandler } from '../../utils/row.utils'; import { parseFromValuesOrFunc } from '../../utils/utils'; import { MRT_SelectCheckbox } from '../inputs/MRT_SelectCheckbox'; @@ -36,7 +37,7 @@ export const MRT_ToolbarAlertBanner = ({ renderToolbarAlertBannerContent, rowCount, }, - refs: { lastSelectedRowId, tablePaperRef }, + refs: { tablePaperRef }, } = table; const { density, grouping, rowSelection, showAlertBanner } = getState(); @@ -51,7 +52,7 @@ export const MRT_ToolbarAlertBanner = ({ table, }); - const totalRowCount = rowCount ?? getPrePaginationRowModel().rows.length; + const totalRowCount = rowCount ?? getPrePaginationRowModel().flatRows.length; const selectedRowCount = useMemo( () => @@ -67,10 +68,7 @@ export const MRT_ToolbarAlertBanner = ({ ?.replace('{selectedCount}', selectedRowCount.toLocaleString()) ?.replace('{rowCount}', totalRowCount.toString())}