{# A button of a form component action. vars: form, a #}
{% import "tungsten/components/ui.html" as ui %}
{% set label_html %}{{ icon(a.icon, 'h-4 w-4') }}{% if a.style != 'icon' and not a.hidden_label %}<span>{{ a.label }}</span>{% endif %}{% if a.badge %}<span class="rounded-full bg-white/20 px-1.5 text-xs">{{ a.badge }}</span>{% endif %}{% endset %}
{% set cls = ui.button_classes(a.color, a.style, a.size, a.outlined) %}
{% if a.disabled %}
<button type="button" class="{{ cls }} cursor-not-allowed opacity-50" disabled {% if a.tooltip %}title="{{ a.tooltip }}"{% endif %}>{{ label_html }}</button>
{% elif a.url %}
<a href="{{ a.url }}" class="{{ cls }}" {% if a.new_tab %}target="_blank" rel="noopener"{% endif %}
   {% if a.tooltip %}title="{{ a.tooltip }}" aria-label="{{ a.tooltip }}"{% endif %}>{{ label_html }}</a>
{% else %}
<button type="button" class="{{ cls }}" data-tw-form-action {% if a.tooltip %}title="{{ a.tooltip }}" aria-label="{{ a.tooltip }}"{% endif %}
        hx-post="{{ form.refresh_url }}" hx-target="#{{ form.id }}" hx-swap="outerHTML" hx-include="closest form"
        hx-sync="closest form:replace" hx-vals='{{ {"_tw_ui_action": a.ui_action} | tojson }}'>{{ label_html }}</button>
{% endif %}