{% load crispy_forms_field %}

<div class="join w-full flex mb-3"
     role="group"
     aria-label="{{ field.label }}"
     _="on click
        if no <input[type='checkbox']:checked/> in me
          set nextCheckbox to the next <input[type='checkbox']/> from event.target within me with wrapping
          call nextCheckbox.click()
        end">
    {% for choice in field.field.choices %}
        <input type="checkbox"
               class="join-item btn btn-secondary btn-outline grow"
               name="{{ field.html_name }}"
               id="{{ field.html_name }}_{{ forloop.counter }}"
               value="{{ choice.0 }}"
               aria-label="{{ choice.1 }}"
               {% if choice.0 in field.value %}checked{% endif %}>
    {% endfor %}
</div>
