<nav class="c-search-pager" role="navigation" aria-label="Pagination">
  <ul class="c-search-pager__list">
    {{#if first}}
    <li>
      <a {{#if first.disabled}}aria-disabled="true" tabindex="-1"{{else}}href="#first"{{/if}} class="c-search-pager__item c-search-pager__item--arrow" aria-label="First">
        <svg class="c-search-pager__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">
          <use xlink:href="{{ basePath }}/assets/patterns/images/sprite.svg#icon-first-page"></use>
        </svg>
      </a>
    </li>
    {{/if}}
    {{#if previous}}
    <li>
      <a {{#if previous.disabled}}aria-disabled="true" tabindex="-1"{{else}}href="#previous"{{/if}} class="c-search-pager__item c-search-pager__item--arrow" aria-label="Previous" rel="prev">
        <svg class="c-search-pager__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">
          <use xlink:href="{{ basePath }}/assets/patterns/images/sprite.svg#icon-prev-page"></use>
        </svg>
      </a>
    </a>
    {{/if}}
    {{#each items}}
    <li>
      <a {{#if this.active}}aria-current="page" aria-disabled="true"{{else}}href="#page{{this.label}}"{{/if}} class="c-search-pager__item c-search-pager__item--num">
        <span>{{this.label}}</span>{{#if this.active}}<span class="u-visually-hidden">(current){{/if}}</span>
      </a>
    </li>
    {{/each}}
    {{#if next}}
    <li>
      <a {{#if next.disabled}}aria-disabled="true"{{else}}href="#next"{{/if}} class="c-search-pager__item c-search-pager__item--arrow" aria-label="Next" rel="next">
        <svg class="c-search-pager__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">
          <use xlink:href="{{ basePath }}/assets/patterns/images/sprite.svg#icon-next-page"></use>
        </svg>
      </a>
    </li>
    {{/if}}
    {{#if last}}
    <li>
      <a {{#if last.disabled}}aria-disabled="true"{{else}}href="#last"{{/if}} class="c-search-pager__item c-search-pager__item--arrow" aria-label="Last">
        <svg class="c-search-pager__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">
          <use xlink:href="{{ basePath }}/assets/patterns/images/sprite.svg#icon-last-page"></use>
        </svg>
      </a>
    </li>
    {{/if}}
  </ul>
</nav>
