{#
/**
 * @file
 * CivicTheme Breadcrumb component.
 *
 * Props:
 * - theme: [string] Theme variation (light or dark).
 * - active_is_link: [boolean] Whether to show the active element as a link.
 * - attributes: [string] Additional HTML attributes.
 * - modifier_class: [string] Additional CSS classes.
 * - links: [array] Breadcrumb links:
 *   Each item contains:
 *   - text: [string] Link text.
 *   - url: [string] Link URL.
 */
#}

{% set theme_class = 'ct-theme-%s'|format(theme|default('light')) %}
{% set modifier_class = '%s %s'|format(theme_class, modifier_class|default('')) %}

{% if links %}
  {% set links_count = links|length %}
  {% set parent = false %}

  <nav class="ct-breadcrumb {{ modifier_class -}}" aria-label="breadcrumb" {% if attributes is not empty %}{{- attributes|raw -}}{% endif %}>
    {% set link_items = [] %}

    {% for link in links %}
      {% set link_item -%}
        {% set link = {
          text: link.text,
          url: link.url,
          theme: theme,
          is_active: (loop.index == links_count),
          attributes: (loop.index == links_count) ? 'aria-current="location"' : '',
          modifier_class: (loop.index == links_count) ? 'ct-breadcrumb__links__link ct-breadcrumb__links__link--active' : 'ct-breadcrumb__links__link',
        } %}

        {%- if (not active_is_link or link.url is empty) and (loop.index == links_count) -%}
          <span class="ct-breadcrumb__links__link ct-breadcrumb__links__link--active" aria-current="location">{{ link.text }}</span>
        {%- else -%}
          {%- include 'civictheme:link' with link only -%}
          {%- if loop.index < links_count -%}
            {%- include 'civictheme:icon' with {
              symbol: 'right-arrow-1',
              modifier_class: 'ct-breadcrumb__links__separator',
            } only -%}
          {% endif -%}
        {% endif %}
      {%- endset %}

      {% set link_items = link_items|merge([link_item]) %}

      {% if loop.index == links_count - 1 %}
        {% set parent = {
          text: link.text,
          url: link.url,
          theme: theme,
          icon: 'left-arrow',
          icon_placement: 'before',
          modifier_class: 'ct-breadcrumb__links__link',
        } %}
      {% endif %}
    {% endfor %}

    {% if parent %}
      {% set parent_link_item %}
        {% include 'civictheme:link' with parent only %}
      {% endset %}

      {% include 'civictheme:item-list' with {
        direction: 'horizontal',
        items: [parent_link_item],
        modifier_class: 'ct-breadcrumb__links show-xxs-flex hide-m',
      } only %}
    {% endif %}

    {% include 'civictheme:item-list' with {
      direction: 'horizontal',
      items: link_items,
      no_gap: true,
      modifier_class: 'ct-breadcrumb__links hide-xxs show-m-flex',
    } only %}
  </nav>
{% endif %}
