Is possible to the tabs functionality of Zurb Foundation within Divshot?

Question

I've got a Divshot project setup to use the Zurb Foundation framework. It appears to be using Foundation version 5.02. Although tabs are a valid component of 5.02 (sections were removed), they do not show up in the component library on the right side in Divshot (while sections are still available).

I was able to copy in a basic tabs example form the Foundation documentation (vertical tabs)

<dl class="tabs vertical" data-tab>
  <dd class="active"><a href="#panel1a">Tab 1</a></dd>
  <dd><a href="#panel2a">Tab 2</a></dd>
  <dd><a href="#panel3a">Tab 3</a></dd>
  <dd><a href="#panel4a">Tab 4</a></dd>
</dl>
<div class="tabs-content vertical">
  <div class="content active" id="panel1a">
    <p>Panel 1 content goes here.</p>
  </div>
  <div class="content" id="panel2a">
    <p>Panel 2 content goes here.</p>
  </div>
  <div class="content" id="panel3a">
    <p>Panel 3 content goes here.</p>
  </div>
  <div class="content" id="panel4a">
    <p>Panel 4 content goes here.</p>
  </div>
</div>

This code generates the appropriate tabs from an appearance perspective, however, they do not actually function. The top left of Divshot shows that elements with different ID selectors are active as I click each of the tabs, however, the tab content doesn't change appropriately.

Is the tabs functionality for Foundation 5 broken or simply not included in Divshot?

Answer 1

I believe that all the components that require Javascript are not supported by default. I've only just started using Divshot so I don't know if there is a way to enable them.

Alternatively you could export your project from Divshot and then add the javascript - following the instructions provided in the Foundation documenation.