{% load cf_ui %}
{% cf_ui_class as cf_class %}
  button
  {% if variant == 'primary' %}
    is-primary
  {% elif variant == 'secondary' %}
    is-link
  {% elif variant == 'success' %}
    is-success
  {% elif variant == 'warning' %}
    is-warning
  {% elif variant == 'danger' %}
    is-danger
  {% elif variant == 'info' %}
    is-info
  {% endif %}
  {% if size == 'small' %}
    is-small
  {% elif size == 'large' %}
    is-large
  {% endif %}
  {% if state == 'loading' %}
    is-loading
  {% endif %}
  {% if full_width %}
    is-fullwidth
  {% endif %}
  {% if class %}
    {{ class }}
  {% endif %}
{% endcf_ui_class %}
{% with cf_tag=href|yesno:"a,button" %}<{{ cf_tag }} class="{{ cf_class }}"{% if href %}{% if state == 'disabled' %} role="link" aria-disabled="true"{% else %} href="{{ href }}"{% endif %}{% else %} type="{{ type }}"{% if state == 'disabled' %} disabled{% endif %}{% endif %}{% cf_ui_render_attrs "button" attrs %}>{{ slot }}</{{ cf_tag }}>{% endwith %}