{% set DROPDOWN_DEFAULTS = {
  className: '',
  dataDropdown: 'id',
  isOpen: false,
  dropdownActiveClass: '',
  classNameWrapper: ''
} %}

{% macro Dropdown( settings = {} ) %}
  {% set settings = merge(DROPDOWN_DEFAULTS, settings) %}
  {% set className = [
    settings.className
  ] %}
  {% set directive = 'x-dropdown.open' if settings.isOpen else 'x-dropdown' %}

  <div
    class="dropdown {{ setClass(className) }}"
    {{ Helpers.setAttr('data-active-class', settings.dropdownActiveClass) }}
    {{ Helpers.setAttr(directive, settings.dataDropdown) }}
  >
    <div class="dropdown__wrapper {{ settings.classNameWrapper }}">
      {{ caller() }}
    </div>
  </div>
{% endmacro %}