cps-ui-kit 0.42.0 → 0.44.0
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.
- package/assets/icons.svg +17 -8
- package/esm2020/lib/components/cps-menu/cps-menu.component.mjs +3 -3
- package/esm2020/lib/components/cps-table/cps-table.component.mjs +91 -11
- package/fesm2015/cps-ui-kit.mjs +91 -11
- package/fesm2015/cps-ui-kit.mjs.map +1 -1
- package/fesm2020/cps-ui-kit.mjs +91 -11
- package/fesm2020/cps-ui-kit.mjs.map +1 -1
- package/lib/components/cps-table/cps-table.component.d.ts +11 -2
- package/package.json +3 -2
package/fesm2015/cps-ui-kit.mjs
CHANGED
|
@@ -3325,7 +3325,7 @@ class CpsMenuComponent {
|
|
|
3325
3325
|
}
|
|
3326
3326
|
}
|
|
3327
3327
|
CpsMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CpsMenuComponent, deps: [{ token: DOCUMENT }, { token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1$1.PrimeNGConfig }, { token: i1$1.OverlayService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3328
|
-
CpsMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsMenuComponent, isStandalone: true, selector: "cps-menu", inputs: { header: "header", items: "items", withArrow: "withArrow", compressed: "compressed", focusOnShow: "focusOnShow", containerClass: "containerClass" }, outputs: { menuShown: "menuShown", menuHidden: "menuHidden" }, ngImport: i0, template: "<div\n *ngIf=\"render\"\n class=\"cps-menu-container\"\n [ngClass]=\"{ 'cps-menu-no-arrow': !withArrow }\"\n [class]=\"containerClass\"\n (click)=\"onOverlayClick($event)\"\n [@animation]=\"{\n value: overlayVisible ? 'open' : 'close',\n params: {\n showTransitionParams: showTransitionOptions,\n hideTransitionParams: hideTransitionOptions\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\">\n <div (click)=\"onContentClick()\" (mousedown)=\"onContentClick()\">\n <ng-container *ngIf=\"items.length < 1\">\n <ng-content></ng-content>\n </ng-container>\n <div\n *ngIf=\"items.length > 0\"\n class=\"cps-menu-content\"\n [ngClass]=\"{ 'cps-menu-content-compressed': compressed }\">\n <div *ngIf=\"header && !compressed\" class=\"cps-menu-header\">\n {{ header }}\n </div>\n <div\n *ngFor=\"let item of items; let i = index\"\n (click)=\"onItemClick($event, item)\"\n [ngClass]=\"{\n 'cps-menu-item-disabled': item.disabled,\n 'cps-menu-item-first': i === 0,\n 'cps-menu-item-compressed': compressed\n }\"\n class=\"cps-menu-item\">\n <div class=\"cps-menu-item-icon\" *ngIf=\"withIcons\">\n <cps-icon\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.disabled ? 'text-light' : 'text-dark'\"\n [size]=\"compressed ? 'small' : 'normal'\"></cps-icon>\n </div>\n <div class=\"cps-menu-item-content\">\n <span class=\"cps-menu-item-content-title\">{{ item.title }}</span>\n <span\n *ngIf=\"item.desc && !compressed\"\n class=\"cps-menu-item-content-desc\"\n >{{ item.desc }}</span\n >\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".cps-menu-container{background:#ffffff;border:0 none;box-shadow:0 1px 3px #0000004d;position:absolute;margin-top:14px;top:0;left:0}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px;border:solid transparent;border-color:#fff0;border-bottom-color:var(--cps-color-line-light)}.cps-menu-container:not(.cps-menu-no-arrow):after,.cps-menu-container:not(.cps-menu-no-arrow):before{bottom:100%;left:var(--overlayArrowLeft, 12);content:\" \";height:0;width:0;position:absolute;pointer-events:none}.cps-menu-container .cps-menu-content{padding:.75rem}.cps-menu-container .cps-menu-content{display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.cps-menu-container .cps-menu-content .cps-menu-header{display:flex;align-items:center;min-height:50px;padding-bottom:8px;font-weight:600;color:var(--cps-color-text-dark);cursor:default}.cps-menu-container .cps-menu-content .cps-menu-item{display:flex;align-items:center;padding:8px 48px 8px 0;border-top:1px solid rgba(0,0,0,.1215686275);cursor:pointer;min-height:58px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon{width:48px;align-items:center;display:flex}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon cps-icon{margin-left:8px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content{display:flex;flex-direction:column}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:600;font-size:15px;line-height:150%;color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-desc{font-size:12px;line-height:150%;color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled{pointer-events:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-lightest)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover{background:#f8f4f5}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):hover .cps-menu-item-icon cps-icon i{color:var(--cps-color-calm)!important}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):active{background:#f1eaec}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-first{border-top:none}.cps-menu-container .cps-menu-content.cps-menu-content-compressed{padding:0}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item{padding:0 16px;min-height:40px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-icon{width:36px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:500}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-icon cps-icon i{color:var(--cps-color-prepared)!important}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-prepared)}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px;border:solid transparent;border-color:#fff0;border-bottom-color:#fff}.cps-menu-container-flipped{margin-top:0;margin-bottom:10px}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px}.cps-menu-container-flipped:not(.cps-menu-no-arrow):after,.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{bottom:auto;top:100%}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):after{border-bottom-color:transparent}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{border-bottom-color:transparent}.cps-menu-no-arrow{margin-top:0;margin-bottom:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }], animations: [
|
|
3328
|
+
CpsMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsMenuComponent, isStandalone: true, selector: "cps-menu", inputs: { header: "header", items: "items", withArrow: "withArrow", compressed: "compressed", focusOnShow: "focusOnShow", containerClass: "containerClass" }, outputs: { menuShown: "menuShown", menuHidden: "menuHidden" }, ngImport: i0, template: "<div\n *ngIf=\"render\"\n class=\"cps-menu-container\"\n [ngClass]=\"{ 'cps-menu-no-arrow': !withArrow }\"\n [class]=\"containerClass\"\n (click)=\"onOverlayClick($event)\"\n [@animation]=\"{\n value: overlayVisible ? 'open' : 'close',\n params: {\n showTransitionParams: showTransitionOptions,\n hideTransitionParams: hideTransitionOptions\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\">\n <div (click)=\"onContentClick()\" (mousedown)=\"onContentClick()\">\n <ng-container *ngIf=\"items.length < 1\">\n <ng-content></ng-content>\n </ng-container>\n <div\n *ngIf=\"items.length > 0\"\n class=\"cps-menu-content\"\n [ngClass]=\"{ 'cps-menu-content-compressed': compressed }\">\n <div *ngIf=\"header && !compressed\" class=\"cps-menu-header\">\n {{ header }}\n </div>\n <div\n *ngFor=\"let item of items; let i = index\"\n (click)=\"onItemClick($event, item)\"\n [ngClass]=\"{\n 'cps-menu-item-disabled': item.disabled,\n 'cps-menu-item-first': i === 0,\n 'cps-menu-item-compressed': compressed,\n 'cps-menu-item-compressed-with-icons': compressed && withIcons\n }\"\n class=\"cps-menu-item\">\n <div class=\"cps-menu-item-icon\" *ngIf=\"withIcons\">\n <cps-icon\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.disabled ? 'text-light' : 'text-dark'\"\n [size]=\"compressed ? 'small' : 'normal'\"></cps-icon>\n </div>\n <div class=\"cps-menu-item-content\">\n <span class=\"cps-menu-item-content-title\">{{ item.title }}</span>\n <span\n *ngIf=\"item.desc && !compressed\"\n class=\"cps-menu-item-content-desc\"\n >{{ item.desc }}</span\n >\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".cps-menu-container{background:#ffffff;border:0 none;box-shadow:0 1px 3px #0000004d;position:absolute;margin-top:14px;top:0;left:0}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px;border:solid transparent;border-color:#fff0;border-bottom-color:var(--cps-color-line-light)}.cps-menu-container:not(.cps-menu-no-arrow):after,.cps-menu-container:not(.cps-menu-no-arrow):before{bottom:100%;left:var(--overlayArrowLeft, 12);content:\" \";height:0;width:0;position:absolute;pointer-events:none}.cps-menu-container .cps-menu-content{padding:.75rem}.cps-menu-container .cps-menu-content{display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.cps-menu-container .cps-menu-content .cps-menu-header{display:flex;align-items:center;min-height:50px;padding-bottom:8px;font-weight:600;color:var(--cps-color-text-dark);cursor:default}.cps-menu-container .cps-menu-content .cps-menu-item{display:flex;align-items:center;padding:8px 48px 8px 0;border-top:1px solid rgba(0,0,0,.1215686275);cursor:pointer;min-height:58px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon{width:48px;align-items:center;display:flex}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon cps-icon{margin-left:8px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content{display:flex;flex-direction:column}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:600;font-size:15px;line-height:150%;color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-desc{font-size:12px;line-height:150%;color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled{pointer-events:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-lightest)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover{background:#f8f4f5}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):hover .cps-menu-item-icon cps-icon i{color:var(--cps-color-calm)!important}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):active{background:#f1eaec}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-first{border-top:none}.cps-menu-container .cps-menu-content.cps-menu-content-compressed{padding:0}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item{padding:0 16px;min-height:40px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-icon{width:36px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:500}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item.cps-menu-item-compressed.cps-menu-item-compressed-with-icons{padding:0 26px 0 16px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-icon cps-icon i{color:var(--cps-color-prepared)!important}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-prepared)}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px;border:solid transparent;border-color:#fff0;border-bottom-color:#fff}.cps-menu-container-flipped{margin-top:0;margin-bottom:10px}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px}.cps-menu-container-flipped:not(.cps-menu-no-arrow):after,.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{bottom:auto;top:100%}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):after{border-bottom-color:transparent}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{border-bottom-color:transparent}.cps-menu-no-arrow{margin-top:0;margin-bottom:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }], animations: [
|
|
3329
3329
|
trigger('animation', [
|
|
3330
3330
|
state('void', style({
|
|
3331
3331
|
transform: 'scaleY(0.8)',
|
|
@@ -3360,7 +3360,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3360
3360
|
transition('void => open', animate('{{showTransitionParams}}')),
|
|
3361
3361
|
transition('open => close', animate('{{hideTransitionParams}}'))
|
|
3362
3362
|
])
|
|
3363
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n *ngIf=\"render\"\n class=\"cps-menu-container\"\n [ngClass]=\"{ 'cps-menu-no-arrow': !withArrow }\"\n [class]=\"containerClass\"\n (click)=\"onOverlayClick($event)\"\n [@animation]=\"{\n value: overlayVisible ? 'open' : 'close',\n params: {\n showTransitionParams: showTransitionOptions,\n hideTransitionParams: hideTransitionOptions\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\">\n <div (click)=\"onContentClick()\" (mousedown)=\"onContentClick()\">\n <ng-container *ngIf=\"items.length < 1\">\n <ng-content></ng-content>\n </ng-container>\n <div\n *ngIf=\"items.length > 0\"\n class=\"cps-menu-content\"\n [ngClass]=\"{ 'cps-menu-content-compressed': compressed }\">\n <div *ngIf=\"header && !compressed\" class=\"cps-menu-header\">\n {{ header }}\n </div>\n <div\n *ngFor=\"let item of items; let i = index\"\n (click)=\"onItemClick($event, item)\"\n [ngClass]=\"{\n 'cps-menu-item-disabled': item.disabled,\n 'cps-menu-item-first': i === 0,\n 'cps-menu-item-compressed': compressed\n }\"\n class=\"cps-menu-item\">\n <div class=\"cps-menu-item-icon\" *ngIf=\"withIcons\">\n <cps-icon\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.disabled ? 'text-light' : 'text-dark'\"\n [size]=\"compressed ? 'small' : 'normal'\"></cps-icon>\n </div>\n <div class=\"cps-menu-item-content\">\n <span class=\"cps-menu-item-content-title\">{{ item.title }}</span>\n <span\n *ngIf=\"item.desc && !compressed\"\n class=\"cps-menu-item-content-desc\"\n >{{ item.desc }}</span\n >\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".cps-menu-container{background:#ffffff;border:0 none;box-shadow:0 1px 3px #0000004d;position:absolute;margin-top:14px;top:0;left:0}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px;border:solid transparent;border-color:#fff0;border-bottom-color:var(--cps-color-line-light)}.cps-menu-container:not(.cps-menu-no-arrow):after,.cps-menu-container:not(.cps-menu-no-arrow):before{bottom:100%;left:var(--overlayArrowLeft, 12);content:\" \";height:0;width:0;position:absolute;pointer-events:none}.cps-menu-container .cps-menu-content{padding:.75rem}.cps-menu-container .cps-menu-content{display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.cps-menu-container .cps-menu-content .cps-menu-header{display:flex;align-items:center;min-height:50px;padding-bottom:8px;font-weight:600;color:var(--cps-color-text-dark);cursor:default}.cps-menu-container .cps-menu-content .cps-menu-item{display:flex;align-items:center;padding:8px 48px 8px 0;border-top:1px solid rgba(0,0,0,.1215686275);cursor:pointer;min-height:58px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon{width:48px;align-items:center;display:flex}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon cps-icon{margin-left:8px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content{display:flex;flex-direction:column}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:600;font-size:15px;line-height:150%;color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-desc{font-size:12px;line-height:150%;color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled{pointer-events:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-lightest)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover{background:#f8f4f5}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):hover .cps-menu-item-icon cps-icon i{color:var(--cps-color-calm)!important}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):active{background:#f1eaec}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-first{border-top:none}.cps-menu-container .cps-menu-content.cps-menu-content-compressed{padding:0}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item{padding:0 16px;min-height:40px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-icon{width:36px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:500}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-icon cps-icon i{color:var(--cps-color-prepared)!important}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-prepared)}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px;border:solid transparent;border-color:#fff0;border-bottom-color:#fff}.cps-menu-container-flipped{margin-top:0;margin-bottom:10px}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px}.cps-menu-container-flipped:not(.cps-menu-no-arrow):after,.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{bottom:auto;top:100%}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):after{border-bottom-color:transparent}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{border-bottom-color:transparent}.cps-menu-no-arrow{margin-top:0;margin-bottom:0}\n"] }]
|
|
3363
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n *ngIf=\"render\"\n class=\"cps-menu-container\"\n [ngClass]=\"{ 'cps-menu-no-arrow': !withArrow }\"\n [class]=\"containerClass\"\n (click)=\"onOverlayClick($event)\"\n [@animation]=\"{\n value: overlayVisible ? 'open' : 'close',\n params: {\n showTransitionParams: showTransitionOptions,\n hideTransitionParams: hideTransitionOptions\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\">\n <div (click)=\"onContentClick()\" (mousedown)=\"onContentClick()\">\n <ng-container *ngIf=\"items.length < 1\">\n <ng-content></ng-content>\n </ng-container>\n <div\n *ngIf=\"items.length > 0\"\n class=\"cps-menu-content\"\n [ngClass]=\"{ 'cps-menu-content-compressed': compressed }\">\n <div *ngIf=\"header && !compressed\" class=\"cps-menu-header\">\n {{ header }}\n </div>\n <div\n *ngFor=\"let item of items; let i = index\"\n (click)=\"onItemClick($event, item)\"\n [ngClass]=\"{\n 'cps-menu-item-disabled': item.disabled,\n 'cps-menu-item-first': i === 0,\n 'cps-menu-item-compressed': compressed,\n 'cps-menu-item-compressed-with-icons': compressed && withIcons\n }\"\n class=\"cps-menu-item\">\n <div class=\"cps-menu-item-icon\" *ngIf=\"withIcons\">\n <cps-icon\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.disabled ? 'text-light' : 'text-dark'\"\n [size]=\"compressed ? 'small' : 'normal'\"></cps-icon>\n </div>\n <div class=\"cps-menu-item-content\">\n <span class=\"cps-menu-item-content-title\">{{ item.title }}</span>\n <span\n *ngIf=\"item.desc && !compressed\"\n class=\"cps-menu-item-content-desc\"\n >{{ item.desc }}</span\n >\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".cps-menu-container{background:#ffffff;border:0 none;box-shadow:0 1px 3px #0000004d;position:absolute;margin-top:14px;top:0;left:0}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px;border:solid transparent;border-color:#fff0;border-bottom-color:var(--cps-color-line-light)}.cps-menu-container:not(.cps-menu-no-arrow):after,.cps-menu-container:not(.cps-menu-no-arrow):before{bottom:100%;left:var(--overlayArrowLeft, 12);content:\" \";height:0;width:0;position:absolute;pointer-events:none}.cps-menu-container .cps-menu-content{padding:.75rem}.cps-menu-container .cps-menu-content{display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.cps-menu-container .cps-menu-content .cps-menu-header{display:flex;align-items:center;min-height:50px;padding-bottom:8px;font-weight:600;color:var(--cps-color-text-dark);cursor:default}.cps-menu-container .cps-menu-content .cps-menu-item{display:flex;align-items:center;padding:8px 48px 8px 0;border-top:1px solid rgba(0,0,0,.1215686275);cursor:pointer;min-height:58px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon{width:48px;align-items:center;display:flex}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon cps-icon{margin-left:8px}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content{display:flex;flex-direction:column}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:600;font-size:15px;line-height:150%;color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-desc{font-size:12px;line-height:150%;color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled{pointer-events:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-lightest)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover{background:#f8f4f5}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):hover .cps-menu-item-icon cps-icon i{color:var(--cps-color-calm)!important}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):active{background:#f1eaec}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-first{border-top:none}.cps-menu-container .cps-menu-content.cps-menu-content-compressed{padding:0}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item{padding:0 16px;min-height:40px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-icon{width:36px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:500}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item.cps-menu-item-compressed.cps-menu-item-compressed-with-icons{padding:0 26px 0 16px}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-icon cps-icon i{color:var(--cps-color-prepared)!important}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-prepared)}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px;border:solid transparent;border-color:#fff0;border-bottom-color:#fff}.cps-menu-container-flipped{margin-top:0;margin-bottom:10px}.cps-menu-container:not(.cps-menu-no-arrow):after{border-width:12px;margin-left:-12px}.cps-menu-container:not(.cps-menu-no-arrow):before{border-width:14px;margin-left:-14px}.cps-menu-container-flipped:not(.cps-menu-no-arrow):after,.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{bottom:auto;top:100%}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):after{border-bottom-color:transparent}.cps-menu-container.cps-menu-container-flipped:not(.cps-menu-no-arrow):before{border-bottom-color:transparent}.cps-menu-no-arrow{margin-top:0;margin-bottom:0}\n"] }]
|
|
3364
3364
|
}], ctorParameters: function () {
|
|
3365
3365
|
return [{ type: Document, decorators: [{
|
|
3366
3366
|
type: Inject,
|
|
@@ -3387,6 +3387,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3387
3387
|
type: Output
|
|
3388
3388
|
}] } });
|
|
3389
3389
|
|
|
3390
|
+
// import jsPDF from 'jspdf';
|
|
3391
|
+
// import 'jspdf-autotable';
|
|
3390
3392
|
function tableFactory(tableComponent) {
|
|
3391
3393
|
return tableComponent.primengTable;
|
|
3392
3394
|
}
|
|
@@ -3394,7 +3396,6 @@ class CpsTableComponent {
|
|
|
3394
3396
|
// eslint-disable-next-line no-useless-constructor
|
|
3395
3397
|
constructor(cdRef) {
|
|
3396
3398
|
this.cdRef = cdRef;
|
|
3397
|
-
this.headers = [];
|
|
3398
3399
|
this.data = [];
|
|
3399
3400
|
this.columns = [];
|
|
3400
3401
|
this.colHeaderName = 'header';
|
|
@@ -3429,7 +3430,10 @@ class CpsTableComponent {
|
|
|
3429
3430
|
this.actionBtnTitle = 'Action';
|
|
3430
3431
|
this.reorderableRows = false;
|
|
3431
3432
|
this.showColumnsToggle = false;
|
|
3432
|
-
|
|
3433
|
+
this.showExportBtn = false;
|
|
3434
|
+
this.exportFilename = 'download';
|
|
3435
|
+
this.csvSeparator = ',';
|
|
3436
|
+
this.dataKey = ''; // field, that uniquely identifies a record in data (needed for expandable rows)
|
|
3433
3437
|
/* @Input() */ this.resizableColumns = false; // TODO
|
|
3434
3438
|
/* @Input() */ this.reorderableColumns = false; // TODO
|
|
3435
3439
|
// TODO CpsTableColumnFilterDirective (type date, text, boolean, range, categories, numeric)
|
|
@@ -3447,6 +3451,29 @@ class CpsTableComponent {
|
|
|
3447
3451
|
this.virtualScrollItemSize = 0;
|
|
3448
3452
|
this.rowOptions = [];
|
|
3449
3453
|
this.selectedColumns = [];
|
|
3454
|
+
this.exportMenuItems = [
|
|
3455
|
+
{
|
|
3456
|
+
title: 'CSV',
|
|
3457
|
+
icon: 'csv',
|
|
3458
|
+
action: () => {
|
|
3459
|
+
this.exportTable('csv');
|
|
3460
|
+
}
|
|
3461
|
+
},
|
|
3462
|
+
{
|
|
3463
|
+
title: 'XLSX',
|
|
3464
|
+
icon: 'xls',
|
|
3465
|
+
action: () => {
|
|
3466
|
+
this.exportTable('xlsx');
|
|
3467
|
+
}
|
|
3468
|
+
}
|
|
3469
|
+
// {
|
|
3470
|
+
// title: 'PDF',
|
|
3471
|
+
// icon: 'pdf',
|
|
3472
|
+
// action: () => {
|
|
3473
|
+
// this.exportTable('pdf');
|
|
3474
|
+
// }
|
|
3475
|
+
// }
|
|
3476
|
+
];
|
|
3450
3477
|
}
|
|
3451
3478
|
ngOnInit() {
|
|
3452
3479
|
var _a, _b;
|
|
@@ -3554,9 +3581,53 @@ class CpsTableComponent {
|
|
|
3554
3581
|
}
|
|
3555
3582
|
this.selectedColumns = res;
|
|
3556
3583
|
}
|
|
3584
|
+
exportTable(format) {
|
|
3585
|
+
if (this.columns.length < 1)
|
|
3586
|
+
throw new Error('Columns must be defined!');
|
|
3587
|
+
if (this.selectedColumns.length < 1)
|
|
3588
|
+
throw new Error('Nothing to export!');
|
|
3589
|
+
switch (format) {
|
|
3590
|
+
case 'csv':
|
|
3591
|
+
this.primengTable.exportCSV();
|
|
3592
|
+
break;
|
|
3593
|
+
case 'xlsx':
|
|
3594
|
+
this.exportXLSX();
|
|
3595
|
+
break;
|
|
3596
|
+
// case 'pdf':
|
|
3597
|
+
// this.exportPDF();
|
|
3598
|
+
// break;
|
|
3599
|
+
}
|
|
3600
|
+
}
|
|
3601
|
+
exportXLSX() {
|
|
3602
|
+
import('xlsx').then((xlsx) => {
|
|
3603
|
+
const sheetData = [
|
|
3604
|
+
this.selectedColumns.map((c) => c[this.colHeaderName]),
|
|
3605
|
+
...this.data.map((item) => this.selectedColumns.map((c) => item[c[this.colFieldName]]))
|
|
3606
|
+
];
|
|
3607
|
+
const worksheet = xlsx.utils.json_to_sheet(sheetData, {
|
|
3608
|
+
skipHeader: true
|
|
3609
|
+
});
|
|
3610
|
+
const workbook = {
|
|
3611
|
+
Sheets: { [this.exportFilename]: worksheet },
|
|
3612
|
+
SheetNames: [this.exportFilename]
|
|
3613
|
+
};
|
|
3614
|
+
const xlsxBuffer = xlsx.write(workbook, {
|
|
3615
|
+
bookType: 'xlsx',
|
|
3616
|
+
type: 'array'
|
|
3617
|
+
});
|
|
3618
|
+
const EXCEL_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';
|
|
3619
|
+
const blob = new Blob([xlsxBuffer], {
|
|
3620
|
+
type: EXCEL_TYPE
|
|
3621
|
+
});
|
|
3622
|
+
const downloadLink = document.createElement('a');
|
|
3623
|
+
downloadLink.href = URL.createObjectURL(blob);
|
|
3624
|
+
downloadLink.download = `${this.exportFilename}.xlsx`;
|
|
3625
|
+
downloadLink.click();
|
|
3626
|
+
});
|
|
3627
|
+
}
|
|
3557
3628
|
}
|
|
3558
3629
|
CpsTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CpsTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3559
|
-
CpsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsTableComponent, isStandalone: true, selector: "cps-table", inputs: {
|
|
3630
|
+
CpsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsTableComponent, isStandalone: true, selector: "cps-table", inputs: { data: "data", columns: "columns", colHeaderName: "colHeaderName", colFieldName: "colFieldName", striped: "striped", bordered: "bordered", size: "size", selectable: "selectable", emptyMessage: "emptyMessage", hasToolbar: "hasToolbar", toolbarSize: "toolbarSize", toolbarTitle: "toolbarTitle", sortMode: "sortMode", customSort: "customSort", rowHover: "rowHover", scrollable: "scrollable", scrollHeight: "scrollHeight", virtualScroll: "virtualScroll", paginator: "paginator", alwaysShowPaginator: "alwaysShowPaginator", rowsPerPageOptions: "rowsPerPageOptions", first: "first", rows: "rows", totalRecords: "totalRecords", lazy: "lazy", lazyLoadOnInit: "lazyLoadOnInit", showGlobalFilter: "showGlobalFilter", globalFilterPlaceholder: "globalFilterPlaceholder", globalFilterFields: "globalFilterFields", showRemoveBtnOnSelect: "showRemoveBtnOnSelect", showActionBtn: "showActionBtn", actionBtnTitle: "actionBtnTitle", reorderableRows: "reorderableRows", showColumnsToggle: "showColumnsToggle", showExportBtn: "showExportBtn", exportFilename: "exportFilename", csvSeparator: "csvSeparator", dataKey: "dataKey" }, outputs: { selectionChanged: "selectionChanged", actionBtnClicked: "actionBtnClicked", pageChanged: "pageChanged", customSortFunction: "customSortFunction" }, providers: [
|
|
3560
3631
|
TableService,
|
|
3561
3632
|
{
|
|
3562
3633
|
provide: Table,
|
|
@@ -3564,10 +3635,10 @@ CpsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
|
|
|
3564
3635
|
// eslint-disable-next-line no-use-before-define
|
|
3565
3636
|
deps: [CpsTableComponent]
|
|
3566
3637
|
}
|
|
3567
|
-
], queries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "bodyTemplate", first: true, predicate: ["body"], descendants: true }], viewQueries: [{ propertyName: "primengTable", first: true, predicate: ["primengTable"], descendants: true, static: true }], ngImport: i0, template: "<p-table\n #primengTable\n withUnsort\n [styleClass]=\"styleClass\"\n [value]=\"data\"\n [columns]=\"selectedColumns\"\n (selectionChange)=\"onSelectionChanged($event)\"\n [resizableColumns]=\"resizableColumns\"\n [reorderableColumns]=\"reorderableColumns\"\n [globalFilterFields]=\"globalFilterFields\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n [lazy]=\"lazy\"\n [lazyLoadOnInit]=\"lazyLoadOnInit\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: 3 }\"\n [paginator]=\"paginator\"\n [showCurrentPageReport]=\"true\"\n [alwaysShowPaginator]=\"alwaysShowPaginator\"\n [rows]=\"rows\"\n [first]=\"first\"\n [totalRecords]=\"totalRecords\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\"\n [(selection)]=\"selectedRows\"\n [metaKeySelection]=\"false\"\n [rowHover]=\"rowHover\"\n [customSort]=\"customSort\"\n [sortMode]=\"sortMode\"\n (onPage)=\"onPageChange($event)\"\n (sortFunction)=\"onSortFunction($event)\">\n <ng-template pTemplate=\"caption\" *ngIf=\"hasToolbar\">\n <ng-container *ngIf=\"toolbarTemplate\">\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!toolbarTemplate\">\n <div class=\"cps-table-tbar-left\">\n <div>{{ toolbarTitle }}</div>\n <div *ngIf=\"showGlobalFilter\" class=\"cps-table-tbar-global-filter\">\n <cps-input\n prefixIcon=\"search\"\n [placeholder]=\"globalFilterPlaceholder\"\n (valueChanged)=\"onFilterGlobal($event)\"\n [clearable]=\"true\"\n [hideDetails]=\"true\">\n </cps-input>\n </div>\n </div>\n <div class=\"cps-table-tbar-right\">\n <div\n *ngIf=\"showRemoveBtnOnSelect && selectedRows.length > 0\"\n class=\"cps-table-tbar-remove-btn\">\n <cps-button\n label=\"Remove\"\n color=\"prepared\"\n type=\"borderless\"\n icon=\"remove\"\n (clicked)=\"removeSelected()\">\n </cps-button>\n </div>\n <div *ngIf=\"showActionBtn\" class=\"cps-table-tbar-action-btn\">\n <cps-button\n [label]=\"actionBtnTitle\"\n color=\"prepared\"\n type=\"outlined\"\n (clicked)=\"onClickActionBtn()\">\n </cps-button>\n </div>\n <div\n *ngIf=\"showColumnsToggle && columns.length > 0\"\n class=\"cps-table-tbar-coltoggle-btn\">\n <cps-icon\n icon=\"columns\"\n size=\"normal\"\n color=\"prepared-lighten1\"\n (click)=\"colToggleMenu.toggle($event)\"></cps-icon>\n <cps-menu #colToggleMenu [withArrow]=\"false\">\n <div class=\"cps-table-coltoggle-menu\">\n <div\n class=\"cps-table-coltoggle-menu-item select-all-option\"\n [class.allselected]=\"selectedColumns.length === columns.length\"\n (click)=\"toggleAllColumns()\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"> </span>\n <span class=\"cps-table-coltoggle-menu-item-label\"\n >Show all columns</span\n >\n </span>\n </div>\n <div\n *ngFor=\"let col of columns\"\n class=\"cps-table-coltoggle-menu-item\"\n (click)=\"onSelectColumn(col)\"\n [class.selected]=\"isColumnSelected(col)\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"></span>\n <span class=\"cps-table-coltoggle-menu-item-label\">{{\n col[colHeaderName]\n }}</span>\n </span>\n </div>\n </div>\n </cps-menu>\n </div>\n </div>\n </ng-container>\n </ng-template>\n\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <th style=\"width: 3rem\" *ngIf=\"reorderableRows\"></th>\n <th style=\"width: 4rem\" *ngIf=\"selectable\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <ng-container *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"\n headerTemplate;\n context: {\n $implicit: columns,\n }\n \"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!headerTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <th *ngFor=\"let col of columns\">\n {{ col[colHeaderName] }}\n </th>\n </ng-container>\n <ng-container *ngIf=\"headers.length > 0 && columns.length < 1\">\n <th *ngFor=\"let h of headers\">{{ h }}</th>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n\n <ng-template\n pTemplate=\"body\"\n let-rowData\n let-columns=\"columns\"\n let-item\n let-rowIndex=\"rowIndex\">\n <tr\n [pReorderableRow]=\"rowIndex\"\n [ngClass]=\"{\n 'cps-table-row-selected': selectable && primengTable.isSelected(item)\n }\">\n <td *ngIf=\"reorderableRows\">\n <span pReorderableRowHandle>\u2630</span>\n </td>\n <td *ngIf=\"selectable\">\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <ng-container *ngIf=\"bodyTemplate\">\n <ng-container\n pTemplate=\"body\"\n *ngTemplateOutlet=\"\n bodyTemplate;\n context: {\n $implicit: item,\n rowIndex: rowIndex,\n columns: columns,\n rowData: rowData\n }\n \">\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"!bodyTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <td *ngFor=\"let col of columns\">\n {{ rowData[col[colFieldName]] }}\n </td>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td colspan=\"100\" class=\"cps-table-empty-message-td\">\n {{ emptyMessage }}\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"paginatorleft\">\n <div class=\"cps-table-paginator-itms-per-page\">\n <span class=\"cps-table-paginator-items-per-page-title\"\n >Rows per page:\n </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChanged()\"\n [returnObject]=\"false\">\n </cps-select>\n </div>\n </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}:host ::ng-deep .p-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}:host ::ng-deep .p-datatable{position:relative}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-header{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable .p-datatable-header{font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:0 10px;border:1px solid var(--cps-color-line-mid);border-left:4px solid var(--cps-color-surprise)!important;border-radius:4px 4px 0 0;font-size:16px;line-height:150%;background-color:#fff;color:var(--cps-color-text-dark);overflow:auto}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-global-filter{margin-left:18px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-remove-btn{margin-right:4px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-action-btn{margin-right:4px;margin-left:8px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn{display:contents}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon{margin-left:8px;margin-right:4px;cursor:pointer}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon:hover .cps-icon{color:var(--cps-color-prepared)!important}:host ::ng-deep .cps-tbar-small.p-datatable .p-datatable-header{height:43px}:host ::ng-deep .cps-tbar-normal.p-datatable .p-datatable-header{height:72px}:host ::ng-deep .p-datatable-flex-scrollable>.p-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}:host ::ng-deep .p-datatable-scrollable>.p-datatable-wrapper{position:relative}:host ::ng-deep .p-datatable>.p-datatable-wrapper{overflow:auto}:host ::ng-deep .p-datatable-table{border-spacing:0px;width:100%}:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-tfoot,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-tfoot{background-color:#fff}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{position:sticky;top:0;z-index:1}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th:last-child{border-width:1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-thead>tr>th{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th{border-width:1px 0 1px 1px}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight:hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;font-weight:400;color:var(--cps-color-text-mild);background:white;transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon{color:var(--cps-color-text-dark)}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon{color:var(--cps-color-text-mild);margin-left:.5rem}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon{color:var(--cps-color-calm)}:host ::ng-deep .p-icon{display:inline-block;width:1rem;height:1rem}:host ::ng-deep .p-sortable-column-icon{width:13px;height:13px}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .p-datatable .p-sortable-column .p-column-title,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{vertical-align:unset}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{border-radius:50%;height:1.125rem;min-width:1.125rem;line-height:1.125rem;color:var(--cps-color-calm);background:#f1eaec;margin-left:.5rem}:host ::ng-deep filtericon{pointer-events:none}:host ::ng-deep filtericon .p-icon{width:13px;height:13px}:host ::ng-deep p-columnfilter{margin-left:4px}:host ::ng-deep .p-column-filter-menu-button:hover{color:var(--cps-color-text-dark);border-color:transparent}:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open,:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open:hover{background:transparent;color:var(--cps-color-text-dark)}:host ::ng-deep .p-column-filter-menu-button,:host ::ng-deep .p-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}:host ::ng-deep .p-column-filter-menu-button:focus{outline:0 none;outline-offset:0;box-shadow:none}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column{cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column:focus{box-shadow:none;outline:0 none}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(odd){background:var(--cps-color-bg-light)}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(even){background:#ffffff}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:#ffffff;color:var(--cps-color-text-dark);transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.cps-table-row-selected{background-color:#f1ebed!important}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td:last-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td:last-child{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-tbody>tr>td{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td{border-width:0 0 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td{border-width:1px 0 0 1px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{text-align:left;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem}:host ::ng-deep td:has(p-tablecheckbox){text-align:center!important}:host ::ng-deep th:has(p-tableheadercheckbox){text-align:center!important;width:3rem!important}:host ::ng-deep .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative;width:18px;height:18px}:host ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:host ::ng-deep .p-hidden-accessible input,:host ::ng-deep .p-hidden-accessible select{transform:scale(0)}:host ::ng-deep .p-checkbox .p-checkbox-box{background:#ffffff;width:18px;height:18px;color:var(--cps-color-text-dark);border:2px solid var(--cps-color-text-mild);border-radius:2px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}:host ::ng-deep .p-checkbox-box{display:flex;justify-content:center;align-items:center}:host ::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:var(--cps-color-calm);background:var(--cps-color-calm)}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover{border-color:var(--cps-color-calm);background:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover{border-color:var(--cps-color-calm)}:host ::ng-deep .p-checkbox .p-checkbox-box .p-icon{width:14px;height:14px}:host ::ng-deep .p-checkbox .p-checkbox-box .p-checkbox-icon{transition-duration:.2s;color:#fff;font-size:14px}:host ::ng-deep .p-datatable-reorderablerow-handle,:host ::ng-deep [pReorderableColumn]{cursor:move;font-size:16px;line-height:1}:host ::ng-deep .p-datatable-reorderablerow-handle:hover,:host ::ng-deep [pReorderableColumn]:hover{color:var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-top>td{box-shadow:inset 0 2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-bottom>td{box-shadow:inset 0 -2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-paginator-bottom{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable .p-paginator-bottom{border-width:0 0 1px 0;border-radius:0}:host ::ng-deep .p-paginator{background:white;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:1rem;border:solid var(--cps-color-line-mid)}:host ::ng-deep .p-paginator-left-content{margin-right:auto}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-table-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select.top-open .cps-select-options{bottom:33px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-options-option{font-size:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-link:focus{outline:0 none;outline-offset:0}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}:host ::ng-deep .cps-table-empty-message-td{text-align:center!important;font-weight:600}.cps-table-coltoggle-menu{display:block;max-height:242px;overflow-x:hidden;background:white}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item:hover{background:#f8f4f5}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-label{color:var(--cps-color-text-dark)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-left{display:flex;align-items:center;margin-right:8px}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected{font-weight:600}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-label,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-label{color:var(--cps-color-calm)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-check,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-check{opacity:1}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected{background:#efe4e7}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.highlighten{background:#f5eeef}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected.highlighten{background:#e6d4d9}.cps-table-coltoggle-menu .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i3$2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3$2.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i3$2.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i3$2.ReorderableRowHandle, selector: "[pReorderableRowHandle]" }, { kind: "directive", type: i3$2.ReorderableRow, selector: "[pReorderableRow]", inputs: ["pReorderableRow", "pReorderableRowDisabled"] }, { kind: "directive", type: TableUnsortDirective, selector: "[withUnsort]" }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred"] }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "type", "label", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "optionLabel", "optionValue", "optionInfo", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "items", "withArrow", "compressed", "focusOnShow", "containerClass"], outputs: ["menuShown", "menuHidden"] }] });
|
|
3638
|
+
], queries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "bodyTemplate", first: true, predicate: ["body"], descendants: true }, { propertyName: "rowExpansionTemplate", first: true, predicate: ["rowexpansion"], descendants: true }], viewQueries: [{ propertyName: "primengTable", first: true, predicate: ["primengTable"], descendants: true, static: true }], ngImport: i0, template: "<p-table\n #primengTable\n withUnsort\n [styleClass]=\"styleClass\"\n [value]=\"data\"\n [dataKey]=\"dataKey\"\n [columns]=\"selectedColumns\"\n (selectionChange)=\"onSelectionChanged($event)\"\n [resizableColumns]=\"resizableColumns\"\n [reorderableColumns]=\"reorderableColumns\"\n [globalFilterFields]=\"globalFilterFields\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n [lazy]=\"lazy\"\n [lazyLoadOnInit]=\"lazyLoadOnInit\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: 3 }\"\n [paginator]=\"paginator\"\n [showCurrentPageReport]=\"true\"\n [alwaysShowPaginator]=\"alwaysShowPaginator\"\n [rows]=\"rows\"\n [first]=\"first\"\n [totalRecords]=\"totalRecords\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\"\n [(selection)]=\"selectedRows\"\n [metaKeySelection]=\"false\"\n [rowHover]=\"rowHover\"\n [customSort]=\"customSort\"\n [sortMode]=\"sortMode\"\n [exportFilename]=\"exportFilename\"\n [csvSeparator]=\"csvSeparator\"\n (onPage)=\"onPageChange($event)\"\n (sortFunction)=\"onSortFunction($event)\">\n <ng-template pTemplate=\"caption\" *ngIf=\"hasToolbar\">\n <ng-container *ngIf=\"toolbarTemplate\">\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!toolbarTemplate\">\n <div class=\"cps-table-tbar-left\">\n <div>{{ toolbarTitle }}</div>\n <div *ngIf=\"showGlobalFilter\" class=\"cps-table-tbar-global-filter\">\n <cps-input\n prefixIcon=\"search\"\n [placeholder]=\"globalFilterPlaceholder\"\n (valueChanged)=\"onFilterGlobal($event)\"\n [clearable]=\"true\"\n [hideDetails]=\"true\">\n </cps-input>\n </div>\n </div>\n <div class=\"cps-table-tbar-right\">\n <div\n *ngIf=\"showRemoveBtnOnSelect && selectedRows.length > 0\"\n class=\"cps-table-tbar-remove-btn\">\n <cps-button\n label=\"Remove\"\n color=\"prepared\"\n type=\"borderless\"\n icon=\"remove\"\n (clicked)=\"removeSelected()\">\n </cps-button>\n </div>\n <div *ngIf=\"showActionBtn\" class=\"cps-table-tbar-action-btn\">\n <cps-button\n [label]=\"actionBtnTitle\"\n color=\"prepared\"\n type=\"outlined\"\n (clicked)=\"onClickActionBtn()\">\n </cps-button>\n </div>\n <div\n *ngIf=\"showColumnsToggle && columns.length > 0\"\n class=\"cps-table-tbar-coltoggle-btn\">\n <cps-icon\n icon=\"columns\"\n size=\"normal\"\n color=\"prepared-lighten1\"\n (click)=\"colToggleMenu.toggle($event)\"></cps-icon>\n <cps-menu #colToggleMenu [withArrow]=\"false\">\n <div class=\"cps-table-coltoggle-menu\">\n <div\n class=\"cps-table-coltoggle-menu-item select-all-option\"\n [class.allselected]=\"selectedColumns.length === columns.length\"\n (click)=\"toggleAllColumns()\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"> </span>\n <span class=\"cps-table-coltoggle-menu-item-label\"\n >Show all columns</span\n >\n </span>\n </div>\n <div\n *ngFor=\"let col of columns\"\n class=\"cps-table-coltoggle-menu-item\"\n (click)=\"onSelectColumn(col)\"\n [class.selected]=\"isColumnSelected(col)\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"></span>\n <span class=\"cps-table-coltoggle-menu-item-label\">{{\n col[colHeaderName]\n }}</span>\n </span>\n </div>\n </div>\n </cps-menu>\n </div>\n <div *ngIf=\"showExportBtn\" class=\"cps-table-tbar-export-btn\">\n <cps-icon\n icon=\"export\"\n size=\"normal\"\n color=\"prepared\"\n (click)=\"exportMenu.toggle($event)\"></cps-icon>\n <cps-menu\n #exportMenu\n [items]=\"exportMenuItems\"\n [compressed]=\"true\"\n [withArrow]=\"false\">\n </cps-menu>\n </div>\n </div>\n </ng-container>\n </ng-template>\n\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <th style=\"width: 3rem\" *ngIf=\"rowExpansionTemplate\"></th>\n <th style=\"width: 3rem\" *ngIf=\"reorderableRows\"></th>\n <th style=\"width: 4rem\" *ngIf=\"selectable\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <ng-container *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"\n headerTemplate;\n context: {\n $implicit: columns,\n }\n \"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!headerTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <th *ngFor=\"let col of columns\">\n {{ col[colHeaderName] }}\n </th>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n\n <ng-template\n pTemplate=\"body\"\n let-rowData\n let-columns=\"columns\"\n let-item\n let-rowIndex=\"rowIndex\"\n let-expanded=\"expanded\">\n <tr\n [pReorderableRow]=\"rowIndex\"\n [ngClass]=\"{\n 'cps-table-row-selected': selectable && primengTable.isSelected(item)\n }\">\n <td *ngIf=\"rowExpansionTemplate\">\n <div\n class=\"cps-table-row-chevron\"\n [ngClass]=\"{ 'cps-table-row-chevron-expanded': expanded }\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n color=\"text-dark\"\n [pRowToggler]=\"item\">\n </cps-icon>\n </div>\n </td>\n <td *ngIf=\"reorderableRows\">\n <span class=\"cps-table-row-drag-handle\" pReorderableRowHandle>\u2630</span>\n </td>\n <td *ngIf=\"selectable\">\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <ng-container *ngIf=\"bodyTemplate\">\n <ng-container\n pTemplate=\"body\"\n *ngTemplateOutlet=\"\n bodyTemplate;\n context: {\n $implicit: item,\n rowIndex: rowIndex,\n columns: columns,\n rowData: rowData\n }\n \">\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"!bodyTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <td *ngFor=\"let col of columns\">\n {{ rowData[col[colFieldName]] }}\n </td>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"rowexpansion\" *ngIf=\"rowExpansionTemplate\" let-item>\n <tr class=\"cps-table-row-expanded-content\">\n <td colspan=\"100\">\n <ng-container\n *ngTemplateOutlet=\"\n rowExpansionTemplate;\n context: {\n $implicit: item\n }\n \"></ng-container>\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td colspan=\"100\" class=\"cps-table-empty-message-td\">\n {{ emptyMessage }}\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"paginatorleft\">\n <div class=\"cps-table-paginator-itms-per-page\">\n <span class=\"cps-table-paginator-items-per-page-title\"\n >Rows per page:\n </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChanged()\"\n [returnObject]=\"false\">\n </cps-select>\n </div>\n </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}:host ::ng-deep .p-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}:host ::ng-deep .p-datatable{position:relative}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-header{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable .p-datatable-header{font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:0 10px;border:1px solid var(--cps-color-line-mid);border-left:4px solid var(--cps-color-surprise)!important;border-radius:4px 4px 0 0;font-size:16px;line-height:150%;background-color:#fff;color:var(--cps-color-text-dark);overflow:auto}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-global-filter{margin-left:18px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-remove-btn{margin-right:4px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-action-btn{margin-right:4px;margin-left:8px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn{display:contents}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon{margin-left:8px;margin-right:4px;cursor:pointer}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon:hover .cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon:hover .cps-icon{color:var(--cps-color-prepared)!important}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon .cps-icon{width:22px;height:22px}:host ::ng-deep .cps-tbar-small.p-datatable .p-datatable-header{height:43px}:host ::ng-deep .cps-tbar-normal.p-datatable .p-datatable-header{height:72px}:host ::ng-deep .p-datatable-flex-scrollable>.p-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}:host ::ng-deep .p-datatable-scrollable>.p-datatable-wrapper{position:relative}:host ::ng-deep .p-datatable>.p-datatable-wrapper{overflow:auto}:host ::ng-deep .p-datatable-table{border-spacing:0px;width:100%}:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-tfoot,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-tfoot{background-color:#fff}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{position:sticky;top:0;z-index:1}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th:last-child{border-width:1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-thead>tr>th{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th{border-width:1px 0 1px 1px}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight:hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;font-weight:400;color:var(--cps-color-text-mild);background:white;transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon{color:var(--cps-color-text-dark)}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon{color:var(--cps-color-text-mild);margin-left:.5rem}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon{color:var(--cps-color-calm)}:host ::ng-deep .p-icon{display:inline-block;width:1rem;height:1rem}:host ::ng-deep .p-sortable-column-icon{width:13px;height:13px}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .p-datatable .p-sortable-column .p-column-title,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{vertical-align:unset}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{border-radius:50%;height:1.125rem;min-width:1.125rem;line-height:1.125rem;color:var(--cps-color-calm);background:#f1eaec;margin-left:.5rem}:host ::ng-deep filtericon{pointer-events:none}:host ::ng-deep filtericon .p-icon{width:13px;height:13px}:host ::ng-deep p-columnfilter{margin-left:4px}:host ::ng-deep .p-column-filter-menu-button:hover{color:var(--cps-color-text-dark);border-color:transparent}:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open,:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open:hover{background:transparent;color:var(--cps-color-text-dark)}:host ::ng-deep .p-column-filter-menu-button,:host ::ng-deep .p-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}:host ::ng-deep .p-column-filter-menu-button:focus{outline:0 none;outline-offset:0;box-shadow:none}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column{cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column:focus{box-shadow:none;outline:0 none}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(odd){background:var(--cps-color-bg-light)}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(even){background:#ffffff}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):not(.cps-table-row-expanded-content):hover{background:#f8f4f5}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:#ffffff;color:var(--cps-color-text-dark);transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.cps-table-row-selected{background-color:#f1ebed!important}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td:last-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td:last-child{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-tbody>tr>td{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td{border-width:0 0 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td{border-width:1px 0 0 1px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{text-align:left;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem}:host ::ng-deep td:has(p-tablecheckbox){text-align:center!important}:host ::ng-deep th:has(p-tableheadercheckbox){text-align:center!important;width:3rem!important}:host ::ng-deep .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative;width:18px;height:18px}:host ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:host ::ng-deep .p-hidden-accessible input,:host ::ng-deep .p-hidden-accessible select{transform:scale(0)}:host ::ng-deep .p-checkbox .p-checkbox-box{background:#ffffff;width:18px;height:18px;color:var(--cps-color-text-dark);border:2px solid var(--cps-color-text-mild);border-radius:2px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}:host ::ng-deep .p-checkbox-box{display:flex;justify-content:center;align-items:center}:host ::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:var(--cps-color-calm);background:var(--cps-color-calm)}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover{border-color:var(--cps-color-calm);background:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover{border-color:var(--cps-color-calm)}:host ::ng-deep .p-checkbox .p-checkbox-box .p-icon{width:14px;height:14px}:host ::ng-deep .p-checkbox .p-checkbox-box .p-checkbox-icon{transition-duration:.2s;color:#fff;font-size:14px}:host ::ng-deep .p-datatable-reorderablerow-handle,:host ::ng-deep [pReorderableColumn]{cursor:move;font-size:16px;line-height:1}:host ::ng-deep .p-datatable-reorderablerow-handle:hover,:host ::ng-deep [pReorderableColumn]:hover{color:var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-top>td{box-shadow:inset 0 2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-bottom>td{box-shadow:inset 0 -2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-paginator-bottom{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable .p-paginator-bottom{border-width:0 0 1px 0;border-radius:0}:host ::ng-deep .p-paginator{background:white;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:1rem;border:solid var(--cps-color-line-mid)}:host ::ng-deep .p-paginator-left-content{margin-right:auto}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-table-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select.top-open .cps-select-options{bottom:33px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-options-option{font-size:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-link:focus{outline:0 none;outline-offset:0}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}:host ::ng-deep .cps-table-empty-message-td{text-align:center!important;font-weight:600}:host ::ng-deep .cps-table-row-drag-handle{-webkit-user-select:none;user-select:none}:host ::ng-deep .cps-table-row-chevron{transition-duration:.2s;cursor:pointer;display:flex}:host ::ng-deep .cps-table-row-chevron-expanded{transform:rotate(180deg)}.cps-table-coltoggle-menu{display:block;max-height:242px;overflow-x:hidden;background:white}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item:hover{background:#f8f4f5}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-label{color:var(--cps-color-text-dark)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-left{display:flex;align-items:center;margin-right:8px}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected{font-weight:600}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-label,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-label{color:var(--cps-color-calm)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-check,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-check{opacity:1}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected{background:#efe4e7}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.highlighten{background:#f5eeef}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected.highlighten{background:#e6d4d9}.cps-table-coltoggle-menu .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i3$2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i3$2.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "component", type: i3$2.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i3$2.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i3$2.ReorderableRowHandle, selector: "[pReorderableRowHandle]" }, { kind: "directive", type: i3$2.ReorderableRow, selector: "[pReorderableRow]", inputs: ["pReorderableRow", "pReorderableRowDisabled"] }, { kind: "directive", type: TableUnsortDirective, selector: "[withUnsort]" }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred"] }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "type", "label", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "optionLabel", "optionValue", "optionInfo", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "items", "withArrow", "compressed", "focusOnShow", "containerClass"], outputs: ["menuShown", "menuHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3568
3639
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CpsTableComponent, decorators: [{
|
|
3569
3640
|
type: Component,
|
|
3570
|
-
args: [{ selector: 'cps-table', standalone: true, imports: [
|
|
3641
|
+
args: [{ selector: 'cps-table', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
3571
3642
|
FormsModule,
|
|
3572
3643
|
CommonModule,
|
|
3573
3644
|
TableModule,
|
|
@@ -3585,10 +3656,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3585
3656
|
// eslint-disable-next-line no-use-before-define
|
|
3586
3657
|
deps: [CpsTableComponent]
|
|
3587
3658
|
}
|
|
3588
|
-
], template: "<p-table\n #primengTable\n withUnsort\n [styleClass]=\"styleClass\"\n [value]=\"data\"\n [columns]=\"selectedColumns\"\n (selectionChange)=\"onSelectionChanged($event)\"\n [resizableColumns]=\"resizableColumns\"\n [reorderableColumns]=\"reorderableColumns\"\n [globalFilterFields]=\"globalFilterFields\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n [lazy]=\"lazy\"\n [lazyLoadOnInit]=\"lazyLoadOnInit\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: 3 }\"\n [paginator]=\"paginator\"\n [showCurrentPageReport]=\"true\"\n [alwaysShowPaginator]=\"alwaysShowPaginator\"\n [rows]=\"rows\"\n [first]=\"first\"\n [totalRecords]=\"totalRecords\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\"\n [(selection)]=\"selectedRows\"\n [metaKeySelection]=\"false\"\n [rowHover]=\"rowHover\"\n [customSort]=\"customSort\"\n [sortMode]=\"sortMode\"\n (onPage)=\"onPageChange($event)\"\n (sortFunction)=\"onSortFunction($event)\">\n <ng-template pTemplate=\"caption\" *ngIf=\"hasToolbar\">\n <ng-container *ngIf=\"toolbarTemplate\">\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!toolbarTemplate\">\n <div class=\"cps-table-tbar-left\">\n <div>{{ toolbarTitle }}</div>\n <div *ngIf=\"showGlobalFilter\" class=\"cps-table-tbar-global-filter\">\n <cps-input\n prefixIcon=\"search\"\n [placeholder]=\"globalFilterPlaceholder\"\n (valueChanged)=\"onFilterGlobal($event)\"\n [clearable]=\"true\"\n [hideDetails]=\"true\">\n </cps-input>\n </div>\n </div>\n <div class=\"cps-table-tbar-right\">\n <div\n *ngIf=\"showRemoveBtnOnSelect && selectedRows.length > 0\"\n class=\"cps-table-tbar-remove-btn\">\n <cps-button\n label=\"Remove\"\n color=\"prepared\"\n type=\"borderless\"\n icon=\"remove\"\n (clicked)=\"removeSelected()\">\n </cps-button>\n </div>\n <div *ngIf=\"showActionBtn\" class=\"cps-table-tbar-action-btn\">\n <cps-button\n [label]=\"actionBtnTitle\"\n color=\"prepared\"\n type=\"outlined\"\n (clicked)=\"onClickActionBtn()\">\n </cps-button>\n </div>\n <div\n *ngIf=\"showColumnsToggle && columns.length > 0\"\n class=\"cps-table-tbar-coltoggle-btn\">\n <cps-icon\n icon=\"columns\"\n size=\"normal\"\n color=\"prepared-lighten1\"\n (click)=\"colToggleMenu.toggle($event)\"></cps-icon>\n <cps-menu #colToggleMenu [withArrow]=\"false\">\n <div class=\"cps-table-coltoggle-menu\">\n <div\n class=\"cps-table-coltoggle-menu-item select-all-option\"\n [class.allselected]=\"selectedColumns.length === columns.length\"\n (click)=\"toggleAllColumns()\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"> </span>\n <span class=\"cps-table-coltoggle-menu-item-label\"\n >Show all columns</span\n >\n </span>\n </div>\n <div\n *ngFor=\"let col of columns\"\n class=\"cps-table-coltoggle-menu-item\"\n (click)=\"onSelectColumn(col)\"\n [class.selected]=\"isColumnSelected(col)\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"></span>\n <span class=\"cps-table-coltoggle-menu-item-label\">{{\n col[colHeaderName]\n }}</span>\n </span>\n </div>\n </div>\n </cps-menu>\n </div>\n </div>\n </ng-container>\n </ng-template>\n\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <th style=\"width: 3rem\" *ngIf=\"reorderableRows\"></th>\n <th style=\"width: 4rem\" *ngIf=\"selectable\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <ng-container *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"\n headerTemplate;\n context: {\n $implicit: columns,\n }\n \"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!headerTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <th *ngFor=\"let col of columns\">\n {{ col[colHeaderName] }}\n </th>\n </ng-container>\n <ng-container *ngIf=\"headers.length > 0 && columns.length < 1\">\n <th *ngFor=\"let h of headers\">{{ h }}</th>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n\n <ng-template\n pTemplate=\"body\"\n let-rowData\n let-columns=\"columns\"\n let-item\n let-rowIndex=\"rowIndex\">\n <tr\n [pReorderableRow]=\"rowIndex\"\n [ngClass]=\"{\n 'cps-table-row-selected': selectable && primengTable.isSelected(item)\n }\">\n <td *ngIf=\"reorderableRows\">\n <span pReorderableRowHandle>\u2630</span>\n </td>\n <td *ngIf=\"selectable\">\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <ng-container *ngIf=\"bodyTemplate\">\n <ng-container\n pTemplate=\"body\"\n *ngTemplateOutlet=\"\n bodyTemplate;\n context: {\n $implicit: item,\n rowIndex: rowIndex,\n columns: columns,\n rowData: rowData\n }\n \">\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"!bodyTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <td *ngFor=\"let col of columns\">\n {{ rowData[col[colFieldName]] }}\n </td>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td colspan=\"100\" class=\"cps-table-empty-message-td\">\n {{ emptyMessage }}\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"paginatorleft\">\n <div class=\"cps-table-paginator-itms-per-page\">\n <span class=\"cps-table-paginator-items-per-page-title\"\n >Rows per page:\n </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChanged()\"\n [returnObject]=\"false\">\n </cps-select>\n </div>\n </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}:host ::ng-deep .p-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}:host ::ng-deep .p-datatable{position:relative}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-header{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable .p-datatable-header{font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:0 10px;border:1px solid var(--cps-color-line-mid);border-left:4px solid var(--cps-color-surprise)!important;border-radius:4px 4px 0 0;font-size:16px;line-height:150%;background-color:#fff;color:var(--cps-color-text-dark);overflow:auto}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-global-filter{margin-left:18px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-remove-btn{margin-right:4px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-action-btn{margin-right:4px;margin-left:8px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn{display:contents}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon{margin-left:8px;margin-right:4px;cursor:pointer}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon:hover .cps-icon{color:var(--cps-color-prepared)!important}:host ::ng-deep .cps-tbar-small.p-datatable .p-datatable-header{height:43px}:host ::ng-deep .cps-tbar-normal.p-datatable .p-datatable-header{height:72px}:host ::ng-deep .p-datatable-flex-scrollable>.p-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}:host ::ng-deep .p-datatable-scrollable>.p-datatable-wrapper{position:relative}:host ::ng-deep .p-datatable>.p-datatable-wrapper{overflow:auto}:host ::ng-deep .p-datatable-table{border-spacing:0px;width:100%}:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-tfoot,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-tfoot{background-color:#fff}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{position:sticky;top:0;z-index:1}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th:last-child{border-width:1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-thead>tr>th{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th{border-width:1px 0 1px 1px}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight:hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;font-weight:400;color:var(--cps-color-text-mild);background:white;transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon{color:var(--cps-color-text-dark)}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon{color:var(--cps-color-text-mild);margin-left:.5rem}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon{color:var(--cps-color-calm)}:host ::ng-deep .p-icon{display:inline-block;width:1rem;height:1rem}:host ::ng-deep .p-sortable-column-icon{width:13px;height:13px}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .p-datatable .p-sortable-column .p-column-title,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{vertical-align:unset}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{border-radius:50%;height:1.125rem;min-width:1.125rem;line-height:1.125rem;color:var(--cps-color-calm);background:#f1eaec;margin-left:.5rem}:host ::ng-deep filtericon{pointer-events:none}:host ::ng-deep filtericon .p-icon{width:13px;height:13px}:host ::ng-deep p-columnfilter{margin-left:4px}:host ::ng-deep .p-column-filter-menu-button:hover{color:var(--cps-color-text-dark);border-color:transparent}:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open,:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open:hover{background:transparent;color:var(--cps-color-text-dark)}:host ::ng-deep .p-column-filter-menu-button,:host ::ng-deep .p-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}:host ::ng-deep .p-column-filter-menu-button:focus{outline:0 none;outline-offset:0;box-shadow:none}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column{cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column:focus{box-shadow:none;outline:0 none}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(odd){background:var(--cps-color-bg-light)}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(even){background:#ffffff}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:#ffffff;color:var(--cps-color-text-dark);transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.cps-table-row-selected{background-color:#f1ebed!important}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td:last-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td:last-child{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-tbody>tr>td{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td{border-width:0 0 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td{border-width:1px 0 0 1px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{text-align:left;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem}:host ::ng-deep td:has(p-tablecheckbox){text-align:center!important}:host ::ng-deep th:has(p-tableheadercheckbox){text-align:center!important;width:3rem!important}:host ::ng-deep .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative;width:18px;height:18px}:host ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:host ::ng-deep .p-hidden-accessible input,:host ::ng-deep .p-hidden-accessible select{transform:scale(0)}:host ::ng-deep .p-checkbox .p-checkbox-box{background:#ffffff;width:18px;height:18px;color:var(--cps-color-text-dark);border:2px solid var(--cps-color-text-mild);border-radius:2px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}:host ::ng-deep .p-checkbox-box{display:flex;justify-content:center;align-items:center}:host ::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:var(--cps-color-calm);background:var(--cps-color-calm)}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover{border-color:var(--cps-color-calm);background:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover{border-color:var(--cps-color-calm)}:host ::ng-deep .p-checkbox .p-checkbox-box .p-icon{width:14px;height:14px}:host ::ng-deep .p-checkbox .p-checkbox-box .p-checkbox-icon{transition-duration:.2s;color:#fff;font-size:14px}:host ::ng-deep .p-datatable-reorderablerow-handle,:host ::ng-deep [pReorderableColumn]{cursor:move;font-size:16px;line-height:1}:host ::ng-deep .p-datatable-reorderablerow-handle:hover,:host ::ng-deep [pReorderableColumn]:hover{color:var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-top>td{box-shadow:inset 0 2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-bottom>td{box-shadow:inset 0 -2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-paginator-bottom{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable .p-paginator-bottom{border-width:0 0 1px 0;border-radius:0}:host ::ng-deep .p-paginator{background:white;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:1rem;border:solid var(--cps-color-line-mid)}:host ::ng-deep .p-paginator-left-content{margin-right:auto}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-table-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select.top-open .cps-select-options{bottom:33px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-options-option{font-size:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-link:focus{outline:0 none;outline-offset:0}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}:host ::ng-deep .cps-table-empty-message-td{text-align:center!important;font-weight:600}.cps-table-coltoggle-menu{display:block;max-height:242px;overflow-x:hidden;background:white}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item:hover{background:#f8f4f5}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-label{color:var(--cps-color-text-dark)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-left{display:flex;align-items:center;margin-right:8px}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected{font-weight:600}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-label,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-label{color:var(--cps-color-calm)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-check,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-check{opacity:1}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected{background:#efe4e7}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.highlighten{background:#f5eeef}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected.highlighten{background:#e6d4d9}.cps-table-coltoggle-menu .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}\n"] }]
|
|
3589
|
-
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: {
|
|
3590
|
-
type: Input
|
|
3591
|
-
}], data: [{
|
|
3659
|
+
], template: "<p-table\n #primengTable\n withUnsort\n [styleClass]=\"styleClass\"\n [value]=\"data\"\n [dataKey]=\"dataKey\"\n [columns]=\"selectedColumns\"\n (selectionChange)=\"onSelectionChanged($event)\"\n [resizableColumns]=\"resizableColumns\"\n [reorderableColumns]=\"reorderableColumns\"\n [globalFilterFields]=\"globalFilterFields\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n [lazy]=\"lazy\"\n [lazyLoadOnInit]=\"lazyLoadOnInit\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: 3 }\"\n [paginator]=\"paginator\"\n [showCurrentPageReport]=\"true\"\n [alwaysShowPaginator]=\"alwaysShowPaginator\"\n [rows]=\"rows\"\n [first]=\"first\"\n [totalRecords]=\"totalRecords\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\"\n [(selection)]=\"selectedRows\"\n [metaKeySelection]=\"false\"\n [rowHover]=\"rowHover\"\n [customSort]=\"customSort\"\n [sortMode]=\"sortMode\"\n [exportFilename]=\"exportFilename\"\n [csvSeparator]=\"csvSeparator\"\n (onPage)=\"onPageChange($event)\"\n (sortFunction)=\"onSortFunction($event)\">\n <ng-template pTemplate=\"caption\" *ngIf=\"hasToolbar\">\n <ng-container *ngIf=\"toolbarTemplate\">\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!toolbarTemplate\">\n <div class=\"cps-table-tbar-left\">\n <div>{{ toolbarTitle }}</div>\n <div *ngIf=\"showGlobalFilter\" class=\"cps-table-tbar-global-filter\">\n <cps-input\n prefixIcon=\"search\"\n [placeholder]=\"globalFilterPlaceholder\"\n (valueChanged)=\"onFilterGlobal($event)\"\n [clearable]=\"true\"\n [hideDetails]=\"true\">\n </cps-input>\n </div>\n </div>\n <div class=\"cps-table-tbar-right\">\n <div\n *ngIf=\"showRemoveBtnOnSelect && selectedRows.length > 0\"\n class=\"cps-table-tbar-remove-btn\">\n <cps-button\n label=\"Remove\"\n color=\"prepared\"\n type=\"borderless\"\n icon=\"remove\"\n (clicked)=\"removeSelected()\">\n </cps-button>\n </div>\n <div *ngIf=\"showActionBtn\" class=\"cps-table-tbar-action-btn\">\n <cps-button\n [label]=\"actionBtnTitle\"\n color=\"prepared\"\n type=\"outlined\"\n (clicked)=\"onClickActionBtn()\">\n </cps-button>\n </div>\n <div\n *ngIf=\"showColumnsToggle && columns.length > 0\"\n class=\"cps-table-tbar-coltoggle-btn\">\n <cps-icon\n icon=\"columns\"\n size=\"normal\"\n color=\"prepared-lighten1\"\n (click)=\"colToggleMenu.toggle($event)\"></cps-icon>\n <cps-menu #colToggleMenu [withArrow]=\"false\">\n <div class=\"cps-table-coltoggle-menu\">\n <div\n class=\"cps-table-coltoggle-menu-item select-all-option\"\n [class.allselected]=\"selectedColumns.length === columns.length\"\n (click)=\"toggleAllColumns()\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"> </span>\n <span class=\"cps-table-coltoggle-menu-item-label\"\n >Show all columns</span\n >\n </span>\n </div>\n <div\n *ngFor=\"let col of columns\"\n class=\"cps-table-coltoggle-menu-item\"\n (click)=\"onSelectColumn(col)\"\n [class.selected]=\"isColumnSelected(col)\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"></span>\n <span class=\"cps-table-coltoggle-menu-item-label\">{{\n col[colHeaderName]\n }}</span>\n </span>\n </div>\n </div>\n </cps-menu>\n </div>\n <div *ngIf=\"showExportBtn\" class=\"cps-table-tbar-export-btn\">\n <cps-icon\n icon=\"export\"\n size=\"normal\"\n color=\"prepared\"\n (click)=\"exportMenu.toggle($event)\"></cps-icon>\n <cps-menu\n #exportMenu\n [items]=\"exportMenuItems\"\n [compressed]=\"true\"\n [withArrow]=\"false\">\n </cps-menu>\n </div>\n </div>\n </ng-container>\n </ng-template>\n\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <th style=\"width: 3rem\" *ngIf=\"rowExpansionTemplate\"></th>\n <th style=\"width: 3rem\" *ngIf=\"reorderableRows\"></th>\n <th style=\"width: 4rem\" *ngIf=\"selectable\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <ng-container *ngIf=\"headerTemplate\">\n <ng-container\n *ngTemplateOutlet=\"\n headerTemplate;\n context: {\n $implicit: columns,\n }\n \"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"!headerTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <th *ngFor=\"let col of columns\">\n {{ col[colHeaderName] }}\n </th>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n\n <ng-template\n pTemplate=\"body\"\n let-rowData\n let-columns=\"columns\"\n let-item\n let-rowIndex=\"rowIndex\"\n let-expanded=\"expanded\">\n <tr\n [pReorderableRow]=\"rowIndex\"\n [ngClass]=\"{\n 'cps-table-row-selected': selectable && primengTable.isSelected(item)\n }\">\n <td *ngIf=\"rowExpansionTemplate\">\n <div\n class=\"cps-table-row-chevron\"\n [ngClass]=\"{ 'cps-table-row-chevron-expanded': expanded }\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n color=\"text-dark\"\n [pRowToggler]=\"item\">\n </cps-icon>\n </div>\n </td>\n <td *ngIf=\"reorderableRows\">\n <span class=\"cps-table-row-drag-handle\" pReorderableRowHandle>\u2630</span>\n </td>\n <td *ngIf=\"selectable\">\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <ng-container *ngIf=\"bodyTemplate\">\n <ng-container\n pTemplate=\"body\"\n *ngTemplateOutlet=\"\n bodyTemplate;\n context: {\n $implicit: item,\n rowIndex: rowIndex,\n columns: columns,\n rowData: rowData\n }\n \">\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"!bodyTemplate\">\n <ng-container *ngIf=\"columns.length > 0\">\n <td *ngFor=\"let col of columns\">\n {{ rowData[col[colFieldName]] }}\n </td>\n </ng-container>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"rowexpansion\" *ngIf=\"rowExpansionTemplate\" let-item>\n <tr class=\"cps-table-row-expanded-content\">\n <td colspan=\"100\">\n <ng-container\n *ngTemplateOutlet=\"\n rowExpansionTemplate;\n context: {\n $implicit: item\n }\n \"></ng-container>\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td colspan=\"100\" class=\"cps-table-empty-message-td\">\n {{ emptyMessage }}\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"paginatorleft\">\n <div class=\"cps-table-paginator-itms-per-page\">\n <span class=\"cps-table-paginator-items-per-page-title\"\n >Rows per page:\n </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChanged()\"\n [returnObject]=\"false\">\n </cps-select>\n </div>\n </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}:host ::ng-deep .p-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}:host ::ng-deep .p-datatable{position:relative}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-header{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable .p-datatable-header{font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:0 10px;border:1px solid var(--cps-color-line-mid);border-left:4px solid var(--cps-color-surprise)!important;border-radius:4px 4px 0 0;font-size:16px;line-height:150%;background-color:#fff;color:var(--cps-color-text-dark);overflow:auto}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-global-filter{margin-left:18px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-remove-btn{margin-right:4px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-action-btn{margin-right:4px;margin-left:8px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn{display:contents}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon{margin-left:8px;margin-right:4px;cursor:pointer}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon:hover .cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon:hover .cps-icon{color:var(--cps-color-prepared)!important}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon .cps-icon{width:22px;height:22px}:host ::ng-deep .cps-tbar-small.p-datatable .p-datatable-header{height:43px}:host ::ng-deep .cps-tbar-normal.p-datatable .p-datatable-header{height:72px}:host ::ng-deep .p-datatable-flex-scrollable>.p-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}:host ::ng-deep .p-datatable-scrollable>.p-datatable-wrapper{position:relative}:host ::ng-deep .p-datatable>.p-datatable-wrapper{overflow:auto}:host ::ng-deep .p-datatable-table{border-spacing:0px;width:100%}:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-tfoot,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-tfoot{background-color:#fff}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{position:sticky;top:0;z-index:1}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th:last-child{border-width:1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-thead>tr>th{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-thead>tr>th{border-width:1px 0 1px 1px}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight:hover{background:white;color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;font-weight:400;color:var(--cps-color-text-mild);background:white;transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon{color:var(--cps-color-text-dark)}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon{color:var(--cps-color-text-mild);margin-left:.5rem}:host ::ng-deep .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon{color:var(--cps-color-calm)}:host ::ng-deep .p-icon{display:inline-block;width:1rem;height:1rem}:host ::ng-deep .p-sortable-column-icon{width:13px;height:13px}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center}:host ::ng-deep .p-datatable .p-sortable-column .p-column-title,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-icon,:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{vertical-align:unset}:host ::ng-deep .p-datatable .p-sortable-column .p-sortable-column-badge{border-radius:50%;height:1.125rem;min-width:1.125rem;line-height:1.125rem;color:var(--cps-color-calm);background:#f1eaec;margin-left:.5rem}:host ::ng-deep filtericon{pointer-events:none}:host ::ng-deep filtericon .p-icon{width:13px;height:13px}:host ::ng-deep p-columnfilter{margin-left:4px}:host ::ng-deep .p-column-filter-menu-button:hover{color:var(--cps-color-text-dark);border-color:transparent}:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open,:host ::ng-deep .p-column-filter-menu-button.p-column-filter-menu-button-open:hover{background:transparent;color:var(--cps-color-text-dark)}:host ::ng-deep .p-column-filter-menu-button,:host ::ng-deep .p-column-filter-clear-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative}:host ::ng-deep .p-column-filter-menu-button:focus{outline:0 none;outline-offset:0;box-shadow:none}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column{cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column:focus{box-shadow:none;outline:0 none}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(odd){background:var(--cps-color-bg-light)}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(even){background:#ffffff}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):not(.cps-table-row-expanded-content):hover{background:#f8f4f5}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:#ffffff;color:var(--cps-color-text-dark);transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.cps-table-row-selected{background-color:#f1ebed!important}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td:last-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td:last-child{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-tbody>tr>td{padding:1.25rem}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td{border-width:0 0 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td{border-width:1px 0 0 1px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{text-align:left;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem}:host ::ng-deep td:has(p-tablecheckbox){text-align:center!important}:host ::ng-deep th:has(p-tableheadercheckbox){text-align:center!important;width:3rem!important}:host ::ng-deep .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative;width:18px;height:18px}:host ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:host ::ng-deep .p-hidden-accessible input,:host ::ng-deep .p-hidden-accessible select{transform:scale(0)}:host ::ng-deep .p-checkbox .p-checkbox-box{background:#ffffff;width:18px;height:18px;color:var(--cps-color-text-dark);border:2px solid var(--cps-color-text-mild);border-radius:2px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}:host ::ng-deep .p-checkbox-box{display:flex;justify-content:center;align-items:center}:host ::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:var(--cps-color-calm);background:var(--cps-color-calm)}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover{border-color:var(--cps-color-calm);background:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover{border-color:var(--cps-color-calm)}:host ::ng-deep .p-checkbox .p-checkbox-box .p-icon{width:14px;height:14px}:host ::ng-deep .p-checkbox .p-checkbox-box .p-checkbox-icon{transition-duration:.2s;color:#fff;font-size:14px}:host ::ng-deep .p-datatable-reorderablerow-handle,:host ::ng-deep [pReorderableColumn]{cursor:move;font-size:16px;line-height:1}:host ::ng-deep .p-datatable-reorderablerow-handle:hover,:host ::ng-deep [pReorderableColumn]:hover{color:var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-top>td{box-shadow:inset 0 2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-bottom>td{box-shadow:inset 0 -2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-paginator-bottom{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable .p-paginator-bottom{border-width:0 0 1px 0;border-radius:0}:host ::ng-deep .p-paginator{background:white;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:1rem;border:solid var(--cps-color-line-mid)}:host ::ng-deep .p-paginator-left-content{margin-right:auto}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-table-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select.top-open .cps-select-options{bottom:33px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator-left-content .cps-table-paginator-itms-per-page .cps-select-options-option{font-size:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):hover{background:#f8f4f5}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):active{background:#f1eaec}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-link:focus{outline:0 none;outline-offset:0}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}:host ::ng-deep .cps-table-empty-message-td{text-align:center!important;font-weight:600}:host ::ng-deep .cps-table-row-drag-handle{-webkit-user-select:none;user-select:none}:host ::ng-deep .cps-table-row-chevron{transition-duration:.2s;cursor:pointer;display:flex}:host ::ng-deep .cps-table-row-chevron-expanded{transform:rotate(180deg)}.cps-table-coltoggle-menu{display:block;max-height:242px;overflow-x:hidden;background:white}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item:hover{background:#f8f4f5}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-label{color:var(--cps-color-text-dark)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-left{display:flex;align-items:center;margin-right:8px}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected{font-weight:600}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-label,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-label{color:var(--cps-color-calm)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-check,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-check{opacity:1}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected{background:#efe4e7}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.highlighten{background:#f5eeef}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected.highlighten{background:#e6d4d9}.cps-table-coltoggle-menu .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}\n"] }]
|
|
3660
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { data: [{
|
|
3592
3661
|
type: Input
|
|
3593
3662
|
}], columns: [{
|
|
3594
3663
|
type: Input
|
|
@@ -3656,6 +3725,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3656
3725
|
type: Input
|
|
3657
3726
|
}], showColumnsToggle: [{
|
|
3658
3727
|
type: Input
|
|
3728
|
+
}], showExportBtn: [{
|
|
3729
|
+
type: Input
|
|
3730
|
+
}], exportFilename: [{
|
|
3731
|
+
type: Input
|
|
3732
|
+
}], csvSeparator: [{
|
|
3733
|
+
type: Input
|
|
3734
|
+
}], dataKey: [{
|
|
3735
|
+
type: Input
|
|
3659
3736
|
}], selectionChanged: [{
|
|
3660
3737
|
type: Output
|
|
3661
3738
|
}], actionBtnClicked: [{
|
|
@@ -3673,6 +3750,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3673
3750
|
}], bodyTemplate: [{
|
|
3674
3751
|
type: ContentChild,
|
|
3675
3752
|
args: ['body', { static: false }]
|
|
3753
|
+
}], rowExpansionTemplate: [{
|
|
3754
|
+
type: ContentChild,
|
|
3755
|
+
args: ['rowexpansion', { static: false }]
|
|
3676
3756
|
}], primengTable: [{
|
|
3677
3757
|
type: ViewChild,
|
|
3678
3758
|
args: ['primengTable', { static: true }]
|