Tabs display the content of Tabs.Panel for SEO

[florianfranconi]

Hi, I use Tabs and everything works fine. But I noticed that only the selected Panel is displayed in the DOM, which is a problem for SEO. It would be nice to have a props to display all the Panels in the DOM and to display: none; of those that are not selected. This would allow Google's indexing robots to properly crawl all the content of the Tabs.

Uber uses a props renderAll on these Tabs to counter this problem: https://baseweb.design/components/tabs-motion#rendering-and-seo

Thanks

[RobinMalfait]

Hey!

That should already be possible by passing an unmount={false} (React) or :unmount="false" (Vue) prop to the Tab Panel component.
I will take note to add it to the docs!

[msmosavar]

Thanks! Saved me hours...
But there is nothing mentioned in the docs yet!

[andcl]

Still missing in the docs :( Lost a couple of hours until I arrived here...

[joemaffei]

Confirmed working in Vue and undocumented as of today.

[joemaffei]

@RobinMalfait Is it possible to make contributions to the documentation?

[Minho-Lee]

Still no documentation on https://headlessui.com/react/tabs ... 😢