@hmcts/ccpay-web-component 6.5.9-cme-779-prerelease → 6.5.10-cme-779-prerelease

package/fesm2022/hmcts-ccpay-web-component.mjs

@@ -5870,11 +5870,11 @@ class TableComponent {
         this.router.navigate([`/cases/case-details/${ccdCaseNumber}`], { relativeTo: this.activeRoute });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TableComponent, deps: [{ token: 'PAYMENT_LIB' }, { token: i0.ChangeDetectorRef }, { token: OrderslistService }, { token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: TableComponent, isStandalone: false, selector: "ccpay-table", inputs: { DATASOURCE: "DATASOURCE", STATUS: "STATUS", errorMessage: "errorMessage" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"add-remission\">\n  <div *ngIf=\"errorMessage\">\n    <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n      <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n        Error in processing the request\n      </h2>\n      <div class=\"govuk-error-summary__body\">\n        {{ errorMessage }}\n      </div>\n    </div>\n  </div>\n\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by caseworker:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All caseworkers</option>\n      <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by service:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All services</option>\n      <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n    <mat-table [dataSource]=\"dataSource\" matSort>\n\n      <ng-container matColumnDef=\"ccd_case_number\">\n        <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"refund_reference\">\n        <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"user_full_name\">\n        <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_created\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_updated\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n          date:'d MMMM yyyy'}}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n          case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n          refund</a></mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n          refund</a></mat-cell>\n      </ng-container>\n\n      <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n      <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n      </mat-row>\n    </mat-table>\n    <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n  </div>\n\n  <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i6.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i7.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: CcdHyphensPipe, name: "ccdHyphens" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: TableComponent, isStandalone: false, selector: "ccpay-table", inputs: { DATASOURCE: "DATASOURCE", STATUS: "STATUS", errorMessage: "errorMessage" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"add-remission\">\n  <div *ngIf=\"errorMessage\">\n    <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n      <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n        Error in processing the request\n      </h2>\n      <div class=\"govuk-error-summary__body\">\n        {{ errorMessage }}\n      </div>\n    </div>\n  </div>\n\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by caseworker:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All caseworkers</option>\n      <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by service:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All services</option>\n      <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n    <mat-table [dataSource]=\"dataSource\" matSort>\n\n      <ng-container matColumnDef=\"ccd_case_number\">\n        <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"refund_reference\">\n        <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"user_full_name\">\n        <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_created\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_updated\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n          date:'d MMMM yyyy'}}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n          case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n          refund</a></mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n          refund</a></mat-cell>\n      </ng-container>\n\n      <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n      <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n      </mat-row>\n    </mat-table>\n    <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n  </div>\n\n  <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}.mat-paginator{position:relative;z-index:10}.mat-paginator .mat-select-panel{position:absolute!important;top:100%!important;left:0!important;z-index:1000!important;background:#fff!important;border:1px solid #ccc!important;box-shadow:0 2px 8px #00000026!important;min-width:60px!important;max-height:200px!important;overflow-y:auto!important}.mat-paginator .mat-select-trigger{position:relative!important;z-index:10!important;display:inline-block!important;vertical-align:middle!important}.mat-paginator .mat-paginator-page-size,.mat-paginator .mat-paginator-range-label,.mat-paginator .mat-paginator-range-actions{display:inline-block!important;vertical-align:middle!important;margin:0 10px!important;white-space:nowrap!important}::ng-deep .cdk-overlay-container{position:fixed!important;z-index:10000!important;pointer-events:none!important}::ng-deep .cdk-overlay-pane{position:absolute!important;pointer-events:auto!important;z-index:10000!important;background:#fff!important;border:1px solid #ccc!important;box-shadow:0 2px 8px #00000026!important}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i6.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i7.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i7.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: CcdHyphensPipe, name: "ccdHyphens" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ccpay-table', standalone: false, template: "<div class=\"add-remission\">\n  <div *ngIf=\"errorMessage\">\n    <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n      <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n        Error in processing the request\n      </h2>\n      <div class=\"govuk-error-summary__body\">\n        {{ errorMessage }}\n      </div>\n    </div>\n  </div>\n\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by caseworker:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All caseworkers</option>\n      <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by service:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All services</option>\n      <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n    <mat-table [dataSource]=\"dataSource\" matSort>\n\n      <ng-container matColumnDef=\"ccd_case_number\">\n        <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"refund_reference\">\n        <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"user_full_name\">\n        <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_created\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_updated\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n          date:'d MMMM yyyy'}}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n          case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n          refund</a></mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n          refund</a></mat-cell>\n      </ng-container>\n\n      <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n      <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n      </mat-row>\n    </mat-table>\n    <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n  </div>\n\n  <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}\n"] }]
+            args: [{ selector: 'ccpay-table', standalone: false, template: "<div class=\"add-remission\">\n  <div *ngIf=\"errorMessage\">\n    <div class=\"error-summary\" role=\"group\" aria-labelledby=\"failure-error-summary-heading\" tabindex=\"-1\">\n      <h2 class=\"heading-medium error-summary-heading\" id=\"failure-error-summary-heading\">\n        Error in processing the request\n      </h2>\n      <div class=\"govuk-error-summary__body\">\n        {{ errorMessage }}\n      </div>\n    </div>\n  </div>\n\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by caseworker:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All caseworkers</option>\n      <option *ngFor=\"let name of userLst;\" value=\"{{name}}\">{{name}}</option>ss\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"govuk-form-group float-right-padding\">\n    <label class=\"govuk-label dropdpwn\" for=\"sort\">\n      Filter by service:\n    </label>\n    <select class=\"govuk-select\" id=\"sort\" name=\"sort\" (change)=\"selectchange($event)\">\n      <option value=\"\" selected='selected'>All services</option>\n      <option *ngFor=\"let name of serviceLst;\" value=\"{{name}}\">{{name}}</option>\n    </select>\n  </div>\n\n  <div *ngIf=\"dataSource.data.length > 0\" class=\"example-container\">\n\n    <mat-table [dataSource]=\"dataSource\" matSort>\n\n      <ng-container matColumnDef=\"ccd_case_number\">\n        <mat-header-cell *matHeaderCellDef>Case reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.ccd_case_number | ccdHyphens }}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"refund_reference\">\n        <mat-header-cell *matHeaderCellDef> Refund reference</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.refund_reference}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"user_full_name\">\n        <mat-header-cell *matHeaderCellDef> Submitted by</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.user_full_name }}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_created\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Date created</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" class=\"whitespace-inherit\"> {{row.date_created | date:'d MMMM yyyy'}}</mat-cell>\n      </ng-container>\n\n      <ng-container matColumnDef=\"date_updated\">\n        <mat-header-cell *matHeaderCellDef mat-sort-header> Last updated</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\" class=\"whitespace-inherit\"> {{row.date_updated |\n          date:'d MMMM yyyy'}}\n        </mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToCaseReview(row.ccd_case_number, row)\">Review\n          case</a>&nbsp;<a href=\"javascript:void(0)\" (click)=\"goToRefundProcessComponent(row.refund_reference, row)\">Process\n          refund</a></mat-cell>\n      </ng-container>\n\n      <ng-container *ngIf=\"!isApprovalFlow\" matColumnDef=\"Action\">\n        <mat-header-cell *matHeaderCellDef> Action</mat-header-cell>\n        <mat-cell *matCellDef=\"let row\" [style.color]=\"row.color\"><a href=\"javascript:void(0)\"\n                                                                     (click)=\"goToRefundViewComponent(row.refund_reference, row)\">Review\n          refund</a></mat-cell>\n      </ng-container>\n\n      <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n      <mat-row *matRowDef=\"let row; columns: displayedColumns;\">\n      </mat-row>\n    </mat-table>\n    <mat-paginator [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator>\n  </div>\n\n  <div class=\"govuk-label dropdpwn\" *ngIf=\"dataSource.data.length === 0\">No records to display</div>\n</div>\n", styles: [".mat-header-row{min-height:27px}.mat-cell{padding:0 10px 0 0;text-align:left;word-wrap:break-word;white-space:inherit!important;font-size:19px;line-height:25px;font-family:nta,Arial,sans-serif;font-weight:400}.mat-table{color:#0b0c0c;display:table;font-family:nta,Arial,sans-serif;-webkit-font-smoothing:antialiased;margin-bottom:1px;box-sizing:border-box;text-indent:initial;border-spacing:0;border-collapse:collapse;font-size:1.1875rem;line-height:1.31578947;table-layout:fixed;width:102%}.mat-header-cell,.mat-mdc-header-cell{text-align:left;font-weight:700;padding:10px 10px 10px 0;word-wrap:break-word;font-size:19px;line-height:25px;color:#0b0c0c;cursor:pointer;font-family:inherit}.mat-mdc-row,mat-header-row,mat-footer-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.row.mat-mdc-row{border-bottom-width:1px;border-style:solid;align-items:center;box-sizing:border-box}.dropdpwn{display:inline-block;margin-right:10px;font-size:19px}.mat-column-ccdCaseNumber{flex:3em}.mat-column-refundReference{flex:6em}.mat-column-reason{flex:2em}.govuk-select{font-size:19px;font-weight:400}.govuk-error-summary__title{font-size:24px!important}.float-right{float:right}.float-right-padding{float:initial;padding-right:2em;padding-left:8em}.float-left-padding{padding-left:12em}.mat-paginator{position:relative;z-index:10}.mat-paginator .mat-select-panel{position:absolute!important;top:100%!important;left:0!important;z-index:1000!important;background:#fff!important;border:1px solid #ccc!important;box-shadow:0 2px 8px #00000026!important;min-width:60px!important;max-height:200px!important;overflow-y:auto!important}.mat-paginator .mat-select-trigger{position:relative!important;z-index:10!important;display:inline-block!important;vertical-align:middle!important}.mat-paginator .mat-paginator-page-size,.mat-paginator .mat-paginator-range-label,.mat-paginator .mat-paginator-range-actions{display:inline-block!important;vertical-align:middle!important;margin:0 10px!important;white-space:nowrap!important}::ng-deep .cdk-overlay-container{position:fixed!important;z-index:10000!important;pointer-events:none!important}::ng-deep .cdk-overlay-pane{position:absolute!important;pointer-events:auto!important;z-index:10000!important;background:#fff!important;border:1px solid #ccc!important;box-shadow:0 2px 8px #00000026!important}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: ['PAYMENT_LIB']