mirror of
https://github.com/gethinode/hinode.git
synced 2025-10-14 05:23:15 +00:00
84 lines
3.4 KiB
HTML
84 lines
3.4 KiB
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", or "underline".
|
|
"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”.
|
|
-->
|
|
|
|
{{- $id := printf "nav-%d" .Ordinal -}}
|
|
{{ with .Get "id" }}
|
|
{{ $id = . }}
|
|
{{ end }}
|
|
|
|
{{- $class := .Get "class" | default "" -}}
|
|
{{ $type := .Get "type" | default "" -}}
|
|
{{ $supportedNavTypes := slice "tabs" "pills" "underline" -}}
|
|
{{ 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 -}}
|
|
|
|
{{- 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 -}}
|
|
|
|
{{ if $vertical }}<div class="d-flex align-items-start">{{ 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 }}>
|
|
{{- range $index, $item := $items -}}
|
|
{{- $header := partial "utilities/GetVal.html" $item -}}
|
|
{{- $itemDisabled := in $disabled $index -}}
|
|
<button class="nav-link text-nowrap{{ 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 -}}
|
|
</div>
|
|
|
|
{{- if $hasContent -}}
|
|
<div class="tab-content {{ if eq $type "tabs" }}border border-top-0 p-3{{ else if $vertical }}ms-3{{ else }}mt-3{{ end }}">
|
|
{{- $inner | safeHTML -}}
|
|
</div>
|
|
{{- end -}}
|
|
{{ if $vertical }}</div>{{ end }}
|