@availity/mui-pagination 0.4.1 → 1.0.0-alpha.0

package/CHANGELOG.md

@@ -2,6 +2,27 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [1.0.0-alpha.0](https://github.com/Availity/element/compare/@availity/mui-pagination@0.4.2...@availity/mui-pagination@1.0.0-alpha.0) (2025-02-24)
+
+
+### ⚠ BREAKING CHANGES
+
+* upgraded to @mui/material v6
+* **element:** upgraded to @mui/material v6
+
+### Features
+
+* **element:** upgrade to @mui/material v6 ([cb958bb](https://github.com/Availity/element/commit/cb958bba99a4f1ee6dab323f0ff54b69e6fd3493))
+* upgrade @mui/material ([571453a](https://github.com/Availity/element/commit/571453a34b21c344594ab4c03bc497d19aba942b))
+* upgrade to MUI v6 ([7febd6f](https://github.com/Availity/element/commit/7febd6fd4fd58e87e1c97a832cea3b4595a35d58))
+
+## [0.4.2](https://github.com/Availity/element/compare/@availity/mui-pagination@0.4.1...@availity/mui-pagination@0.4.2) (2025-02-24)
+
+
+### Bug Fixes
+
+* **mui-pagination:** add react-query peer dependency ([39ae736](https://github.com/Availity/element/commit/39ae736a8a9a2a9529691f4edb841f2c774262c7))
+
 ## [0.4.1](https://github.com/Availity/element/compare/@availity/mui-pagination@0.4.0...@availity/mui-pagination@0.4.1) (2025-02-06)
 
 

package/dist/index.js

@@ -45,12 +45,12 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   Pagination: () => Pagination,
   PaginationItem: () => PaginationItem
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 
 // src/lib/Pagination.tsx
 var import_Pagination = __toESM(require("@mui/material/Pagination"));
@@ -84,8 +84,7 @@ var PaginationItem = (props) => {
 // src/lib/Pagination.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var getItemAriaLabel = (type, page) => {
-  if (type === "page")
-    return `Go to page ${page}`;
+  if (type === "page") return `Go to page ${page}`;
   return `Go to ${type} page`;
 };
 var Pagination = (props) => {

package/dist/index.mjs

@@ -52,8 +52,7 @@ var PaginationItem = (props) => {
 // src/lib/Pagination.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
 var getItemAriaLabel = (type, page) => {
-  if (type === "page")
-    return `Go to page ${page}`;
+  if (type === "page") return `Go to page ${page}`;
   return `Go to ${type} page`;
 };
 var Pagination = (props) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/mui-pagination",
-  "version": "0.4.1",
+  "version": "1.0.0-alpha.0",
   "description": "Availity MUI Pagination Component - part of the @availity/element design system",
   "keywords": [
     "react",
@@ -40,18 +40,25 @@
     "publish:canary": "yarn npm publish --access public --tag canary"
   },
   "devDependencies": {
-    "@availity/mui-icon": "0.14.0",
-    "@mui/material": "^5.15.15",
+    "@availity/mui-icon": "1.0.0-alpha.0",
+    "@mui/material": "^6.4.5",
+    "@tanstack/react-query": "^4.36.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "tsup": "^8.0.2",
+    "tsup": "^8.3.6",
     "typescript": "^5.4.5"
   },
   "peerDependencies": {
-    "@availity/mui-icon": "0.14.0",
-    "@mui/material": "^5.11.9",
+    "@availity/mui-icon": "1.0.0-alpha.0",
+    "@mui/material": "^6.4.5",
+    "@tanstack/react-query": "^4.36.1",
     "react": ">=16.3.0"
   },
+  "peerDependenciesMeta": {
+    "@tanstack/react-query": {
+      "optional": true
+    }
+  },
   "publishConfig": {
     "access": "public"
   }

package/src/lib/Pagination.stories.tsx

@@ -1,7 +1,7 @@
 // Each exported component in the package should have its own stories file
 
 import type { Meta, StoryObj } from '@storybook/react';
-import Grid from '@mui/material/Grid';
+import { Grid } from '@availity/mui-layout';
 import { Pagination, PaginationProps } from './Pagination';
 
 const meta: Meta<typeof Pagination> = {
@@ -22,16 +22,12 @@ export const _Pagination: StoryObj<typeof Pagination> = {
 export const _Variants: StoryObj<typeof Pagination> = {
   render: () => (
     <Grid container spacing={1}>
-      <Grid item xs={2}>
-        Text
-      </Grid>
-      <Grid item xs={10}>
+      <Grid size={{ xs: 2 }}>Text</Grid>
+      <Grid size={{ xs: 10 }}>
         <Pagination variant="text" count={10} aria-label="text pagination" />
       </Grid>
-      <Grid item xs={2}>
-        Outlined
-      </Grid>
-      <Grid item xs={10}>
+      <Grid size={{ xs: 2 }}>Outlined</Grid>
+      <Grid size={{ xs: 10 }}>
         <Pagination variant="outlined" count={10} aria-label="outlined pagination" />
       </Grid>
     </Grid>
@@ -41,10 +37,8 @@ export const _Variants: StoryObj<typeof Pagination> = {
 export const _FirstLast: StoryObj<typeof Pagination> = {
   render: () => (
     <Grid container spacing={1}>
-      <Grid item xs={2}>
-        Text
-      </Grid>
-      <Grid item xs={10}>
+      <Grid size={{ xs: 2 }}>Text</Grid>
+      <Grid size={{ xs: 10 }}>
         <Pagination
           variant="text"
           aria-label="text pagination"
@@ -56,10 +50,8 @@ export const _FirstLast: StoryObj<typeof Pagination> = {
           showLastButton
         />
       </Grid>
-      <Grid item xs={2}>
-        Outlined
-      </Grid>
-      <Grid item xs={10}>
+      <Grid size={{ xs: 2 }}>Outlined</Grid>
+      <Grid size={{ xs: 10 }}>
         <Pagination
           variant="outlined"
           aria-label="outlined pagination"

package/src/lib/PaginationItem.stories.tsx

@@ -1,7 +1,7 @@
 // Each exported component in the package should have its own stories file
 
 import type { Meta, StoryObj } from '@storybook/react';
-import Grid from '@mui/material/Grid';
+import { Grid } from '@availity/mui-layout';
 import { PaginationItem, PaginationItemProps } from './PaginationItem';
 
 const meta: Meta<typeof PaginationItem> = {
@@ -22,46 +22,42 @@ export const _PaginationItem: StoryObj<typeof PaginationItem> = {
 export const _Types: StoryObj<typeof PaginationItem> = {
   render: () => (
     <Grid container spacing={1}>
-      <Grid item xs={3}>
-        Text
-      </Grid>
-      <Grid item xs={9}>
-        Outlined
-      </Grid>
-      <Grid item xs={3}>
+      <Grid size={{ xs: 3 }}>Text</Grid>
+      <Grid size={{ xs: 9 }}>Outlined</Grid>
+      <Grid size={{ xs: 3 }}>
         <PaginationItem variant="text" type="page" page="1" selected />
       </Grid>
-      <Grid item xs={9}>
+      <Grid size={{ xs: 9 }}>
         <PaginationItem variant="outlined" type="page" page="1" selected />
       </Grid>
-      <Grid item xs={3}>
+      <Grid size={{ xs: 3 }}>
         <PaginationItem variant="text" type="page" page="1" />
       </Grid>
-      <Grid item xs={9}>
+      <Grid size={{ xs: 9 }}>
         <PaginationItem variant="outlined" type="page" page="1" />
       </Grid>
-      <Grid item xs={3}>
+      <Grid size={{ xs: 3 }}>
         <PaginationItem variant="text" type="first" />
       </Grid>
-      <Grid item xs={9}>
+      <Grid size={{ xs: 9 }}>
         <PaginationItem variant="outlined" type="first" />
       </Grid>
-      <Grid item xs={3}>
+      <Grid size={{ xs: 3 }}>
         <PaginationItem variant="text" type="previous" />
       </Grid>
-      <Grid item xs={9}>
+      <Grid size={{ xs: 9 }}>
         <PaginationItem variant="outlined" type="previous" />
       </Grid>
-      <Grid item xs={3}>
+      <Grid size={{ xs: 3 }}>
         <PaginationItem variant="text" type="next" />
       </Grid>
-      <Grid item xs={9}>
+      <Grid size={{ xs: 9 }}>
         <PaginationItem variant="outlined" type="next" />
       </Grid>
-      <Grid item xs={3}>
+      <Grid size={{ xs: 3 }}>
         <PaginationItem variant="text" type="last" />
       </Grid>
-      <Grid item xs={9}>
+      <Grid size={{ xs: 9 }}>
         <PaginationItem variant="outlined" type="last" />
       </Grid>
     </Grid>

package/src/lib/ResourcePagination.tsx

@@ -57,6 +57,7 @@ const loadPage = async <TData,>({
   };
 };
 
+/** @requires `@tanstack/react-query` peer dependency */
 export const useResourcePagination = <TData,>({
   page,
   itemsPerPage,