{#
/**
 * @file
 * Template for Button component.
 */
#}
{% set type = button_type %}
{% set icon_position = icon_position|default('left') %}
{% set block = block|default(false) %}
{% set disabled = disabled|default(false) %}
{% set attributes = attributes|default(create_attribute()) %}

{% set classes = [
  'kern-btn',
  variant ? 'kern-btn--' ~ variant : 'kern-btn--secondary',
  block ? 'kern-btn--block',
] %}

{% set button_content %}
  {% if icon and icon_position != 'right' %}
    {{ icon }}
  {% endif %}
  <span class="kern-label">{{ label }}</span>
  {% if icon and icon_position == 'right' %}
    {{ icon }}
  {% endif %}
{% endset %}

{% if href %}
  <a href="{{ href }}"
     {% if target %}target="{{ target }}"{% endif %}
     {% if rel %}rel="{{ rel }}"{% endif %}
     {% if alt %}aria-label="{{ alt }}"{% endif %}
     {{ attributes.addClass(classes) }}>
    {{ button_content }}
  </a>
{% else %}
  <button {% if type %}type="{{ type }}"{% endif %}
          {% if disabled %}disabled{% endif %}
          {% if alt %}aria-label="{{ alt }}"{% endif %}
          {{ attributes.addClass(classes) }}>
    {{ button_content }}
  </button>
{% endif %}

