<div class="sidebar-block-header">
  <h2><%- @T(@title) %></h2>
</div>

<div class="btn-list horizontal">
  <a href="#" class="btn btn--action btn--small btn--create js-add" <% if !@enabled: %>disabled<% end %> >
    <%- @Icon('plus-small') %> <span><%- @T('Add') %></span>
  </a>
  <a href="#" class="js-reorder btn btn--action btn--small" <% if !@enabled: %>disabled<% end %>>
    <%- @Icon('rearange') %> <span><%- @T('Change order') %></span>
  </a>
</div>

<ul class="kb-sidebar-block-content nav nav-pills nav-stacked">
  <% if @items.length > 0: %>
    <% for elem in @items: %>
      <li>
        <a href="<%= elem.url %>" class="<%= elem.className %>">
          <%- @iconWithModifier(elem, className: 'section-inner-icon-holder', iconset: @iconset, addStateClass: true) %>
          <span class="u-textTruncate"><%= elem.title %></span>

          <% if elem.icons: %>
          <span class="flex-spacer"></span>
            <% for key, value of elem.icons: %>
              <%- @Icon(key) %>
            <% end %>
          <% end %>

          <% if elem.count != null: %>
            <span class="badge badge--text"><%= elem.count %></span>
          <% end %>
        </a>
      </li>
    <% end %>
  <% else: %>
    <li>
      <span class="nav-pills-placeholder"><%- @T(@emptyNote) %></span>
    </li>
  <% end %>
</ul>

