<ul class="umb-sub-views-nav" ng-show="showNavigation">

    <li ng-repeat="navItem in navigation | limitTo: itemsLimit ">
        <div ng-show="navItem.alias !== 'more'"
            ng-class="navItem.errorClass">
            <umb-editor-navigation-item
                item="navItem"
                on-open="openNavigationItem(item)"
                on-open-anchor="openAnchorItem(item, anchor)"
                hotkey="$index + 1">
            </umb-editor-navigation-item>
        </div>
    </li>

    <li ng-show="showMoreButton" style="position: relative;">

        <div class="umb-sub-views-nav-item umb-sub-views-nav-item-more">

            <a data-element="sub-view-{{moreButton.alias}}"
                href=""
                ng-click="toggleDropdown()"
                ng-class="{'is-active': moreButton.active}">
                <div class="umb-sub-views-nav-item-more__icon"><i></i><i></i><i></i></div>
                <span class="umb-sub-views-nav-item-text">{{ moreButton.name }}</span>
            </a>

            <umb-dropdown ng-show="showDropdown" on-close="hideDropdown()" class="umb-sub-views-nav-item-more__dropdown">
                <umb-dropdown-item ng-repeat="navItem in navigation | limitTo: overflowingItems">
                    <umb-editor-navigation-item
                        item="navItem"
                        on-open="openNavigationItem(item)"
                        on-open-anchor="openAnchorItem(item, anchor)"
                        index="{{$index}}">
                    </umb-editor-navigation-item>
                </umb-dropdown-item>
            </umb-dropdown>

        </div>

    </li>

</ul>
