chore: upgrade react-aria / React 19 & Next.js 15 support (#3732)

* chore: upgrade react-aria * chore: add changeset * chore: fix type error --------- Co-authored-by: Junior Garcia <[email protected]>
heroui-inc · Nov 4, 2024 · 67ea2f6 · 67ea2f6
1 parent 2d6ae74
commit 67ea2f6
Show file tree

Hide file tree

Showing 59 changed files with 1,640 additions and 1,400 deletions.
diff --git a/.changeset/few-jars-flow.md b/.changeset/few-jars-flow.md
@@ -0,0 +1,53 @@
+---
+"@nextui-org/table": minor
+"@nextui-org/accordion": patch
+"@nextui-org/autocomplete": patch
+"@nextui-org/avatar": patch
+"@nextui-org/breadcrumbs": patch
+"@nextui-org/button": patch
+"@nextui-org/calendar": patch
+"@nextui-org/card": patch
+"@nextui-org/checkbox": patch
+"@nextui-org/chip": patch
+"@nextui-org/date-input": patch
+"@nextui-org/date-picker": patch
+"@nextui-org/divider": patch
+"@nextui-org/dropdown": patch
+"@nextui-org/input": patch
+"@nextui-org/kbd": patch
+"@nextui-org/link": patch
+"@nextui-org/listbox": patch
+"@nextui-org/menu": patch
+"@nextui-org/modal": patch
+"@nextui-org/navbar": patch
+"@nextui-org/pagination": patch
+"@nextui-org/popover": patch
+"@nextui-org/progress": patch
+"@nextui-org/radio": patch
+"@nextui-org/select": patch
+"@nextui-org/slider": patch
+"@nextui-org/snippet": patch
+"@nextui-org/switch": patch
+"@nextui-org/tabs": patch
+"@nextui-org/tooltip": patch
+"@nextui-org/user": patch
+"@nextui-org/react": patch
+"@nextui-org/system": patch
+"@nextui-org/system-rsc": patch
+"@nextui-org/use-aria-accordion": patch
+"@nextui-org/use-aria-accordion-item": patch
+"@nextui-org/use-aria-button": patch
+"@nextui-org/use-aria-link": patch
+"@nextui-org/use-aria-menu": patch
+"@nextui-org/use-aria-modal-overlay": patch
+"@nextui-org/use-aria-multiselect": patch
+"@nextui-org/use-aria-overlay": patch
+"@nextui-org/use-aria-toggle-button": patch
+"@nextui-org/use-disclosure": patch
+"@nextui-org/use-intersection-observer": patch
+"@nextui-org/use-is-mobile": patch
+"@nextui-org/use-pagination": patch
+"@nextui-org/aria-utils": patch
+---
+
+update react-aria version
diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -18,7 +18,7 @@
     "@codesandbox/sandpack-react": "^2.6.4",
     "@iconify/icons-solar": "^1.2.3",
     "@iconify/react": "^4.1.1",
-    "@internationalized/date": "^3.5.4",
+    "@internationalized/date": "3.5.5",
     "@mapbox/rehype-prism": "^0.6.0",
     "@nextui-org/aria-utils": "workspace:*",
     "@nextui-org/badge": "workspace:*",
@@ -99,7 +99,7 @@
     "@docusaurus/utils": "2.0.0-beta.3",
     "@next/bundle-analyzer": "^13.4.6",
     "@next/env": "^13.4.12",
-    "@react-types/shared": "3.23.1",
+    "@react-types/shared": "3.24.1",
     "@tailwindcss/typography": "^0.5.9",
     "@types/canvas-confetti": "^1.4.2",
     "@types/lodash": "^4.14.194",

diff --git a/package.json b/package.json
@@ -68,7 +68,7 @@
     "@commitlint/config-conventional": "^17.2.0",
     "@react-bootstrap/babel-preset": "^2.1.0",
     "@react-types/link": "^3.4.4",
-    "@react-types/shared": "3.23.1",
+    "@react-types/shared": "3.24.1",
     "@storybook/react": "^7.4.6",
     "@swc/core": "^1.3.35",
     "@swc/jest": "^0.2.24",

diff --git a/packages/components/accordion/package.json b/packages/components/accordion/package.json
@@ -54,13 +54,13 @@
     "@nextui-org/framer-utils": "workspace:*",
     "@nextui-org/divider": "workspace:*",
     "@nextui-org/use-aria-accordion": "workspace:*",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/utils": "3.24.1",
-    "@react-stately/tree": "3.8.1",
-    "@react-aria/button": "3.9.5",
-    "@react-types/accordion": "3.0.0-alpha.21",
-    "@react-types/shared": "3.23.1"
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-stately/tree": "3.8.4",
+    "@react-aria/button": "3.9.8",
+    "@react-types/accordion": "3.0.0-alpha.23",
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",

diff --git a/packages/components/autocomplete/package.json b/packages/components/autocomplete/package.json
@@ -53,15 +53,15 @@
     "@nextui-org/spinner": "workspace:*",
     "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/use-safe-layout-effect": "workspace:*",
-    "@react-aria/combobox": "3.9.1",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/i18n": "3.11.1",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/utils": "3.24.1",
-    "@react-aria/visually-hidden": "3.8.12",
-    "@react-stately/combobox": "3.8.4",
-    "@react-types/combobox": "3.11.1",
-    "@react-types/shared": "3.23.1"
+    "@react-aria/combobox": "3.10.3",
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/i18n": "3.12.2",
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-aria/visually-hidden": "3.8.15",
+    "@react-stately/combobox": "3.9.2",
+    "@react-types/combobox": "3.12.1",
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/avatar": "workspace:*",
@@ -70,7 +70,7 @@
     "@nextui-org/system": "workspace:*",
     "@nextui-org/theme": "workspace:*",
     "@nextui-org/use-infinite-scroll": "workspace:*",
-    "@react-stately/data": "3.11.4",
+    "@react-stately/data": "3.11.6",
     "clean-package": "2.2.0",
     "framer-motion": "^11.0.28",
     "react": "^18.0.0",

diff --git a/packages/components/avatar/package.json b/packages/components/avatar/package.json
@@ -43,9 +43,9 @@
     "@nextui-org/shared-utils": "workspace:*",
     "@nextui-org/react-utils": "workspace:*",
     "@nextui-org/use-image": "workspace:*",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/utils": "3.24.1"
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/utils": "3.25.2"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",

diff --git a/packages/components/breadcrumbs/package.json b/packages/components/breadcrumbs/package.json
@@ -43,11 +43,11 @@
     "@nextui-org/react-utils": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
     "@nextui-org/shared-icons": "workspace:*",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/breadcrumbs": "3.5.13",
-    "@react-aria/utils": "3.24.1",
-    "@react-types/breadcrumbs": "3.7.5",
-    "@react-types/shared": "3.23.1"
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/breadcrumbs": "3.5.16",
+    "@react-aria/utils": "3.25.2",
+    "@react-types/breadcrumbs": "3.7.7",
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",

diff --git a/packages/components/button/package.json b/packages/components/button/package.json
@@ -46,12 +46,12 @@
     "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/ripple": "workspace:*",
     "@nextui-org/spinner": "workspace:*",
-    "@react-aria/button": "3.9.5",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/utils": "3.24.1",
-    "@react-aria/focus": "3.17.1",
-    "@react-types/shared": "3.23.1",
-    "@react-types/button": "3.9.4"
+    "@react-aria/button": "3.9.8",
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-aria/focus": "3.18.2",
+    "@react-types/shared": "3.24.1",
+    "@react-types/button": "3.9.6"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",

diff --git a/packages/components/calendar/package.json b/packages/components/calendar/package.json
@@ -47,18 +47,18 @@
     "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/button": "workspace:*",
     "lodash.debounce": "^4.0.8",
-    "@internationalized/date": "^3.5.4",
-    "@react-aria/calendar": "3.5.8",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/i18n": "3.11.1",
-    "@react-stately/calendar": "3.5.1",
-    "@react-types/button": "3.9.4",
-    "@react-aria/visually-hidden": "3.8.12",
-    "@react-aria/utils": "3.24.1",
-    "@react-stately/utils": "3.10.1",
-    "@react-types/calendar": "3.4.6",
-    "@react-aria/interactions": "3.21.3",
-    "@react-types/shared": "3.23.1",
+    "@internationalized/date": "3.5.5",
+    "@react-aria/calendar": "3.5.11",
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/i18n": "3.12.2",
+    "@react-stately/calendar": "3.5.4",
+    "@react-types/button": "3.9.6",
+    "@react-aria/visually-hidden": "3.8.15",
+    "@react-aria/utils": "3.25.2",
+    "@react-stately/utils": "3.10.3",
+    "@react-types/calendar": "3.4.9",
+    "@react-aria/interactions": "3.22.2",
+    "@react-types/shared": "3.24.1",
     "scroll-into-view-if-needed": "3.0.10",
     "@types/lodash.debounce": "^4.0.7"
   },

diff --git a/packages/components/calendar/src/calendar-cell.tsx b/packages/components/calendar/src/calendar-cell.tsx
@@ -49,9 +49,9 @@ export function CalendarCell(originalProps: CalendarCellProps) {
     !isDisabled && !isInvalid && state.isCellUnavailable(props.date.subtract({days: 1}));
   const highlightedRange = "highlightedRange" in state && state.highlightedRange;
   const isSelectionStart =
-    isSelected && highlightedRange && isSameDay(props.date, highlightedRange.start);
+    isSelected && highlightedRange ? isSameDay(props.date, highlightedRange.start) : false;
   const isSelectionEnd =
-    isSelected && highlightedRange && isSameDay(props.date, highlightedRange.end);
+    isSelected && highlightedRange ? isSameDay(props.date, highlightedRange.end) : false;
   const {locale} = useLocale();
   const dayOfWeek = getDayOfWeek(props.date, locale);
   const isRangeStart =

diff --git a/packages/components/calendar/src/utils.ts b/packages/components/calendar/src/utils.ts
@@ -1,6 +1,6 @@
 import {DateValue, startOfYear} from "@internationalized/date";
 
-export function getYearRange(start?: DateValue, end?: DateValue): DateValue[] {
+export function getYearRange(start?: DateValue | null, end?: DateValue | null): DateValue[] {
   const years: DateValue[] = [];
 
   if (!start || !end) {

diff --git a/packages/components/card/package.json b/packages/components/card/package.json
@@ -45,11 +45,11 @@
     "@nextui-org/react-utils": "workspace:*",
     "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/ripple": "workspace:*",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/utils": "3.24.1",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/button": "3.9.5",
-    "@react-types/shared": "3.23.1"
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/button": "3.9.8",
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",

diff --git a/packages/components/checkbox/package.json b/packages/components/checkbox/package.json
@@ -44,15 +44,15 @@
     "@nextui-org/shared-utils": "workspace:*",
     "@nextui-org/use-callback-ref": "workspace:*",
     "@nextui-org/use-safe-layout-effect": "workspace:*",
-    "@react-aria/checkbox": "3.14.3",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/utils": "3.24.1",
-    "@react-aria/visually-hidden": "3.8.12",
-    "@react-stately/checkbox": "3.6.5",
-    "@react-stately/toggle": "3.7.4",
-    "@react-types/checkbox": "3.8.1",
-    "@react-types/shared": "3.23.1"
+    "@react-aria/checkbox": "3.14.6",
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-aria/visually-hidden": "3.8.15",
+    "@react-stately/checkbox": "3.6.8",
+    "@react-stately/toggle": "3.7.7",
+    "@react-types/checkbox": "3.8.3",
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/chip": "workspace:*",

diff --git a/packages/components/chip/package.json b/packages/components/chip/package.json
@@ -43,10 +43,10 @@
     "@nextui-org/shared-icons": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
     "@nextui-org/react-utils": "workspace:*",
-    "@react-aria/focus": "3.17.1",
-    "@react-aria/interactions": "3.21.3",
-    "@react-aria/utils": "3.24.1",
-    "@react-types/checkbox": "3.8.1"
+    "@react-aria/focus": "3.18.2",
+    "@react-aria/interactions": "3.22.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-types/checkbox": "3.8.3"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",

diff --git a/packages/components/date-input/package.json b/packages/components/date-input/package.json
@@ -42,13 +42,13 @@
   "dependencies": {
     "@nextui-org/react-utils": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
-    "@internationalized/date": "^3.5.4",
-    "@react-aria/datepicker": "3.10.1",
-    "@react-aria/i18n": "3.11.1",
-    "@react-stately/datepicker": "3.9.4",
-    "@react-types/datepicker": "3.7.4",
-    "@react-types/shared": "3.23.1",
-    "@react-aria/utils": "3.24.1"
+    "@internationalized/date": "3.5.5",
+    "@react-aria/datepicker": "3.11.2",
+    "@react-aria/i18n": "3.12.2",
+    "@react-stately/datepicker": "3.10.2",
+    "@react-types/datepicker": "3.8.2",
+    "@react-types/shared": "3.24.1",
+    "@react-aria/utils": "3.25.2"
   },
   "devDependencies": {
     "@nextui-org/system": "workspace:*",

diff --git a/packages/components/date-input/src/date-input-segment.tsx b/packages/components/date-input/src/date-input-segment.tsx
@@ -22,14 +22,8 @@ export const DateInputSegment: React.FC<DateInputSegmentProps> = ({
   ...otherProps
 }) => {
   const ref = useRef(null);
-
   let {segmentProps} = useDateSegment(segment, state, ref);
 
-  // @ts-expect-error autoCapitalize is not a valid prop
-  // Removing autoCapitalize as it causes bugs in Firefox.
-  // See: https://github.com/adobe/react-spectrum/issues/5599
-  delete segmentProps.autoCapitalize;
-
   return (
     <div
       {...mergeProps(segmentProps, otherProps)}

diff --git a/packages/components/date-input/src/use-date-input.ts b/packages/components/date-input/src/use-date-input.ts
@@ -1,7 +1,8 @@
 import type {DateInputVariantProps, DateInputSlots, SlotsToClasses} from "@nextui-org/theme";
 import type {AriaDateFieldProps} from "@react-types/datepicker";
 import type {SupportedCalendars} from "@nextui-org/system";
-import type {DateValue, Calendar} from "@internationalized/date";
+import type {DateValue} from "@react-types/datepicker";
+import type {Calendar} from "@internationalized/date";
 import type {ReactRef} from "@nextui-org/react-utils";
 import type {DOMAttributes, GroupDOMAttributes} from "@react-types/shared";
 import type {DateInputGroupProps} from "./date-input-group";

diff --git a/packages/components/date-picker/package.json b/packages/components/date-picker/package.json
@@ -40,7 +40,7 @@
     "react-dom": ">=18"
   },
   "dependencies": {
-    "@internationalized/date": "^3.5.4",
+    "@internationalized/date": "3.5.5",
     "@nextui-org/aria-utils": "workspace:*",
     "@nextui-org/button": "workspace:*",
     "@nextui-org/calendar": "workspace:*",
@@ -49,14 +49,14 @@
     "@nextui-org/react-utils": "workspace:*",
     "@nextui-org/shared-icons": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
-    "@react-aria/datepicker": "3.10.1",
-    "@react-aria/i18n": "3.11.1",
-    "@react-aria/utils": "3.24.1",
-    "@react-stately/datepicker": "3.9.4",
-    "@react-stately/overlays": "3.6.7",
-    "@react-stately/utils": "3.10.1",
-    "@react-types/datepicker": "3.7.4",
-    "@react-types/shared": "3.23.1"
+    "@react-aria/datepicker": "3.11.2",
+    "@react-aria/i18n": "3.12.2",
+    "@react-aria/utils": "3.25.2",
+    "@react-stately/datepicker": "3.10.2",
+    "@react-stately/overlays": "3.6.10",
+    "@react-stately/utils": "3.10.3",
+    "@react-types/datepicker": "3.8.2",
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/radio": "workspace:*",
@@ -68,4 +68,4 @@
     "react-dom": "^18.0.0"
   },
   "clean-package": "../../../clean-package.config.json"
-}
+}
diff --git a/packages/components/divider/package.json b/packages/components/divider/package.json
@@ -42,7 +42,7 @@
     "@nextui-org/shared-utils": "workspace:*",
     "@nextui-org/react-rsc-utils": "workspace:*",
     "@nextui-org/system-rsc": "workspace:*",
-    "@react-types/shared": "3.23.1"
+    "@react-types/shared": "3.24.1"
   },
   "devDependencies": {
     "@nextui-org/theme": "workspace:*",