{# ========================================================================= #}
{# :: Imports #}
{# ========================================================================= #}

{# ========================================================================= #}
{# :: Default #}
{# ========================================================================= #}
{% macro default(classes, data) %}
<div class="a-switch {{classes}}">
  <input type="checkbox" class="a-switch__checkbox" id="{{data.id}}" />

  <label for="{{data.id}}" class="a-switch__container">
    <p class="a-switch__text a-switch__text--off">{{data.labelOn}}</p>

    <div class="a-switch__button">
      <span class="a-switch__outer"></span>

      <span class="a-switch__inner-container">
        <span class="a-switch__inner"></span>
      </span>
    </div>

    <p class="a-switch__text a-switch__text--on">{{data.labelOff}}</p>
  </label>
</div>
{% endmacro %}

{# ========================================================================= #}
{# :: Disabled #}
{# ========================================================================= #}
{% macro defaultDisabled(classes, data) %}
<div class="a-switch is-disabled {{classes}}">
  <input type="checkbox" class="a-switch__checkbox" id="{{data.id}}" disabled/>

  <label for="{{data.id}}" class="a-switch__container">
    <p class="a-switch__text a-switch__text--off">{{data.labelOn}}</p>

    <div class="a-switch__button">
      <span class="a-switch__outer"></span>

      <span class="a-switch__inner-container">
        <span class="a-switch__inner"></span>
      </span>
    </div>

    <p class="a-switch__text a-switch__text--on">{{data.labelOff}}</p>
  </label>
</div>
{% endmacro %}