{% set DEFAULT_CALLOUT_SETTINGS = {
  icon: '',
  title: '',
  canClose: false,
  closeAttrs: {
    '@click': '$root.remove()'
  },
  actions: []
} %}

{% macro Callout(settings = {}) %}
  {% set settings = merge(DEFAULT_CALLOUT_SETTINGS, settings) %}
  {% set classNames = [settings.className] %}

  <div class="callout {{ setClass(classNames) }}" x-data>
    {% if settings.icon %}
      <span class="callout__icon" aria-hidden="true">
        {{ Helpers.svg(settings.icon) }}
      </span>
    {% endif %}

    <div class="callout__content">
      {% if settings.title %}
        <p class="callout__title">{{ settings.title }}</p>
      {% endif %}
      <div class="callout__text">
        {{ caller() }}
      </div>
      {% if settings.actions | length %}
        <div class="callout__actions">
          {{ RenderButtonsList(settings.actions) }}
        </div>
      {% endif %}
    </div>

    {% if settings.canClose %}
      <button class="callout__close" type="button" aria-label="Dismiss" {{ Helpers.setAttributes(settings.closeAttrs) }}>
        <span aria-hidden="true">
          {{ Helpers.svg('icons/close') }}
        </span>
      </button>
    {% endif %}
  </div>
{% endmacro %}