{% from "components/icon.html" import Icon %}

{% macro Modal(name, dismissable=False, classes="") -%}
  <div v-show="$root.activeModal === '{{name}}'" v-cloak>
    <div id='modal--{{name}}' class='modal {% if dismissable %}modal--dismissable{% endif%} {{ classes }}'>
      <div class='modal__container'>
        <div class='modal__dialog' role='dialog' aria-modal='true'>
          <div class='modal__body'>
            {{ caller() }}

            {% if dismissable %}
              <button type='button' class='icon-link modal__dismiss' v-on:click='closeModal("{{name}}")'>
                {{ Icon('x') }}
                <span>
                  {{ "common.close" | translate }}
                </span>
              </button>
            {% endif %}
          </div>
        </div>
      </div>
    </div>
  </div>
{%- endmacro %}