<!--
 SPDX-FileCopyrightText: 2023 jordi fita mas <jordi@tandem.blog>
 SPDX-License-Identifier: AGPL-3.0-only
-->
{{ define "error-attrs" }}{{ if .Error }}aria-invalid="true" aria-errormessage="{{ .Name }}-error"{{ end }}{{ end }}

{{ define "error-message" -}}
    {{ if .Error -}}
        <span id="{{ .Name }}-error" class="error">{{ .Error }}</span><br>
    {{- end }}
{{- end }}

{{ define "list-options" -}}
    {{- range .Options }}
        <option value="{{ .Value }}" {{ if $.IsSelected .Value }} selected="selected"{{ end }}>{{ .Label }}</option>
    {{- end }}
{{- end }}

{{ define "radio-options" -}}
    {{- range .Options }}
        <label><input type="radio" name="{{ $.Name }}" value="{{ .Value }}"
                      {{ if $.IsSelected .Value }}checked{{ end }}> {{ .Label }}</label>
    {{- end }}
{{- end }}

{{ define "media-picker" -}}
    {{- /*gotype: dev.tandem.ws/tandem/camper/pkg/form.Media*/ -}}
    <fieldset data-hx-target="this" data-hx-swap="outerHTML">
        <legend>{{( pgettext .Label "input" )}}</legend>
        <input type="hidden" name="{{ .Name }}" value="{{ .Val }}">
        <button type="button"
                data-hx-get="/admin/media/picker?name={{ .Name | queryEscape }}&amp;value={{ .Val | queryEscape }}&amp;label={{ .Label | queryEscape }}&amp;prompt={{ .Prompt | queryEscape }}"
                data-hx-swap="beforeend"
        >
            {{ if .Val -}}
                <img src="/admin/media/{{ .Val }}/content" alt="">
            {{ else -}}
                {{( pgettext .Prompt "action" )}}
            {{- end }}
        </button>
        {{ template "error-message" . }}
    </fieldset>
{{- end }}

{{ define "init-lang" }}x-data="{ lang: '{{ .DefaultLang }}' }"{{ end }}

{{ define "lang-selector" -}}
    <div class="lang-selector" role="toolbar">
        {{ range $lang, $input := . -}}
            <button :aria-pressed="lang === '{{ $lang }}'"
                    @click.prevent="lang = '{{ $lang }}'">{{ $lang }}</button>
        {{- end }}
    </div>
{{- end }}
