I first returned my jsx as I was rendered by a map. with hardcoded buttons. we have to replace data.map and hardcode the tab buttons for this to work.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, error. Animi repellendus eaque, magni ipsam rerum exercitationem beatae, dicta earum ea inventore numquam quia nulla velit temporibus reiciendis cumque obcaecati?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, error. Animi repellendus eaque, magni ipsam rerum exercitationem beatae, dicta earum ea inventore numquam quia nulla velit temporibus reiciendis cumque obcaecati?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, error. Animi repellendus eaque, magni ipsam rerum exercitationem beatae, dicta earum ea inventore numquam quia nulla velit temporibus reiciendis cumque obcaecati?
use Qwik named slots to provide tabs & contents
we have a somewhat reusable component that ships renders fully to html & minimal js, though the logic needs to be quite specific to fulfil the "no-jsx"
and we can still build content dynamically w data.map. but the child component won't need it's jsx if content is passed in via qwik:slots
this just requires tab buttons to have a data ttribute with tab number, and that tabs are wrapped in a div.tab