{% filter markdown %}{% raw %}
```html+jinja
<TabGroup>
  <TabList vertical>
    <Tab target="vertical-recent" selected>Recent</Tab>
    <Tab target="vertical-popular">Popular</Tab>
    <Tab target="vertical-disabled" disabled>Disabled</Tab>
    <Tab target="vertical-trending">Trending</Tab>
  </TabList>

  <TabPanel id="vertical-recent">
    <p>This is the tab panel for <b>"Recent"</b>.</p>
  </TabPanel>

  <TabPanel id="vertical-popular" hidden>
    <p>This is the tab panel for <b>"Popular"</b>.</p>
  </TabPanel>

  <TabPanel id="vertical-disabled" hidden>
    <p>This is the tab panel for "Disabled".</p>
  </TabPanel>

  <TabPanel id="vertical-trending" hidden>
    <p>This is the tab panel for <b>"Trending"</b>.</p>
  </TabPanel>
</TabGroup>
```
{% endraw %}{% endfilter %}