[BUG] - Incompatibilities with newer Next.js canaries.

[jimapl]

NextUI Version

2.3.6

Describe the bug

seems nextui is not working with the newer next.js canaries.

PopoverTrigger throws

"Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, props, _owner, _store}). If you meant to render a collection of children, use an array instead."

When any variable or children is present within, even a div. Only flat string are accepted
See no issues on this topic on Github atm. But expect this will be a massive dealbreaker for many
Works in 14.2.3, breaks from canary 66

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

Install latest nextjs canary, for example. 14.3.0-canary-70.

Use a popover, tooltip or any other portal components where children are objects or components.

Expected behavior

It to work.

Screenshots or Videos

Operating System Version

Mac

Browser

Chrome

[linear]

ENG-848 [BUG] - Incompatibilities with newer Next.js canaries.

[wingkwong]

The nextjs canary version requires react 19 rc, which seems react-aria currently doesn't support yet.

[amauryfischer]

yeah it's going on :
adobe/react-spectrum#6437

[lostfutures]

react-spectrum just merged react 19 support @wingkwong

[Minisaints]

I'm also experiencing this issue on the latest RC versions. I tracked my issue down to the Dropdown. Even using the basic example Dropdown code in the docs throws it.

⨯ Internal error: Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, props, _owner, _store}). If you meant to render a collection of children, use an array instead.

"@nextui-org/react": "^2.4.2",
"next": "^15.0.0-rc.0",
"react": "^19.0.0-rc-6fb39ec9e9-20240621",

[jimmailcamp]

Yeah, only when you return a plain string it works. Any objects throws this.
also the case for tooltip/popover and any other component basicly.

[zerosoul]

any progress?

[victorkardel]

up, any progress?

[wingkwong]

This issue has been marked as on hold. Here's the reasons.

1. NextJS 15 RC is using React 19 RC. Just FYI, recently there is a heated discussion about sibling components of suspended components causing performance issue. React team is planning to hold the release until they find the good fix.
2. react-spectrum has merged the related changes to support 19 but it hasn't been GA yet. We're still waiting for the release and we're NOT using a nightly version in our production release. We may consider to have a beta version (probably would be introduced after v2.5.0) so that you may optionally use it at your own risk.
3. Please note that supporting a major version upgrade is not just like bumping the version and everything will be working fine. There's lots of things to evaluate and consider. It could potentially break lots of logics and require effort to fix them. Please be patient and eventually we will support it, when everything is ready.

I'm going to lock this conversation and will unlock it once we got some actual updates.

[wingkwong]

Currently supported in canary branch. Will target to release in 2.6.0. However, framer-motion hasn't released a stable version supporting react 19. One could override it with their alpha version.