Look into using Radix's TabsContent component for <Tabs />

[jessepinho]

Per @VanishMax 's comment here:

suggestion (non-blocking, worth implementing): expose TabsContent component from Radix and somehow allow the children for Tabs.

If you inspect the markup of the Radix Tabs example, you can see that Tabs.Content components are nested inside the Tabs.Root. It allows Radix to set useful attributes like data-state="active" and role="tabpanel". Plus, there is a rendering logic involved that all [role="tabpanel"] divs are rendered but inactive divs have empty contents. All of this corresponds to W3C standards.

Developers might and probably will forget to implement this, so it would be useful to help them (and ourselves)

My response:

Good call — will look into it. I'm not sure that <TabsContent /> will be appropriate in our case, since we won't have multiple tab contents rendered on the page at the same time — <Tabs /> will usually be used for routing, I believe.

So, in short — this ticket may not be necessary. But if there's ever a case where multiple tabs' contents will be rendered at the same time (i.e., when the tabs aren't involved in routing), this would be worth looking into.