{% sw_extends '@Storefront/storefront/layout/breadcrumb.html.twig' %}

{% block layout_breadcrumb_list %}
    <ol class="breadcrumb"
        itemscope
        itemtype="https://schema.org/BreadcrumbList">

        <li class="breadcrumb-item">
                <a href="{{ path('frontend.home.page') }}"
                   itemprop="url"
                   title="{{ "general.homeLink"|trans|striptags }}">
                   <span>{{ "general.homeLink"|trans|sw_sanitize }}</span>
                </a>
            </li> 
            <li class="breadcrumb-item">
                <span class="breadcrumb-placeholder">
                    {% sw_icon 'icon-arrow' style { 'pack':'custom', 'namespace': 'SsikLibertyTheme', 'class':'ssik xxs' } %}
                </span>
            </li>

        {% for breadcrumbCategory in breadcrumbCategories %}
            {% set key = breadcrumbCategory.id %}
            {% set name = breadcrumbCategory.translated.name %}

            {% block layout_breadcrumb_list_item %}
                <li class="breadcrumb-item"
                    {% if key is same as(categoryId) %}aria-current="page"{% endif %}
                    itemprop="itemListElement"
                    itemscope
                    itemtype="https://schema.org/ListItem">
                    {% if breadcrumbCategory.type == 'folder' %}
                        <div itemprop="item">
                            <div itemprop="name">{{ name }}</div>
                        </div>
                    {% else %}
                        <a href="{{ category_url(breadcrumbCategory) }}"
                            class="breadcrumb-link {% if key is same as(categoryId) %} is-active{% endif %}"
                            title="{{ name }}"
                            {% if category_linknewtab(breadcrumbCategory) %}target="_blank"{% endif %}
                            itemprop="item">
                            <link itemprop="url"
                                    href="{{ category_url(breadcrumbCategory) }}">
                            <span class="breadcrumb-title" itemprop="name">{{ name }}</span>
                        </a>
                    {% endif %}
                    <meta itemprop="position" content="{{ loop.index }}">
                </li>
            {% endblock %}

            {% block layout_breadcrumb_placeholder %}
                {% if key != breadcrumbKeys|last %}
                    <li class="breadcrumb-item">
                        <span class="breadcrumb-placeholder">
                            {% sw_icon 'icon-arrow' style { 'pack':'custom', 'namespace': 'SsikLibertyTheme', 'class':'ssik xxs' } %}
                        </span>
                    </li>
                {% endif %}
            {% endblock %}
        {% endfor %}
    </ol>
{% endblock %}