{# LIBRARIES #}
{{ attach_library('ui_patterns/libraries.bs_breadcrumb') }}
{{ attach_library('ui_patterns/bs_breadcrumb.bs_breadcrumb_lib') }}

{# VARIABLES #}
{% set chevron = global_icon_right|default('fas fa-chevron-right') %}
{% set devider = separator|default('|') %}
{% set no_first_underline = no_first_underline|default(false) %}
{% set style = style|default('underline') %}
{% if style == 'background' %}
  {% set style_class = ' brd-crm-sb' %}
  {% set underline_class = no_first_underline ? ' brd-crm-nfu' : '' %}
{% else %}
  {% set style_class = ' brd-crm-su' %}
  {% set underline_class = '' %}
{% endif %}
{% if separator == 'slash' %}{% set devider = "/" %}{% endif %}
{% if separator == 'pipe' %}{% set devider = "|" %}{% endif %}
{% if separator == 'arrow' %}{% set devider = "&gt;" %}{% endif %}
{% if separator == 'raquo' %}{% set devider = "&raquo;" %}{% endif %}
{% if separator == 'icon' %}{% set devider = "<i class='fal fa-angle-right'></i>" %}{% endif %}
{% if separator == 'angle' %}{% set devider = "<i class='fal fa-angle-right'></i>" %}{% endif %}
{% if separator == 'chevron' %}{% set devider = "<i class='" ~ chevron ~ "'></i>" %}{% endif %}
{% if separator starts with 'fa' %}{% set devider = "<i class='" ~ separator ~ "'></i>" %}{% endif %}

{# TEMPLATE #}
{% if breadcrumb %}
  <nav aria-label="breadcrumb" class="{{ utility_classes|join(' ') }} brd-crm{{ style_class }}{{ underline_class }}">
    <ol class="breadcrumb mb-1">
      {%- for item in breadcrumb %}
        <li class="breadcrumb-item {{ not item.url ? 'active' }}">
          {% if item.url %}
            <a class="bci-text" href="{{ item.url }}">{{ item.text }}</a>{% if not loop.last %}{{ devider|raw }}{% endif %}
          {% else %}
            <span class="bci-text">{{ item.text }}</span>{% if not loop.last %}{{ devider|raw }}{% endif %}
          {% endif %}
        </li>
      {%- endfor %}
    </ol>
  </nav>
{% endif %}
