SSR for Dialog (no unmount)

[alexanderbluhm]

Since I have some SEO relevant parts in my sidebar menu I would like it to be statically generated (Gatsby).
So, I just want a slide-in with focus, keyboard support etc. However, it shouldn't be unmounted but just slided out.
I tried to utilize forceMount but I run into issues with it.
Here is a minimal reproduction: https://codesandbox.io/s/peaceful-ishizaka-6dhihg?file=/src/App.js:0-904

It works fine but when I focus on the close button and hit "Enter", the focus is trapped inside the closed Dialog.
In addition, it seems that the Dialog is not statically generated by Gatsby and I am not sure why.

Can anyone help here?
Thanks in advance.

(I am using React 17 and version 0.1.7 of the Radix Dialog.

[benoitgrelard]

Hey @alexanderbluhm,

forceMount is intended for use with JS animation library to control the mounting state, but the expectation is still that it would be unmounted. Hence why you can't use it in the way you want.

There are other discussions where we've started talking about supporting some lazy mounting options for more components:

• [Accordion][Collapsible][Tabs][…] Consider adding an option to control how Content is mounted/unmounted over time/activation cycle #1155
• Proposal | Don't mount Tab content unless tab is active - add mountMode prop #855

[alexanderbluhm]

Thanks!