Improve Remix support

I've started experimenting with using Material UI and Joy UI components with Remix and I've run into a few bugs and blockers along the way. Browsing the issues here, I see several open threads where folks are discussing the same problems I've bumped into, so I thought it might be helpful to create an umbrella issue to bring all those discussions to one centralized, up-to-date location where folks can track the progress.

Here are all of the open issues I could find—some are overlapping, others are probably pretty outdated and possibly no longer relevant but I haven't dug too deeply into each one:

Open

• #34170
• #31957
• #30359
• #31233
• #31140
• #31835
• #30922
• #38965

Problems

Here are the biggest things I see after reviewing these issues:

• Emotion doesn't play well with Remix / React 18
  • renderToPipeableStream() function doesn't work with Emotion, causing hydration issues
    • supposedly this workaround can resolve the hydration stuff but I haven't tried it yet myself, and it looks like it came before Remix v2 so I don't know if that changes things
• MUI doesn't support ES modules - https://github.com/remix-run/remix/issues/7314#issuecomment-1706998472
  • Remix uses esbuild under the hood - #31835
• as mentioned in #39641, it's not ideal to have to customize entry.client.tsx and entry.server.tsx if it can be avoided/minimized

Potential solutions

• migrate away from Emotion - WIP - #38137
• publish packages as ES modules - #30671
  • I've read that you can add serverModuleFormat: 'cjs', to remix.config.js to get around this problem, but it didn't work for me when I tried it—maybe I'm missing something

Examples and docs

There are several things we could do to improve the documentation around Remix + MUI!

• We have a nice example of Remix v2 + Material UI: #39229
• We could use a similar example for Joy UI: #39641
• Base UI + Remix example too: #36193
• It would also be really nice to have Integration guides for Remix like we do with the Next.js App Router
  • but maybe it's better to wait on "official" integration guides until we've resolved the bigger problems?

If there are any other known issues or requests to improve the DX, please share them here!

Start by reviewing the linked open issues, especially #34170, #31957, #30359, #30922, and #38965, then compare the Remix v2 example in #39229 with the entry.client.tsx, entry.server.tsx, and remix.config.js concerns described here. The issue has no single implementation target or acceptance criteria; completion would require an agreed scope for support, integration behavior, or documentation.