<!-- Semmet Angular: Navbar — https://www.w3.org/WAI/tutorials/menus/ -->
<!--
Usage from a parent component template:
Import <%= classify(name) %>, <%= classify(name) %>Item, <%= classify(name) %>Toggle and <%= classify(name) %>Menu
in that parent component. This directive set never owns markup: bring your own <nav>, brand, toggle
button and links, in whatever structure the layout needs.

<nav <%= camelize(name) %> label="Main navigation" #nav="<%= camelize(name) %>">
  <a class="brand" href="/">Acme</a>

  <button type="button" <%= camelize(name) %>Toggle aria-label="Toggle navigation">
    <span aria-hidden="true"></span>
  </button>

  <div <%= camelize(name) %>Menu>
    <ul>
      @for (item of items; track item.href) {
        <li>
          <a
            <%= camelize(name) %>Item
            [href]="item.href"
            [current]="item.current"
            [disabled]="item.disabled"
            #navLink="<%= camelize(name) %>Item"
            [class.active]="item.current"
          >
            {{ item.label }}
          </a>
        </li>
      }
    </ul>
  </div>
</nav>
-->
