{# ========================================================================== #}
{# :: Imports #}
{# ========================================================================== #}
{% import "components/icon.njk" as icon %}

{# ========================================================================== #}
{# :: Private macros _content #}
{# ========================================================================== #}
{% macro _content(data) %}
	{% if data.iconBefore %}
		{{icon.default("bp-c-action__icon", { name: data.iconBefore })}}
	{% endif %}

	<span class="bp-c-action__text">{{data.text}}</span>

	{% if data.iconAfter %}
		{{icon.default("bp-c-action__icon", { name: data.iconAfter })}}
	{% endif %}
{% endmacro %}

{# ========================================================================== #}
{# :: Default #}
{# ========================================================================== #}
{% macro default(classes, data) %}

	<button
		class="bp-c-action {{classes}} {{'bp-js-overlay-trigger' if data.overlay}}"
		{% if data.overlay %}data-overlay-target="{{data.overlay.id}}" data-overlay-type="{{data.overlay.type}}"{% endif %}
	>
		{{_content(data)}}
	</button>

{% endmacro %}

{# ========================================================================== #}
{# :: Link #}
{# ========================================================================== #}
{% macro link(classes, data) %}

	<a class="bp-c-action {{classes}}" href="{{data.url}}"
		{% if data.overlayId %} data-overlay-target={{data.overlayId}} {% endif %}
		{% if data.imageId %} data-image-target={{data.imageId}} {% endif %}
	>
		{{_content(data)}}
	</a>

{% endmacro %}