[Meta] Server side rendering / SSR

[chandlerprall]

Issue description updated by @tkajtoch.

Summary

Server Side Rendering (SSR) isn't currently officially supported by EUI despite the effort made in the past to make it so. We know that some internal and external teams already use our components and utilities on the server side, and we want to provide official support for this feature.

We've already made some improvements in the past and fixed reported bugs related to SSR as they came, but we have yet to take the time and effort to confirm EUI is 100% SSR compatible.

Acceptance Criteria

• All EUI components should be SSR compatible
• There should be no hydration errors related to unique ID generation, DOM nesting, and others when rendering EUI components
• A documentation page should be added to guide users on how to use EUI in server-side rendered environments as well as in Next.js

Tasks

Preview Give feedback

1. [SSR] Replace htmlIdGenerator usages with useGeneratedHtmlId in all function components #7093
   good first issue task tech debt +3
2. [SSR] Implement EuiSsrProvider to provide a context for stable unique ID generation #7094
   stale-issue stale-issue-closed tech debt +3
3. [EuiSideNav] ID generation isn't server-side rendering safe #5418
   bug developer experience +2
4. ts(7016) error when trying to import icons #5305
   task typescript +2
5. [EuiText] Fix SSR issues #7079
   task +1
   
6. Update useGeneratedHtmlId to use SSR-compatible useId hook when available #7078
   +0
   

[elizabetdev]

@chandlerprall should the following issue also be tracked here? #4807

[chandlerprall]

@chandlerprall should the following issue also be tracked here? #4807

Done!

[bradennapier]

It is also erroring when you use EuiAccordion

[ghost]

v62.1.0 SSR has stopped working with the error ReferenceError: window is not defined

[acidjunk]

I see: "We expect this feature to be completed before the end of October 2023." -> Is the planning on track?

[jlove-dev]

Team - is there any update on this? I've tried integrating Elastic UI with SSR but running into a lot of issues with CSS or HTMLElement throughout the library.

[JasonStoltz]

Hello 👋 . We don't have plans to tackle this any time in the near future.

[mdefazio]

Tried digging through this some more and still running up against the lovely ReferenceError: CSS not defined.

I no longer hit the CSS error when running dev, but now only on build.

Running
react: ^18,
next: 14.0.4,
eui: ^91.2.0