hinode/layouts/shortcodes/nav.html

<!-- 
    Displays a tab group of multiple items. Add nav-item inner elements for each tab pane. The shortcode supports the
    following arguments:
    "type"          Optional type of the tab group, either "tabs", "pills", "underline", or "callout".
    "vertical"      Optional flag to show vertical tabs instead of horizontal tabs (default).
    "fade"          Optional flag to make tab panes fade in.
    "class"         Optional class attribute of the tab group, e.g. “nav-fill”.
    "wrap"          Optional flag to enable word wrapping of tab titles, defaults to false.
-->

{{- $id := printf "nav-%d" .Ordinal -}}
{{ with .Get "id" }}
    {{ $id = . }}
{{ end }}

{{- $class := .Get "class" | default "" -}}
{{ $type := .Get "type" | default "" -}}
{{ $supportedNavTypes := slice "tabs" "pills" "underline" "callout" -}}
{{ if $type }}
    {{ if not (in $supportedNavTypes $type) -}}
        {{ errorf "Invalid value for param 'type': %s" $type -}}
    {{ end -}}
{{ end -}}

{{ $supportedFlags := slice "true" "false" -}}
{{ $verticalParam := "false" -}}
{{ $vertical := false -}}
{{ with .Get "vertical" }}{{ $verticalParam = . }}{{ end -}}
{{ if in $supportedFlags $verticalParam -}}
    {{ if eq $verticalParam "true" }}{{ $vertical = true }}{{ else }}{{ $vertical = false }}{{ end -}}
{{ else -}}
    {{ errorf "Invalid value for param 'vertical': %s" $verticalParam -}}
{{- end -}}

{{ $fadeParam := "false" -}}
{{ with .Get "fade" }}{{ $fadeParam = . }}{{ end -}}
{{ if not (in $supportedFlags $fadeParam) -}}
    {{ errorf "Invalid value for param 'fade': %s" $fadeParam -}}
{{- end -}}

{{ $wrapParam := "false" -}}
{{- $wrap := false -}}
{{ with .Get "wrap" }}{{ $wrapParam = . }}{{ end -}}
{{ if not (in $supportedFlags $wrapParam) -}}
    {{ errorf "Invalid value for param 'wrap': %s" $wrapParam -}}
{{- end -}}

{{- if and (eq $type "tabs") $vertical -}}
    {{- errorf "Tabs do not support vertical layout" -}}
{{- end -}}

{{ $inner := .Scratch.Get "inner" }}
{{ $input := trim .Inner " \r\n" }}
{{ if $input }}
    {{ $input = replace $input "\n" "\n  " }}
    {{ warnf "Unexpected inner content: %s\r\n      %s" .Position $input }}
{{ end }}

{{- $items := findRE "data-header=\"(.+?)\"" $inner -}}
{{- $showVal := findRE "data-show-id=\"(.+?)\"" $inner -}}
{{- $showID := -1 -}}
{{- if gt (len $showVal) 0 -}}
    {{- $showID = int (partial "utilities/GetVal.html" (index $showVal 0)) -}}
{{- end -}}

{{ $disabled := slice -}}
{{- $disabledVal := findRE "data-disabled-id=\"(.+?)\"" $inner -}}
{{- range $item := $disabledVal -}}
    {{- $disabled = $disabled | append (int (partial "utilities/GetVal.html" $item)) -}}
{{- end -}}

{{- $hasContent := gt (len (findRE "data-has-content=\"true\"" $inner)) 0 -}}

{{ $alternative := .Scratch.Get "alternative" }}
{{ if and (eq $type "callout") $alternative }}
    <div class="d-lg-none">
        <div id="accordion-{{ $id }}" class="accordion mb-3{{ with $class }} {{ . }}{{ end }} nav-callout">
            {{- $alternative | safeHTML -}}
        </div>
    </div>
    <div class="d-none d-lg-block">
{{ end }}

<div class="nav{{ with $type }} nav-{{ . }}{{ end }}{{ with $class }} {{ . }}{{ end }}{{ if $vertical }} flex-column{{ end }}" id="{{ $id }}" role="tablist"{{ if $vertical }} aria-orientation="vertical"{{ end }}>
    {{ if $vertical }}<div class="row"><div class="col-auto">{{ end }}
    {{- range $index, $item := $items -}}
        {{- $header := partial "utilities/GetVal.html" $item -}}
        {{- $itemDisabled := in $disabled $index -}}
        <button class="nav-link{{ if not $wrap }} text-nowrap{{ end }}{{ if eq $index $showID }} active{{ end }}{{ if $itemDisabled}} disabled {{end }}" id="{{ $id }}-btn-{{ $index }}" data-bs-toggle="pill" data-bs-target="#{{ $id }}-{{ $index }}" 
                type="button" role="tab" aria-controls="{{ $id }}-{{ $index }}" aria-selected="{{ if eq $index 0 }}true{{ else }}false{{ end }}">
            {{ $header }}
        </button>
    {{ end -}}
    {{ if $vertical }}</div><div class="col">{{ end }}
        {{- if $hasContent -}}
        <div class="tab-content w-100 {{ if not $vertical }} {{ end }}{{ if eq $type "tabs" }}border border-bottom-0 p-3{{ else if $vertical }}ms-3{{ else }}mt-3{{ end }}">
            {{- $inner | safeHTML -}}
        </div>
    {{- end -}}
    {{ if $vertical }}</div></div>{{ end }}
    </div>

{{ if and (eq $type "callout") $alternative }}</div>{{ end }}