div(ng-cloak).banner
  dl.api-key
    dt Display:
    dd.directive(ng-class='{ active: apiType === "directive" }' ng-click='setType("directive")') Directive
    dd.class(ng-class='{ active: apiType === "class" }' ng-click='setType("class")') Class
    dd.interface(ng-class='{ active: apiType === "interface" }' ng-click='setType("interface")') Interface
    dd.function(ng-class='{ active: apiType === "function" }' ng-click='setType("function")') Function
    dd.const(ng-class='{ active: apiType === "const" }' ng-click='setType("const")') Const or Enum
    dd.var(ng-class='{ active: apiType === "var" }' ng-click='setType("var")') Variable
  input.api-filter(placeholder='Filter', ng-model='apiFilter')
article(class="l-content-small grid-fluid docs-content")
  div(ng-repeat='section in apiSections' ng-if="(apiList[section.name] | filter: { title: apiFilter, docType: apiType }).length" ng-cloak)
    h3 {{ section.title }}
    ul.api-list
      li.api-item(ng-repeat='item in apiList[section.name] | filter: { title: apiFilter, docType: apiType }')
        a(ng-href='{{ section.name }}/{{ item.title }}-{{ item.docType === "directive" ? "class" : item.docType }}.html')
          span(class='symbol {{ item.docType }}')
          | {{ item.title }}