Tab Group

<gstock-tab-group> | GstockTabGroup

General

Custom

Advanced

Disabled

This is the general tab panel.

This is the custom tab panel.

This is the advanced tab panel.

This is a disabled tab panel.

<gstock-tab-group>
  <gstock-tab slot="nav" panel="general" active>General</gstock-tab>
  <gstock-tab slot="nav" panel="custom">Custom</gstock-tab>
  <gstock-tab slot="nav" panel="advanced">Advanced</gstock-tab>
  <gstock-tab slot="nav" panel="disabled" disabled>Disabled</gstock-tab>

  <gstock-tab-panel name="general">This is the general tab panel.</gstock-tab-panel>
  <gstock-tab-panel name="custom">This is the custom tab panel.</gstock-tab-panel>
  <gstock-tab-panel name="advanced">This is the advanced tab panel.</gstock-tab-panel>
  <gstock-tab-panel name="disabled">This is a disabled tab panel.</gstock-tab-panel>
</gstock-tab-group>

<style>
  gstock-tab-panel {
    padding-block: var(--gstock-legacy-spacing-5);
    padding-inline: var(--gstock-legacy-spacing-6);
  }
</style>