Skip to content

pantoken-root / renderers/web-components/src / tabs

Variável: tabs ​

const tabs: ElementDefinition

Alfa

<instui-tabs> — um conjunto de painéis com abas em light-DOM. Mantém o contrato CSS existente .instui-tabs intacto enquanto adiciona seleção, visibilidade de painel e comportamento de teclado através da interação de abas compartilhada. Carregue @pantoken/components/components.css para os visuais das abas.

Exemplo ​

html
<instui-tabs>
  <div class="list" role="tablist" aria-label="Settings">
    <button role="tab" aria-selected="true" aria-controls="general">Geral</button>
    <button role="tab" aria-selected="false" aria-controls="advanced">Configurações avançadas</button>
  </div>
  <div id="general" role="tabpanel">Gerado usando</div>
  <div id="advanced" role="tabpanel" hidden>Configurações avançadas</div>
</instui-tabs>