{# ========================================================================= #}
{# :: Imports #}
{# ========================================================================= #}
{# atoms #}
{% import "styleguides/general/atoms/label/label-macros.njk" as label %}
{% import "styleguides/general/atoms/radio/radio-macros.njk" as radioChild %}
{% import "styleguides/general/atoms/checkbox/checkbox-macros.njk" as checkboxChild %}

{# ========================================================================= #}
{# :: Radio #}
{# ========================================================================= #}
{% macro radio(classes, data) %}

<div class="o-toggle-group {{classes}}">
  {% if data.label %}
    {{label.default("o-toggle-group__label " + data.label.classes, {
      text: data.label.text
    })}}
  {% endif %}

  <ul class="o-toggle-group__list {{data.listClasses}}">
    {% for item in data.items %}

      <li class="o-toggle-group__item {{item.classes}}">
        {{radioChild.default("", item.data)}}
      </li>

    {% endfor %}
  </ul>
</div>

{% endmacro %}

{# ========================================================================= #}
{# :: Checkbox #}
{# ========================================================================= #}
{% macro checkbox(classes, data) %}

<div class="o-toggle-group {{classes}}">
  {% if data.label %}
    {{label.default("o-toggle-group__label " + data.label.classes, {
      text: data.label.text
    })}}
  {% endif %}

  <ul class="o-toggle-group__list {{data.listClasses}}">
    {% for item in data.items %}

      <li class="o-toggle-group__item {{item.classes}}">
        {{checkboxChild.default("", item.data)}}
      </li>

    {% endfor %}
  </ul>
</div>

{% endmacro %}