{# Petits morceaux partagés par les formulaires de compte (vitrine/auth.html.twig).
   Usage : {% import 'vitrine/_auth_fields.html.twig' as auth %} #}

{# Bouton « afficher / masquer » posé dans un .auth-password, à côté du champ `id`. #}
{% macro eye(id) %}
    {% import 'vitrine/_icons.html.twig' as icons %}
    <button type="button" class="auth-eye" data-toggle-password="{{ id }}" aria-pressed="false" aria-label="Afficher le mot de passe">
        <span class="auth-eye__show">{{ icons.icon('eye', 20) }}</span>
        <span class="auth-eye__hide">{{ icons.icon('eye-off', 20) }}</span>
    </button>
{% endmacro %}

{# Messages d'erreur d'un champ. `id` sert d'ancre à l'aria-describedby du champ,
   pour que le lecteur d'écran énonce la raison du refus et pas seulement « invalide ». #}
{% macro errors(id, errorLists) %}
    {% import 'vitrine/_icons.html.twig' as icons %}
    {% set messages = [] %}
    {% for list in errorLists %}{% for e in list %}{% set messages = messages|merge([e.message]) %}{% endfor %}{% endfor %}
    {% if messages is not empty %}
        <div id="{{ id }}">
            {% for message in messages %}
                <p class="form-error">{{ icons.icon('alert-triangle', 16) }} <span>{{ message }}</span></p>
            {% endfor %}
        </div>
    {% endif %}
{% endmacro %}