%# BEGIN BPS TAGGED BLOCK {{{
%#
%# COPYRIGHT:
%#
%# This software is Copyright (c) 1996-2023 Best Practical Solutions, LLC
%#                                          <sales@bestpractical.com>
%#
%# (Except where explicitly superseded by other copyright notices)
%#
%#
%# LICENSE:
%#
%# This work is made available to you under the terms of Version 2 of
%# the GNU General Public License. A copy of that license should have
%# been provided with this software, but in any event can be snarfed
%# from www.gnu.org.
%#
%# This work is distributed in the hope that it will be useful, but
%# WITHOUT ANY WARRANTY; without even the implied warranty of
%# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
%# General Public License for more details.
%#
%# You should have received a copy of the GNU General Public License
%# along with this program; if not, write to the Free Software
%# Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA
%# 02110-1301 or visit their web page on the internet at
%# http://www.gnu.org/licenses/old-licenses/gpl-2.0.html.
%#
%#
%# CONTRIBUTION SUBMISSION POLICY:
%#
%# (The following paragraph is not intended to limit the rights granted
%# to you to modify and distribute this software under the terms of
%# the GNU General Public License and is only of importance to you if
%# you choose to contribute your changes and enhancements to the
%# community by submitting them to Best Practical Solutions, LLC.)
%#
%# By intentionally submitting any modifications, corrections or
%# derivatives to this work, or any other work intended for use with
%# Request Tracker, to Best Practical Solutions, LLC, you confirm that
%# you are the copyright holder for those contributions and you grant
%# Best Practical Solutions,  LLC a nonexclusive, worldwide, irrevocable,
%# royalty-free, perpetual, license to use, copy, create derivative
%# works based on those contributions, and sublicense and distribute
%# those contributions and any derivatives thereof.
%#
%# END BPS TAGGED BLOCK }}}
% my $nav_type = 'pill'; # 'tab' or 'pill'
% my $tab_id = CSSClass( $tab->{Name} );
<div class="row">
  <div class="col-3">
% my @section_names = map { $_->{Name} } @{$tab->{Content}};
    <ul class="nav nav-<% $nav_type %>s flex-column navbar-fixed-top" id="config-sections-<% $tab_id %>" aria-orientation="vertical">
% my $first_section = 1;
% foreach my $section_name (@section_names) {
%     $current_context->{section} = CSSClass( $section_name );
%     my $active = $current_context->{tab} eq $active_context->{tab} ?
%       $current_context->{section} eq $active_context->{section} :
%       $first_section;
%     $first_section = 0;
%     my( $active_class, $aria_selected) = $active ? ('active', 'true') : ('', 'false');
%     my $nav_id = join '-', 'nav', $current_context->{tab}, $current_context->{section};
%     my $content_id = join '-', 'content', $current_context->{tab}, $current_context->{section};
      <li class="nav-item">
        <a class="nav-link <% $active_class %>" id="<% $nav_id %>" data-toggle="<% $nav_type %>" href="#<% $content_id %>" role="<% $nav_type %>" aria-controls="<% $nav_id %>" aria-selected="<% $aria_selected %>"><% $section_name %></a>
      </li>
% }
    </ul>
  </div>
  <div class="col-9">
    <div class="tab-content" id="tab-content-<% $tab_id %>" >

% $first_section = 1;
% foreach my $section ( @{$tab->{Content}} ) {
%     $current_context->{section} = CSSClass( $section->{Name} );
%     my $active = $current_context->{tab} eq $active_context->{tab} ?
%       $current_context->{section} eq $active_context->{section} :
%       $first_section;
%     my $active_class = $active ? 'active show' : '';
%     $first_section = 0;
%     my $nav_id = join '-', 'nav', $current_context->{tab}, $current_context->{section};
%     my $content_id = join '-', 'content', $current_context->{tab}, $current_context->{section};
      <div class="tab-pane fade <% $active_class %>" role="tabpanel" id="<% $content_id %>" aria-labelledby="<% $nav_id %>">
        <& /Admin/Tools/Config/Elements/Section, section => $section, current_context => $current_context, active_context => $active_context &>
      </div><!-- end section <% $content_id %> -->
% }
    </div><!-- end of tab tab-content-<% $tab_id %> -->
  </div>
</div>
<%ARGS>
$tab
$active_context
$current_context
</%ARGS>
