Emotion Cache with React 18 renderToPipeableStream?

[tyteen4a03]

Is there an example of using the emotion cache with React 18's renderToPipeableStream? I am using Remix and would like to use React 18 features along with Chakra UI.

The existing guide on https://chakra-ui.com/getting-started/remix-guide refers only to React 17 setup.

[Andarist]

No, Emotion is currently not fully compatible with this API. We could accept a PR implementing support for this - but we are also currently waiting on new React features that are supposed to make our integration easier.

Related threads:
#2801
#2800

[Andarist]

No ETA. I've learned a little bit more about how this can be implemented lately but I still need to consider how this can fit Emotion and I need to find the time to actually implement stuff.

[joacub]

No ETA. I've learned a little bit more about how this can be implemented lately but I still need to consider how this can fit Emotion and I need to find the time to actually implement stuff.

Good, we are waiting for this as we are using emotion with MUI and this is been a big blocking issue that is not allowing us to have suspense rendering splited components.

i would appreciete any ETA aprox then we can prepare o have some idea when this can be at least compatible with Suspense in ssr.

thanks so much.

[Andarist]

My ETA is - "I have 2 young kids and often I'm drained at the end of the day, so I can't commit any ETAs for the work that I do voluntarily".

Instead of asking for ETAs you could ask how your company/team can help with what you are blocked on.

[joacub]

My ETA is - "I have 2 young kids and often I'm drained at the end of the day, so I can't commit any ETAs for the work that I do voluntarily".

Instead of asking for ETAs you could ask how your company/team can help with what you are blocked on.

I do understand you 100 percent (I also have kids) thanks for the work you does for the rest of the people. Really nice form your part, you can get in touch with me at johan@weshipyou.com and we can discuss about it. Also I can help you with it doing a pull request if you accept it.

[beast911]

@Andarist any update on this request ? We are also looking into moving to server side rendered components and use emotion. If you need more hands on this, please reach out to me at kanwar.singh@booking.com and I can provide some support

[WesleyYue]

I believe Remix has a working example for streaming with Chakra here that should be transferable to other Emotion based systems.

[leonardomgt]

Unfortunately, that example does not implement the Emotion cache, which is the subject of this thread.

[kellyrmilligan]

It seems like it does? Maybe it didn’t used to?

[leonardomgt]

Are there any updates on this issue, or are any solutions available?

[heath-freenome]

Bump! It's been over a year since this question was asked. I too would love to know how to use renderToPipeableStream() with emotion on the server as I'm doing my upgrade now