{% load design_components %}
{% if href %}
    <a href="{{ href }}"
       role="button"
       draggable="false"
       class="great-ds-button{% if classes %} {{ classes }}{% endif %}"
       data-module="great-ds-button"
       {% if attributes %}{{ attributes|safe }}{% endif %}
       {% if id %}id="{{ id }}"{% endif %}>
        {% if iconPrefix %}{{ iconPrefix }}{% endif %}
        {% if html %}{{ html|safe }}{% else %}<span class="great-ds-button__text">{{ text }}</span>{% endif %}
        {% if iconSuffix %}{{ iconSuffix }}{% endif %}
        {% if is_start_button %}
            <svg class="govuk-button__start-icon"
                 xmlns="http://www.w3.org/2000/svg"
                 width="17"
                 height="19"
                 viewBox="0 0 33 40"
                 aria-hidden="true"
                 focusable="false">
                <path fill="currentColor" d="M0 0h13l20 20-20 20H0l20-20z" />
            </svg>
        {% endif %}
    </a>
{% elif input %}
    <input value="{{ text }}"
           type="{% if type %}{{ type }}{% else %}submit{% endif %}"
           class="great-ds-button{% if classes %} {{ classes }}{% endif %}"
           data-module="great-ds-button"
           {% if attributes %}{{ attributes|safe }}{% endif %}
           {% if id %}id="{{ id }}"{% endif %}
           {% if name %}name="{{ name }}"{% endif %}
           {% if disabled %}disabled aria-disabled="true"{% endif %}
           {% if prevent_double_click and type == "submit" %}data-prevent-double-click="true"{% endif %}>
{% else %}
    <button {% if value %}value="{{ value }}"{% endif %}
            type="{% if type %}{{ type }}{% else %}submit{% endif %}"
            class="great-ds-button{% if classes %} {{ classes }}{% endif %}"
            data-module="great-ds-button"
            {% if id %}id="{{ id }}"{% endif %}
            {% if attributes %}{{ attributes|safe }}{% endif %}
            {% if name %}name="{{ name }}"{% endif %}
            {% if disabled %}disabled aria-disabled="true"{% endif %}
            {% if prevent_double_click and type == "submit" %}data-prevent-double-click="true"{% endif %}>
        {% if iconPrefix %}{{ iconPrefix }}{% endif %}
        {% if html %}{{ html|safe }}{% else %}<span class="great-ds-button__text">{{ text }}</span>{% endif %}
        {% if iconSuffix %}{{ iconSuffix }}{% endif %}
        {% if is_start_button %}
            <svg class="govuk-button__start-icon"
                 xmlns="http://www.w3.org/2000/svg"
                 width="17"
                 height="19"
                 viewBox="0 0 33 40"
                 aria-hidden="true"
                 focusable="false">
                <path fill="currentColor" d="M0 0h13l20 20-20 20H0l20-20z" />
            </svg>
        {% endif %}
    </button>
{% endif %}