{% load templates generator %}
<nav id="navbar" class="page-navbar">
    <div class="collapse navbar-collapse">
    {% with "navbar-dropdown-"|generator as navbar_dropdown_id %}
    {% block navbar_start %}
        <ul class="navbar-nav me-auto my-0">
            {% if navbar %}
                {% for item in navbar %}
                    <li class="nav-item">
                        {% if item.template %}
                            {% include item.template|template:theme %}
                        {% elif item.widget %}
                            {{ item.widget|safe }}
                        {% elif item.url %}
                            <a class="nav-link" href="{{ item.url }}">{{ item.title }}</a>
                        {% elif item.menu %}
                            <div class="nav-item dropdown">
                                <a class="nav-link dropdown-toggle" href="#" id="{{ navbar_dropdown_id.next }}" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                    {{ item.title }}
                                </a>
                                <ul class="dropdown-menu" aria-labelledby="{{ navbar_dropdown_id }}">
                                    {% for subitem in item.menu %}
                                        <li>
                                            {% if subitem.widget %}
                                                {{ subitem.widget|safe }}
                                            {% elif subitem.url %}
                                                <a class="dropdown-item" href="{{ subitem.url }}">{{ subitem.title }}</a>
                                            {% else %}
                                                <span class="dropdown-item">{{ subitem.title }}</span>
                                            {% endif %}
                                        </li>
                                    {% endfor %}
                                </ul>
                            </div>
                        {% else %}
                            <button type="button" class="nav-link">{{ item.title }}</span>
                        {% endif %}
                    </li>
                {% endfor %}
            {% endif %}
        </ul>
    {% endblock navbar_start %}
    {% block navbar_end %}
        {% if navbar_end %}
            <ul class="navbar-nav ms-auto">
                {% for item in navbar_end %}
                    <li class="nav-item">
                        {% if item.widget %}
                            {{ item.widget|safe }}
                        {% elif item.url %}
                            <a class="nav-link" href="{{ item.url }}">{{ item.title }}</a>
                        {% elif item.menu %}
                            <div class="nav-item dropdown">
                                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownEnd" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                    {{ item.title }}
                                </a>
                                <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdownEnd">
                                    {% for subitem in item.menu %}
                                        <li>
                                            {% if subitem.widget %}
                                                {{ subitem.widget|safe }}
                                            {% elif subitem.url %}
                                                <a class="dropdown-item" href="{{ subitem.url }}">{{ subitem.title }}</a>
                                            {% else %}
                                                <span class="dropdown-item">{{ subitem.title }}</span>
                                            {% endif %}
                                        </li>
                                    {% endfor %}
                                </ul>
                            </div>
                        {% else %}
                            <span class="nav-link">{{ item.title }}</span>
                        {% endif %}
                    </li>
                {% endfor %}
            </ul>
        {% endif %}
    {% endblock navbar_end %}
    {% endwith %}</div>
</nav>