@paddls/ngx-easy-table/esm2022/lib/features/pagination/template.mjs

Angular easy table

/**
 * The default template and styles for the pagination links are borrowed directly
 * from Zurb Foundation 6: http://foundation.zurb.com/sites/docs/pagination.html
 */
export const DEFAULT_TEMPLATE = `
    <pagination-template  #p="paginationApi"
                         [id]="id"
                         [maxSize]="maxSize"
                         (pageChange)="pageChange.emit($event)"
                         (pageBoundsCorrection)="pageBoundsCorrection.emit($event)">
    <nav role="navigation" [attr.aria-label]="screenReaderPaginationLabel">
    <ul class="ngx-pagination" 
        [class.responsive]="responsive"
        *ngIf="!(autoHide && p.pages.length <= 1)">

        <li class="pagination-previous" [class.disabled]="p.isFirstPage()" *ngIf="directionLinks"> 
            <a tabindex="0" *ngIf="1 < p.getCurrent()" (keyup.enter)="p.previous()" (click)="p.previous()">
                {{ previousLabel }} <span class="show-for-sr">{{ screenReaderPageLabel }}</span>
            </a>
            <span *ngIf="p.isFirstPage()" aria-disabled="true">
                {{ previousLabel }} <span class="show-for-sr">{{ screenReaderPageLabel }}</span>
            </span>
        </li> 

        <li class="small-screen">
            {{ p.getCurrent() }} / {{ p.getLastPage() }}
        </li>

        <li [class.current]="p.getCurrent() === page.value" 
            [class.ellipsis]="page.label === '...'"
            *ngFor="let page of p.pages; trackBy: trackByIndex">
            <a tabindex="0" (keyup.enter)="p.setCurrent(page.value)" (click)="p.setCurrent(page.value)" *ngIf="p.getCurrent() !== page.value">
                <span class="show-for-sr">{{ screenReaderPageLabel }} </span>
                <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>
            </a>
            <ng-container *ngIf="p.getCurrent() === page.value">
              <span aria-live="polite">
                <span class="show-for-sr">{{ screenReaderCurrentLabel }} </span>
                <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span> 
              </span>
            </ng-container>
        </li>

        <li class="pagination-next" [class.disabled]="p.isLastPage()" *ngIf="directionLinks">
            <a tabindex="0" *ngIf="!p.isLastPage()" (keyup.enter)="p.next()" (click)="p.next()">
                 {{ nextLabel }} <span class="show-for-sr">{{ screenReaderPageLabel }}</span>
            </a>
            <span *ngIf="p.isLastPage()" aria-disabled="true">
                 {{ nextLabel }} <span class="show-for-sr">{{ screenReaderPageLabel }}</span>
            </span>
        </li>

    </ul>
    </nav>
    </pagination-template>
    `;
export const DEFAULT_STYLES = `
.ngx-pagination {
  margin-left: 0;
  margin-bottom: 1rem; }
  .ngx-pagination::before, .ngx-pagination::after {
    content: ' ';
    display: table; }
  .ngx-pagination::after {
    clear: both; }
  .ngx-pagination li {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    margin-right: 0.0625rem;
    border-radius: 0; }
  .ngx-pagination li {
    display: inline-block; }
  .ngx-pagination a,
  .ngx-pagination button {
    color: #0a0a0a; 
    display: block;
    padding: 0.1875rem 0.625rem;
    border-radius: 0; }
    .ngx-pagination a:hover,
    .ngx-pagination button:hover {
      background: #e6e6e6; }
  .ngx-pagination .current {
    padding: 0.1875rem 0.625rem;
    background: #2199e8;
    color: #fefefe;
    cursor: default; }
  .ngx-pagination .disabled {
    padding: 0.1875rem 0.625rem;
    color: #cacaca;
    cursor: default; } 
    .ngx-pagination .disabled:hover {
      background: transparent; }
  .ngx-pagination a, .ngx-pagination button {
    cursor: pointer; }

.ngx-pagination .pagination-previous a::before,
.ngx-pagination .pagination-previous.disabled::before { 
  content: '«';
  display: inline-block;
  margin-right: 0.5rem; }

.ngx-pagination .pagination-next a::after,
.ngx-pagination .pagination-next.disabled::after {
  content: '»';
  display: inline-block;
  margin-left: 0.5rem; }

.ngx-pagination .show-for-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0); }
.ngx-pagination .small-screen {
  display: none; }
@media screen and (max-width: 601px) {
  .ngx-pagination.responsive .small-screen {
    display: inline-block; } 
  .ngx-pagination.responsive li:not(.small-screen):not(.pagination-previous):not(.pagination-next) {
    display: none; }
}
  `;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVtcGxhdGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZWFzeS10YWJsZS9zcmMvbGliL2ZlYXR1cmVzL3BhZ2luYXRpb24vdGVtcGxhdGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7OztHQUdHO0FBRUgsTUFBTSxDQUFDLE1BQU0sZ0JBQWdCLEdBQUc7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztLQW1EM0IsQ0FBQztBQUVOLE1BQU0sQ0FBQyxNQUFNLGNBQWMsR0FBRzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBa0UzQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBUaGUgZGVmYXVsdCB0ZW1wbGF0ZSBhbmQgc3R5bGVzIGZvciB0aGUgcGFnaW5hdGlvbiBsaW5rcyBhcmUgYm9ycm93ZWQgZGlyZWN0bHlcbiAqIGZyb20gWnVyYiBGb3VuZGF0aW9uIDY6IGh0dHA6Ly9mb3VuZGF0aW9uLnp1cmIuY29tL3NpdGVzL2RvY3MvcGFnaW5hdGlvbi5odG1sXG4gKi9cblxuZXhwb3J0IGNvbnN0IERFRkFVTFRfVEVNUExBVEUgPSBgXG4gICAgPHBhZ2luYXRpb24tdGVtcGxhdGUgICNwPVwicGFnaW5hdGlvbkFwaVwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgW2lkXT1cImlkXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICBbbWF4U2l6ZV09XCJtYXhTaXplXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAocGFnZUNoYW5nZSk9XCJwYWdlQ2hhbmdlLmVtaXQoJGV2ZW50KVwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgKHBhZ2VCb3VuZHNDb3JyZWN0aW9uKT1cInBhZ2VCb3VuZHNDb3JyZWN0aW9uLmVtaXQoJGV2ZW50KVwiPlxuICAgIDxuYXYgcm9sZT1cIm5hdmlnYXRpb25cIiBbYXR0ci5hcmlhLWxhYmVsXT1cInNjcmVlblJlYWRlclBhZ2luYXRpb25MYWJlbFwiPlxuICAgIDx1bCBjbGFzcz1cIm5neC1wYWdpbmF0aW9uXCIgXG4gICAgICAgIFtjbGFzcy5yZXNwb25zaXZlXT1cInJlc3BvbnNpdmVcIlxuICAgICAgICAqbmdJZj1cIiEoYXV0b0hpZGUgJiYgcC5wYWdlcy5sZW5ndGggPD0gMSlcIj5cblxuICAgICAgICA8bGkgY2xhc3M9XCJwYWdpbmF0aW9uLXByZXZpb3VzXCIgW2NsYXNzLmRpc2FibGVkXT1cInAuaXNGaXJzdFBhZ2UoKVwiICpuZ0lmPVwiZGlyZWN0aW9uTGlua3NcIj4gXG4gICAgICAgICAgICA8YSB0YWJpbmRleD1cIjBcIiAqbmdJZj1cIjEgPCBwLmdldEN1cnJlbnQoKVwiIChrZXl1cC5lbnRlcik9XCJwLnByZXZpb3VzKClcIiAoY2xpY2spPVwicC5wcmV2aW91cygpXCI+XG4gICAgICAgICAgICAgICAge3sgcHJldmlvdXNMYWJlbCB9fSA8c3BhbiBjbGFzcz1cInNob3ctZm9yLXNyXCI+e3sgc2NyZWVuUmVhZGVyUGFnZUxhYmVsIH19PC9zcGFuPlxuICAgICAgICAgICAgPC9hPlxuICAgICAgICAgICAgPHNwYW4gKm5nSWY9XCJwLmlzRmlyc3RQYWdlKClcIiBhcmlhLWRpc2FibGVkPVwidHJ1ZVwiPlxuICAgICAgICAgICAgICAgIHt7IHByZXZpb3VzTGFiZWwgfX0gPHNwYW4gY2xhc3M9XCJzaG93LWZvci1zclwiPnt7IHNjcmVlblJlYWRlclBhZ2VMYWJlbCB9fTwvc3Bhbj5cbiAgICAgICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPC9saT4gXG5cbiAgICAgICAgPGxpIGNsYXNzPVwic21hbGwtc2NyZWVuXCI+XG4gICAgICAgICAgICB7eyBwLmdldEN1cnJlbnQoKSB9fSAvIHt7IHAuZ2V0TGFzdFBhZ2UoKSB9fVxuICAgICAgICA8L2xpPlxuXG4gICAgICAgIDxsaSBbY2xhc3MuY3VycmVudF09XCJwLmdldEN1cnJlbnQoKSA9PT0gcGFnZS52YWx1ZVwiIFxuICAgICAgICAgICAgW2NsYXNzLmVsbGlwc2lzXT1cInBhZ2UubGFiZWwgPT09ICcuLi4nXCJcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCBwYWdlIG9mIHAucGFnZXM7IHRyYWNrQnk6IHRyYWNrQnlJbmRleFwiPlxuICAgICAgICAgICAgPGEgdGFiaW5kZXg9XCIwXCIgKGtleXVwLmVudGVyKT1cInAuc2V0Q3VycmVudChwYWdlLnZhbHVlKVwiIChjbGljayk9XCJwLnNldEN1cnJlbnQocGFnZS52YWx1ZSlcIiAqbmdJZj1cInAuZ2V0Q3VycmVudCgpICE9PSBwYWdlLnZhbHVlXCI+XG4gICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJzaG93LWZvci1zclwiPnt7IHNjcmVlblJlYWRlclBhZ2VMYWJlbCB9fSA8L3NwYW4+XG4gICAgICAgICAgICAgICAgPHNwYW4+e3sgKHBhZ2UubGFiZWwgPT09ICcuLi4nKSA/IHBhZ2UubGFiZWwgOiAocGFnZS5sYWJlbCB8IG51bWJlcjonJykgfX08L3NwYW4+XG4gICAgICAgICAgICA8L2E+XG4gICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwicC5nZXRDdXJyZW50KCkgPT09IHBhZ2UudmFsdWVcIj5cbiAgICAgICAgICAgICAgPHNwYW4gYXJpYS1saXZlPVwicG9saXRlXCI+XG4gICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJzaG93LWZvci1zclwiPnt7IHNjcmVlblJlYWRlckN1cnJlbnRMYWJlbCB9fSA8L3NwYW4+XG4gICAgICAgICAgICAgICAgPHNwYW4+e3sgKHBhZ2UubGFiZWwgPT09ICcuLi4nKSA/IHBhZ2UubGFiZWwgOiAocGFnZS5sYWJlbCB8IG51bWJlcjonJykgfX08L3NwYW4+IFxuICAgICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9saT5cblxuICAgICAgICA8bGkgY2xhc3M9XCJwYWdpbmF0aW9uLW5leHRcIiBbY2xhc3MuZGlzYWJsZWRdPVwicC5pc0xhc3RQYWdlKClcIiAqbmdJZj1cImRpcmVjdGlvbkxpbmtzXCI+XG4gICAgICAgICAgICA8YSB0YWJpbmRleD1cIjBcIiAqbmdJZj1cIiFwLmlzTGFzdFBhZ2UoKVwiIChrZXl1cC5lbnRlcik9XCJwLm5leHQoKVwiIChjbGljayk9XCJwLm5leHQoKVwiPlxuICAgICAgICAgICAgICAgICB7eyBuZXh0TGFiZWwgfX0gPHNwYW4gY2xhc3M9XCJzaG93LWZvci1zclwiPnt7IHNjcmVlblJlYWRlclBhZ2VMYWJlbCB9fTwvc3Bhbj5cbiAgICAgICAgICAgIDwvYT5cbiAgICAgICAgICAgIDxzcGFuICpuZ0lmPVwicC5pc0xhc3RQYWdlKClcIiBhcmlhLWRpc2FibGVkPVwidHJ1ZVwiPlxuICAgICAgICAgICAgICAgICB7eyBuZXh0TGFiZWwgfX0gPHNwYW4gY2xhc3M9XCJzaG93LWZvci1zclwiPnt7IHNjcmVlblJlYWRlclBhZ2VMYWJlbCB9fTwvc3Bhbj5cbiAgICAgICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPC9saT5cblxuICAgIDwvdWw+XG4gICAgPC9uYXY+XG4gICAgPC9wYWdpbmF0aW9uLXRlbXBsYXRlPlxuICAgIGA7XG5cbmV4cG9ydCBjb25zdCBERUZBVUxUX1NUWUxFUyA9IGBcbi5uZ3gtcGFnaW5hdGlvbiB7XG4gIG1hcmdpbi1sZWZ0OiAwO1xuICBtYXJnaW4tYm90dG9tOiAxcmVtOyB9XG4gIC5uZ3gtcGFnaW5hdGlvbjo6YmVmb3JlLCAubmd4LXBhZ2luYXRpb246OmFmdGVyIHtcbiAgICBjb250ZW50OiAnICc7XG4gICAgZGlzcGxheTogdGFibGU7IH1cbiAgLm5neC1wYWdpbmF0aW9uOjphZnRlciB7XG4gICAgY2xlYXI6IGJvdGg7IH1cbiAgLm5neC1wYWdpbmF0aW9uIGxpIHtcbiAgICAtbW96LXVzZXItc2VsZWN0OiBub25lO1xuICAgIC13ZWJraXQtdXNlci1zZWxlY3Q6IG5vbmU7XG4gICAgLW1zLXVzZXItc2VsZWN0OiBub25lO1xuICAgIG1hcmdpbi1yaWdodDogMC4wNjI1cmVtO1xuICAgIGJvcmRlci1yYWRpdXM6IDA7IH1cbiAgLm5neC1wYWdpbmF0aW9uIGxpIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7IH1cbiAgLm5neC1wYWdpbmF0aW9uIGEsXG4gIC5uZ3gtcGFnaW5hdGlvbiBidXR0b24ge1xuICAgIGNvbG9yOiAjMGEwYTBhOyBcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICBwYWRkaW5nOiAwLjE4NzVyZW0gMC42MjVyZW07XG4gICAgYm9yZGVyLXJhZGl1czogMDsgfVxuICAgIC5uZ3gtcGFnaW5hdGlvbiBhOmhvdmVyLFxuICAgIC5uZ3gtcGFnaW5hdGlvbiBidXR0b246aG92ZXIge1xuICAgICAgYmFja2dyb3VuZDogI2U2ZTZlNjsgfVxuICAubmd4LXBhZ2luYXRpb24gLmN1cnJlbnQge1xuICAgIHBhZGRpbmc6IDAuMTg3NXJlbSAwLjYyNXJlbTtcbiAgICBiYWNrZ3JvdW5kOiAjMjE5OWU4O1xuICAgIGNvbG9yOiAjZmVmZWZlO1xuICAgIGN1cnNvcjogZGVmYXVsdDsgfVxuICAubmd4LXBhZ2luYXRpb24gLmRpc2FibGVkIHtcbiAgICBwYWRkaW5nOiAwLjE4NzVyZW0gMC42MjVyZW07XG4gICAgY29sb3I6ICNjYWNhY2E7XG4gICAgY3Vyc29yOiBkZWZhdWx0OyB9IFxuICAgIC5uZ3gtcGFnaW5hdGlvbiAuZGlzYWJsZWQ6aG92ZXIge1xuICAgICAgYmFja2dyb3VuZDogdHJhbnNwYXJlbnQ7IH1cbiAgLm5neC1wYWdpbmF0aW9uIGEsIC5uZ3gtcGFnaW5hdGlvbiBidXR0b24ge1xuICAgIGN1cnNvcjogcG9pbnRlcjsgfVxuXG4ubmd4LXBhZ2luYXRpb24gLnBhZ2luYXRpb24tcHJldmlvdXMgYTo6YmVmb3JlLFxuLm5neC1wYWdpbmF0aW9uIC5wYWdpbmF0aW9uLXByZXZpb3VzLmRpc2FibGVkOjpiZWZvcmUgeyBcbiAgY29udGVudDogJ8KrJztcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICBtYXJnaW4tcmlnaHQ6IDAuNXJlbTsgfVxuXG4ubmd4LXBhZ2luYXRpb24gLnBhZ2luYXRpb24tbmV4dCBhOjphZnRlcixcbi5uZ3gtcGFnaW5hdGlvbiAucGFnaW5hdGlvbi1uZXh0LmRpc2FibGVkOjphZnRlciB7XG4gIGNvbnRlbnQ6ICfCuyc7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgbWFyZ2luLWxlZnQ6IDAuNXJlbTsgfVxuXG4ubmd4LXBhZ2luYXRpb24gLnNob3ctZm9yLXNyIHtcbiAgcG9zaXRpb246IGFic29sdXRlICFpbXBvcnRhbnQ7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBjbGlwOiByZWN0KDAsIDAsIDAsIDApOyB9XG4ubmd4LXBhZ2luYXRpb24gLnNtYWxsLXNjcmVlbiB7XG4gIGRpc3BsYXk6IG5vbmU7IH1cbkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDYwMXB4KSB7XG4gIC5uZ3gtcGFnaW5hdGlvbi5yZXNwb25zaXZlIC5zbWFsbC1zY3JlZW4ge1xuICAgIGRpc3BsYXk6IGlubGluZS1ibG9jazsgfSBcbiAgLm5neC1wYWdpbmF0aW9uLnJlc3BvbnNpdmUgbGk6bm90KC5zbWFsbC1zY3JlZW4pOm5vdCgucGFnaW5hdGlvbi1wcmV2aW91cyk6bm90KC5wYWdpbmF0aW9uLW5leHQpIHtcbiAgICBkaXNwbGF5OiBub25lOyB9XG59XG4gIGA7XG4iXX0=