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

{% macro Modal(name, dismissable=False) -%}
  <Modal inline-template ref={{ name }}>
    <div v-if='active'>
      <div class='modal' v-on:click='handleDismiss'>
        <div class='modal__dialog' role='dialog' aria-modal='true'>

          {% if dismissable %}
            <button class='icon-link modal__dismiss' v-on:click='handleDismiss'>
              {{ Icon('x') }}
              <span>Close</span>
            </button>
          {% endif %}

          <div class='modal__body'>
              {{ caller() }}
          </div>
        </div>
      </div>
    </div>
  </Modal>
{%- endmacro %}