@hmcts/ccd-case-ui-toolkit 7.1.36-document-heading-v3 → 7.1.36-pagination-descriptor-v3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14344,7 +14344,7 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
14344
14344
  fileChangeEvent(fileInput, allowedRegex) {
14345
14345
  let fileTypeRegex;
14346
14346
  if (allowedRegex) {
14347
- fileTypeRegex = new RegExp(`(${allowedRegex.replace(/,/g, '|')})`, 'i');
14347
+ fileTypeRegex = new RegExp(`(${allowedRegex.replace(/,/g, '|')})`);
14348
14348
  }
14349
14349
  if (fileInput.target?.files[0] && !fileInput.target?.files[0]?.name?.match(fileTypeRegex)) {
14350
14350
  this.invalidFileFormat();
@@ -23563,7 +23563,7 @@ class CaseFileViewFolderComponent {
23563
23563
  i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
23564
23564
  i0.ɵɵelement(2, "input", 2);
23565
23565
  i0.ɵɵelementEnd()();
23566
- i0.ɵɵelementStart(3, "div", 3)(4, "span", 4);
23566
+ i0.ɵɵelementStart(3, "div", 3)(4, "div", 4);
23567
23567
  i0.ɵɵtext(5);
23568
23568
  i0.ɵɵelementEnd();
23569
23569
  i0.ɵɵelementStart(6, "div")(7, "ccd-case-file-view-folder-sort", 5);
@@ -23581,7 +23581,7 @@ class CaseFileViewFolderComponent {
23581
23581
  }
23582
23582
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFolderComponent, [{
23583
23583
  type: Component,
23584
- args: [{ selector: 'ccd-case-file-view-folder', template: "<div class=\"document-filter-container\">\n <div class=\"form-group document-filter\" [formGroup]=\"documentFilterFormGroup\">\n <input class=\"form-control document-search\"\n type=\"search\"\n id=\"document-search\"\n name=\"documentSearchFormControl\"\n formControlName=\"documentSearchFormControl\"\n placeholder=\"Search by document name\"\n aria-label=\"Search by document name\">\n </div>\n</div>\n\n<div class=\"document-folders-header\">\n <span class=\"document-folders-header__title\">Documents ({{ documentCount }})</span>\n <div>\n <ccd-case-file-view-folder-sort\n (sortAscending)=\"sortDataSourceAscending($event)\"\n (sortDescending)=\"sortDataSourceDescending($event)\"\n ></ccd-case-file-view-folder-sort>\n </div>\n</div>\n\n<div class=\"document-tree-container\" *ngIf=\"documentTreeData\">\n <div *ngIf=\"!nestedDataSource || nestedDataSource.length === 0\">\n No results found\n </div>\n <div>\n <cdk-tree [dataSource]=\"nestedDataSource\" [treeControl]=\"nestedTreeControl\">\n <!-- document -->\n <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__node--document\" *cdkTreeNodeDef=\"let node\">\n <button class=\"node\" (click)=\"selectedNodeItem = node; clickedDocument.emit(node)\"\n [class.node--selected]=\"selectedNodeItem?.name === node.name\">\n <div class=\"node__icon\" disabled>\n <img src=\"/assets/img/case-file-view/case-file-view-document.svg\" class=\"node__iconImg\" alt=\"Document icon\">\n </div>\n <span class=\"node__name node-name-document\">\n {{node.name}}\n <br>\n <span class=\"node__document-upload-timestamp\">{{node.upload_timestamp | ccdDate : 'local' :'dd MMM YYYY HH:mm'}}</span>\n </span>\n <div class=\"node__document-options\">\n <ccd-case-file-view-folder-document-actions\n (changeFolderAction)=\"triggerDocumentAction('changeFolder', node)\"\n (openInANewTabAction)=\"triggerDocumentAction('openInANewTab', node)\"\n (downloadAction)=\"triggerDocumentAction('download', node)\"\n (printAction)=\"triggerDocumentAction('print', node)\"\n [allowMoving]=\"allowMoving\"\n >\n </ccd-case-file-view-folder-document-actions>\n </div>\n </button>\n </cdk-nested-tree-node>\n <!-- folder-->\n <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__folder\" *cdkTreeNodeDef=\"let node; when: nestedChildren\">\n <button class=\"node\" cdkTreeNodeToggle>\n <div class=\"node__icon\" [attr.aria-label]=\"'toggle ' + node.name\" >\n <img class=\"node__iconImg\"\n [src]=\"nestedTreeControl.isExpanded(node) ? '/assets/images/folder-open.png' : '/assets/images/folder.png'\" alt=\"Folder icon\">\n <span class=\"node__count\">{{node.childDocumentCount}}</span>\n </div>\n <span class=\"node__name node__name--folder\">{{node.name}}</span>\n </button>\n\n <div [class.document-tree-invisible]=\"!nestedTreeControl.isExpanded(node)\">\n <ng-container cdkTreeNodeOutlet></ng-container>\n </div>\n </cdk-nested-tree-node>\n </cdk-tree>\n </div>\n</div>\n", styles: [":host{display:flex;height:100%;flex-direction:column}:host .document-tree-container{flex:1 0}.document-filter-container{border-bottom:2px solid #C9C9C9}.document-filter-container .document-filter{padding:10px}.document-filter-container .document-filter .document-search{background:url(/assets/images/icon-search-black.svg) no-repeat right #fff;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container .documents-title{height:30%;margin-left:8px;font-weight:700}.document-tree-container{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node{display:block}.document-tree-container__node .document-tree-container__node{padding-left:40px}.document-tree-container .document-tree-invisible{display:none}.document-tree-container::-webkit-scrollbar{width:7px}.document-tree-container::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container::-webkit-scrollbar-button{display:none}.document-tree-container::-webkit-scrollbar-track-piece{background:#eee}.document-tree-container::-webkit-scrollbar-thumb{background:#ccc}.document-folders-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title{font-weight:700}.node{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected{background:#fff2cc}.node__icon{position:relative;display:inline-block}.node__count{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg{display:block;height:30px;width:30px}.node__name{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options{margin-left:auto;margin-right:0}.node__document-upload-timestamp{font-size:.8rem;float:left;padding-left:10px}\n"] }]
23584
+ args: [{ selector: 'ccd-case-file-view-folder', template: "<div class=\"document-filter-container\">\n <div class=\"form-group document-filter\" [formGroup]=\"documentFilterFormGroup\">\n <input class=\"form-control document-search\"\n type=\"search\"\n id=\"document-search\"\n name=\"documentSearchFormControl\"\n formControlName=\"documentSearchFormControl\"\n placeholder=\"Search by document name\"\n aria-label=\"Search by document name\">\n </div>\n</div>\n\n<div class=\"document-folders-header\">\n <div class=\"document-folders-header__title\">Documents ({{ documentCount }})</div>\n <div>\n <ccd-case-file-view-folder-sort\n (sortAscending)=\"sortDataSourceAscending($event)\"\n (sortDescending)=\"sortDataSourceDescending($event)\"\n ></ccd-case-file-view-folder-sort>\n </div>\n</div>\n\n<div class=\"document-tree-container\" *ngIf=\"documentTreeData\">\n <div *ngIf=\"!nestedDataSource || nestedDataSource.length === 0\">\n No results found\n </div>\n <div>\n <cdk-tree [dataSource]=\"nestedDataSource\" [treeControl]=\"nestedTreeControl\">\n <!-- document -->\n <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__node--document\" *cdkTreeNodeDef=\"let node\">\n <button class=\"node\" (click)=\"selectedNodeItem = node; clickedDocument.emit(node)\"\n [class.node--selected]=\"selectedNodeItem?.name === node.name\">\n <div class=\"node__icon\" disabled>\n <img src=\"/assets/img/case-file-view/case-file-view-document.svg\" class=\"node__iconImg\" alt=\"Document icon\">\n </div>\n <span class=\"node__name node-name-document\">\n {{node.name}}\n <br>\n <span class=\"node__document-upload-timestamp\">{{node.upload_timestamp | ccdDate : 'local' :'dd MMM YYYY HH:mm'}}</span>\n </span>\n <div class=\"node__document-options\">\n <ccd-case-file-view-folder-document-actions\n (changeFolderAction)=\"triggerDocumentAction('changeFolder', node)\"\n (openInANewTabAction)=\"triggerDocumentAction('openInANewTab', node)\"\n (downloadAction)=\"triggerDocumentAction('download', node)\"\n (printAction)=\"triggerDocumentAction('print', node)\"\n [allowMoving]=\"allowMoving\"\n >\n </ccd-case-file-view-folder-document-actions>\n </div>\n </button>\n </cdk-nested-tree-node>\n <!-- folder-->\n <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__folder\" *cdkTreeNodeDef=\"let node; when: nestedChildren\">\n <button class=\"node\" cdkTreeNodeToggle>\n <div class=\"node__icon\" [attr.aria-label]=\"'toggle ' + node.name\" >\n <img class=\"node__iconImg\"\n [src]=\"nestedTreeControl.isExpanded(node) ? '/assets/images/folder-open.png' : '/assets/images/folder.png'\" alt=\"Folder icon\">\n <span class=\"node__count\">{{node.childDocumentCount}}</span>\n </div>\n <span class=\"node__name node__name--folder\">{{node.name}}</span>\n </button>\n\n <div [class.document-tree-invisible]=\"!nestedTreeControl.isExpanded(node)\">\n <ng-container cdkTreeNodeOutlet></ng-container>\n </div>\n </cdk-nested-tree-node>\n </cdk-tree>\n </div>\n</div>\n", styles: [":host{display:flex;height:100%;flex-direction:column}:host .document-tree-container{flex:1 0}.document-filter-container{border-bottom:2px solid #C9C9C9}.document-filter-container .document-filter{padding:10px}.document-filter-container .document-filter .document-search{background:url(/assets/images/icon-search-black.svg) no-repeat right #fff;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container .documents-title{height:30%;margin-left:8px;font-weight:700}.document-tree-container{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node{display:block}.document-tree-container__node .document-tree-container__node{padding-left:40px}.document-tree-container .document-tree-invisible{display:none}.document-tree-container::-webkit-scrollbar{width:7px}.document-tree-container::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container::-webkit-scrollbar-button{display:none}.document-tree-container::-webkit-scrollbar-track-piece{background:#eee}.document-tree-container::-webkit-scrollbar-thumb{background:#ccc}.document-folders-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title{font-weight:700}.node{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected{background:#fff2cc}.node__icon{position:relative;display:inline-block}.node__count{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg{display:block;height:30px;width:30px}.node__name{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options{margin-left:auto;margin-right:0}.node__document-upload-timestamp{font-size:.8rem;float:left;padding-left:10px}\n"] }]
23585
23585
  }], () => [{ type: WindowService }, { type: i1$1.Router }, { type: DocumentManagementService }, { type: i1$3.MatLegacyDialog }, { type: AbstractAppConfig }], { categoriesAndDocuments: [{
23586
23586
  type: Input
23587
23587
  }], allowMoving: [{
@@ -30507,22 +30507,24 @@ function PaginationComponent_ul_4_li_2_a_1_Template(rf, ctx) { if (rf & 1) {
30507
30507
  } }
30508
30508
  function PaginationComponent_ul_4_li_2_span_2_Template(rf, ctx) { if (rf & 1) {
30509
30509
  i0.ɵɵelementStart(0, "span");
30510
- i0.ɵɵtext(1);
30511
- i0.ɵɵpipe(2, "rpxTranslate");
30512
- i0.ɵɵelementStart(3, "span", 13);
30513
- i0.ɵɵtext(4);
30514
- i0.ɵɵpipe(5, "rpxTranslate");
30510
+ i0.ɵɵpipe(1, "rpxTranslate");
30511
+ i0.ɵɵtext(2);
30512
+ i0.ɵɵpipe(3, "rpxTranslate");
30513
+ i0.ɵɵelementStart(4, "span", 13);
30514
+ i0.ɵɵtext(5);
30515
+ i0.ɵɵpipe(6, "rpxTranslate");
30515
30516
  i0.ɵɵelementEnd()();
30516
30517
  } if (rf & 2) {
30517
30518
  const ctx_r3 = i0.ɵɵnextContext(3);
30518
- i0.ɵɵadvance();
30519
- i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 2, ctx_r3.previousLabel), " ");
30519
+ i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 3, ctx_r3.previousLabel + " " + ctx_r3.screenReaderPageLabel));
30520
+ i0.ɵɵadvance(2);
30521
+ i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 5, ctx_r3.previousLabel), " ");
30520
30522
  i0.ɵɵadvance(3);
30521
- i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(5, 4, ctx_r3.screenReaderPageLabel));
30523
+ i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 7, ctx_r3.screenReaderPageLabel));
30522
30524
  } }
30523
30525
  function PaginationComponent_ul_4_li_2_Template(rf, ctx) { if (rf & 1) {
30524
30526
  i0.ɵɵelementStart(0, "li", 9);
30525
- i0.ɵɵtemplate(1, PaginationComponent_ul_4_li_2_a_1_Template, 7, 9, "a", 10)(2, PaginationComponent_ul_4_li_2_span_2_Template, 6, 6, "span", 11);
30527
+ i0.ɵɵtemplate(1, PaginationComponent_ul_4_li_2_a_1_Template, 7, 9, "a", 10)(2, PaginationComponent_ul_4_li_2_span_2_Template, 7, 9, "span", 11);
30526
30528
  i0.ɵɵelementEnd();
30527
30529
  } if (rf & 2) {
30528
30530
  i0.ɵɵnextContext(2);
@@ -30536,22 +30538,24 @@ function PaginationComponent_ul_4_li_2_Template(rf, ctx) { if (rf & 1) {
30536
30538
  function PaginationComponent_ul_4_li_5_a_1_Template(rf, ctx) { if (rf & 1) {
30537
30539
  const _r5 = i0.ɵɵgetCurrentView();
30538
30540
  i0.ɵɵelementStart(0, "a", 12);
30541
+ i0.ɵɵpipe(1, "rpxTranslate");
30539
30542
  i0.ɵɵlistener("keyup.enter", function PaginationComponent_ul_4_li_5_a_1_Template_a_keyup_enter_0_listener() { i0.ɵɵrestoreView(_r5); const page_r6 = i0.ɵɵnextContext().$implicit; i0.ɵɵnextContext(2); const p_r3 = i0.ɵɵreference(1); return i0.ɵɵresetView(p_r3.setCurrent(page_r6.value)); })("click", function PaginationComponent_ul_4_li_5_a_1_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r5); const page_r6 = i0.ɵɵnextContext().$implicit; i0.ɵɵnextContext(2); const p_r3 = i0.ɵɵreference(1); return i0.ɵɵresetView(p_r3.setCurrent(page_r6.value)); });
30540
- i0.ɵɵelementStart(1, "span", 13);
30541
- i0.ɵɵtext(2);
30542
- i0.ɵɵpipe(3, "rpxTranslate");
30543
+ i0.ɵɵelementStart(2, "span", 13);
30544
+ i0.ɵɵtext(3);
30545
+ i0.ɵɵpipe(4, "rpxTranslate");
30543
30546
  i0.ɵɵelementEnd();
30544
- i0.ɵɵelementStart(4, "span");
30545
- i0.ɵɵtext(5);
30546
- i0.ɵɵpipe(6, "number");
30547
+ i0.ɵɵelementStart(5, "span");
30548
+ i0.ɵɵtext(6);
30549
+ i0.ɵɵpipe(7, "number");
30547
30550
  i0.ɵɵelementEnd()();
30548
30551
  } if (rf & 2) {
30549
30552
  const page_r6 = i0.ɵɵnextContext().$implicit;
30550
30553
  const ctx_r3 = i0.ɵɵnextContext(2);
30551
- i0.ɵɵadvance(2);
30552
- i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(3, 2, ctx_r3.screenReaderPageLabel), " ");
30554
+ i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 3, "Page " + page_r6.label));
30553
30555
  i0.ɵɵadvance(3);
30554
- i0.ɵɵtextInterpolate(page_r6.label === "..." ? page_r6.label : i0.ɵɵpipeBind2(6, 4, page_r6.label, ""));
30556
+ i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(4, 5, ctx_r3.screenReaderPageLabel), " ");
30557
+ i0.ɵɵadvance(3);
30558
+ i0.ɵɵtextInterpolate(page_r6.label === "..." ? page_r6.label : i0.ɵɵpipeBind2(7, 7, page_r6.label, ""));
30555
30559
  } }
30556
30560
  function PaginationComponent_ul_4_li_5_ng_container_2_Template(rf, ctx) { if (rf & 1) {
30557
30561
  i0.ɵɵelementContainerStart(0);
@@ -30574,7 +30578,7 @@ function PaginationComponent_ul_4_li_5_ng_container_2_Template(rf, ctx) { if (rf
30574
30578
  } }
30575
30579
  function PaginationComponent_ul_4_li_5_Template(rf, ctx) { if (rf & 1) {
30576
30580
  i0.ɵɵelementStart(0, "li");
30577
- i0.ɵɵtemplate(1, PaginationComponent_ul_4_li_5_a_1_Template, 7, 7, "a", 10)(2, PaginationComponent_ul_4_li_5_ng_container_2_Template, 7, 7, "ng-container", 11);
30581
+ i0.ɵɵtemplate(1, PaginationComponent_ul_4_li_5_a_1_Template, 8, 10, "a", 10)(2, PaginationComponent_ul_4_li_5_ng_container_2_Template, 7, 7, "ng-container", 11);
30578
30582
  i0.ɵɵelementEnd();
30579
30583
  } if (rf & 2) {
30580
30584
  const page_r6 = ctx.$implicit;
@@ -30711,7 +30715,7 @@ class PaginationComponent {
30711
30715
  }
30712
30716
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PaginationComponent, [{
30713
30717
  type: Component,
30714
- args: [{ selector: 'ccd-pagination', template: "<pagination-template #p=\"paginationApi\" [id]=\"id\" [maxSize]=\"maxSize\" (pageChange)=\"pageChange.emit($event)\"\n (pageBoundsCorrection)=\"pageBoundsCorrection.emit($event)\">\n <nav role=\"navigation\" [attr.aria-label]=\"'Pagination' | rpxTranslate\">\n <ul class=\"ngx-pagination\" [attr.aria-label]=\"screenReaderPaginationLabel | rpxTranslate\"\n [class.responsive]=\"responsive\" *ngIf=\"!(autoHide && p.pages.length <= 1)\">\n <li class=\"pagination-previous\" [class.disabled]=\"p.isFirstPage()\" *ngIf=\"directionLinks\">\n <a tabindex=\"0\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\" (click)=\"p.previous()\"\n [attr.aria-label]=\"previousLabel + ' ' + screenReaderPageLabel | rpxTranslate\">\n {{ previousLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </a>\n <span *ngIf=\"p.isFirstPage()\">\n {{ previousLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </span>\n </li>\n <li class=\"small-screen\">\n {{ p.getCurrent() }} / {{ p.getLastPage() }}\n </li>\n <li [class.current]=\"p.getCurrent() === page.value\" [class.ellipsis]=\"page.label === '...'\"\n *ngFor=\"let page of p.pages\">\n <a tabindex=\"0\" (keyup.enter)=\"p.setCurrent(page.value)\" (click)=\"p.setCurrent(page.value)\"\n *ngIf=\"p.getCurrent() !== page.value\">\n <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }} </span>\n <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n </a>\n <ng-container *ngIf=\"p.getCurrent() === page.value\">\n <span class=\"show-for-sr\">{{ screenReaderCurrentLabel | rpxTranslate }} </span>\n <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n </ng-container>\n </li>\n <li class=\"pagination-next\" [class.disabled]=\"p.isLastPage()\" *ngIf=\"directionLinks\">\n <a tabindex=\"0\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\" (click)=\"p.next()\"\n [attr.aria-label]=\"nextLabel + ' ' + screenReaderPageLabel | rpxTranslate\">\n {{ nextLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </a>\n <span *ngIf=\"p.isLastPage()\">\n {{ nextLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </span>\n </li>\n </ul>\n </nav>\n</pagination-template>\n", styles: [".ngx-pagination{margin-left:0;margin-bottom:1rem;padding-top:25px;text-decoration:none;text-align:left;font-size:16px}.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:.0625rem;border-radius:0}.ngx-pagination li{display:inline-block}.ngx-pagination a,.ngx-pagination button{display:block;padding:.1875rem .625rem;border-radius:0;color:#005da6}.ngx-pagination a:hover,.ngx-pagination button:hover{background:#e6e6e6}.ngx-pagination .current{padding:.1875rem .625rem;background:#fff;color:#4c2c92;cursor:default;font-weight:900}.ngx-pagination .disabled{display:none}.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{margin-right:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:3px 0 0 3px}.ngx-pagination .pagination-next a:after,.ngx-pagination .pagination-next.disabled:after{margin-left:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:0 3px 3px 0}.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}}\n"] }]
30718
+ args: [{ selector: 'ccd-pagination', template: "<pagination-template #p=\"paginationApi\" [id]=\"id\" [maxSize]=\"maxSize\" (pageChange)=\"pageChange.emit($event)\"\n (pageBoundsCorrection)=\"pageBoundsCorrection.emit($event)\">\n <nav role=\"navigation\" [attr.aria-label]=\"'Pagination' | rpxTranslate\">\n <ul class=\"ngx-pagination\" [attr.aria-label]=\"screenReaderPaginationLabel | rpxTranslate\"\n [class.responsive]=\"responsive\" *ngIf=\"!(autoHide && p.pages.length <= 1)\">\n <li class=\"pagination-previous\" [class.disabled]=\"p.isFirstPage()\" *ngIf=\"directionLinks\">\n <a tabindex=\"0\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\" (click)=\"p.previous()\"\n [attr.aria-label]=\"previousLabel + ' ' + screenReaderPageLabel | rpxTranslate\">\n {{ previousLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </a>\n <span *ngIf=\"p.isFirstPage()\" [attr.aria-label]=\"previousLabel + ' ' + screenReaderPageLabel | rpxTranslate\">\n {{ previousLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </span>\n </li>\n <li class=\"small-screen\">\n {{ p.getCurrent() }} / {{ p.getLastPage() }}\n </li>\n <li [class.current]=\"p.getCurrent() === page.value\" [class.ellipsis]=\"page.label === '...'\"\n *ngFor=\"let page of p.pages\">\n <a tabindex=\"0\" (keyup.enter)=\"p.setCurrent(page.value)\" (click)=\"p.setCurrent(page.value)\"\n *ngIf=\"p.getCurrent() !== page.value\" [attr.aria-label]=\"'Page ' + page.label | rpxTranslate\">\n <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }} </span>\n <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n </a>\n <ng-container *ngIf=\"p.getCurrent() === page.value\">\n <span class=\"show-for-sr\">{{ screenReaderCurrentLabel | rpxTranslate }} </span>\n <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n </ng-container>\n </li>\n <li class=\"pagination-next\" [class.disabled]=\"p.isLastPage()\" *ngIf=\"directionLinks\">\n <a tabindex=\"0\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\" (click)=\"p.next()\"\n [attr.aria-label]=\"nextLabel + ' ' + screenReaderPageLabel | rpxTranslate\">\n {{ nextLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </a>\n <span *ngIf=\"p.isLastPage()\">\n {{ nextLabel | rpxTranslate }} <span class=\"show-for-sr\">{{ screenReaderPageLabel | rpxTranslate }}</span>\n </span>\n </li>\n </ul>\n </nav>\n</pagination-template>\n", styles: [".ngx-pagination{margin-left:0;margin-bottom:1rem;padding-top:25px;text-decoration:none;text-align:left;font-size:16px}.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:.0625rem;border-radius:0}.ngx-pagination li{display:inline-block}.ngx-pagination a,.ngx-pagination button{display:block;padding:.1875rem .625rem;border-radius:0;color:#005da6}.ngx-pagination a:hover,.ngx-pagination button:hover{background:#e6e6e6}.ngx-pagination .current{padding:.1875rem .625rem;background:#fff;color:#4c2c92;cursor:default;font-weight:900}.ngx-pagination .disabled{display:none}.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{margin-right:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:3px 0 0 3px}.ngx-pagination .pagination-next a:after,.ngx-pagination .pagination-next.disabled:after{margin-left:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:0 3px 3px 0}.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}}\n"] }]
30715
30719
  }], null, { visibilityLabel: [{
30716
30720
  type: Input
30717
30721
  }], id: [{