{% extends default ? "partials/field.html.twig" : 'forms/' ~ layout|default('field') ~ '.html.twig' %}

{% block input %}
    {% set local_fonts = gantry.theme.details.configuration['fonts']|default([]) %}
    {% set map = [] %}
    {% for name, variants in local_fonts %}
        {% if variants is iterable %}{% set variants = variants|keys %}
        {% else %}{% set variants = ['regular'] %}{% endif %}
        {% set map = map|merge([{ family: name, variants: variants }]) %}
    {% endfor %}

    <div class="g-fonts">
        <div class="input-group append">
            <input
                    {# required attribute structures #}
                    type="text"
                    name="{{ (scope ~ name)|fieldName }}"
                    value="{{ value|join(', ') }}"
                    {# global attribute structures #}
                    {{ block('global_attributes') }}
                    {# non-gloval attribute structures #}
                    {% if field.autocomplete in ['on', 'off'] %}autocomplete="{{ field.autocomplete }}"{% endif %}
                    {% if field.autofocus in ['on', 'true', 1] %}autofocus="autofocus"{% endif %}
                    {% if field.disabled in ['on', 'true', 1] %}disabled="disabled"{% endif %}
                    {% if field.list is defined %}list="{{ field.list }}"{% endif %}
                    />
            {% set picker = {'field':'input[name="' ~ ((scope ~ name)|fieldName|e) ~ '"]'} %}
            <span class="input-group-btn">
                <button class="button" type="button" aria-label="{{ 'GANTRY5_PLATFORM_SELECT'|trans }} {{ field.label|trans_key('GANTRY5_FORM_FIELD', scope, name, 'LABEL') }}" data-g5-fontpicker="{{ picker|json_encode()|e('html_attr') }}">
                    <i class="fa fa-font" aria-hidden="true"></i>
                </button>
            </span>
        </div>
    </div>
{% endblock %}