{% macro fieldrow(id, field, norow = false, nohide = false, em = false) %}
	{% if field.visible is not defined or (field.visible is defined and field.visible) or nohide == true %}
		{% if norow == false and (field.type != 'hidden' or (field.type == 'hidden' and field.display is defined and field.display is not empty)) %}
			<div class="row g-0 formfield d-flex align-items-center">
				{% if field.prior_infotext is defined and field.prior_infotext|length > 0 %}
					<h5>{{ field.prior_infotext|raw }}</h5>
				{% endif %}
				{% if field.label is iterable %}
					<label for="{{ id }}" class="col-sm-6 col-form-label pe-3">
						{% if em %}
							<mark>
							{% endif %}
							{{ field.label.title|raw }}
							{% if field.mandatory is defined and field.mandatory %}
								<span class="text-danger">*</span>
							{% endif %}
							{% if em %}
							</mark>
						{% endif %}
						{% if field.label.description is defined and field.label.description is not empty %}<br><small>{{ field.label.description|raw }}</small>
						{% endif %}
						{% if field.desc is defined and field.desc is not empty %}<br><small>{{ field.desc|raw }}</small>
						{% endif %}
						{% if field.requires_reconf is defined and field.requires_reconf is not empty %}
							<div class="bg-info bg-opacity-25 rounded p-2 mt-2 d-flex align-items-center" role="alert">
								<i class="fa-solid fa-circle-exclamation me-2"></i><p class="mb-0">{{ lng('serversettings.requires_reconfiguration', [field.requires_reconf|join(', ')])|raw }}</p>
							</div>
						{% endif %}
					</label>
				{% else %}
					<label for="{{ id }}" class="col-sm-6 col-form-label pe-3">
						{% if em %}
							<mark>
							{% endif %}
							{{ field.label|raw }}
							{% if field.mandatory is defined and field.mandatory %}
								<span class="text-danger">*</span>
							{% endif %}
							{% if em %}
							</mark>
						{% endif %}
						{% if field.desc is defined and field.desc is not empty %}<br><small>{{ field.desc|raw }}</small>
						{% endif %}
						{% if field.requires_reconf is defined and field.requires_reconf is not empty %}
							<div class="bg-info bg-opacity-25 rounded p-2 mt-2 d-flex align-items-center" role="alert">
								<i class="fa-solid fa-circle-exclamation me-2"></i><p class="mb-0">{{ lng('serversettings.requires_reconfiguration', [field.requires_reconf|join(', ')])|raw }}</p>
							</div>
						{% endif %}
					</label>
				{% endif %}
				<div class="col-sm-6">
				{% endif %}
				{% if field.type == 'text' or field.type == 'password' or field.type == 'number' or field.type == 'file' or field.type == 'email' or field.type == 'url' or field.type == 'hidden' or field.type == 'date' or field.type == 'datetime-local' %}
					{{ _self.input(id, field) }}
				{% elseif field.type == 'textul' %}
					{{ _self.input_ul(id, field) }}
				{% elseif field.type == 'checkbox' %}
					{{ _self.bool(id, field) }}
				{% elseif field.type == 'checkrequired' %}
					{{ _self.chk_required(id, field) }}
				{% elseif field.type == 'select' %}
					{{ _self.select(id, field) }}
				{% elseif field.type == 'textarea' %}
					{{ _self.textarea(id, field) }}
				{% elseif field.type == 'longtext' %}
					{{ _self.longtext(id, field) }}
				{% elseif field.type == 'label' %}
					{{ _self.plain(id, field) }}
				{% elseif field.type == 'link' %}
					{{ _self.link(id, field) }}
				{% elseif field.type == 'itemlist' %}
					{{ _self.itemlist(id, field) }}
				{% elseif field.type == 'infotext' %}
					{{ _self.infotext(id, field) }}
				{% elseif field.type == 'image' %}
					{{ _self.image(id, field) }}
				{% else %}
					<div class="alert alert-warning" role="alert">Unknown field-type
						{{ field.type }}</div>
				{% endif %}
				{% if field.note is defined and field.note is not empty %}
					<small class="text-info">{{ field.note|raw }}</small>
				{% endif %}

				{% if norow == false and (field.type != 'hidden' or (field.type == 'hidden' and field.display is defined and field.display is not empty)) %}
				</div>
			</div>
		{% endif %}
	{% endif %}
{% endmacro %}

{# installation specific format #}
{% macro field(id, field, norow = true, nohide = false, em = false) %}
	{% if field.type == 'checkbox' %}
		<div class="form-check form-switch mb-3">
			<input type="hidden" value="0" name="{{ id }}"/>
			<input type="checkbox" {% if (field.visible is defined and field.visible == false) or (field.disabled is defined and field.disabled == true) %} disabled {% endif %} value="{{ field.value }}" id="{{ id }}" name="{{ id }}" class="form-check-input {% if field.valid is defined and field.valid == false %}is-invalid{% endif %}" {% if field.checked is defined and field.checked == 1 %} checked="checked" {% endif %}>
			<label for="{{ id }}" class="form-check-label">{{ field.label|raw }}</label>
		</div>
	{% elseif field.type == 'hidden' %}
		{{ _self.fieldrow(id, field, norow, nohide, em) }}
	{% else %}
		<div class="form-floating mb-3">
			{{ _self.fieldrow(id, field, norow, nohide, em) }}
			<label for="{{ id }}" class="form-label">{{ field.label|raw }}</label>
		</div>
	{% endif %}
{% endmacro %}

{% macro bool(id, field) %}
	{% if field.is_array is defined and field.is_array == 1 and field.values is not empty %}
		{% for subfield in field.values %}
			<div class="form-check form-switch">
				<input type="checkbox" {% if (field.visible is defined and field.visible == false) or (field.disabled is defined and field.disabled == true) %} disabled {% endif %} value="{{ subfield.value }}" name="{{ id }}[]" class="form-check-input" {% if field.value is defined and subfield.value in field.value %} checked="checked" {% endif %} {% if field.mandatory is defined and field.mandatory %} required {% endif %}>
				<label class="form-check-label">
					{{ subfield.label|raw }}
				</label>
			</div>
		{% endfor %}
	{% else %}
		<div class="form-check form-switch">
			<input type="hidden" value="0" name="{{ id }}"/>
			<input type="checkbox" {% if (field.visible is defined and field.visible == false) or (field.disabled is defined and field.disabled == true) %} disabled {% endif %} value="{{ field.value }}" id="{{ id }}" name="{{ id }}" class="form-check-input {% if field.valid is defined and field.valid == false %}is-invalid{% endif %}" {% if field.checked is defined and field.checked == 1 %} checked="checked" {% endif %}>
		</div>
	{% endif %}
{% endmacro %}

{% macro chk_required(id, field) %}
	<div class="form-check form-switch">
		<input type="checkbox" value="{{ field.value }}" id="{{ id }}" name="{{ id }}" class="form-check-input" {% if field.mandatory is defined and field.mandatory == 1 %} required {% endif %} />
	</div>
{% endmacro %}

{% macro infotext(id, field) %}
	{% if field.next_to is defined %}
		<div class="input-group">
		{% endif %}
		<span {% if field.classes is defined %} class="{{ field.classes }}" {% endif %}>{{ field.value|raw }}</span>
		{% if field.next_to is defined %}
			{% for nid, nfield in field.next_to %}
				{% if nfield.next_to_prefix is defined %}
					<span class="input-group-text">{{ nfield.next_to_prefix }}</span>
				{% endif %}
				{{ _self.fieldrow(nid, nfield, true) }}
			{% endfor %}
		</div>
	{% endif %}
{% endmacro %}

{% macro plain(id, field) %}
	<input type="text" readonly class="form-control-plaintext" id="{{ id }}" name="{{ id }}" value="{{ field.value|raw }}">
	{% if field.next_to is defined %}
		{% for nid, nfield in field.next_to %}
			{% if nfield.next_to_prefix is defined %}
				<span class="input-group-text">{{ nfield.next_to_prefix }}</span>
			{% endif %}
			{{ _self.fieldrow(nid, nfield, true) }}
		{% endfor %}
	{% endif %}
{% endmacro %}

{% macro longtext(id, field) %}
	<div>
		<div class="float-end">
			<button class="btn btn-outline-secondary copyClipboard" data-clipboard-source="{{ id }}" style="--bs-btn-padding-y: .25rem; --bs-btn-padding-x: .5rem; --bs-btn-font-size: .5rem;" title="Copy to clipboard"><i class="fa-solid fa-copy"></i></button>
		</div>
		<p class="text-break" id="{{ id }}">{{ field.value|raw }}</p>
	</div>
{% endmacro %}

{% macro input(id, field) %}
	{% if field.next_to is defined %}
		<div class="input-group">
		{% endif %}
	<input type="{{ field.type }}" {% if (field.visible is defined and field.visible == false) or (field.disabled is defined and field.disabled == true) %} disabled {% endif %} {% if field.type == 'number' and field.min is defined %} min="{{ field.min }}" {% endif %} {% if field.type == 'number' and field.max is defined %} max="{{ field.max }}" {% endif %} {% if field.type == 'number' and field.step is not empty %} step="{{ field.step }}" {% endif %} {% if field.type != 'number' and field.maxlength is defined %} maxlength="{{ field.maxlength }}" {% endif %} id="{{ id }}" name="{{ id }}" value="{{ field.value|raw }}" class="form-control {% if field.valid is defined and field.valid == false %}is-invalid{% endif %}" {% if field.mandatory is defined and field.mandatory %} required {% endif %} {% if field.readonly is defined and field.readonly %} readonly {% endif %} {% if field.autocomplete is defined %} autocomplete="{{ field.autocomplete }}" {% endif %} {% if field.placeholder is defined %} placeholder="{{ field.placeholder }}" {% endif %} {% if field.type == 'file' and field.accept is defined %} accept="{{ field.accept }}" {% endif %} {% if field.pattern is defined %} pattern="{{ field.pattern }}" {% endif %}/>
		{% if field.type == 'hidden' and field.display is defined %}
			<input type="text" readonly class="form-control-plaintext" value="{{ field.display|raw }}">
		{% endif %}
		{% if field.next_to is defined %}
			{% for nid, nfield in field.next_to %}
				{% if nfield.next_to_prefix is defined %}
					<span class="input-group-text">{{ nfield.next_to_prefix }}</span>
				{% endif %}
				{{ _self.fieldrow(nid, nfield, true) }}
			{% endfor %}
		</div>
	{% endif %}
{% endmacro %}

{% macro image(id, field) %}
	{% if field.value is not empty %}
		<img src="{{ field.value }}" alt="Current Image" class="field-image-preview"><br>
		<div class="form-check form-switch mb-2">
			<input type="checkbox" value="1" name="{{ id }}_delete" class="form-check-input">
			<label class="form-check-label">
				{{ lng('panel.image_field_delete') }}
			</label>
		</div>
	{% endif %}
	{% set field = field|merge({'type':'file'})|merge({'value':''}) %}
	{{ _self.input(id, field) }}
{% endmacro %}

{% macro input_ul(id, field) %}
	{% set max = "" %}
	{% if field.maxlength is defined %}
		{% for i in 1..field.maxlength %}
			{% set max = max ~ "9" %}
		{% endfor %}
	{% endif %}
	<div class="input-group">
		<input type="number" min="0" {% if max is not empty %} max="{{ max }}" {% endif %}{% if field.step is not empty %} step="{{ field.step }}" {% endif %} id="{{ id }}" name="{{ id }}" value="{% if field.value >= 0 %}{{ field.value }}{% endif %}" class="form-control {% if field.valid is defined and field.valid == false %}is-invalid{% endif %}" {% if field.mandatory is defined and field.mandatory %} required {% endif %} {% if field.readonly is defined and field.readonly %} readonly {% endif %} {% if field.autocomplete is defined %} autocomplete="{{ field.autocomplete }}" {% endif %} {% if field.placeholder is defined %} placeholder="{{ field.placeholder }}" {% endif %}/>
		<div class="input-group-text">
			<input class="form-check-input mt-0" type="checkbox" name="{{ id }}_ul" value="1" {% if field.value == -1 %} checked="checked" {% endif %}>
		</div>
	</div>
{% endmacro %}


{% macro select(id, field) %}
	{% if field.next_to is defined %}
		<div class="input-group">
		{% endif %}
		<select {% if field.visible is defined and field.visible == false %} disabled {% endif %} class="form-select {% if field.valid is defined and field.valid == false %}is-invalid{% endif %}" name="{{ id }}{% if field.select_mode is defined and field.select_mode == 'multiple' %}[]{% endif %}" id="{{ id }}" {% if field.mandatory is defined and field.mandatory %} required {% endif %} {% if field.select_mode is defined and field.select_mode == 'multiple' %} multiple="multiple" {% endif %}{% if field.readonly is defined and field.readonly %} readonly {% endif %}>
			{% for val,txt in field.select_var %}
				<option value="{{ val }}" {% if field.selected is defined and ((field.selected is not iterable and field.selected == val) or (field.selected is iterable and val in field.selected|keys)) %} selected="selected" {% endif %}>{{ txt|raw }}</option>
			{% endfor %}
		</select>
		{% if field.next_to is defined %}
			{% for nid, nfield in field.next_to %}
				{% if nfield.next_to_prefix is defined %}
					<span class="input-group-text">{{ nfield.next_to_prefix }}</span>
				{% endif %}
				{{ _self.fieldrow(nid, nfield, true) }}
			{% endfor %}
		</div>
	{% endif %}
{% endmacro %}

{% macro textarea(id, field) %}
	<textarea {% if field.visible is defined and field.visible == false %} disabled {% endif %} rows="{{ field.rows|default('12') }}" cols="{{ field.cols|default('60') }}" id="{{ id }}" name="{{ id }}" class="form-control {% if field.valid is defined and field.valid == false %}is-invalid{% endif %}" {% if field.mandatory is defined and field.mandatory %} required {% endif %} {% if field.readonly is defined and field.readonly %} readonly {% endif %} {% if field.placeholder is defined %} placeholder="{{ field.placeholder }}" {% endif %} {% if field.style is defined %} style="{{ field.style }}" {% endif %}>{{ field.value|raw }}</textarea>
{% endmacro %}

{% macro link(id, field) %}
	<a href="{{ field.href|raw }}" class="{{ field.classes }}">{{ field.label|raw }}</a>
{% endmacro %}

{% macro itemlist(id, field) %}
	{% if field.values is not empty %}
		{% for value in field.values %}
			<p>{{ value.item|raw }}
				{% if value.href is defined and value.href is not empty %}
					{{ _self.link(id, value) }}
				{% endif %}
			</p>
		{% endfor %}
	{% endif %}
	{% if field.next_to is defined %}
		{% for nid, nfield in field.next_to %}
			{{ _self.fieldrow(nid, nfield, true) }}
		{% endfor %}
	{% endif %}
{% endmacro %}
