npm - @biit-solutions/wizardry-theme - Versions diffs - 1.22.23 → 1.22.25 - Mend

@biit-solutions/wizardry-theme 1.22.23 → 1.22.25

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.

Files changed (16) hide show

package/fesm2015/biit-solutions-wizardry-theme-popup.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"biit-solutions-wizardry-theme-popup.mjs","sources":["../../../projects/wizardry-theme/popup/src/biit-popup/biit-popup.component.ts","../../../projects/wizardry-theme/popup/src/biit-popup/biit-popup.component.html","../../../projects/wizardry-theme/popup/src/biit-popup/biit-popup.module.ts","../../../projects/wizardry-theme/popup/src/public-api.ts","../../../projects/wizardry-theme/popup/src/biit-solutions-wizardry-theme-popup.ts"],"sourcesContent":["import {\n AfterViewInit,\n ChangeDetectorRef,\n Component,\n Directive,\n ElementRef,\n EventEmitter, HostListener,\n Input,\n Output,\n ViewChild\n} from '@angular/core';\n\n@Directive({\n selector: '[clear-bg]'\n})\nexport class BiitPopupBackgroundDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.background = false;\n }\n}\n\n@Directive({\n selector: '[no-header]'\n})\nexport class BiitPopupNoHeaderDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.header = false;\n }\n}\n\n@Directive({\n selector: '[closable]'\n})\nexport class BiitPopupClosableDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.closable = true;\n }\n}\n\n@Directive({\n selector: '[closable-outside]'\n})\nexport class BiitPopupClosableOutsideDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.closableOutside = true;\n }\n}\n\n@Directive({\n selector: '[sixty-view]'\n})\nexport class BiitPopupSixtyViewDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.type = BiitPopupType.SIXTY;\n }\n}\n\n@Directive({\n selector: '[info-box]'\n})\nexport class BiitPopupInfoBoxDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.type = BiitPopupType.INFO_BOX;\n }\n}\n\n\n\n@Component({\n selector: 'biit-popup',\n templateUrl: './biit-popup.component.html',\n styleUrls: ['./biit-popup.component.scss']\n})\nexport class BiitPopupComponent implements AfterViewInit {\n @Input() title: string = '';\n @Input() mouseEvent: MouseEvent;\n @Output() onClosed: EventEmitter<void> = new EventEmitter<void>();\n @ViewChild('popup') popup: ElementRef;\n\n background: boolean = true;\n header: boolean = true;\n closable: boolean = false;\n closableOutside: boolean = false;\n type: BiitPopupType = BiitPopupType.DEFAULT;\n coordinates: { x: string, y: string } = { x: undefined, y: undefined };\n\n protected readonly Type = BiitPopupType;\n\n @HostListener('document:keydown.escape', ['$event']) onEscPress(event: KeyboardEvent) {\n this.onClosed.emit();\n }\n\n constructor(private cdRef : ChangeDetectorRef) {\n }\n\n ngAfterViewInit() {\n if (this.type == BiitPopupType.INFO_BOX) {\n const rem = parseFloat(getComputedStyle(document.documentElement).fontSize);\n const popupWidth = rem * 26.5 + 6;\n\n // Checking available screen space\n const fitsBottom = this.mouseEvent.y + this.popup.nativeElement.offsetHeight + 0.5rem < window.innerHeight;\n const fitsLeft = this.mouseEvent.x - popupWidth/2 > 0;\n const fitsRight = this.mouseEvent.x + popupWidth/2 < window.innerWidth;\n\n if (fitsBottom) {\n this.coordinates.y = this.mouseEvent.y + 0.5rem + \"px\";\n } else {\n this.coordinates.y = this.mouseEvent.y - this.popup.nativeElement.offsetHeight + \"px\";\n }\n\n if (!fitsLeft) {\n this.coordinates.x = \"0px\";\n } else if (!fitsRight) {\n this.coordinates.x = window.innerWidth - popupWidth + \"px\";\n } else {\n this.coordinates.x = this.mouseEvent.x - popupWidth/2 + \"px\";\n }\n\n this.cdRef.detectChanges();\n }\n }\n}\n\nenum BiitPopupType {\n DEFAULT = 'default',\n SIXTY = 'sixty',\n INFO_BOX = 'info-box'\n}\n","<div ngIf=\"type !== Type.INFO_BOX\" [class.dark-bg]=\"background\" class=\"popup-background\"\n (click)=\"closableOutside ? onClosed.emit() : false\">\n</div>\n<div #popup id=\"biit-popup\"\n [class.popup-canvas]=\"type == Type.DEFAULT\"\n [class.sixty-canvas]=\"type == Type.SIXTY\"\n [class.info-box-canvas]=\"type == Type.INFO_BOX\"\n [ngStyle]=\"type == Type.INFO_BOX ? {top: coordinates.y, left: coordinates.x} : undefined\">\n <div ngIf=\"header\" id=\"header\"\n class=\"header\">\n <div class=\"title\">\n <a>{{ title }}</a>\n </div>\n <div class=\"bar\"></div>\n <biit-icon ngIf=\"closable\" id=\"popup-x-button\"\n class=\"close\"\n [name]=\"'cross_wide'\"\n [pathStyle]=\"{fill: '#000000'}\"\n (click)=\"onClosed.emit()\"\n ></biit-icon>\n </div>\n <div class=\"content\" id=\"content\">\n <ng-container ngTemplateOutlet=\"content\"></ng-container>\n </div>\n</div>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport {\n BiitPopupBackgroundDirective, BiitPopupClosableDirective, BiitPopupClosableOutsideDirective,\n BiitPopupComponent, BiitPopupInfoBoxDirective,\n BiitPopupNoHeaderDirective,\n BiitPopupSixtyViewDirective\n} from './biit-popup.component';\nimport {BiitIconModule} from '@biit-solutions/wizardry-theme/icon';\n\n\n\n@NgModule({\n declarations: [\n BiitPopupComponent,\n BiitPopupBackgroundDirective,\n BiitPopupNoHeaderDirective,\n BiitPopupClosableDirective,\n BiitPopupClosableOutsideDirective,\n BiitPopupSixtyViewDirective,\n BiitPopupInfoBoxDirective\n ],\n imports: [\n CommonModule,\n BiitIconModule\n ],\n exports: [\n BiitPopupComponent,\n BiitPopupBackgroundDirective,\n BiitPopupNoHeaderDirective,\n BiitPopupClosableDirective,\n BiitPopupClosableOutsideDirective,\n BiitPopupSixtyViewDirective,\n BiitPopupInfoBoxDirective\n ]\n})\nexport class BiitPopupModule { }\n","/\n Public API Surface of wizardry-theme/popup\n /\n\nexport from './biit-popup/biit-popup.module';\nexport * from './biit-popup/biit-popup.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;MAea,4BAA4B,CAAA;AACvC,IAAA,WAAA,CAAoB,MAA0B,EAAA;AAA1B,QAAA,IAAM,CAAA,MAAA,GAAN,MAAM,CAAoB;AAC5C,QAAA,MAAM,CAAC,UAAU,GAAG,KAAK,CAAC;KAC3B;;0HAHU,4BAA4B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;8GAA5B,4BAA4B,EAAA,QAAA,EAAA,YAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAA5B,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAHxC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;iBACvB,CAAA;;MAUY,0BAA0B,CAAA;AACrC,IAAA,WAAA,CAAoB,MAA0B,EAAA;AAA1B,QAAA,IAAM,CAAA,MAAA,GAAN,MAAM,CAAoB;AAC5C,QAAA,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC;KACvB;;wHAHU,0BAA0B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;4GAA1B,0BAA0B,EAAA,QAAA,EAAA,aAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAA1B,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAHtC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,aAAa;iBACxB,CAAA;;MAUY,0BAA0B,CAAA;AACrC,IAAA,WAAA,CAAoB,MAA0B,EAAA;AAA1B,QAAA,IAAM,CAAA,MAAA,GAAN,MAAM,CAAoB;AAC5C,QAAA,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC;KACxB;;wHAHU,0BAA0B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;4GAA1B,0BAA0B,EAAA,QAAA,EAAA,YAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAA1B,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAHtC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;iBACvB,CAAA;;MAUY,iCAAiC,CAAA;AAC5C,IAAA,WAAA,CAAoB,MAA0B,EAAA;AAA1B,QAAA,IAAM,CAAA,MAAA,GAAN,MAAM,CAAoB;AAC5C,QAAA,MAAM,CAAC,eAAe,GAAG,IAAI,CAAC;KAC/B;;+HAHU,iCAAiC,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mHAAjC,iCAAiC,EAAA,QAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAAjC,iCAAiC,EAAA,UAAA,EAAA,CAAA;kBAH7C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;iBAC/B,CAAA;;MAUY,2BAA2B,CAAA;AACtC,IAAA,WAAA,CAAoB,MAA0B,EAAA;AAA1B,QAAA,IAAM,CAAA,MAAA,GAAN,MAAM,CAAoB;AAC5C,QAAA,MAAM,CAAC,IAAI,GAAG,aAAa,CAAC,KAAK,CAAC;KACnC;;yHAHU,2BAA2B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;6GAA3B,2BAA2B,EAAA,QAAA,EAAA,cAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAA3B,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAHvC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,cAAc;iBACzB,CAAA;;MAUY,yBAAyB,CAAA;AACpC,IAAA,WAAA,CAAoB,MAA0B,EAAA;AAA1B,QAAA,IAAM,CAAA,MAAA,GAAN,MAAM,CAAoB;AAC5C,QAAA,MAAM,CAAC,IAAI,GAAG,aAAa,CAAC,QAAQ,CAAC;KACtC;;uHAHU,yBAAyB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;2GAAzB,yBAAyB,EAAA,QAAA,EAAA,YAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAAzB,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAHrC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;iBACvB,CAAA;;MAcY,kBAAkB,CAAA;AAewB,IAAA,UAAU,CAAC,KAAoB,EAAA;AAClF,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;KACtB;AAED,IAAA,WAAA,CAAoB,KAAyB,EAAA;AAAzB,QAAA,IAAK,CAAA,KAAA,GAAL,KAAK,CAAoB;AAlBpC,QAAA,IAAK,CAAA,KAAA,GAAW,EAAE,CAAC;AAElB,QAAA,IAAA,CAAA,QAAQ,GAAuB,IAAI,YAAY,EAAQ,CAAC;AAGlE,QAAA,IAAU,CAAA,UAAA,GAAY,IAAI,CAAC;AAC3B,QAAA,IAAM,CAAA,MAAA,GAAY,IAAI,CAAC;AACvB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK,CAAC;AAC1B,QAAA,IAAe,CAAA,eAAA,GAAY,KAAK,CAAC;AACjC,QAAA,IAAA,CAAA,IAAI,GAAkB,aAAa,CAAC,OAAO,CAAC;AAC5C,QAAA,IAAW,CAAA,WAAA,GAA6B,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC;AAEpD,QAAA,IAAI,CAAA,IAAA,GAAG,aAAa,CAAC;KAOvC;IAED,eAAe,GAAA;AACb,QAAA,IAAI,IAAI,CAAC,IAAI,IAAI,aAAa,CAAC,QAAQ,EAAE;AACvC,YAAA,MAAM,GAAG,GAAG,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,QAAQ,CAAC,CAAC;AAC5E,YAAA,MAAM,UAAU,GAAG,GAAG,GAAG,IAAI,GAAG,CAAC,CAAC;;YAGlC,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,GAAG,GAAG,GAAC,GAAG,GAAG,MAAM,CAAC,WAAW,CAAC;AAC5G,YAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,UAAU,GAAC,CAAC,GAAG,CAAC,CAAC;AACtD,YAAA,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,UAAU,GAAC,CAAC,GAAG,MAAM,CAAC,UAAU,CAAC;AAEvE,YAAA,IAAI,UAAU,EAAE;AACd,gBAAA,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,GAAG,GAAC,GAAG,GAAG,IAAI,CAAC;AACzD,aAAA;AAAM,iBAAA;gBACL,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,GAAG,IAAI,CAAC;AACvF,aAAA;YAED,IAAI,CAAC,QAAQ,EAAE;AACb,gBAAA,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,KAAK,CAAC;AAC5B,aAAA;iBAAM,IAAI,CAAC,SAAS,EAAE;AACrB,gBAAA,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,MAAM,CAAC,UAAU,GAAG,UAAU,GAAG,IAAI,CAAC;AAC5D,aAAA;AAAM,iBAAA;AACL,gBAAA,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,UAAU,GAAC,CAAC,GAAG,IAAI,CAAC;AAC9D,aAAA;AAED,YAAA,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC;AAC5B,SAAA;KACF;;gHAhDU,kBAAkB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,qTCzE/B,yiCA6BA,EAAA,MAAA,EAAA,CAAA,+5EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;4FD4Ca,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAL9B,SAAS;+BACE,YAAY,EAAA,QAAA,EAAA,yiCAAA,EAAA,MAAA,EAAA,CAAA,+5EAAA,CAAA,EAAA,CAAA;wGAKb,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBACI,QAAQ,EAAA,CAAA;sBAAjB,MAAM;gBACa,KAAK,EAAA,CAAA;sBAAxB,SAAS;uBAAC,OAAO,CAAA;gBAWmC,UAAU,EAAA,CAAA;sBAA9D,YAAY;uBAAC,yBAAyB,EAAE,CAAC,QAAQ,CAAC,CAAA;;AAoCrD,IAAK,aAIJ,CAAA;AAJD,CAAA,UAAK,aAAa,EAAA;AAChB,IAAA,aAAA,CAAA,SAAA,CAAA,GAAA,SAAmB,CAAA;AACnB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,aAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACvB,CAAC,EAJI,aAAa,KAAb,aAAa,GAIjB,EAAA,CAAA,CAAA;;ME5FY,eAAe,CAAA;;6GAAf,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAf,eAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,iBAtBxB,kBAAkB;QAClB,4BAA4B;QAC5B,0BAA0B;QAC1B,0BAA0B;QAC1B,iCAAiC;QACjC,2BAA2B;AAC3B,QAAA,yBAAyB,aAGzB,YAAY;AACZ,QAAA,cAAc,aAGd,kBAAkB;QAClB,4BAA4B;QAC5B,0BAA0B;QAC1B,0BAA0B;QAC1B,iCAAiC;QACjC,2BAA2B;QAC3B,yBAAyB,CAAA,EAAA,CAAA,CAAA;AAGhB,eAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,YAbxB,YAAY;QACZ,cAAc,CAAA,EAAA,CAAA,CAAA;4FAYL,eAAe,EAAA,UAAA,EAAA,CAAA;kBAxB3B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ,kBAAkB;wBAClB,4BAA4B;wBAC5B,0BAA0B;wBAC1B,0BAA0B;wBAC1B,iCAAiC;wBACjC,2BAA2B;wBAC3B,yBAAyB;AAC1B,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,cAAc;AACf,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,kBAAkB;wBAClB,4BAA4B;wBAC5B,0BAA0B;wBAC1B,0BAA0B;wBAC1B,iCAAiC;wBACjC,2BAA2B;wBAC3B,yBAAyB;AAC1B,qBAAA;iBACF,CAAA;;;ACnCD;;AAEG;;ACFH;;AAEG;;;;"}
1	+ {"version":3,"file":"biit-solutions-wizardry-theme-popup.mjs","sources":["../../../projects/wizardry-theme/popup/src/biit-popup/biit-popup.component.ts","../../../projects/wizardry-theme/popup/src/biit-popup/biit-popup.component.html","../../../projects/wizardry-theme/popup/src/biit-popup/biit-popup.module.ts","../../../projects/wizardry-theme/popup/src/public-api.ts","../../../projects/wizardry-theme/popup/src/biit-solutions-wizardry-theme-popup.ts"],"sourcesContent":["import {\n AfterViewInit,\n ChangeDetectorRef,\n Component,\n Directive,\n ElementRef,\n EventEmitter, HostListener,\n Input,\n Output,\n ViewChild\n} from '@angular/core';\n\n@Directive({\n selector: '[clear-bg]'\n})\nexport class BiitPopupBackgroundDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.background = false;\n }\n}\n\n@Directive({\n selector: '[no-header]'\n})\nexport class BiitPopupNoHeaderDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.header = false;\n }\n}\n\n@Directive({\n selector: '[closable]'\n})\nexport class BiitPopupClosableDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.closable = true;\n }\n}\n\n@Directive({\n selector: '[closable-outside]'\n})\nexport class BiitPopupClosableOutsideDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.closableOutside = true;\n }\n}\n\n@Directive({\n selector: '[sixty-view]'\n})\nexport class BiitPopupSixtyViewDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.type = BiitPopupType.SIXTY;\n }\n}\n\n@Directive({\n selector: '[info-box]'\n})\nexport class BiitPopupInfoBoxDirective {\n constructor(private parent: BiitPopupComponent) {\n parent.type = BiitPopupType.INFO_BOX;\n }\n}\n\n\n\n@Component({\n selector: 'biit-popup',\n templateUrl: './biit-popup.component.html',\n styleUrls: ['./biit-popup.component.scss']\n})\nexport class BiitPopupComponent implements AfterViewInit {\n @Input() title: string = '';\n @Input() mouseEvent: MouseEvent;\n @Output() onClosed: EventEmitter<void> = new EventEmitter<void>();\n @ViewChild('popup') popup: ElementRef;\n\n background: boolean = true;\n header: boolean = true;\n closable: boolean = false;\n closableOutside: boolean = false;\n type: BiitPopupType = BiitPopupType.DEFAULT;\n coordinates: { x: string, y: string } = { x: undefined, y: undefined };\n\n protected readonly Type = BiitPopupType;\n\n @HostListener('document:keydown.escape', ['$event']) onEscPress(event: KeyboardEvent) {\n this.onClosed.emit();\n }\n\n constructor(private cdRef : ChangeDetectorRef) {\n }\n\n ngAfterViewInit() {\n if (this.type == BiitPopupType.INFO_BOX) {\n const rem = parseFloat(getComputedStyle(document.documentElement).fontSize);\n const popupWidth = rem * 26.5 + 6;\n\n // Checking available screen space\n const fitsBottom = this.mouseEvent.y + this.popup.nativeElement.offsetHeight + 0.5rem < window.innerHeight;\n const fitsLeft = this.mouseEvent.x - popupWidth/2 > 0;\n const fitsRight = this.mouseEvent.x + popupWidth/2 < window.innerWidth;\n\n if (fitsBottom) {\n this.coordinates.y = this.mouseEvent.y + 0.5rem + \"px\";\n } else {\n this.coordinates.y = this.mouseEvent.y - this.popup.nativeElement.offsetHeight + \"px\";\n }\n\n if (!fitsLeft) {\n this.coordinates.x = \"0px\";\n } else if (!fitsRight) {\n this.coordinates.x = window.innerWidth - popupWidth + \"px\";\n } else {\n this.coordinates.x = this.mouseEvent.x - popupWidth/2 + \"px\";\n }\n\n this.cdRef.detectChanges();\n }\n }\n}\n\nenum BiitPopupType {\n DEFAULT = 'default',\n SIXTY = 'sixty',\n INFO_BOX = 'info-box'\n}\n","<div ngIf=\"type !== Type.INFO_BOX\" [class.dark-bg]=\"background\" class=\"popup-background\"\n (click)=\"closableOutside ? onClosed.emit() : false\">\n</div>\n<div #popup id=\"biit-popup\"\n [class.popup-canvas]=\"type == Type.DEFAULT\"\n [class.sixty-canvas]=\"type == Type.SIXTY\"\n [class.info-box-canvas]=\"type == Type.INFO_BOX\"\n [ngStyle]=\"type == Type.INFO_BOX ? {top: coordinates.y, left: coordinates.x} : undefined\">\n <div ngIf=\"header\" id=\"header\"\n class=\"header\">\n <div class=\"title\">\n <a>{{ title }}</a>\n </div>\n <div class=\"bar\"></div>\n <biit-icon ngIf=\"closable\" id=\"popup-x-button\"\n class=\"close\"\n [name]=\"'cross_wide'\"\n [pathStyle]=\"{fill: 'var(--popup-close-button)'}\"\n (click)=\"onClosed.emit()\"\n ></biit-icon>\n </div>\n <div class=\"content\" id=\"content\">\n <ng-container ngTemplateOutlet=\"content\"></ng-container>\n </div>\n</div>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport {\n BiitPopupBackgroundDirective, BiitPopupClosableDirective, BiitPopupClosableOutsideDirective,\n BiitPopupComponent, BiitPopupInfoBoxDirective,\n BiitPopupNoHeaderDirective,\n BiitPopupSixtyViewDirective\n} from './biit-popup.component';\nimport {BiitIconModule} from '@biit-solutions/wizardry-theme/icon';\n\n\n\n@NgModule({\n declarations: [\n BiitPopupComponent,\n BiitPopupBackgroundDirective,\n BiitPopupNoHeaderDirective,\n BiitPopupClosableDirective,\n BiitPopupClosableOutsideDirective,\n BiitPopupSixtyViewDirective,\n BiitPopupInfoBoxDirective\n ],\n imports: [\n CommonModule,\n BiitIconModule\n ],\n exports: [\n BiitPopupComponent,\n BiitPopupBackgroundDirective,\n BiitPopupNoHeaderDirective,\n BiitPopupClosableDirective,\n BiitPopupClosableOutsideDirective,\n BiitPopupSixtyViewDirective,\n BiitPopupInfoBoxDirective\n ]\n})\nexport class BiitPopupModule { }\n","/\n Public API Surface of wizardry-theme/popup\n /\n\nexport from './biit-popup/biit-popup.module';\nexport * from './biit-popup/biit-popup.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/biit-solutions-wizardry-theme-table.mjs CHANGED Viewed

@@ -921,10 +921,10 @@ class BiitDatatableComponent {
     }
 }
 BiitDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitDatatableComponent, deps: [{ token: i1$1.BiitIconService }], target: i0.ɵɵFactoryTarget.Component });
-BiitDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitDatatableComponent, selector: "biit-datatable", inputs: { data: "data", columns: "columns", pageSize: "pageSize", pageSizeList: "pageSizeList", loading: "loading", selectable: "selectable", singleSelection: "singleSelection", scrollbarH: "scrollbarH", hideHeader: "hideHeader", hideFooter: "hideFooter", serverSide: "serverSide", page: "page" }, outputs: { onSelection: "onSelection", onPageChange: "onPageChange" }, providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], queries: [{ propertyName: "actionsTpl", first: true, predicate: ["actions"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: BiitDatatablePagerComponent, selector: "biit-datatable-pager" }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i6.DataTableFooterTemplateDirective, selector: "[ngx-datatable-footer-template]" }, { kind: "directive", type: i6.DatatableFooterDirective, selector: "ngx-datatable-footer", inputs: ["footerHeight", "totalMessage", "selectedMessage", "pagerLeftArrowIcon", "pagerRightArrowIcon", "pagerPreviousIcon", "pagerNextIcon", "template"] }, { kind: "component", type: i5$1.BiitProgressBarComponent, selector: "biit-progress-bar", inputs: ["type", "_value", "value"] }, { kind: "component", type: i4.BiitMultiselectComponent, selector: "biit-multiselect", inputs: ["title", "type", "icon", "label", "value", "descriptionField", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc"], outputs: ["onCreate"] }, { kind: "directive", type: i5.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i4.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "component", type: i9.BiitVerticalMenuComponent, selector: "biit-vertical-menu" }] });
+BiitDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitDatatableComponent, selector: "biit-datatable", inputs: { data: "data", columns: "columns", pageSize: "pageSize", pageSizeList: "pageSizeList", loading: "loading", selectable: "selectable", singleSelection: "singleSelection", scrollbarH: "scrollbarH", hideHeader: "hideHeader", hideFooter: "hideFooter", serverSide: "serverSide", page: "page" }, outputs: { onSelection: "onSelection", onPageChange: "onPageChange" }, providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], queries: [{ propertyName: "actionsTpl", first: true, predicate: ["actions"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--table-background-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--table-background-color);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--table-background-color);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: BiitDatatablePagerComponent, selector: "biit-datatable-pager" }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i6.DataTableFooterTemplateDirective, selector: "[ngx-datatable-footer-template]" }, { kind: "directive", type: i6.DatatableFooterDirective, selector: "ngx-datatable-footer", inputs: ["footerHeight", "totalMessage", "selectedMessage", "pagerLeftArrowIcon", "pagerRightArrowIcon", "pagerPreviousIcon", "pagerNextIcon", "template"] }, { kind: "component", type: i5$1.BiitProgressBarComponent, selector: "biit-progress-bar", inputs: ["type", "_value", "value"] }, { kind: "component", type: i4.BiitMultiselectComponent, selector: "biit-multiselect", inputs: ["title", "type", "icon", "label", "value", "descriptionField", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc"], outputs: ["onCreate"] }, { kind: "directive", type: i5.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i4.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "component", type: i9.BiitVerticalMenuComponent, selector: "biit-vertical-menu" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitDatatableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'biit-datatable', providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"] }]
+            args: [{ selector: 'biit-datatable', providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--table-background-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--table-background-color);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--table-background-color);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.BiitIconService }]; }, propDecorators: { table: [{
                 type: ViewChild,
                 args: ['table']