{{ define "hidden-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.InputField*/ -}}
    <input type="hidden" name="{{ .Name }}"
            {{- range $attribute := .Attributes }} {{$attribute}} {{ end }}
           value="{{ .String }}">
{{- end }}

{{ define "input-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.InputField*/ -}}
    <div class="input{{ if .Errors }} has-errors{{ end }}"{{ if .Is }} is="{{ .Is }}"{{ end }}>
        {{ if eq .Type "textarea" }}
            <textarea name="{{ .Name }}" id="{{ .Name }}-field"
                    {{- range $attribute := .Attributes }} {{$attribute}} {{ end }}
                    {{ if .Required }}required="required"{{ end }} placeholder="{{ .Label }}"
            >{{ .Val }}</textarea>
        {{ else }}
            <input type="{{ .Type }}" name="{{ .Name }}" id="{{ .Name }}-field"
                    {{- range $attribute := .Attributes }} {{$attribute}} {{ end }}
                    {{ if .Required }}required="required"{{ end }} value="{{ .Val }}" placeholder="{{ .Label }}">
        {{ end }}
        <label for="{{ .Name }}-field">{{ .Label }}</label>
        {{- if .Errors }}
            <ul>
                {{- range $error := .Errors }}
                    <li>{{ . }}</li>
                {{- end }}
            </ul>
        {{- end }}
    </div>
{{- end }}

{{ define "file-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.FileField*/ -}}
    <div class="input{{ if .Errors }} has-errors{{ end }}">
        <input type="file" name="{{ .Name }}" id="{{ .Name }}-field" placeholder="{{ .Label }}"{{ if .Required}} required="required"{{ end }}>
        <label for="{{ .Name }}-field">{{ .Label }}{{ if gt .MaxSize 0 }} {{printf (pgettext "(Max. %s)" "input") (.MaxSize|humanizeBytes) }}{{ end }}</label>
        {{- if .Errors }}
            <ul>
                {{- range $error := .Errors }}
                    <li>{{ . }}</li>
                {{- end }}
            </ul>
        {{- end }}
    </div>
{{- end }}

{{ define "tags-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.InputField*/ -}}
    <div class="input {{ if .Errors }}has-errors{{ end }}" is="numerus-tags">
        <input type="text" name="{{ .Name }}" id="{{ .Name }}-field"
                {{- range $attribute := .Attributes }} {{$attribute}} {{ end }}
                {{ if .Required }}required="required"{{ end }} value="{{ .String }}" placeholder="{{ .Label }}">
        <label for="{{ .Name }}-field">{{ .Label }}</label>
        {{- if .Errors }}
            <ul>
                {{- range $error := .Errors }}
                    <li>{{ . }}</li>
                {{- end }}
            </ul>
        {{- end }}
    </div>
{{- end }}

{{ define "hidden-select-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.SelectField*/ -}}
    {{- range $selected := .Selected }}
        <input type="hidden" name="{{ $.Name }}"
                {{- range $attribute := $.Attributes }} {{$attribute}} {{ end }}
               value="{{ . }}">
    {{- end }}
{{- end }}

{{ define "select-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.SelectField*/ -}}
    <div class="input{{ if .Errors }} has-errors{{ end }}"{{ if .Multiple }} is="numerus-multiselect"{{ end -}}>
        <select id="{{ .Name }}-field" name="{{ .Name }}"
                {{- range $attribute := .Attributes }} {{$attribute}} {{ end -}}
                {{ if .Multiple }} multiple="multiple"{{ end -}}
                {{ if .Required }} required="required"{{ end -}}
        >
            {{- with .EmptyLabel }}
                <option value="">{{ . }}</option>
            {{- end}}
            {{- $withinGroup := "" -}}
            {{- range $option := .Options }}
        {{- if ne .Group $withinGroup }}
        {{- if ne $withinGroup "" }}
            </optgroup>
        {{ end }}
            <optgroup label="{{ .Group }}">
                {{- $withinGroup = .Group -}}
                {{ end }}
                <option value="{{ .Value }}"
                        {{- if $.IsSelected .Value }} selected="selected"{{ end }}>{{ .Label }}</option>
                {{- end }}
                {{- if ne $withinGroup "" }}
            </optgroup>
            {{- end }}
        </select>
        <label for="{{ .Name }}-field">{{ .Label }}</label>
        {{- if .Errors }}
            <ul>
                {{- range $error := .Errors }}
                    <li>{{ . }}</li>
                {{- end }}
            </ul>
        {{- end }}
    </div>
{{- end }}

{{ define "toggle-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.ToggleField*/ -}}
    <fieldset id="{{ .Name}}-field" class="input toggle{{ if .Errors }} has-errors{{ end }}" is="numerus-toggle">
        <legend>{{ .Label }}</legend>
        <label title="{{.FirstOption.Description }}">
            <input type="radio" name="{{ .Name }}" value="{{ .FirstOption.Value }}"
                   {{ if eq .Selected .FirstOption.Value }}checked{{ end }}>
            {{ .FirstOption.Label }}
        </label>
        <label title="{{ .SecondOption.Description }}">
            <input type="radio" name="{{ .Name }}" value="{{ .SecondOption.Value }}"
                   {{ if eq .Selected .SecondOption.Value }}checked{{ end }}>
            {{ .SecondOption.Label }}
        </label>
    </fieldset>
{{- end }}

{{ define "radio-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.RadioField*/ -}}
    <fieldset id="{{ .Name}}-field" class="input radio{{ if .Errors }} has-errors{{ end }}">
        <legend>{{ .Label }}</legend>
        {{- range $option := .Options }}
            <label><input type="radio" name="{{$.Name}}" value="{{.Value}}"{{ if $.IsSelected .Value }} checked="checked"{{ end }}{{ if $.Required }} required="required"{{ end }}
                        {{- range $attribute := $.Attributes }} {{$attribute}} {{ end -}}
                > {{.Label}}</label>
        {{- end }}
        {{- if .Errors }}
            <ul>
                {{- range $error := .Errors }}
                    <li>{{ . }}</li>
                {{- end }}
            </ul>
        {{- end }}
    </fieldset>
{{- end }}

{{ define "check-field" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.CheckField*/ -}}
    <input id="{{ .Name }}-field" type="checkbox" name="{{.Name}}"{{ if .Checked}} checked="checked"{{ end }}{{ if .Required }} required="required"{{ end }}>
    <label for="{{ .Name }}-field">{{.Label }}</label>
{{- end }}

{{ define "invoice-product-form" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.invoiceProductForm*/ -}}
    <fieldset class="new-invoice-product"
              data-hx-select="unset"
              data-hx-vals='{"index": {{ .Index }}}'
              data-hx-include="[name='product.quantity.{{ .Index }}']"
    >
        <button type="submit" class="icon delete-product"
                formnovalidate
                name="action" value="remove-product.{{ .Index }}"
                aria-label="{{( gettext "Delete product from invoice" )}}"
        ><i class="ri-delete-back-2-line"></i></button>
        {{ template "hidden-field" .InvoiceProductId }}
        {{ template "hidden-field" .ProductId }}
        {{ template "input-field" .Name }}
        {{ template "input-field" .Price }}
        {{ template "input-field" .Quantity }}
        {{ template "input-field" .Discount }}
        {{ template "select-field" .Tax }}
        {{ template "input-field" .Description | addInputAttr `rows="2"`}}
    </fieldset>
{{- end }}

{{ define "quote-product-form" -}}
    {{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.quoteProductForm*/ -}}
    <fieldset class="new-quote-product"
              data-hx-select="unset"
              data-hx-vals='{"index": {{ .Index }}}'
              data-hx-include="[name='product.quantity.{{ .Index }}']"
    >
        <button type="submit" class="icon delete-product"
                formnovalidate
                name="action" value="remove-product.{{ .Index }}"
                aria-label="{{( gettext "Delete product from quotation" )}}"
        ><i class="ri-delete-back-2-line"></i></button>
        {{ template "hidden-field" .QuoteProductId }}
        {{ template "hidden-field" .ProductId }}
        {{ template "input-field" .Name }}
        {{ template "input-field" .Price }}
        {{ template "input-field" .Quantity }}
        {{ template "input-field" .Discount }}
        {{ template "select-field" .Tax }}
        {{ template "input-field" .Description | addInputAttr `rows="2"`}}
    </fieldset>
{{- end }}

{{ define "filters-toggle" -}}
    <button id="filters-toggle" x-cloak x-data="{}"
            @click="document.body.classList.toggle('filters-visible')"
            type="button">{{(pgettext "Filters" "action")}}</button>
{{- end }}