{#
/**
 * @file
 * CivicTheme Mobile Navigation Close component.
 *
 * Props:
 * - theme: [string] Theme variation (light or dark).
 * - text: [string] Text for the button.
 * - attributes: [string] Additional HTML attributes.
 * - modifier_class: [string] Additional CSS classes.
 */
#}

{% set theme_class = 'ct-theme-%s'|format(theme|default('light')) %}
{% set modifier_class = '%s %s'|format(theme_class, modifier_class|default('')) %}
{% set attributes = '%s %s'|format('data-flyout-close-all-trigger', attributes|default('')) %}
{% set text = text|default('Close') %}

<div class="ct-mobile-navigation-close {{ modifier_class -}}">
  {% include 'civictheme:button' with {
    theme: theme,
    type: 'tertiary',
    kind: 'button',
    size: 'small',
    text: text,
    icon: 'close',
    icon_placement: 'after',
    attributes: attributes,
    modifier_class: 'ct-mobile-navigation-close__button',
  } only %}
</div>
