NextJS 13 support

[Comi9]

Hi, is there a roadmap for using NextUI with NextJS 13?

[codart1]

I think you just need to add 'use client'; to the top of the file where you import and use next-ui component. Given you adopt the new app folder. pages folder works just fine without modifications

[Comi9]

This is the tricky part: server-side components can render client-side components, but the other-way-around does not work. Since app/page.tsx is the new root of any new NextJS .13+ app - which is the most suitable entry point to declare any providers, this means that you either have to create a separate entry point for the NextUI provider and its depts, with the 'use-client' declaration, or convert the app/page.tsx to a client-side component (which limits nesting any other server-side components inside the root entry-point).

[jim-king-2000]

Will nextui support server-side component?

[Lzadhito]

While in the docs we use 'use client' to support React hooks, supporting server-side component should be great and doable for components that not using hooks or client side API. Creating roadmap for the issues (ex: removing Provider, react-aria overlay alternative, etc.) is the only things we needed to start :)

cc @jguddas

[jguddas]

SSC are already implemented for components that don't have client interactions.

[Lzadhito]

cmiiw, docs said that we need to implement a provider wrapper with 'use client' on top. Does that means all of our components inside the provider will be using client?

[jguddas]

You can pass server components to a client component as part of its props.

[Lzadhito]

I see. From your comment, I just know that next has composition pattern to sneak server components into client components. Thanks