lewis.moe
Monorepo for Tangled
1{{ define "fragments/tabSelector" }}
2 {{ $name := .Name }}
3 {{ $all := .Values }}
4 {{ $active := .Active }}
5 {{ $include := .Include }}
6 {{ $form := .Form }}
7 <div class="flex justify-between divide-x divide-gray-200 dark:divide-gray-700 rounded border border-gray-200 dark:border-gray-700 overflow-hidden">
8 {{ $activeTab := "bg-white dark:bg-gray-700 shadow-sm" }}
9 {{ $inactiveTab := "bg-gray-100 dark:bg-gray-800 shadow-inner" }}
10 {{ range $index, $value := $all }}
11 {{ $isActive := eq $value.Key $active }}
12 {{ if $form }}
13 <button type="submit"
14 form="{{ $form }}"
15 name="{{ $name }}" value="{{ $value.Key }}"
16 hx-get="?{{ $name }}={{ $value.Key }}"
17 hx-include="{{ $include }}"
18 hx-push-url="true"
19 hx-target="body"
20 hx-on:htmx:config-request="if(!event.detail.parameters.q) delete event.detail.parameters.q"
21 class="p-2 whitespace-nowrap flex justify-center items-center gap-2 text-sm w-full hover:no-underline text-center {{ if $isActive }} {{$activeTab }} {{ else }} {{ $inactiveTab }} {{ end }}">
22 {{ if $value.Icon }}
23 {{ i $value.Icon "size-4" }}
24 {{ end }}
25
26 {{ with $value.Meta }}
27 {{ . }}
28 {{ end }}
29
30 {{ $value.Value }}
31 </button>
32 {{ else }}
33 <a href="?{{ $name }}={{ $value.Key }}"
34 {{ if $include }}
35 hx-get="?{{ $name }}={{ $value.Key }}"
36 hx-include="{{ $include }}"
37 hx-push-url="true"
38 hx-target="body"
39 hx-on:htmx:config-request="if(!event.detail.parameters.q) delete event.detail.parameters.q"
40 {{ end }}
41 class="p-2 whitespace-nowrap flex justify-center items-center gap-2 text-sm w-full block hover:no-underline text-center {{ if $isActive }} {{$activeTab }} {{ else }} {{ $inactiveTab }} {{ end }}">
42 {{ if $value.Icon }}
43 {{ i $value.Icon "size-4" }}
44 {{ end }}
45
46 {{ with $value.Meta }}
47 {{ . }}
48 {{ end }}
49
50 {{ $value.Value }}
51 </a>
52 {{ end }}
53 {{ end }}
54 </div>
55{{ end }}