{#
Reusable form field macros for CRUD forms.
Adapted for Bootstrap 5.
#}

{# Internal helper for help text #}
{% macro _help(text) %}{% if text %}<div class="form-text">{{ text }}</div>{% endif %}{% endmacro %}

{% macro text_input(name, label, value='', help='', readonly=false, required=false, type='text', maxlength=none) %}
{#- `readonly` greys itself here, sharing `readonly_field`'s class: the attribute
    already blocks typing, but Bootstrap 5 dropped the `[readonly]` styling
    Bootstrap 4 had, so the control still read as editable.  Not `disabled`,
    which would leave the tab order and put the value out of a keyboard user's
    reach -- `test_unit_detail_page_is_keyboard_reachable` holds that. -#}
<div class="mb-3">
    <label for="{{ name }}">{{ label }}</label>
    <input type="{{ type }}" class="form-control{% if readonly %} crud-readonly-field{% endif %}" id="{{ name }}" name="{{ name }}"
           value="{{ value }}"{% if readonly %} readonly{% endif %}{% if required %} required{% endif %}{% if maxlength %} maxlength="{{ maxlength }}"{% endif %}>
    {{ _help(help) }}
</div>
{% endmacro %}

{% macro date_input(name, label, value='', help='', required=false, min='') %}
<div class="mb-3">
    <label for="{{ name }}">{{ label }}</label>
    <input type="date" class="form-control" id="{{ name }}" name="{{ name }}"
           value="{{ value }}"{% if required %} required{% endif %}{% if min %} min="{{ min }}"{% endif %}>
    {{ _help(help) }}
</div>
{% endmacro %}

{% macro number_input(name, label, value='', help='', min=none, max=none, step=none) %}
<div class="mb-3">
    <label for="{{ name }}">{{ label }}</label>
    <input type="number" class="form-control" id="{{ name }}" name="{{ name }}" value="{{ value }}"
           {% if min is not none %}min="{{ min }}"{% endif %}
           {% if max is not none %}max="{{ max }}"{% endif %}
           {% if step is not none %}step="{{ step }}"{% endif %}>
    {{ _help(help) }}
</div>
{% endmacro %}

{% macro textarea(name, label, value='', help='', rows=3) %}
<div class="mb-3">
    <label for="{{ name }}">{{ label }}</label>
    <textarea class="form-control" id="{{ name }}" name="{{ name }}" rows="{{ rows }}">{{ value }}</textarea>
    {{ _help(help) }}
</div>
{% endmacro %}

{% macro select(name, label, options, selected='', help='', readonly=false, placeholder='') %}
<div class="mb-3">
    <label for="{{ name }}">{{ label }}</label>
    {# When disabled, add hidden input to submit the value (disabled fields don't submit) #}
    {% if readonly %}<input type="hidden" name="{{ name }}" value="{{ selected }}">{% endif %}
    <select class="form-control" id="{{ name }}"{% if not readonly %} name="{{ name }}"{% endif %}{% if readonly %} disabled{% endif %}>
        {% if placeholder %}<option value=""{% if not selected %} selected{% endif %}>{{ placeholder }}</option>{% endif %}
        {% for opt in options %}
        {# Support both plain values and (value, label) tuples #}
        {% if opt is iterable and opt is not string and opt | length == 2 %}
        <option value="{{ opt[0] }}"{% if opt[0] == selected %} selected{% endif %}>{{ opt[1] }}</option>
        {% else %}
        <option value="{{ opt }}"{% if opt == selected %} selected{% endif %}>{{ opt }}</option>
        {% endif %}
        {% endfor %}
    </select>
    {{ _help(help) }}
</div>
{% endmacro %}

{% macro checkbox(name, label, id, checked=false, value='true') %}
<div class="form-check mb-3">
    <input class="form-check-input" type="checkbox" name="{{ name }}" id="{{ id }}" value="{{ value }}"{% if checked %} checked{% endif %}>
    <label class="form-check-label" for="{{ id }}">{{ label }}</label>
</div>
{% endmacro %}

{% macro checkbox_list(name, label, options, selected=[], help='', scrollable=false) %}
<div class="mb-3">
    {# fieldset/legend so the group's name is announced with each option; a
       bare <label> beside a <div> names nothing. #}
    <fieldset>
    {# Reboot gives <legend> float:left, width:100% and font-size:1.5rem;
       these utilities put it back to the body-size label it replaces. #}
    <legend class="form-label float-none w-auto fs-6">{{ label }}</legend>
    {% if help %}<p class="form-text crud-help-block">{{ help }}</p>{% endif %}
    <div{% if scrollable %} class="crud-scrollable-list"{% endif %}>
        {% for opt in options %}
        {# Support both plain values and (value, label) tuples #}
        {% if opt is iterable and opt is not string and opt | length == 2 %}
        <div class="form-check">
            <input class="form-check-input" type="checkbox" id="{{ name }}_{{ loop.index }}" name="{{ name }}" value="{{ opt[0] }}"{% if opt[0] in selected %} checked{% endif %}>
            <label class="form-check-label" for="{{ name }}_{{ loop.index }}">{{ opt[1] }}</label>
        </div>
        {% else %}
        <div class="form-check">
            <input class="form-check-input" type="checkbox" id="{{ name }}_{{ loop.index }}" name="{{ name }}" value="{{ opt }}"{% if opt in selected %} checked{% endif %}>
            <label class="form-check-label" for="{{ name }}_{{ loop.index }}">{{ opt }}</label>
        </div>
        {% endif %}
        {% endfor %}
    </div>
    </fieldset>
</div>
{% endmacro %}

{% macro readonly_field(label, value, help='') %}
{% set _id = 'readonly-' ~ (label | lower | replace(' ', '-')) %}
<div class="mb-3">
    <label for="{{ _id }}">{{ label }}</label>
    <input type="text" id="{{ _id }}" class="form-control crud-readonly-field" value="{{ value }}" readonly>
    {{ _help(help) }}
</div>
{% endmacro %}

{% macro hidden_input(name, value) %}
<input type="hidden" name="{{ name }}" value="{{ value }}">
{% endmacro %}