Merge pull request #613 from icflorescu/next

Update changelog & release new version

CHANGELOG.md

@@ -3,6 +3,11 @@
 The following is a list of notable changes to the Mantine DataTable component.  
 Minor versions that are not listed in the changelog are bug fixes and small improvements.
 
+## 7.11.1 (2024-06-30)
+
+- Add new `paginationWithControls` prop (thanks to [@ValentinJS](https://github.com/ValentinJS) for PR [#611](https://github.com/icflorescu/mantine-datatable/pull/611))
+- Minor docs website improvements
+
 ## 7.11.0 (2024-06-30)
 
 - Attempt to fix issue [#596](https://github.com/icflorescu/mantine-datatable/issues/596) again, thanks to [@gfazioli](https://github.com/gfazioli) for PR [#608](https://github.com/icflorescu/mantine-datatable/pull/608)

README.md

@@ -140,7 +140,7 @@ Mantine DataTable works perfectly with [Mantine Context Menu](https://icflorescu
 
 ## Contributing
 
-See the [contributing guide in the documentation website](https://icflorescu.github.io/mantine-datatable/contribute-and-support) or the repo [CONTRIBUTING.md](https://github.com/icflorescu/mantine-datatable/blob/master/CONTRIBUTING.md) file for details.
+See the [contributing guide in the documentation website](https://icflorescu.github.io/mantine-datatable/contribute-and-support) or the repo [CONTRIBUTING.md](https://github.com/icflorescu/mantine-datatable/blob/master/CONTRIBUTING.md) file for details. **Most importantly, remember to make your PRs against the `next` branch.**
 
 Here's the list of people who have already contributed to Mantine DataTable:
 

app/contribute-and-support/page.tsx

@@ -37,8 +37,8 @@ export default function ContributeAndSupportPage() {
         <li>
           I think <ExternalLink to={MANTINE_LINK}>Mantine</ExternalLink> is currently the best React UI Framework;
           however people were{' '}
-          <ExternalLink to="https://github.com/mantinedev/mantine/discussions/1049">asking</ExternalLink> in the
-          community for a ContextMenu component;
+          <ExternalLink to="https://github.com/mantinedev/mantine/discussions/1057">asking</ExternalLink> in the
+          community for a data-table / data-grid component;
         </li>
         <li>
           I’m a keen advocate of open-source and{' '}
@@ -49,7 +49,7 @@ export default function ContributeAndSupportPage() {
       </ul>
       <PageSubtitle value="Please sponsor my work" />
       <Txt>
-        I built these projects out of passion, but the constant effort of spending so many hours on open-source
+        I’m building these projects out of passion, but the constant effort of spending so many hours on open-source
         development and maintenance takes its toll, and passion alone doesn’t pay the bills. So, if you find{' '}
         {PRODUCT_NAME} useful and you want to support its future development, please consider{' '}
         <ExternalLink to="https://github.com/sponsors/icflorescu">sponsoring my work</ExternalLink> ❤️.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mantine-datatable",
-  "version": "7.11.0",
+  "version": "7.11.1",
   "description": "The lightweight, dependency-free, dark-theme aware table component for your Mantine UI data-rich applications, featuring asynchronous data loading support, pagination, intuitive Gmail-style additive batch rows selection, column sorting, custom cell data rendering, row expansion, nesting, context menus, and much more",
   "keywords": [
     "mantine",

package/DataTable.tsx

@@ -63,6 +63,7 @@ export function DataTable<T>({
   recordsPerPageOptions,
   recordsPerPageLabel = 'Records per page',
   paginationWithEdges,
+  paginationWithControls,
   paginationActiveTextColor,
   paginationActiveBackgroundColor,
   paginationSize = 'sm',
@@ -459,6 +460,7 @@ export function DataTable<T>({
             recordsPerPageOptions={recordsPerPageOptions}
             recordsPerPageLabel={recordsPerPageLabel}
             paginationWithEdges={paginationWithEdges}
+            paginationWithControls={paginationWithControls}
             paginationActiveTextColor={paginationActiveTextColor}
             paginationActiveBackgroundColor={paginationActiveBackgroundColor}
             paginationSize={paginationSize}

package/DataTablePagination.tsx

@@ -30,6 +30,7 @@ export const DataTablePagination = forwardRef(function DataTablePagination(
     page,
     onPageChange,
     paginationWithEdges,
+    paginationWithControls,
     paginationActiveTextColor,
     paginationActiveBackgroundColor,
     paginationSize,
@@ -104,6 +105,7 @@ export const DataTablePagination = forwardRef(function DataTablePagination(
             : undefined
         }
         withEdges={paginationWithEdges}
+        withControls={paginationWithControls}
         value={page}
         onChange={onPageChange}
         size={paginationSize}

package/types/DataTablePaginationProps.ts

@@ -4,6 +4,7 @@ import type { DataTablePageSizeSelectorProps } from './DataTablePageSizeSelector
 export type DataTablePaginationProps = (
   | {
       paginationWithEdges?: never;
+      paginationWithControls?: never;
       page?: never;
       onPageChange?: never;
       totalRecords?: never;
@@ -18,10 +19,15 @@ export type DataTablePaginationProps = (
     }
   | {
       /**
-       * Whenther to show first and last page navigation buttons.
+       * Whether to show first and last page navigation buttons.
        */
       paginationWithEdges?: boolean;
 
+      /**
+       * Whether to show next and previous page navigation buttons.
+       */
+      paginationWithControls?: boolean;
+
       /**
        * Current page number (1-based).
        * If provided, a pagination component is shown.