Hey there 👋 I am a Stencil framework developer and try to add support for SSR in Next.js for Stencil components. Unfortunately Next.js has a hard time transforming a component coming from the server as Declarative Shadow DOM back into a web component. I trying to work with suppressHydrationWarning as everything just renders fine but it still throws Next.js of:

on-recoverable-error.js:28 Uncaught Error: Hydration failed because the server rendered HTML didn't match the client. As a result this tree will be regenerated on the client. This can happen if a SSR-ed Client Component used:

- ...

https://react.dev/link/hydration-mismatch

                            <>
                              <z>
                                <my-component suppressHydrationWarning={true} class="hydrated m..." first="Stencil" ...>
+                                 <template
+                                   shadowrootmode="open"
+                                   suppressHydrationWarning={true}
+                                   dangerouslySetInnerHTML={{__html:"<!--r.1-->..."}}
+                                 >
                          ...
                        ...

    at ...

You can see that suppressHydrationWarning is set in the component as well as part of the template tag but Next.js still struggles. Does anyone has clues how to workaround this?