Make panel-tabset div available

[fherreazcue]

I've seen it used in the carpentries sites, for example here.

However, when I tried to use it on a lesson i get the error:

! There were errors in 1/118 fenced divs
◌ The Carpentries Workbench knows the following div types callout, objectives, questions, challenge, prereq, checklist, solution, hint, discussion, testimonial, keypoints, instructor

learners/setup.md:40 [unknown div] panel-tabset

[zkamvar]

Thank you for opening this issue. The example you point to is this site, which is not a lesson website. The lessons websites are purposefully not as feature-rich as static site generators because we want to make sure they are accessible and reliable.

The tabsets are not currently available partially because they are surprisingly complext to implement in a flexible and accessible manner (for example, quarto mentions the word 'tabset' in 26 files written in HTML, SCSS, TypeScript, and Lua and R Markdown adds extra CSS and JS with a separate license when tabsets are used.

The error you get does not prevent you from building the site, but it's letting you know that the div you chose is not recognised and not guaranteed to work (note that bootstrap divs will work, though they will also throw the error).

Adding tabset support is a project that we will explore in the future, but they are not necessarily a priority right now based on our internal capacity. If you want to achieve the effect of selectivly showing elements, I would suggeset to use a series of dropdown solution blocks such as presented in the workbench template setup page (rendered version: https://carpentries.github.io/workbench-template-md/#software-setup).

[fherreazcue]

Thanks for the reply, I'd seen the recommendation of using solution blocks, and sometimes it is useful, but sometimes it just does not work as well as tabs would... Before doing the migration to the workbench, we had for example a block of code that would render tabs and worked nicely with styles:

{::options parse_block_html="true" /}
<div>
<ul class="nav nav-tabs nav-justified" role="tablist">
  <li role="presentation" class="active">
    <a href="#tab1" aria-controls="tab1" role="tab" data-toggle="tab">tab1</a>  </li>
  <li role="presentation">
    <a href="#tab2" aria-controls="tab2" role="tab" data-toggle="tab">tab2</a>  </li>
  <li role="presentation">
    <a href="#tab3" aria-controls="tab3" role="tab" data-toggle="tab">tab3</a>  </li>
</ul>
<div class="tab-content">
  <article role="tabpanel" class="tab-pane active" id="tab1">
  ![tab1_img](tab1_img.png)
  </article>
  <article role="tabpanel" class="tab-pane active" id="tab2">
  ![tab2_img](tab2_img.png)
  </article>
  <article role="tabpanel" class="tab-pane active" id="tab3">
  ![tab3_img](tab3_img.png)
  </article>
</div>
</div>
<br/>
{::options parse_block_html="false" /}

It is all bootstrap, but does not work with the workbench... Exploring this page I found the very pretty tabs could be accomplished with the much simpler notation:

::::::::::::::::::: {.panel-tabset}

##### Tab 1

![tab1_img](tab1_img.png)

##### Tab 2

![tab2_img](tab2_img.png)

##### Tab 3

![tab3_img](tab3_img.png)

:::::::::::::::::::

It looked to me quite nice and much less error prone than the bootstrap version (that I couldn't get to work now), and already playing well with the oworkbench, that's the only reason I suggested it is "released to us, even in its current non-flexible form... restrictive usage is still better than not available...

But I'll keep tabs on the issue and hopefully we get something that works soon :)

[froggleston]

This has now been implemented in https://github.com/carpentries/sandpaper/pull/571