{% load i18n phoxtail_design_tags %}
{# Items only — swapped into #wid-results by HTMX search; panel wrapper lives in input.html #}
{% with wid=widget_id|default:field.html_name %}
    {% if available_items %}
        {% for item in available_items|slice:":20" %}
            {% if not forloop.first %}<div class="fw-search-divider"></div>{% endif %}
            <button type="button"
                    class="fw-search-item"
                    hx-get="{{ search_url }}"
                    hx-include="#{{ wid }}-selected-value{% if hx_include %}, {{ hx_include }}{% endif %}"
                    hx-vals='{"{{ wid }}_select": "{{ item.pk }}"}'
                    hx-target="#{{ wid }}-container"
                    hx-swap="innerHTML">
                {% if item_template %}
                    {% include item_template with item=item %}
                {% else %}
                    <span class="fw-search-item-text">{{ item }}</span>
                {% endif %}
            </button>
        {% endfor %}
    {% else %}
        <div class="fw-search-empty">
            {% if search_value %}{% trans "No matches found" %}{% else %}{% trans "No options available" %}{% endif %}
        </div>
    {% endif %}
{% endwith %}