{% set isActive = item.category.id == activeId %}

{# @deprecated tag:v6.8.0 - Variable declaration has been moved to `@Storefront/storefront/layout/navigation/offcanvas/categories.html.twig` template #}
{% if not feature('v6.8.0.0') %}
    {% set hasChildren = item.category.visibleChildCount > 0 %}
{% endif %}
{% set url = item.category.seoUrl %}
{% set name = item.category.translated.name %}

{% block layout_navigation_offcanvas_navigation_category_item_link %}
    <li class="navigation-offcanvas-list-item">
        {% block layout_navigation_offcanvas_navigation_categories_list_category_item_link %}
            <a
                class="navigation-offcanvas-link nav-item nav-link{% if isActive %} active{% endif %}{% if hasChildren %} js-navigation-offcanvas-link{% endif %}"
                href="{{ url }}"
                title="{{ name }}"
                itemprop="url"
                {% if hasChildren %}
                    data-href="{{ path('frontend.menu.offcanvas', {navigationId: item.category.id}) }}"
                {% endif %}
                {% if item.category.shouldOpenInNewTab %}
                    target="_blank"
                {% endif %}
            >
                {% block layout_navigation_offcanvas_navigation_categories_list_category_item_link_text %}
                    <span itemprop="name">{{ name }}</span>
                    {% if hasChildren %}
                        {% block layout_navigation_offcanvas_navigation_categories_list_category_item_link_icon %}
                            <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon">
                                {% sw_icon 'arrow-medium-right' style { pack:'solid', size: 'sm' } %}
                            </span>
                        {% endblock %}
                    {% endif %}
                {% endblock %}
            </a>
        {% endblock %}
    </li>
{% endblock %}