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

变量: tabs

const tabs: ElementDefinition

Alpha

<instui-tabs> — 一个 light-DOM 的选项卡面板集合。它在保持现有 .instui-tabs CSS 约定不变的同时，通过共享的标签交互添加了选择、面板可见性和键盘行为。加载 @pantoken/components/components.css 以获取选项卡的视觉样式。

示例

<instui-tabs>
  <div class="list" role="tablist" aria-label="Settings">
    <button role="tab" aria-selected="true" aria-controls="general">常规</button>
    <button role="tab" aria-selected="false" aria-controls="advanced">高级设置</button>
  </div>
  <div id="general" role="tabpanel">生成工具</div>
  <div id="advanced" role="tabpanel" hidden>高级设置</div>
</instui-tabs>