@n-isi-platform/design-system 1.0.30 → 1.0.31

package/fesm2022/n-isi-platform-design-system.mjs

@@ -54,10 +54,10 @@ import { FileUploadModule } from 'primeng/fileupload';
 import * as i2$4 from 'primeng/menubar';
 import { MenubarModule } from 'primeng/menubar';
 import { OverlayBadgeModule } from 'primeng/overlaybadge';
+import { Dialog, DialogModule } from 'primeng/dialog';
 import * as i1$8 from 'primeng/config';
 import { InputMask } from 'primeng/inputmask';
 import { ProgressSpinner } from 'primeng/progressspinner';
-import { Dialog, DialogModule } from 'primeng/dialog';
 import { MessageModule } from 'primeng/message';
 import * as i1$9 from 'primeng/picklist';
 import { PickListModule } from 'primeng/picklist';
@@ -1487,12 +1487,13 @@ class TextareaComponent {
     hasGap = true;
     // 2024-03-19; zato da je možno maxlength zaobit v določenih primerih (npr. inline forma na upravni-postopki)
     customMaxLength = 255;
+    onBlurEvent = new EventEmitter();
     ngOnInit() {
         this._isTooltipVisible = !!this.tooltipText;
     }
     TooltipHoverEventEnum = TooltipHoverEventEnum;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TextareaComponent, isStandalone: true, selector: "lib-textarea[group][controlName][name]", inputs: { name: "name", resize: "resize", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", rows: "rows", cols: "cols", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", group: "group", controlName: "controlName", isRequired: "isRequired", formStatus: "formStatus", hasGap: "hasGap", customMaxLength: "customMaxLength" }, ngImport: i0, template: "<div class=\"card flex flex-column gap-1\" [ngClass]=\"{\r\n  'resize-none': !resize,\r\n  'gap-1': hasGap,\r\n  }\" [formGroup]=\"group\">\r\n  <div class=\"flex\">\r\n    <label [for]=\"name\" class=\"mr-2\">\r\n      {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n    </label>\r\n    <lib-tooltip\r\n      *ngIf=\"_isTooltipVisible\"\r\n      [position]=\"tooltipPosition\"\r\n      [text]=\"tooltipText!\"\r\n    ></lib-tooltip>\r\n  </div>\r\n  <textarea [id]=\"name\"\r\n            [rows]=\"rows\"\r\n            [cols]=\"cols\"\r\n            pTextarea \r\n            [maxlength]=\"customMaxLength\"\r\n            [placeholder]='placeholder'\r\n            [formControlName]=\"controlName\"\r\n            [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n            [attr.aria-label]=\"accessibilityText\"\r\n            [attr.aria-describedby]=\"name + 'Error'\"\r\n            [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n            [attr.aria-required]=\"isRequired\"\r\n  ></textarea>\r\n  <lib-error\r\n    *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n    [hasError]=\"group.get(controlName)!.errors\"\r\n    [isTouched]=\"group.get(controlName)!.touched\"\r\n    [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n</div>\r\n", styles: [".resize-none textarea{resize:none}:host ::ng-deep .p-textarea{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-textarea::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-textarea:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-textarea:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-inputtext{border:1px solid #1B495A;font-family:Republika,Roboto,sans-serif}:host ::ng-deep .p-inputtext::placeholder{color:#848484}:host ::ng-deep .card{padding:0!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$2.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "variant", "fluid", "pSize"], outputs: ["onResize"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: TextareaComponent, isStandalone: true, selector: "lib-textarea[group][controlName][name]", inputs: { name: "name", resize: "resize", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", rows: "rows", cols: "cols", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", group: "group", controlName: "controlName", isRequired: "isRequired", formStatus: "formStatus", hasGap: "hasGap", customMaxLength: "customMaxLength" }, outputs: { onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"card flex flex-column gap-1\" [ngClass]=\"{\r\n  'resize-none': !resize,\r\n  'gap-1': hasGap,\r\n  }\" [formGroup]=\"group\">\r\n  <div class=\"flex\">\r\n    <label [for]=\"name\" class=\"mr-2\">\r\n      {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n    </label>\r\n    <lib-tooltip\r\n      *ngIf=\"_isTooltipVisible\"\r\n      [position]=\"tooltipPosition\"\r\n      [text]=\"tooltipText!\"\r\n    ></lib-tooltip>\r\n  </div>\r\n  <textarea [id]=\"name\"\r\n            [rows]=\"rows\"\r\n            [cols]=\"cols\"\r\n            pTextarea \r\n            (blur)=\"onBlurEvent.emit()\"\r\n            [maxlength]=\"customMaxLength\"\r\n            [placeholder]='placeholder'\r\n            [formControlName]=\"controlName\"\r\n            [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n            [attr.aria-label]=\"accessibilityText\"\r\n            [attr.aria-describedby]=\"name + 'Error'\"\r\n            [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n            [attr.aria-required]=\"isRequired\"\r\n  ></textarea>\r\n  <lib-error\r\n    *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n    [hasError]=\"group.get(controlName)!.errors\"\r\n    [isTouched]=\"group.get(controlName)!.touched\"\r\n    [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n</div>\r\n", styles: [".resize-none textarea{resize:none}:host ::ng-deep .p-textarea{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-textarea::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-textarea:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-textarea:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-inputtext{border:1px solid #1B495A;font-family:Republika,Roboto,sans-serif}:host ::ng-deep .p-inputtext::placeholder{color:#848484}:host ::ng-deep .card{padding:0!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$2.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "variant", "fluid", "pSize"], outputs: ["onResize"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
@@ -1504,7 +1505,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         NgIf,
                         TooltipComponent,
                         ErrorComponent,
-                    ], template: "<div class=\"card flex flex-column gap-1\" [ngClass]=\"{\r\n  'resize-none': !resize,\r\n  'gap-1': hasGap,\r\n  }\" [formGroup]=\"group\">\r\n  <div class=\"flex\">\r\n    <label [for]=\"name\" class=\"mr-2\">\r\n      {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n    </label>\r\n    <lib-tooltip\r\n      *ngIf=\"_isTooltipVisible\"\r\n      [position]=\"tooltipPosition\"\r\n      [text]=\"tooltipText!\"\r\n    ></lib-tooltip>\r\n  </div>\r\n  <textarea [id]=\"name\"\r\n            [rows]=\"rows\"\r\n            [cols]=\"cols\"\r\n            pTextarea \r\n            [maxlength]=\"customMaxLength\"\r\n            [placeholder]='placeholder'\r\n            [formControlName]=\"controlName\"\r\n            [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n            [attr.aria-label]=\"accessibilityText\"\r\n            [attr.aria-describedby]=\"name + 'Error'\"\r\n            [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n            [attr.aria-required]=\"isRequired\"\r\n  ></textarea>\r\n  <lib-error\r\n    *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n    [hasError]=\"group.get(controlName)!.errors\"\r\n    [isTouched]=\"group.get(controlName)!.touched\"\r\n    [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n</div>\r\n", styles: [".resize-none textarea{resize:none}:host ::ng-deep .p-textarea{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-textarea::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-textarea:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-textarea:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-inputtext{border:1px solid #1B495A;font-family:Republika,Roboto,sans-serif}:host ::ng-deep .p-inputtext::placeholder{color:#848484}:host ::ng-deep .card{padding:0!important}\n"] }]
+                    ], template: "<div class=\"card flex flex-column gap-1\" [ngClass]=\"{\r\n  'resize-none': !resize,\r\n  'gap-1': hasGap,\r\n  }\" [formGroup]=\"group\">\r\n  <div class=\"flex\">\r\n    <label [for]=\"name\" class=\"mr-2\">\r\n      {{label}}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n    </label>\r\n    <lib-tooltip\r\n      *ngIf=\"_isTooltipVisible\"\r\n      [position]=\"tooltipPosition\"\r\n      [text]=\"tooltipText!\"\r\n    ></lib-tooltip>\r\n  </div>\r\n  <textarea [id]=\"name\"\r\n            [rows]=\"rows\"\r\n            [cols]=\"cols\"\r\n            pTextarea \r\n            (blur)=\"onBlurEvent.emit()\"\r\n            [maxlength]=\"customMaxLength\"\r\n            [placeholder]='placeholder'\r\n            [formControlName]=\"controlName\"\r\n            [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n            [attr.aria-label]=\"accessibilityText\"\r\n            [attr.aria-describedby]=\"name + 'Error'\"\r\n            [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n            [attr.aria-required]=\"isRequired\"\r\n  ></textarea>\r\n  <lib-error\r\n    *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered)\"\r\n    [hasError]=\"group.get(controlName)!.errors\"\r\n    [isTouched]=\"group.get(controlName)!.touched\"\r\n    [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n</div>\r\n", styles: [".resize-none textarea{resize:none}:host ::ng-deep .p-textarea{border:1.75px solid #3E7C94!important}:host ::ng-deep .p-textarea::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-textarea:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-textarea:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-inputtext{border:1px solid #1B495A;font-family:Republika,Roboto,sans-serif}:host ::ng-deep .p-inputtext::placeholder{color:#848484}:host ::ng-deep .card{padding:0!important}\n"] }]
         }], propDecorators: { name: [{
                 type: Input
             }], resize: [{
@@ -1535,6 +1536,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                 type: Input
             }], customMaxLength: [{
                 type: Input
+            }], onBlurEvent: [{
+                type: Output
             }] } });
 
 class DropdownComponent {
@@ -1976,7 +1979,7 @@ class CustomTableComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CustomTableComponent, isStandalone: true, selector: "lib-custom-table[tableData][tableColumns]", inputs: { tableData: "tableData", tableColumns: "tableColumns", isPaginatorVisible: "isPaginatorVisible", tableRowCount: "tableRowCount", scrollable: "scrollable", scrollHeight: "scrollHeight", selectedProducts: "selectedProducts", isEditingTable: "isEditingTable", isTableLoading: "isTableLoading", hideColumnsOnMobile: "hideColumnsOnMobile", tableMinWidth: "tableMinWidth", isVirtualScrollButtonVisible: "isVirtualScrollButtonVisible", isVirtualScroll: "isVirtualScroll", virtualScrollRowSize: "virtualScrollRowSize", tableCaption: "tableCaption", captionColorClass: "captionColorClass", isCaptionButtonVisible: "isCaptionButtonVisible", captionButtonLabel: "captionButtonLabel", captionButtonColor: "captionButtonColor", isTableHeaderVisible: "isTableHeaderVisible", emptyColumnWidth: "emptyColumnWidth", toggleTableHeaderName: "toggleTableHeaderName", toggleWidth: "toggleWidth", toggleTwoTableHeaderName: "toggleTwoTableHeaderName", toggleTwoWidth: "toggleTwoWidth", toggleThreeTableHeaderName: "toggleThreeTableHeaderName", toggleThreeWidth: "toggleThreeWidth", toggleFourTableHeaderName: "toggleFourTableHeaderName", toggleFourWidth: "toggleFourWidth", rowColor: "rowColor", formGroup: "formGroup", type: "type", formStatus: "formStatus", tagColor: "tagColor", isWarningTextVisible: "isWarningTextVisible", isButtonOneVisible: "isButtonOneVisible", buttonLabel: "buttonLabel", buttonOneLabel: "buttonOneLabel", buttonOneHasIcon: "buttonOneHasIcon", buttonOneEditIcon: "buttonOneEditIcon", buttonOneSaveIcon: "buttonOneSaveIcon", buttonOneColor: "buttonOneColor", buttonOneIcon: "buttonOneIcon", isPlainTableIconButtonOne: "isPlainTableIconButtonOne", isPlainTableButtonOneLink: "isPlainTableButtonOneLink", isButtonTwoVisible: "isButtonTwoVisible", buttonTwoLabel: "buttonTwoLabel", buttonTwoHasIcon: "buttonTwoHasIcon", buttonTwoDeleteIcon: "buttonTwoDeleteIcon", buttonTwoCancelIcon: "buttonTwoCancelIcon", buttonTwoColor: "buttonTwoColor", buttonTwoIcon: "buttonTwoIcon", isPlainTableIconButtonTwo: "isPlainTableIconButtonTwo", isDeactivateToggle: "isDeactivateToggle", isDeactivateToggleTwo: "isDeactivateToggleTwo", isDeactivateToggleThree: "isDeactivateToggleThree", isDeactivateToggleFour: "isDeactivateToggleFour", showEllipsisFullText: "showEllipsisFullText" }, outputs: { captionButtonClicked: "captionButtonClicked", buttonEditClick: "buttonEditClick", buttonSaveClick: "buttonSaveClick", buttonOneClick: "buttonOneClick", buttonDeleteClick: "buttonDeleteClick", buttonTwoClick: "buttonTwoClick", toggleSwitch: "toggleSwitch", toggleTwoSwitch: "toggleTwoSwitch", toggleThreeSwitch: "toggleThreeSwitch", toggleFourSwitch: "toggleFourSwitch", checkboxOne: "checkboxOne" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "<p-table\r\n  #dt\r\n  [value]=\"tableData\"\r\n  [paginator]=\"isPaginatorVisible\"\r\n  [rows]=\"tableRowCount\"\r\n  [showCurrentPageReport]=\"false\"\r\n  [scrollable]=\"scrollable\"\r\n  [scrollHeight]=\"scrollHeight\"\r\n  dataKey=\"id\"\r\n  editMode=\"row\"\r\n  [ngClass]=\"captionColorClass\"\r\n  [loading]=\"isTableLoading\"\r\n  [tableStyle]=\"{'min-width': tableMinWidth}\"\r\n  [virtualScroll]=\"isVirtualScroll\"\r\n  [virtualScrollItemSize]=\"virtualScrollRowSize\"\r\n  aria-live=\"polite\"\r\n>\r\n  <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">\r\n    <div class=\"flex align-items-center justify-content-between\">\r\n      {{ tableCaption }}\r\n      <span *ngIf=\"isVirtualScrollButtonVisible\"\r\n            (click)=\"isVirtualScroll = !isVirtualScroll\"\r\n            [ngStyle]=\"{'color': isVirtualScroll ? '' : 'lightgray'}\"\r\n            class=\"pi pi-sort cursor-pointer\">\r\n      </span>\r\n      <lib-button\r\n        *ngIf=\"isCaptionButtonVisible\"\r\n        [label]=\"captionButtonLabel\"\r\n        [color]=\"captionButtonColor\"\r\n        (clickEvent)=\"clickCaptionButton($event)\"\r\n      ></lib-button>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n    <tr>\r\n      <ng-container *ngFor=\"let column of tableColumns\">\r\n        <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n          <th  scope=\"col\" [style.width]=\"column.width\">\r\n            {{ column.header | translate }}\r\n          </th>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <th *ngFor=\"let _ of emptyHeaderColumnList\" [style.width]=\"emptyColumnWidth\" aria-hidden=\"true\"></th>\r\n      <th *ngIf=\"!!toggleTableHeaderName\" scope=\"col\" [style.width]=\"toggleWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleTableHeaderName }}\r\n      </th>\r\n      <th *ngIf=\"!!toggleTwoTableHeaderName\" scope=\"col\" [style.width]=\"toggleTwoWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleTwoTableHeaderName }}\r\n      </th>\r\n      <th *ngIf=\"!!toggleThreeTableHeaderName\" scope=\"col\" [style.width]=\"toggleThreeWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleThreeTableHeaderName }}\r\n      </th>\r\n      <th *ngIf=\"!!toggleFourTableHeaderName\" scope=\"col\" [style.width]=\"toggleFourWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleFourTableHeaderName }}\r\n      </th>\r\n    </tr>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"body\" let-rowData let-editing=\"editing\" let-ri=\"rowIndex\">\r\n    <!--\r\n      Mare; 2024-09-19: dodajanje logike barvanja rowColor za /cms/notifications, delat mora pa tudi v /vsi-termini\r\n    -->\r\n    <tr [pEditableRow]=\"rowData\" #htmlTableRowElement\r\n        [ngClass]=\"\r\n            rowData?.cmsStatus ?\r\n              (rowData?.cmsStatus === 'expired' ? 'disabled_row_color' :\r\n               rowData?.cmsStatus === 'planned' ? '' :\r\n               rowData?.cmsStatus === 'active' ? 'success_row_color' : '') :\r\n            (!rowData?.registered ? rowColor : '')\r\n      \">\r\n      <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n        <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n          <td [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n            <!-- Text input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'input'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-input\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [type]=\"column.inputType ? column.inputType : type\"\r\n                    placeholder=\"{{ column.placeholder! |translate }}\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                  ></lib-input>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    <ng-container *ngIf=\"column.isLink; else notLink\">\r\n                      <a href=\"{{ rowData[column.field] }}\" target=\"_blank\">\r\n                        {{ rowData[column.field] }}\r\n                      </a>\r\n                    </ng-container>\r\n                    <ng-template #notLink>\r\n                      {{ rowData[column.field] }} {{ column?.suffix }}\r\n                    </ng-template>\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Date input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'date'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-date-input\r\n                    appendTo=\"body\"\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [setMinAndMax]=\"false\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                    placeholder=\"{{ column.placeholder! | translate }}\"\r\n                  ></lib-date-input>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    {{ rowData[column.field] | date: 'dd.MM.yyyy' }} {{ column?.suffix }}\r\n                  </ng-container>\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Date+Time output-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'dateTime'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    {{ rowData[column.field] | date: 'dd.MM.yyyy, HH:mm' }} {{ column?.suffix }}\r\n                  </ng-container>\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- TextArea input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'textarea'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-textarea *ngIf=\"column.maxLength === -1\"\r\n                    [customMaxLength]=\"null\"\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                    placeholder=\"{{ column.placeholder! |translate }}\"\r\n                  ></lib-textarea>\r\n                  <lib-textarea *ngIf=\"column.maxLength !== -1\"\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                    placeholder=\"{{ column.placeholder! |translate }}\"\r\n                  ></lib-textarea>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    <lib-tooltip\r\n                      [htmlParser]=\"true\"\r\n                      [text]=\"rowData[column.field]\"\r\n                    ></lib-tooltip>\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Dropdown input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'dropdown'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-dropdown\r\n                    label=\"Moje naloge\"\r\n                    placeholder=\"Izberite\"\r\n                    optionLabel=\"name\"\r\n                    [showClear]=\"true\"\r\n                    [formStatus]=\"formStatus\"\r\n\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n\r\n                    filterBy=\"name\"\r\n                    [isLoading]=\"false\"\r\n                    [optionList]=\"overviewList\"\r\n                    [filter]=\"true\"\r\n                    [isRequired]=\"false\"\r\n                  ></lib-dropdown>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    <lib-tooltip\r\n                      [htmlParser]=\"true\"\r\n                      [text]=\"rowData[column.field]\"\r\n                    ></lib-tooltip>\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Switch input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'switch'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-toggle-switch\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [checked]=\"rowData[column.field]\"\r\n                  ></lib-toggle-switch>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    {{ 'components.customTable.yes' | translate }}\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    {{ 'components.customTable.no' | translate }}\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Mare; dodal custom checkbox za izbiro vrstice -->\r\n            <!-- [controlName] je oblike rowChecked_2024-04-11T11:35:00_c3cff776-dc06-40ec-bab5-7cab26e2014a  -->\r\n            <!-- column.field = rowChecked -->\r\n            <!-- rowData[column?.control!] = 2024-04-11T11:35:00 (startDate) -->\r\n            <!-- rowData[column?.control2!] = c3cff776-dc06-40ec-bab5-7cab26e2014a (uuid) -->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'checkbox'\">\r\n                <lib-checkbox class=\"\"\r\n                              [group]=\"formGroup\"\r\n                              [controlName]=\"column.field + '_' + rowData[column?.control!] + '_' + rowData[column?.control2!]\"\r\n                              (clickCheckboxEvent)=\"clickCheckboxOne($event, rowData[column?.control!] + '_' + rowData[column?.control2!])\"\r\n                              label=\"\">\r\n                </lib-checkbox>\r\n            </ng-container>\r\n\r\n            <!-- Plain table-->\r\n            <ng-container *ngIf=\"!column.editable\">\r\n              <ng-container *ngIf=\"column.tooltip || column.tag || column.status || column.ellipsis; else valueCell\">\r\n                <!-- Tooltip -->\r\n                <ng-container *ngIf=\"column.tooltip\">\r\n                  <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n                    <lib-tooltip [htmlParser]=\"true\" [text]=\"getNestedValue(rowData, column.field)\"></lib-tooltip>\r\n                  </ng-container>\r\n                  <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n                    /\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n                <!-- Ellipsis -->\r\n                <ng-container *ngIf=\"column.ellipsis\">\r\n                  <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n                    <span>\r\n                      {{ getNestedValue(rowData, column.field) }}\r\n                    </span>\r\n                  </ng-container>\r\n                  <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n                    /\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n                <!-- Tag -->\r\n                <ng-container *ngIf=\"column.tag && getNestedValue(rowData, column.field)\">\r\n                  <lib-tag [tagText]=\"getNestedValue(rowData, column.field)\" [tagColor]=\"rowData.tagColor\" [rounded]=\"true\"></lib-tag>\r\n                </ng-container>\r\n\r\n                <!-- Status -->\r\n                <ng-container *ngIf=\"column.status\">\r\n                  <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n                    <div style=\"background-color: #66952E; height: 25px; width: 75px;\"></div>\r\n                  </ng-container>\r\n                  <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n                    <div style=\"background-color: #f44336; height: 25px; width: 75px;\"></div>\r\n                  </ng-container>\r\n                </ng-container>\r\n              </ng-container>\r\n              <ng-template #valueCell>\r\n                <ng-container *ngIf=\"getNestedValue(rowData, column.field); else emptyCell\">\r\n                  <!-- Mare; dodal izjemo za 'cmsStatus' -->\r\n                  <ng-container *ngIf=\"column.field === 'cmsStatus'; else defaultContent\">\r\n                    {{ 'pages.cms.cmsStatus.' + getNestedValue(rowData, column.field) | translate }}\r\n                  </ng-container>\r\n                  <!-- Privzeta vsebina za vse ostale stolpce -->\r\n                  <ng-template #defaultContent>\r\n                    {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n                  </ng-template>\r\n                 </ng-container>\r\n                <ng-template #emptyCell>\r\n                  /\r\n                </ng-template>\r\n              </ng-template>\r\n            </ng-container>\r\n\r\n            <p class=\"text-red-500 custom-small-text\" *ngIf=\"colIndex === 0 && rowData?.administrativeProcedure?.localJurisdiction && isWarningTextVisible\">\r\n              <br/> {{ 'components.customTable.notification' | translate }}\r\n            </p>\r\n          </td>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <!--  Button column one -->\r\n      <td *ngIf=\"isButtonOneVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n        <!--  Editing table-->\r\n        <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n          <lib-icon-button\r\n            *ngIf=\"!editing\"\r\n            pInitEditableRow\r\n            [color]=\"buttonOneColor\"\r\n            [icon]=\"buttonOneEditIcon\"\r\n            (click)='onRowEdit(rowData)'\r\n          ></lib-icon-button>\r\n          <lib-icon-button\r\n            *ngIf=\"editing\"\r\n            [color]=\"buttonOneColor!\"\r\n            [icon]=\"buttonOneSaveIcon\"\r\n            (click)='onRowSave(rowData, htmlTableRowElement)'\r\n          ></lib-icon-button>\r\n        </ng-container>\r\n\r\n        <!--  Plain table-->\r\n        <ng-template #plainTable>\r\n          <ng-container\r\n            *ngIf=\"(rowData?.administrativeProcedure === undefined || rowData?.administrativeProcedure?.detailsUrl !== null) && !isPlainTableIconButtonOne\"\r\n          >\r\n            <lib-button\r\n              *ngIf=\"!isPlainTableButtonOneLink\"\r\n              [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n              [hasIcon]=\"buttonOneHasIcon!\"\r\n              [color]=\"rowData?.buttonColor ? rowData.buttonColor : buttonOneColor!\"\r\n              [icon]=\"buttonOneIcon!\"\r\n              (click)='clickButtonOne(rowData)'\r\n            ></lib-button>\r\n            <lib-button-link\r\n              *ngIf=\"isPlainTableButtonOneLink\"\r\n              [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n              [isPrimary]=\"true\"\r\n              [hasIcon]=\"buttonOneHasIcon!\"\r\n              [icon]=\"buttonOneIcon! + ' md:ml-2'\"\r\n              (click)='clickButtonOne(rowData)'\r\n            ></lib-button-link>\r\n          </ng-container>\r\n          <lib-icon-button\r\n            *ngIf=\"isPlainTableIconButtonOne\"\r\n            [color]=\"buttonOneColor!\"\r\n            [icon]=\"buttonOneSaveIcon\"\r\n            (click)='clickButtonOne(rowData)'\r\n          ></lib-icon-button>\r\n        </ng-template>\r\n      </td>\r\n\r\n      <!--  Button column two -->\r\n      <td *ngIf=\"isButtonTwoVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n        <!--  Editing table-->\r\n        <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n          <lib-icon-button\r\n            *ngIf=\"!editing\"\r\n            [color]=\"buttonTwoColor\"\r\n            [icon]=\"buttonTwoDeleteIcon\"\r\n            (click)='onRowDelete(rowData)'\r\n          ></lib-icon-button>\r\n          <lib-icon-button\r\n            *ngIf=\"editing\"\r\n            [color]=\"buttonTwoColor\"\r\n            [icon]=\"buttonTwoCancelIcon\"\r\n            (click)=\"onRowCancel(rowData)\"\r\n          ></lib-icon-button>\r\n        </ng-container>\r\n\r\n        <!--  Plain table-->\r\n        <ng-template #plainTable>\r\n          <lib-button\r\n            *ngIf=\"!isPlainTableIconButtonTwo\"\r\n            [label]=\"buttonTwoLabel!\"\r\n            [hasIcon]=\"buttonTwoHasIcon!\"\r\n            [color]=\"buttonTwoColor!\"\r\n            [icon]=\"buttonTwoIcon!\"\r\n            (click)='clickButtonTwo(rowData)'\r\n          ></lib-button>\r\n          <lib-icon-button\r\n            *ngIf=\"isPlainTableIconButtonTwo\"\r\n            [color]=\"buttonTwoColor!\"\r\n            [icon]=\"buttonTwoDeleteIcon\"\r\n            (click)='clickButtonTwo(rowData)'\r\n          ></lib-icon-button>\r\n        </ng-template>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle -->\r\n      <td *ngIf=\"isDeactivateToggle\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isEnabled\"\r\n          (getValueEvent)=\"toggleEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle two -->\r\n      <td *ngIf=\"isDeactivateToggleTwo\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [disabled]=\"!rowData.isEnabled\"\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isAppointmentEnabled\"\r\n          (getValueEvent)=\"toggleTwoEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle three -->\r\n      <td *ngIf=\"isDeactivateToggleThree\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [disabled]=\"!rowData.isEnabled\"\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isNotificationEnabled\"\r\n          (getValueEvent)=\"toggleThreeEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle four -->\r\n      <td *ngIf=\"isDeactivateToggleFour\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [disabled]=\"!rowData.isEnabled\"\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isVrstomatEnabled\"\r\n          (getValueEvent)=\"toggleFourEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n    </tr>\r\n  </ng-template>\r\n</p-table>\r\n", styles: [":host ::ng-deep .future .p-datatable-header{background:#b2414d}:host ::ng-deep .past .p-datatable-header{background:#6d7375}:host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:8px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border:none;color:#fff;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:first-child,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:first-child{width:400px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:nth-child(2),:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:nth-child(2){width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent;height:50px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952eb3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.disabled_row_color{background:#b4b4b4b3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-datatable .table-icon-button{width:50px}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}@media(max-width:600px){:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem}}.disabled-row{opacity:.5;pointer-events:none}.custom-small-text{font-size:.8rem;line-height:.9}.ellipsis-text{cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i1$7.CellEditor, selector: "p-cellEditor" }, { kind: "directive", type: i1$7.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$7.InitEditableRow, selector: "[pInitEditableRow]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InputComponent, selector: "lib-input[group][controlName][name]", inputs: ["name", "type", "label", "placeholder", "accessibilityText", "group", "controlName", "isRequired", "isLabelVisible", "tooltipPosition", "tooltipText", "formStatus", "groupError", "hasGap", "hasTitle", "maxLength"] }, { kind: "component", type: DateInputComponent, selector: "lib-date-input[group][controlName][name]", inputs: ["isLabelVisible", "name", "label", "placeholder", "accessibilityText", "isRequired", "tooltipPosition", "tooltipText", "dateFormat", "group", "controlName", "showIcon", "selectionMode", "touchUI", "formStatus", "showClear", "isPublicDate", "minDate", "maxDate", "minDateToday", "maxDateSixMonths", "maxDateThreeMonths", "maxDateRangeOneYear", "setMinAndMax", "hasGap", "disabledDates", "appendTo", "groupError", "showTime", "availableDates", "disabledDays", "disabledWeekends"], outputs: ["onSelect"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea[group][controlName][name]", inputs: ["name", "resize", "label", "placeholder", "accessibilityText", "rows", "cols", "tooltipPosition", "tooltipText", "group", "controlName", "isRequired", "formStatus", "hasGap", "customMaxLength"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: DropdownComponent, selector: "lib-dropdown[group][controlName][name]", inputs: ["name", "isMultiselect", "selectedItemLabel", "group", "controlName", "label", "optionList", "optionLabel", "optionalValue", "placeholder", "accessibilityText", "filter", "filterBy", "showClear", "isRequired", "tooltipPosition", "tooltipText", "formStatus", "nestedGroup", "isLoading", "appendTo", "isLabelVisible", "emptyMessage", "virtualScroll", "ariaFilterLabel", "optionValue"], outputs: ["getValueEvent"] }, { kind: "component", type: ToggleSwitchComponent, selector: "lib-toggle-switch", inputs: ["group", "controlName", "isFormElement", "checked", "disabled"], outputs: ["getValueEvent", "checkedChanged"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox[group][controlName][label]", inputs: ["label", "group", "controlName", "value", "formStatus", "ariaLabel"], outputs: ["clickCheckboxEvent"] }, { kind: "component", type: TagComponent, selector: "lib-tag", inputs: ["tagText", "tagColor", "rounded"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["icon", "disabled", "color", "styleClass", "size"], outputs: ["clickEvent"] }, { kind: "component", type: ButtonLinkComponent, selector: "lib-button-link", inputs: ["hasIcon", "label", "isDanger", "isPrimary", "icon", "target", "accessibilityText"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CustomTableComponent, isStandalone: true, selector: "lib-custom-table[tableData][tableColumns]", inputs: { tableData: "tableData", tableColumns: "tableColumns", isPaginatorVisible: "isPaginatorVisible", tableRowCount: "tableRowCount", scrollable: "scrollable", scrollHeight: "scrollHeight", selectedProducts: "selectedProducts", isEditingTable: "isEditingTable", isTableLoading: "isTableLoading", hideColumnsOnMobile: "hideColumnsOnMobile", tableMinWidth: "tableMinWidth", isVirtualScrollButtonVisible: "isVirtualScrollButtonVisible", isVirtualScroll: "isVirtualScroll", virtualScrollRowSize: "virtualScrollRowSize", tableCaption: "tableCaption", captionColorClass: "captionColorClass", isCaptionButtonVisible: "isCaptionButtonVisible", captionButtonLabel: "captionButtonLabel", captionButtonColor: "captionButtonColor", isTableHeaderVisible: "isTableHeaderVisible", emptyColumnWidth: "emptyColumnWidth", toggleTableHeaderName: "toggleTableHeaderName", toggleWidth: "toggleWidth", toggleTwoTableHeaderName: "toggleTwoTableHeaderName", toggleTwoWidth: "toggleTwoWidth", toggleThreeTableHeaderName: "toggleThreeTableHeaderName", toggleThreeWidth: "toggleThreeWidth", toggleFourTableHeaderName: "toggleFourTableHeaderName", toggleFourWidth: "toggleFourWidth", rowColor: "rowColor", formGroup: "formGroup", type: "type", formStatus: "formStatus", tagColor: "tagColor", isWarningTextVisible: "isWarningTextVisible", isButtonOneVisible: "isButtonOneVisible", buttonLabel: "buttonLabel", buttonOneLabel: "buttonOneLabel", buttonOneHasIcon: "buttonOneHasIcon", buttonOneEditIcon: "buttonOneEditIcon", buttonOneSaveIcon: "buttonOneSaveIcon", buttonOneColor: "buttonOneColor", buttonOneIcon: "buttonOneIcon", isPlainTableIconButtonOne: "isPlainTableIconButtonOne", isPlainTableButtonOneLink: "isPlainTableButtonOneLink", isButtonTwoVisible: "isButtonTwoVisible", buttonTwoLabel: "buttonTwoLabel", buttonTwoHasIcon: "buttonTwoHasIcon", buttonTwoDeleteIcon: "buttonTwoDeleteIcon", buttonTwoCancelIcon: "buttonTwoCancelIcon", buttonTwoColor: "buttonTwoColor", buttonTwoIcon: "buttonTwoIcon", isPlainTableIconButtonTwo: "isPlainTableIconButtonTwo", isDeactivateToggle: "isDeactivateToggle", isDeactivateToggleTwo: "isDeactivateToggleTwo", isDeactivateToggleThree: "isDeactivateToggleThree", isDeactivateToggleFour: "isDeactivateToggleFour", showEllipsisFullText: "showEllipsisFullText" }, outputs: { captionButtonClicked: "captionButtonClicked", buttonEditClick: "buttonEditClick", buttonSaveClick: "buttonSaveClick", buttonOneClick: "buttonOneClick", buttonDeleteClick: "buttonDeleteClick", buttonTwoClick: "buttonTwoClick", toggleSwitch: "toggleSwitch", toggleTwoSwitch: "toggleTwoSwitch", toggleThreeSwitch: "toggleThreeSwitch", toggleFourSwitch: "toggleFourSwitch", checkboxOne: "checkboxOne" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "<p-table\r\n  #dt\r\n  [value]=\"tableData\"\r\n  [paginator]=\"isPaginatorVisible\"\r\n  [rows]=\"tableRowCount\"\r\n  [showCurrentPageReport]=\"false\"\r\n  [scrollable]=\"scrollable\"\r\n  [scrollHeight]=\"scrollHeight\"\r\n  dataKey=\"id\"\r\n  editMode=\"row\"\r\n  [ngClass]=\"captionColorClass\"\r\n  [loading]=\"isTableLoading\"\r\n  [tableStyle]=\"{'min-width': tableMinWidth}\"\r\n  [virtualScroll]=\"isVirtualScroll\"\r\n  [virtualScrollItemSize]=\"virtualScrollRowSize\"\r\n  aria-live=\"polite\"\r\n>\r\n  <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">\r\n    <div class=\"flex align-items-center justify-content-between\">\r\n      {{ tableCaption }}\r\n      <span *ngIf=\"isVirtualScrollButtonVisible\"\r\n            (click)=\"isVirtualScroll = !isVirtualScroll\"\r\n            [ngStyle]=\"{'color': isVirtualScroll ? '' : 'lightgray'}\"\r\n            class=\"pi pi-sort cursor-pointer\">\r\n      </span>\r\n      <lib-button\r\n        *ngIf=\"isCaptionButtonVisible\"\r\n        [label]=\"captionButtonLabel\"\r\n        [color]=\"captionButtonColor\"\r\n        (clickEvent)=\"clickCaptionButton($event)\"\r\n      ></lib-button>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n    <tr>\r\n      <ng-container *ngFor=\"let column of tableColumns\">\r\n        <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n          <th  scope=\"col\" [style.width]=\"column.width\">\r\n            {{ column.header | translate }}\r\n          </th>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <th *ngFor=\"let _ of emptyHeaderColumnList\" [style.width]=\"emptyColumnWidth\" aria-hidden=\"true\"></th>\r\n      <th *ngIf=\"!!toggleTableHeaderName\" scope=\"col\" [style.width]=\"toggleWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleTableHeaderName }}\r\n      </th>\r\n      <th *ngIf=\"!!toggleTwoTableHeaderName\" scope=\"col\" [style.width]=\"toggleTwoWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleTwoTableHeaderName }}\r\n      </th>\r\n      <th *ngIf=\"!!toggleThreeTableHeaderName\" scope=\"col\" [style.width]=\"toggleThreeWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleThreeTableHeaderName }}\r\n      </th>\r\n      <th *ngIf=\"!!toggleFourTableHeaderName\" scope=\"col\" [style.width]=\"toggleFourWidth\"  class=\"vertical-align-middle\">\r\n        {{ toggleFourTableHeaderName }}\r\n      </th>\r\n    </tr>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"body\" let-rowData let-editing=\"editing\" let-ri=\"rowIndex\">\r\n    <!--\r\n      Mare; 2024-09-19: dodajanje logike barvanja rowColor za /cms/notifications, delat mora pa tudi v /vsi-termini\r\n    -->\r\n    <tr [pEditableRow]=\"rowData\" #htmlTableRowElement\r\n        [ngClass]=\"\r\n            rowData?.cmsStatus ?\r\n              (rowData?.cmsStatus === 'expired' ? 'disabled_row_color' :\r\n               rowData?.cmsStatus === 'planned' ? '' :\r\n               rowData?.cmsStatus === 'active' ? 'success_row_color' : '') :\r\n            (!rowData?.registered ? rowColor : '')\r\n      \">\r\n      <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n        <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n          <td [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n            <!-- Text input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'input'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-input\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [type]=\"column.inputType ? column.inputType : type\"\r\n                    placeholder=\"{{ column.placeholder! |translate }}\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                  ></lib-input>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    <ng-container *ngIf=\"column.isLink; else notLink\">\r\n                      <a href=\"{{ rowData[column.field] }}\" target=\"_blank\">\r\n                        {{ rowData[column.field] }}\r\n                      </a>\r\n                    </ng-container>\r\n                    <ng-template #notLink>\r\n                      {{ rowData[column.field] }} {{ column?.suffix }}\r\n                    </ng-template>\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Date input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'date'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-date-input\r\n                    appendTo=\"body\"\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [setMinAndMax]=\"false\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                    placeholder=\"{{ column.placeholder! | translate }}\"\r\n                  ></lib-date-input>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    {{ rowData[column.field] | date: 'dd.MM.yyyy' }} {{ column?.suffix }}\r\n                  </ng-container>\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Date+Time output-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'dateTime'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    {{ rowData[column.field] | date: 'dd.MM.yyyy, HH:mm' }} {{ column?.suffix }}\r\n                  </ng-container>\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- TextArea input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'textarea'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-textarea *ngIf=\"column.maxLength === -1\"\r\n                    [customMaxLength]=\"null\"\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                    placeholder=\"{{ column.placeholder! |translate }}\"\r\n                  ></lib-textarea>\r\n                  <lib-textarea *ngIf=\"column.maxLength !== -1\"\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n                    [isRequired]=\"false\"\r\n                    [formStatus]=\"formStatus\"\r\n                    [hasGap]=\"false\"\r\n                    placeholder=\"{{ column.placeholder! |translate }}\"\r\n                  ></lib-textarea>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    <lib-tooltip\r\n                      [htmlParser]=\"true\"\r\n                      [text]=\"rowData[column.field]\"\r\n                    ></lib-tooltip>\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Dropdown input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'dropdown'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-dropdown\r\n                    label=\"Moje naloge\"\r\n                    placeholder=\"Izberite\"\r\n                    optionLabel=\"name\"\r\n                    [showClear]=\"true\"\r\n                    [formStatus]=\"formStatus\"\r\n\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [name]=\"column.field\"\r\n\r\n                    filterBy=\"name\"\r\n                    [isLoading]=\"false\"\r\n                    [optionList]=\"overviewList\"\r\n                    [filter]=\"true\"\r\n                    [isRequired]=\"false\"\r\n                  ></lib-dropdown>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    <lib-tooltip\r\n                      [htmlParser]=\"true\"\r\n                      [text]=\"rowData[column.field]\"\r\n                    ></lib-tooltip>\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    /\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Switch input-->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'switch'\">\r\n              <p-cellEditor>\r\n                <ng-template pTemplate=\"input\">\r\n                  <lib-toggle-switch\r\n                    [group]=\"formGroup\"\r\n                    [controlName]=\"column.field\"\r\n                    [checked]=\"rowData[column.field]\"\r\n                  ></lib-toggle-switch>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"output\">\r\n                  <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n                    {{ 'components.customTable.yes' | translate }}\r\n                  </ng-container>\r\n\r\n                  <ng-template #emptyCell>\r\n                    {{ 'components.customTable.no' | translate }}\r\n                  </ng-template>\r\n                </ng-template>\r\n              </p-cellEditor>\r\n            </ng-container>\r\n\r\n            <!-- Mare; dodal custom checkbox za izbiro vrstice -->\r\n            <!-- [controlName] je oblike rowChecked_2024-04-11T11:35:00_c3cff776-dc06-40ec-bab5-7cab26e2014a  -->\r\n            <!-- column.field = rowChecked -->\r\n            <!-- rowData[column?.control!] = 2024-04-11T11:35:00 (startDate) -->\r\n            <!-- rowData[column?.control2!] = c3cff776-dc06-40ec-bab5-7cab26e2014a (uuid) -->\r\n            <ng-container *ngIf=\"column.editable && column.component === 'checkbox'\">\r\n                <lib-checkbox class=\"\"\r\n                              [group]=\"formGroup\"\r\n                              [controlName]=\"column.field + '_' + rowData[column?.control!] + '_' + rowData[column?.control2!]\"\r\n                              (clickCheckboxEvent)=\"clickCheckboxOne($event, rowData[column?.control!] + '_' + rowData[column?.control2!])\"\r\n                              label=\"\">\r\n                </lib-checkbox>\r\n            </ng-container>\r\n\r\n            <!-- Plain table-->\r\n            <ng-container *ngIf=\"!column.editable\">\r\n              <ng-container *ngIf=\"column.tooltip || column.tag || column.status || column.ellipsis; else valueCell\">\r\n                <!-- Tooltip -->\r\n                <ng-container *ngIf=\"column.tooltip\">\r\n                  <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n                    <lib-tooltip [htmlParser]=\"true\" [text]=\"getNestedValue(rowData, column.field)\"></lib-tooltip>\r\n                  </ng-container>\r\n                  <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n                    /\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n                <!-- Ellipsis -->\r\n                <ng-container *ngIf=\"column.ellipsis\">\r\n                  <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n                    <span>\r\n                      {{ getNestedValue(rowData, column.field) }}\r\n                    </span>\r\n                  </ng-container>\r\n                  <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n                    /\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n                <!-- Tag -->\r\n                <ng-container *ngIf=\"column.tag && getNestedValue(rowData, column.field)\">\r\n                  <lib-tag [tagText]=\"getNestedValue(rowData, column.field)\" [tagColor]=\"rowData.tagColor\" [rounded]=\"true\"></lib-tag>\r\n                </ng-container>\r\n\r\n                <!-- Status -->\r\n                <ng-container *ngIf=\"column.status\">\r\n                  <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n                    <div style=\"background-color: #66952E; height: 25px; width: 75px;\"></div>\r\n                  </ng-container>\r\n                  <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n                    <div style=\"background-color: #f44336; height: 25px; width: 75px;\"></div>\r\n                  </ng-container>\r\n                </ng-container>\r\n              </ng-container>\r\n              <ng-template #valueCell>\r\n                <ng-container *ngIf=\"getNestedValue(rowData, column.field); else emptyCell\">\r\n                  <!-- Mare; dodal izjemo za 'cmsStatus' -->\r\n                  <ng-container *ngIf=\"column.field === 'cmsStatus'; else defaultContent\">\r\n                    {{ 'pages.cms.cmsStatus.' + getNestedValue(rowData, column.field) | translate }}\r\n                  </ng-container>\r\n                  <!-- Privzeta vsebina za vse ostale stolpce -->\r\n                  <ng-template #defaultContent>\r\n                    {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n                  </ng-template>\r\n                 </ng-container>\r\n                <ng-template #emptyCell>\r\n                  /\r\n                </ng-template>\r\n              </ng-template>\r\n            </ng-container>\r\n\r\n            <p class=\"text-red-500 custom-small-text\" *ngIf=\"colIndex === 0 && rowData?.administrativeProcedure?.localJurisdiction && isWarningTextVisible\">\r\n              <br/> {{ 'components.customTable.notification' | translate }}\r\n            </p>\r\n          </td>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <!--  Button column one -->\r\n      <td *ngIf=\"isButtonOneVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n        <!--  Editing table-->\r\n        <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n          <lib-icon-button\r\n            *ngIf=\"!editing\"\r\n            pInitEditableRow\r\n            [color]=\"buttonOneColor\"\r\n            [icon]=\"buttonOneEditIcon\"\r\n            (click)='onRowEdit(rowData)'\r\n          ></lib-icon-button>\r\n          <lib-icon-button\r\n            *ngIf=\"editing\"\r\n            [color]=\"buttonOneColor!\"\r\n            [icon]=\"buttonOneSaveIcon\"\r\n            (click)='onRowSave(rowData, htmlTableRowElement)'\r\n          ></lib-icon-button>\r\n        </ng-container>\r\n\r\n        <!--  Plain table-->\r\n        <ng-template #plainTable>\r\n          <ng-container\r\n            *ngIf=\"(rowData?.administrativeProcedure === undefined || rowData?.administrativeProcedure?.detailsUrl !== null) && !isPlainTableIconButtonOne\"\r\n          >\r\n            <lib-button\r\n              *ngIf=\"!isPlainTableButtonOneLink\"\r\n              [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n              [hasIcon]=\"buttonOneHasIcon!\"\r\n              [color]=\"rowData?.buttonColor ? rowData.buttonColor : buttonOneColor!\"\r\n              [icon]=\"buttonOneIcon!\"\r\n              (click)='clickButtonOne(rowData)'\r\n            ></lib-button>\r\n            <lib-button-link\r\n              *ngIf=\"isPlainTableButtonOneLink\"\r\n              [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n              [isPrimary]=\"true\"\r\n              [hasIcon]=\"buttonOneHasIcon!\"\r\n              [icon]=\"buttonOneIcon! + ' md:ml-2'\"\r\n              (click)='clickButtonOne(rowData)'\r\n            ></lib-button-link>\r\n          </ng-container>\r\n          <lib-icon-button\r\n            *ngIf=\"isPlainTableIconButtonOne\"\r\n            [color]=\"buttonOneColor!\"\r\n            [icon]=\"buttonOneSaveIcon\"\r\n            (click)='clickButtonOne(rowData)'\r\n          ></lib-icon-button>\r\n        </ng-template>\r\n      </td>\r\n\r\n      <!--  Button column two -->\r\n      <td *ngIf=\"isButtonTwoVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n        <!--  Editing table-->\r\n        <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n          <lib-icon-button\r\n            *ngIf=\"!editing\"\r\n            [color]=\"buttonTwoColor\"\r\n            [icon]=\"buttonTwoDeleteIcon\"\r\n            (click)='onRowDelete(rowData)'\r\n          ></lib-icon-button>\r\n          <lib-icon-button\r\n            *ngIf=\"editing\"\r\n            [color]=\"buttonTwoColor\"\r\n            [icon]=\"buttonTwoCancelIcon\"\r\n            (click)=\"onRowCancel(rowData)\"\r\n          ></lib-icon-button>\r\n        </ng-container>\r\n\r\n        <!--  Plain table-->\r\n        <ng-template #plainTable>\r\n          <lib-button\r\n            *ngIf=\"!isPlainTableIconButtonTwo\"\r\n            [label]=\"buttonTwoLabel!\"\r\n            [hasIcon]=\"buttonTwoHasIcon!\"\r\n            [color]=\"buttonTwoColor!\"\r\n            [icon]=\"buttonTwoIcon!\"\r\n            (click)='clickButtonTwo(rowData)'\r\n          ></lib-button>\r\n          <lib-icon-button\r\n            *ngIf=\"isPlainTableIconButtonTwo\"\r\n            [color]=\"buttonTwoColor!\"\r\n            [icon]=\"buttonTwoDeleteIcon\"\r\n            (click)='clickButtonTwo(rowData)'\r\n          ></lib-icon-button>\r\n        </ng-template>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle -->\r\n      <td *ngIf=\"isDeactivateToggle\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isEnabled\"\r\n          (getValueEvent)=\"toggleEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle two -->\r\n      <td *ngIf=\"isDeactivateToggleTwo\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [disabled]=\"!rowData.isEnabled\"\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isAppointmentEnabled\"\r\n          (getValueEvent)=\"toggleTwoEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle three -->\r\n      <td *ngIf=\"isDeactivateToggleThree\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [disabled]=\"!rowData.isEnabled\"\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isNotificationEnabled\"\r\n          (getValueEvent)=\"toggleThreeEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n\r\n      <!--  Deactivate toggle four -->\r\n      <td *ngIf=\"isDeactivateToggleFour\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n        <lib-toggle-switch\r\n          [disabled]=\"!rowData.isEnabled\"\r\n          [isFormElement]=\"false\"\r\n          [checked]=\"rowData.isVrstomatEnabled\"\r\n          (getValueEvent)=\"toggleFourEnable({ rowData, $event })\"\r\n        ></lib-toggle-switch>\r\n      </td>\r\n    </tr>\r\n  </ng-template>\r\n</p-table>\r\n", styles: [":host ::ng-deep .future .p-datatable-header{background:#b2414d}:host ::ng-deep .past .p-datatable-header{background:#6d7375}:host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:8px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border:none;color:#fff;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:first-child,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:first-child{width:400px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:nth-child(2),:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:nth-child(2){width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent;height:50px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952eb3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.disabled_row_color{background:#b4b4b4b3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-datatable .table-icon-button{width:50px}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}@media(max-width:600px){:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem}}.disabled-row{opacity:.5;pointer-events:none}.custom-small-text{font-size:.8rem;line-height:.9}.ellipsis-text{cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i1$7.CellEditor, selector: "p-cellEditor" }, { kind: "directive", type: i1$7.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$7.InitEditableRow, selector: "[pInitEditableRow]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InputComponent, selector: "lib-input[group][controlName][name]", inputs: ["name", "type", "label", "placeholder", "accessibilityText", "group", "controlName", "isRequired", "isLabelVisible", "tooltipPosition", "tooltipText", "formStatus", "groupError", "hasGap", "hasTitle", "maxLength"] }, { kind: "component", type: DateInputComponent, selector: "lib-date-input[group][controlName][name]", inputs: ["isLabelVisible", "name", "label", "placeholder", "accessibilityText", "isRequired", "tooltipPosition", "tooltipText", "dateFormat", "group", "controlName", "showIcon", "selectionMode", "touchUI", "formStatus", "showClear", "isPublicDate", "minDate", "maxDate", "minDateToday", "maxDateSixMonths", "maxDateThreeMonths", "maxDateRangeOneYear", "setMinAndMax", "hasGap", "disabledDates", "appendTo", "groupError", "showTime", "availableDates", "disabledDays", "disabledWeekends"], outputs: ["onSelect"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea[group][controlName][name]", inputs: ["name", "resize", "label", "placeholder", "accessibilityText", "rows", "cols", "tooltipPosition", "tooltipText", "group", "controlName", "isRequired", "formStatus", "hasGap", "customMaxLength"], outputs: ["onBlurEvent"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: DropdownComponent, selector: "lib-dropdown[group][controlName][name]", inputs: ["name", "isMultiselect", "selectedItemLabel", "group", "controlName", "label", "optionList", "optionLabel", "optionalValue", "placeholder", "accessibilityText", "filter", "filterBy", "showClear", "isRequired", "tooltipPosition", "tooltipText", "formStatus", "nestedGroup", "isLoading", "appendTo", "isLabelVisible", "emptyMessage", "virtualScroll", "ariaFilterLabel", "optionValue"], outputs: ["getValueEvent"] }, { kind: "component", type: ToggleSwitchComponent, selector: "lib-toggle-switch", inputs: ["group", "controlName", "isFormElement", "checked", "disabled"], outputs: ["getValueEvent", "checkedChanged"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox[group][controlName][label]", inputs: ["label", "group", "controlName", "value", "formStatus", "ariaLabel"], outputs: ["clickCheckboxEvent"] }, { kind: "component", type: TagComponent, selector: "lib-tag", inputs: ["tagText", "tagColor", "rounded"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["icon", "disabled", "color", "styleClass", "size"], outputs: ["clickEvent"] }, { kind: "component", type: ButtonLinkComponent, selector: "lib-button-link", inputs: ["hasIcon", "label", "isDanger", "isPrimary", "icon", "target", "accessibilityText"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomTableComponent, decorators: [{
             type: Component,
@@ -2573,6 +2576,204 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                 type: Output
             }] } });
 
+class ModalComponent {
+    header = 'Header title';
+    headerColor = DialogColor.primary;
+    width = '50vw';
+    height = '';
+    dynamicContentTemplate;
+    resizable = false;
+    draggable = true;
+    visible;
+    closable = true;
+    modal = false;
+    body = 'Body content';
+    position = 'top';
+    mode = 'create';
+    btnLabel = 'Sem prebral/-a';
+    btnColor = ButtonColor.success;
+    btnIcon = 'pi pi-check';
+    hasIcon = true;
+    disabled = false;
+    hasLeftButton = false;
+    appendTo;
+    leftBtnLabel = 'Zapri';
+    leftBtnColor = ButtonColor.danger;
+    leftBtnIcon = 'pi pi-times';
+    leftHasIcon = true;
+    leftDisabled = false;
+    buttonClickEvent = new EventEmitter();
+    visibleChange = new EventEmitter();
+    leftButtonClickEvent = new EventEmitter();
+    scrollEvent = new EventEmitter();
+    modalClosed = new EventEmitter();
+    isFooterVisible = true;
+    dismissableMask = false;
+    headerClassMap = {
+        primary: 'primary',
+        secondary: 'secondary',
+        info: 'info',
+        warning: 'warning',
+        danger: 'danger',
+    };
+    /**
+     * Event emitted on clicking added button on bottom of modal
+     * @param event mouse click event
+     */
+    buttonCloseModal(event) {
+        event.stopPropagation();
+        this.buttonClickEvent.emit(event);
+    }
+    /**
+     * Event emitted on clicking added button on bottom of modal
+     * @param event mouse click event
+     */
+    leftButtonClick(event) {
+        event.stopPropagation();
+        this.leftButtonClickEvent.emit(event);
+    }
+    changeVisibility(newVisibility) {
+        this.visible = newVisibility;
+        this.visibleChange.emit(this.visible);
+    }
+    handleHide() {
+        this.changeVisibility(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ModalComponent, isStandalone: true, selector: "lib-modal", inputs: { header: "header", headerColor: "headerColor", width: "width", height: "height", dynamicContentTemplate: "dynamicContentTemplate", resizable: "resizable", draggable: "draggable", visible: "visible", closable: "closable", modal: "modal", body: "body", position: "position", mode: "mode", btnLabel: "btnLabel", btnColor: "btnColor", btnIcon: "btnIcon", hasIcon: "hasIcon", disabled: "disabled", hasLeftButton: "hasLeftButton", appendTo: "appendTo", leftBtnLabel: "leftBtnLabel", leftBtnColor: "leftBtnColor", leftBtnIcon: "leftBtnIcon", leftHasIcon: "leftHasIcon", leftDisabled: "leftDisabled", isFooterVisible: "isFooterVisible", dismissableMask: "dismissableMask" }, outputs: { buttonClickEvent: "buttonClickEvent", visibleChange: "visibleChange", leftButtonClickEvent: "leftButtonClickEvent", scrollEvent: "scrollEvent", modalClosed: "modalClosed" }, ngImport: i0, template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n          [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n          [dismissableMask]=\"dismissableMask\"\r\n          [appendTo]=\"appendTo\"\r\n          [ngClass]=\"headerClassMap[headerColor]\" [closable]=\"closable\"\r\n          [footerTemplate]=\"isFooterVisible ? footer  : undefined\"\r\n          (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n  <ng-template pTemplate=\"content\">\r\n    <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n  </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n  <div class=\"w-full flex\"\r\n       [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n    <lib-button\r\n      *ngIf=\"hasLeftButton\"\r\n      [disabled]=\"leftDisabled\"\r\n      (click)=\"leftButtonClick($event)\"\r\n      [label]=\"leftBtnLabel\"\r\n      [color]=\"leftBtnColor\"\r\n      [icon]=\"leftBtnIcon\"\r\n      [hasIcon]=\"leftHasIcon\"\r\n    ></lib-button>\r\n    <lib-button\r\n      [disabled]=\"disabled\"\r\n      (click)=\"buttonCloseModal($event)\"\r\n      [label]=\"btnLabel\"\r\n      [color]=\"btnColor\"\r\n      [icon]=\"btnIcon\"\r\n      [hasIcon]=\"hasIcon\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"], dependencies: [{ kind: "component", type: Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-modal', imports: [
+                        Dialog,
+                        NgClass,
+                        PrimeTemplate,
+                        NgTemplateOutlet,
+                        NgIf,
+                        ButtonComponent,
+                    ], template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n          [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n          [dismissableMask]=\"dismissableMask\"\r\n          [appendTo]=\"appendTo\"\r\n          [ngClass]=\"headerClassMap[headerColor]\" [closable]=\"closable\"\r\n          [footerTemplate]=\"isFooterVisible ? footer  : undefined\"\r\n          (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n  <ng-template pTemplate=\"content\">\r\n    <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n  </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n  <div class=\"w-full flex\"\r\n       [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n    <lib-button\r\n      *ngIf=\"hasLeftButton\"\r\n      [disabled]=\"leftDisabled\"\r\n      (click)=\"leftButtonClick($event)\"\r\n      [label]=\"leftBtnLabel\"\r\n      [color]=\"leftBtnColor\"\r\n      [icon]=\"leftBtnIcon\"\r\n      [hasIcon]=\"leftHasIcon\"\r\n    ></lib-button>\r\n    <lib-button\r\n      [disabled]=\"disabled\"\r\n      (click)=\"buttonCloseModal($event)\"\r\n      [label]=\"btnLabel\"\r\n      [color]=\"btnColor\"\r\n      [icon]=\"btnIcon\"\r\n      [hasIcon]=\"hasIcon\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"] }]
+        }], propDecorators: { header: [{
+                type: Input
+            }], headerColor: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], dynamicContentTemplate: [{
+                type: Input
+            }], resizable: [{
+                type: Input
+            }], draggable: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }], closable: [{
+                type: Input
+            }], modal: [{
+                type: Input
+            }], body: [{
+                type: Input
+            }], position: [{
+                type: Input
+            }], mode: [{
+                type: Input
+            }], btnLabel: [{
+                type: Input
+            }], btnColor: [{
+                type: Input
+            }], btnIcon: [{
+                type: Input
+            }], hasIcon: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], hasLeftButton: [{
+                type: Input
+            }], appendTo: [{
+                type: Input
+            }], leftBtnLabel: [{
+                type: Input
+            }], leftBtnColor: [{
+                type: Input
+            }], leftBtnIcon: [{
+                type: Input
+            }], leftHasIcon: [{
+                type: Input
+            }], leftDisabled: [{
+                type: Input
+            }], buttonClickEvent: [{
+                type: Output
+            }], visibleChange: [{
+                type: Output
+            }], leftButtonClickEvent: [{
+                type: Output
+            }], scrollEvent: [{
+                type: Output
+            }], modalClosed: [{
+                type: Output
+            }], isFooterVisible: [{
+                type: Input
+            }], dismissableMask: [{
+                type: Input
+            }] } });
+
+class KameraComponent {
+    sanitizer;
+    video;
+    photoCaptured = new EventEmitter();
+    safeImageUrl;
+    constructor(sanitizer) {
+        this.sanitizer = sanitizer;
+    }
+    async ngAfterViewInit() {
+        try {
+            const devices = await navigator.mediaDevices.enumerateDevices();
+            const videoDevices = devices.filter(device => device.kind === 'videoinput');
+            let constraints;
+            if (videoDevices.length > 1) {
+                const backCameraId = videoDevices[videoDevices.length - 1].deviceId;
+                constraints = { video: { deviceId: { exact: backCameraId } } };
+            }
+            else {
+                constraints = { video: true };
+            }
+            const stream = await navigator.mediaDevices.getUserMedia(constraints);
+            this.video.nativeElement.srcObject = stream;
+        }
+        catch (err) {
+            console.warn('Zunanja kamera ni na voljo. Uporabljam privzeto.', err);
+            const fallbackStream = await navigator.mediaDevices.getUserMedia({ video: true });
+            this.video.nativeElement.srcObject = fallbackStream;
+        }
+    }
+    ngOnDestroy() {
+        const stream = this.video?.nativeElement?.srcObject;
+        stream?.getTracks().forEach(track => track.stop());
+    }
+    async captureAndEmitPhoto() {
+        const canvas = document.createElement('canvas');
+        canvas.width = this.video.nativeElement.videoWidth;
+        canvas.height = this.video.nativeElement.videoHeight;
+        const ctx = canvas.getContext('2d');
+        ctx?.drawImage(this.video.nativeElement, 0, 0);
+        const base64 = canvas.toDataURL('image/jpeg', 0.9);
+        this.safeImageUrl = this.sanitizer.bypassSecurityTrustUrl(base64);
+        this.photoCaptured.emit(base64);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: KameraComponent, deps: [{ token: i1$5.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: KameraComponent, isStandalone: true, selector: "app-kamera", outputs: { photoCaptured: "photoCaptured" }, viewQueries: [{ propertyName: "video", first: true, predicate: ["video"], descendants: true }], ngImport: i0, template: "<div class=\"camera-container\">\r\n  <video #video autoplay playsinline></video>\r\n\r\n  <lib-button [label]=\"'Zajemi sliko'\"(click)=\"captureAndEmitPhoto()\">Zajemi fotografijo</lib-button>\r\n</div>\r\n", styles: [".camera-container{display:flex;flex-direction:column;align-items:center}.camera-container video{width:100%;min-height:220px;background:#222}button{margin-top:.5rem}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: KameraComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-kamera', standalone: true, imports: [ButtonComponent], template: "<div class=\"camera-container\">\r\n  <video #video autoplay playsinline></video>\r\n\r\n  <lib-button [label]=\"'Zajemi sliko'\"(click)=\"captureAndEmitPhoto()\">Zajemi fotografijo</lib-button>\r\n</div>\r\n", styles: [".camera-container{display:flex;flex-direction:column;align-items:center}.camera-container video{width:100%;min-height:220px;background:#222}button{margin-top:.5rem}\n"] }]
+        }], ctorParameters: () => [{ type: i1$5.DomSanitizer }], propDecorators: { video: [{
+                type: ViewChild,
+                args: ['video']
+            }], photoCaptured: [{
+                type: Output
+            }] } });
+
 class FileUploadComponent {
     config;
     sharedMessageService;
@@ -2593,6 +2794,8 @@ class FileUploadComponent {
     onDownload = new EventEmitter();
     valid = new EventEmitter();
     isCameraVisible = false;
+    hasPreviewImage = false;
+    lastImageUrl = null;
     openCamera() { this.isCameraVisible = true; }
     closeCamera() { this.isCameraVisible = false; }
     // File upload
@@ -2606,13 +2809,6 @@ class FileUploadComponent {
         this.sharedMessageService = sharedMessageService;
         this.translateService = translateService;
     }
-    onSelectedFiles(event) {
-        const currentFiles = event?.currentFiles ?? [];
-        const sanitizedFiles = currentFiles.map((file) => this.sanitizeFile(file));
-        this.fileList = sanitizedFiles;
-        this.onSaveFile.emit(this.fileList);
-        this.calculateFileSize();
-    }
     sanitizeFile(file) {
         const lastDotIndex = file.name.lastIndexOf('.');
         const baseName = lastDotIndex > -1 ? file.name.slice(0, lastDotIndex) : file.name;
@@ -2702,8 +2898,15 @@ class FileUploadComponent {
         }
         this.totalSizePercent = this.totalSize / 10;
     }
+    onSelectedFiles(event) {
+        const currentFiles = event?.currentFiles ?? [];
+        const sanitizedFiles = currentFiles.map((file) => this.sanitizeFile(file));
+        this.fileList = sanitizedFiles;
+        this.onSaveFile.emit(this.fileList);
+        this.calculateFileSize();
+        this.updatePreviewState();
+    }
     onPhotoCaptured(base64) {
-        // Pretvorba PICK
         const arr = base64.split(',');
         const mime = arr[0].match(/:(.*?);/)[1];
         const bstr = atob(arr[1]);
@@ -2715,9 +2918,35 @@ class FileUploadComponent {
         this.fileList = [...this.fileList, file];
         this.onSaveFile.emit(this.fileList);
         this.closeCamera();
+        // hranimo base64 za predogled
+        this.lastImageUrl = base64;
+        this.updatePreviewState();
+    }
+    updatePreviewState() {
+        this.hasPreviewImage = !!this.lastImageUrl || this.fileList.some(f => f.type.startsWith('image/'));
+    }
+    openLastImagePreview() {
+        if (this.lastImageUrl) {
+            const arr = this.lastImageUrl.split(',');
+            const mime = arr[0].match(/:(.*?);/)[1];
+            const bstr = atob(arr[1]);
+            let n = bstr.length;
+            const u8arr = new Uint8Array(n);
+            while (n--)
+                u8arr[n] = bstr.charCodeAt(n);
+            const blob = new Blob([u8arr], { type: mime });
+            const url = URL.createObjectURL(blob);
+            window.open(url, '_blank');
+            return;
+        }
+        const lastImage = [...this.fileList].reverse().find(f => f.type.startsWith('image/'));
+        if (!lastImage)
+            return;
+        const blobUrl = URL.createObjectURL(lastImage);
+        window.open(blobUrl, '_blank');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1$8.PrimeNG }, { token: SharedMessageService }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: FileUploadComponent, isStandalone: true, selector: "app-file-upload", inputs: { postavkaPregledaId: "postavkaPregledaId", uploadedFiles: "uploadedFiles", maxFileSize: "maxFileSize", totalMaxFileSize: "totalMaxFileSize", disabled: "disabled", acceptFiles: "acceptFiles", multiple: "multiple" }, outputs: { onSaveFile: "onSaveFile", onDelete: "onDelete", onDownload: "onDownload", valid: "valid" }, ngImport: i0, template: "    <p-fileupload\r\n      class=\"pt-3\"\r\n      name=\"priloge[]\"\r\n      invalidFileSizeMessageSummary=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageSummary' | translate\r\n      }}\"\r\n      invalidFileSizeMessageDetail=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageDetail' | translate\r\n      }}\"\r\n      invalidFileTypeMessageDetail=\"{{'components.fileUpload.invalidFileTypeMessageDetail' | translate}}\"\r\n      invalidFileTypeMessageSummary=\"{{ 'components.fileUpload.invalidFileTypeMessageSummary' | translate}}\"\r\n      [multiple]=\"multiple\"\r\n      (onRemove)=\"remove($event)\"\r\n      [accept]=\"acceptFiles\"\r\n      [maxFileSize]=\"maxFileSize\"\r\n      (onSelect)=\"onSelectedFiles($event)\">\r\n      <ng-template\r\n        #header\r\n        let-priloge\r\n        let-chooseCallback=\"chooseCallback\"\r\n        let-clearCallback=\"clearCallback\">\r\n        <div class=\"flex gap-2\">\r\n          <lib-button\r\n            [disabled]=\"disabled\"\r\n            (click)=\"choose($event, chooseCallback)\"\r\n            label=\"{{ 'components.fileUpload.izberi' | translate }}\"\r\n            [hasIcon]=\"true\"\r\n            [icon]=\"'pi pi-file'\"\r\n            [color]=\"ButtonColor.primary\" />\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #content let-priloge let-removeFileCallback=\"removeFileCallback\">\r\n        <div class=\"flex flex-col gap-8 pt-4\">\r\n          <div class=\"w-full\" *ngIf=\"uploadedFiles.length > 0\">\r\n            <div class=\"flex flex-column gap-4\">\r\n              <div\r\n                *ngFor=\"let priloga of uploadedFiles; let i = index\"\r\n                class=\"flex flex-col justify-content-between items-center gap-2 px-3\">\r\n                <div class=\"flex flex-col\">\r\n                  <div>\r\n                    <i class=\"pi pi-file\"></i>\r\n                  </div>\r\n                  <span class=\"pl-3 text-ellipsis max-w-60 whitespace-nowrap overflow-hidden\">\r\n                    {{ getDisplayName(priloga) }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"flex align-items-center\">\r\n                  <div *ngIf=\"!isTempFile(priloga)\">\r\n                    <p-badge value=\"Zaklju\u010Den\" badgeSize=\"small\" severity=\"success\" />\r\n                    <p-button\r\n                      (click)=\"downloadFile(priloga)\"\r\n                      severity=\"primary\"\r\n                      icon=\"pi pi-download\"\r\n                      aria-label=\"Prenesi\"\r\n                      [rounded]=\"true\"\r\n                      [text]=\"true\" />\r\n                  </div>\r\n                  <p-button\r\n                    [disabled]=\"disabled\"\r\n                    (click)=\"isTempFile(priloga) ? removeFileCallback() : delete(priloga)\"\r\n                    severity=\"danger\"\r\n                    icon=\"pi pi-times\"\r\n                    [rounded]=\"true\"\r\n                    [text]=\"true\" />\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #priloga></ng-template>\r\n      <ng-template #empty>\r\n        <div\r\n          *ngIf=\"uploadedFiles.length === 0\"\r\n          class=\"flex align-center justify-around\"\r\n          [style.width]=\"'100%'\">\r\n          <span class=\"pi pi-cloud-upload mr-3\"></span>\r\n          <p>{{ 'components.fileUpload.povlecitveInSpustiteDatotekeZaNalaganje' | translate }}</p>\r\n        </div>\r\n        <div *ngIf=\"acceptFiles\" class=\"flex align-center justify-around\">\r\n          <div class=\"placeholder\"></div>\r\n          <p>{{ ('components.fileUpload.dovoljeneDatoteke' | translate) + acceptFiles }}</p>\r\n        </div>\r\n      </ng-template>\r\n    </p-fileupload>\r\n\r\n\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i4.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i5$1.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: OverlayBadgeModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MenubarModule }, { kind: "ngmodule", type: ChipModule }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: FileUploadComponent, isStandalone: true, selector: "app-file-upload", inputs: { postavkaPregledaId: "postavkaPregledaId", uploadedFiles: "uploadedFiles", maxFileSize: "maxFileSize", totalMaxFileSize: "totalMaxFileSize", disabled: "disabled", acceptFiles: "acceptFiles", multiple: "multiple" }, outputs: { onSaveFile: "onSaveFile", onDelete: "onDelete", onDownload: "onDownload", valid: "valid" }, ngImport: i0, template: "    <p-fileupload\r\n      class=\"pt-3\"\r\n      name=\"priloge[]\"\r\n      invalidFileSizeMessageSummary=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageSummary' | translate\r\n      }}\"\r\n      invalidFileSizeMessageDetail=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageDetail' | translate\r\n      }}\"\r\n      invalidFileTypeMessageDetail=\"{{'components.fileUpload.invalidFileTypeMessageDetail' | translate}}\"\r\n      invalidFileTypeMessageSummary=\"{{ 'components.fileUpload.invalidFileTypeMessageSummary' | translate}}\"\r\n      [multiple]=\"multiple\"\r\n      (onRemove)=\"remove($event)\"\r\n      [accept]=\"acceptFiles\"\r\n      [maxFileSize]=\"maxFileSize\"\r\n      (onSelect)=\"onSelectedFiles($event)\">\r\n      <ng-template\r\n        #header\r\n        let-priloge\r\n        let-chooseCallback=\"chooseCallback\"\r\n        let-clearCallback=\"clearCallback\">\r\n        <div class=\"flex gap-2\">\r\n          <lib-button\r\n            [disabled]=\"disabled\"\r\n            (click)=\"choose($event, chooseCallback)\"\r\n            label=\"{{ 'components.fileUpload.izberi' | translate }}\"\r\n            [hasIcon]=\"true\"\r\n            [icon]=\"'pi pi-file'\"\r\n            [color]=\"ButtonColor.primary\" />\r\n            <lib-button\r\n      [disabled]=\"disabled\"\r\n      (click)=\"openCamera()\"\r\n      label=\"{{ 'components.fileUpload.kamera' | translate }}\"\r\n      [hasIcon]=\"true\"\r\n      [icon]=\"'pi pi-camera'\"\r\n      [color]=\"ButtonColor.primary\" />\r\n      <lib-button\r\n      [disabled]=\"!hasPreviewImage\"\r\n      (click)=\"openLastImagePreview()\"\r\n      [hasIcon]=\"true\"\r\n      [icon]=\"'pi pi-eye'\"\r\n      [color]=\"ButtonColor.secondary\"\r\n      [label]=\"' '\">\r\n    </lib-button>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #content let-priloge let-removeFileCallback=\"removeFileCallback\">\r\n        <div class=\"flex flex-col gap-8 pt-4\">\r\n          <div class=\"w-full\" *ngIf=\"uploadedFiles.length > 0\">\r\n            <div class=\"flex flex-column gap-4\">\r\n              <div\r\n                *ngFor=\"let priloga of uploadedFiles; let i = index\"\r\n                class=\"flex flex-col justify-content-between items-center gap-2 px-3\">\r\n                <div class=\"flex flex-col\">\r\n                  <div>\r\n                    <i class=\"pi pi-file\"></i>\r\n                  </div>\r\n                  <span class=\"pl-3 text-ellipsis max-w-60 whitespace-nowrap overflow-hidden\">\r\n                    {{ getDisplayName(priloga) }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"flex align-items-center\">\r\n                  <div *ngIf=\"!isTempFile(priloga)\">\r\n                    <p-badge value=\"Zaklju\u010Den\" badgeSize=\"small\" severity=\"success\" />\r\n                    <p-button\r\n                      (click)=\"downloadFile(priloga)\"\r\n                      severity=\"primary\"\r\n                      icon=\"pi pi-download\"\r\n                      aria-label=\"Prenesi\"\r\n                      [rounded]=\"true\"\r\n                      [text]=\"true\" />\r\n                  </div>\r\n                  <p-button\r\n                    [disabled]=\"disabled\"\r\n                    (click)=\"isTempFile(priloga) ? removeFileCallback() : delete(priloga)\"\r\n                    severity=\"danger\"\r\n                    icon=\"pi pi-times\"\r\n                    [rounded]=\"true\"\r\n                    [text]=\"true\" />\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #priloga></ng-template>\r\n      <ng-template #empty>\r\n        <div\r\n          *ngIf=\"uploadedFiles.length === 0\"\r\n          class=\"flex align-center justify-around\"\r\n          [style.width]=\"'100%'\">\r\n          <span class=\"pi pi-cloud-upload mr-3\"></span>\r\n          <p>{{ 'components.fileUpload.povlecitveInSpustiteDatotekeZaNalaganje' | translate }}</p>\r\n        </div>\r\n        <div *ngIf=\"acceptFiles\" class=\"flex align-center justify-around\">\r\n          <div class=\"placeholder\"></div>\r\n          <p>{{ ('components.fileUpload.dovoljeneDatoteke' | translate) + acceptFiles }}</p>\r\n        </div>\r\n      </ng-template>\r\n    </p-fileupload>\r\n    <lib-modal\r\n  [(visible)]=\"isCameraVisible\"\r\n  [draggable]=\"true\"\r\n  [btnColor]=\"ButtonColor.success\"\r\n  [closable]=\"true\"\r\n  leftBtnLabel=\"{{ 'common.buttonCancel' | translate }}\"\r\n  btnLabel=\"{{ 'common.buttonConfirm' | translate }}\"\r\n  [hasLeftButton]=\"true\"\r\n  (leftButtonClickEvent)=\"closeCamera()\"\r\n  (buttonClickEvent)=\"closeCamera()\"\r\n  (visibleChange)=\"closeCamera()\"\r\n  header=\"Kamera\"\r\n  [modal]=\"true\"\r\n  [dynamicContentTemplate]=\"dynamicContentListePreverjanjaCamera\">\r\n\r\n  <ng-template #dynamicContentListePreverjanjaCamera>\r\n    <app-kamera (photoCaptured)=\"onPhotoCaptured($event)\"></app-kamera>\r\n  </ng-template>\r\n</lib-modal>\r\n\r\n\r\n\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i4.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "size", "severity", "value", "badgeDisabled"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i5$1.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i6.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: OverlayBadgeModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MenubarModule }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: ModalComponent, selector: "lib-modal", inputs: ["header", "headerColor", "width", "height", "dynamicContentTemplate", "resizable", "draggable", "visible", "closable", "modal", "body", "position", "mode", "btnLabel", "btnColor", "btnIcon", "hasIcon", "disabled", "hasLeftButton", "appendTo", "leftBtnLabel", "leftBtnColor", "leftBtnIcon", "leftHasIcon", "leftDisabled", "isFooterVisible", "dismissableMask"], outputs: ["buttonClickEvent", "visibleChange", "leftButtonClickEvent", "scrollEvent", "modalClosed"] }, { kind: "component", type: KameraComponent, selector: "app-kamera", outputs: ["photoCaptured"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FileUploadComponent, decorators: [{
             type: Component,
@@ -2734,7 +2963,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         TranslateModule,
                         MenubarModule,
                         ChipModule,
-                    ], template: "    <p-fileupload\r\n      class=\"pt-3\"\r\n      name=\"priloge[]\"\r\n      invalidFileSizeMessageSummary=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageSummary' | translate\r\n      }}\"\r\n      invalidFileSizeMessageDetail=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageDetail' | translate\r\n      }}\"\r\n      invalidFileTypeMessageDetail=\"{{'components.fileUpload.invalidFileTypeMessageDetail' | translate}}\"\r\n      invalidFileTypeMessageSummary=\"{{ 'components.fileUpload.invalidFileTypeMessageSummary' | translate}}\"\r\n      [multiple]=\"multiple\"\r\n      (onRemove)=\"remove($event)\"\r\n      [accept]=\"acceptFiles\"\r\n      [maxFileSize]=\"maxFileSize\"\r\n      (onSelect)=\"onSelectedFiles($event)\">\r\n      <ng-template\r\n        #header\r\n        let-priloge\r\n        let-chooseCallback=\"chooseCallback\"\r\n        let-clearCallback=\"clearCallback\">\r\n        <div class=\"flex gap-2\">\r\n          <lib-button\r\n            [disabled]=\"disabled\"\r\n            (click)=\"choose($event, chooseCallback)\"\r\n            label=\"{{ 'components.fileUpload.izberi' | translate }}\"\r\n            [hasIcon]=\"true\"\r\n            [icon]=\"'pi pi-file'\"\r\n            [color]=\"ButtonColor.primary\" />\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #content let-priloge let-removeFileCallback=\"removeFileCallback\">\r\n        <div class=\"flex flex-col gap-8 pt-4\">\r\n          <div class=\"w-full\" *ngIf=\"uploadedFiles.length > 0\">\r\n            <div class=\"flex flex-column gap-4\">\r\n              <div\r\n                *ngFor=\"let priloga of uploadedFiles; let i = index\"\r\n                class=\"flex flex-col justify-content-between items-center gap-2 px-3\">\r\n                <div class=\"flex flex-col\">\r\n                  <div>\r\n                    <i class=\"pi pi-file\"></i>\r\n                  </div>\r\n                  <span class=\"pl-3 text-ellipsis max-w-60 whitespace-nowrap overflow-hidden\">\r\n                    {{ getDisplayName(priloga) }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"flex align-items-center\">\r\n                  <div *ngIf=\"!isTempFile(priloga)\">\r\n                    <p-badge value=\"Zaklju\u010Den\" badgeSize=\"small\" severity=\"success\" />\r\n                    <p-button\r\n                      (click)=\"downloadFile(priloga)\"\r\n                      severity=\"primary\"\r\n                      icon=\"pi pi-download\"\r\n                      aria-label=\"Prenesi\"\r\n                      [rounded]=\"true\"\r\n                      [text]=\"true\" />\r\n                  </div>\r\n                  <p-button\r\n                    [disabled]=\"disabled\"\r\n                    (click)=\"isTempFile(priloga) ? removeFileCallback() : delete(priloga)\"\r\n                    severity=\"danger\"\r\n                    icon=\"pi pi-times\"\r\n                    [rounded]=\"true\"\r\n                    [text]=\"true\" />\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #priloga></ng-template>\r\n      <ng-template #empty>\r\n        <div\r\n          *ngIf=\"uploadedFiles.length === 0\"\r\n          class=\"flex align-center justify-around\"\r\n          [style.width]=\"'100%'\">\r\n          <span class=\"pi pi-cloud-upload mr-3\"></span>\r\n          <p>{{ 'components.fileUpload.povlecitveInSpustiteDatotekeZaNalaganje' | translate }}</p>\r\n        </div>\r\n        <div *ngIf=\"acceptFiles\" class=\"flex align-center justify-around\">\r\n          <div class=\"placeholder\"></div>\r\n          <p>{{ ('components.fileUpload.dovoljeneDatoteke' | translate) + acceptFiles }}</p>\r\n        </div>\r\n      </ng-template>\r\n    </p-fileupload>\r\n\r\n\r\n" }]
+                        ModalComponent,
+                        KameraComponent
+                    ], template: "    <p-fileupload\r\n      class=\"pt-3\"\r\n      name=\"priloge[]\"\r\n      invalidFileSizeMessageSummary=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageSummary' | translate\r\n      }}\"\r\n      invalidFileSizeMessageDetail=\"{{\r\n        'components.fileUpload.invalidFileSizeMessageDetail' | translate\r\n      }}\"\r\n      invalidFileTypeMessageDetail=\"{{'components.fileUpload.invalidFileTypeMessageDetail' | translate}}\"\r\n      invalidFileTypeMessageSummary=\"{{ 'components.fileUpload.invalidFileTypeMessageSummary' | translate}}\"\r\n      [multiple]=\"multiple\"\r\n      (onRemove)=\"remove($event)\"\r\n      [accept]=\"acceptFiles\"\r\n      [maxFileSize]=\"maxFileSize\"\r\n      (onSelect)=\"onSelectedFiles($event)\">\r\n      <ng-template\r\n        #header\r\n        let-priloge\r\n        let-chooseCallback=\"chooseCallback\"\r\n        let-clearCallback=\"clearCallback\">\r\n        <div class=\"flex gap-2\">\r\n          <lib-button\r\n            [disabled]=\"disabled\"\r\n            (click)=\"choose($event, chooseCallback)\"\r\n            label=\"{{ 'components.fileUpload.izberi' | translate }}\"\r\n            [hasIcon]=\"true\"\r\n            [icon]=\"'pi pi-file'\"\r\n            [color]=\"ButtonColor.primary\" />\r\n            <lib-button\r\n      [disabled]=\"disabled\"\r\n      (click)=\"openCamera()\"\r\n      label=\"{{ 'components.fileUpload.kamera' | translate }}\"\r\n      [hasIcon]=\"true\"\r\n      [icon]=\"'pi pi-camera'\"\r\n      [color]=\"ButtonColor.primary\" />\r\n      <lib-button\r\n      [disabled]=\"!hasPreviewImage\"\r\n      (click)=\"openLastImagePreview()\"\r\n      [hasIcon]=\"true\"\r\n      [icon]=\"'pi pi-eye'\"\r\n      [color]=\"ButtonColor.secondary\"\r\n      [label]=\"' '\">\r\n    </lib-button>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #content let-priloge let-removeFileCallback=\"removeFileCallback\">\r\n        <div class=\"flex flex-col gap-8 pt-4\">\r\n          <div class=\"w-full\" *ngIf=\"uploadedFiles.length > 0\">\r\n            <div class=\"flex flex-column gap-4\">\r\n              <div\r\n                *ngFor=\"let priloga of uploadedFiles; let i = index\"\r\n                class=\"flex flex-col justify-content-between items-center gap-2 px-3\">\r\n                <div class=\"flex flex-col\">\r\n                  <div>\r\n                    <i class=\"pi pi-file\"></i>\r\n                  </div>\r\n                  <span class=\"pl-3 text-ellipsis max-w-60 whitespace-nowrap overflow-hidden\">\r\n                    {{ getDisplayName(priloga) }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"flex align-items-center\">\r\n                  <div *ngIf=\"!isTempFile(priloga)\">\r\n                    <p-badge value=\"Zaklju\u010Den\" badgeSize=\"small\" severity=\"success\" />\r\n                    <p-button\r\n                      (click)=\"downloadFile(priloga)\"\r\n                      severity=\"primary\"\r\n                      icon=\"pi pi-download\"\r\n                      aria-label=\"Prenesi\"\r\n                      [rounded]=\"true\"\r\n                      [text]=\"true\" />\r\n                  </div>\r\n                  <p-button\r\n                    [disabled]=\"disabled\"\r\n                    (click)=\"isTempFile(priloga) ? removeFileCallback() : delete(priloga)\"\r\n                    severity=\"danger\"\r\n                    icon=\"pi pi-times\"\r\n                    [rounded]=\"true\"\r\n                    [text]=\"true\" />\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template #priloga></ng-template>\r\n      <ng-template #empty>\r\n        <div\r\n          *ngIf=\"uploadedFiles.length === 0\"\r\n          class=\"flex align-center justify-around\"\r\n          [style.width]=\"'100%'\">\r\n          <span class=\"pi pi-cloud-upload mr-3\"></span>\r\n          <p>{{ 'components.fileUpload.povlecitveInSpustiteDatotekeZaNalaganje' | translate }}</p>\r\n        </div>\r\n        <div *ngIf=\"acceptFiles\" class=\"flex align-center justify-around\">\r\n          <div class=\"placeholder\"></div>\r\n          <p>{{ ('components.fileUpload.dovoljeneDatoteke' | translate) + acceptFiles }}</p>\r\n        </div>\r\n      </ng-template>\r\n    </p-fileupload>\r\n    <lib-modal\r\n  [(visible)]=\"isCameraVisible\"\r\n  [draggable]=\"true\"\r\n  [btnColor]=\"ButtonColor.success\"\r\n  [closable]=\"true\"\r\n  leftBtnLabel=\"{{ 'common.buttonCancel' | translate }}\"\r\n  btnLabel=\"{{ 'common.buttonConfirm' | translate }}\"\r\n  [hasLeftButton]=\"true\"\r\n  (leftButtonClickEvent)=\"closeCamera()\"\r\n  (buttonClickEvent)=\"closeCamera()\"\r\n  (visibleChange)=\"closeCamera()\"\r\n  header=\"Kamera\"\r\n  [modal]=\"true\"\r\n  [dynamicContentTemplate]=\"dynamicContentListePreverjanjaCamera\">\r\n\r\n  <ng-template #dynamicContentListePreverjanjaCamera>\r\n    <app-kamera (photoCaptured)=\"onPhotoCaptured($event)\"></app-kamera>\r\n  </ng-template>\r\n</lib-modal>\r\n\r\n\r\n\r\n" }]
         }], ctorParameters: () => [{ type: i1$8.PrimeNG }, { type: SharedMessageService }, { type: i1$2.TranslateService }], propDecorators: { postavkaPregledaId: [{
                 type: Input
             }], uploadedFiles: [{
@@ -3021,148 +3252,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                 args: ['document:click', ['$event']]
             }] } });
 
-class ModalComponent {
-    header = 'Header title';
-    headerColor = DialogColor.primary;
-    width = '50vw';
-    height = '';
-    dynamicContentTemplate;
-    resizable = false;
-    draggable = true;
-    visible;
-    closable = true;
-    modal = false;
-    body = 'Body content';
-    position = 'top';
-    mode = 'create';
-    btnLabel = 'Sem prebral/-a';
-    btnColor = ButtonColor.success;
-    btnIcon = 'pi pi-check';
-    hasIcon = true;
-    disabled = false;
-    hasLeftButton = false;
-    appendTo;
-    leftBtnLabel = 'Zapri';
-    leftBtnColor = ButtonColor.danger;
-    leftBtnIcon = 'pi pi-times';
-    leftHasIcon = true;
-    leftDisabled = false;
-    buttonClickEvent = new EventEmitter();
-    visibleChange = new EventEmitter();
-    leftButtonClickEvent = new EventEmitter();
-    scrollEvent = new EventEmitter();
-    modalClosed = new EventEmitter();
-    isFooterVisible = true;
-    dismissableMask = false;
-    headerClassMap = {
-        primary: 'primary',
-        secondary: 'secondary',
-        info: 'info',
-        warning: 'warning',
-        danger: 'danger',
-    };
-    /**
-     * Event emitted on clicking added button on bottom of modal
-     * @param event mouse click event
-     */
-    buttonCloseModal(event) {
-        event.stopPropagation();
-        this.buttonClickEvent.emit(event);
-    }
-    /**
-     * Event emitted on clicking added button on bottom of modal
-     * @param event mouse click event
-     */
-    leftButtonClick(event) {
-        event.stopPropagation();
-        this.leftButtonClickEvent.emit(event);
-    }
-    changeVisibility(newVisibility) {
-        this.visible = newVisibility;
-        this.visibleChange.emit(this.visible);
-    }
-    handleHide() {
-        this.changeVisibility(false);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ModalComponent, isStandalone: true, selector: "lib-modal", inputs: { header: "header", headerColor: "headerColor", width: "width", height: "height", dynamicContentTemplate: "dynamicContentTemplate", resizable: "resizable", draggable: "draggable", visible: "visible", closable: "closable", modal: "modal", body: "body", position: "position", mode: "mode", btnLabel: "btnLabel", btnColor: "btnColor", btnIcon: "btnIcon", hasIcon: "hasIcon", disabled: "disabled", hasLeftButton: "hasLeftButton", appendTo: "appendTo", leftBtnLabel: "leftBtnLabel", leftBtnColor: "leftBtnColor", leftBtnIcon: "leftBtnIcon", leftHasIcon: "leftHasIcon", leftDisabled: "leftDisabled", isFooterVisible: "isFooterVisible", dismissableMask: "dismissableMask" }, outputs: { buttonClickEvent: "buttonClickEvent", visibleChange: "visibleChange", leftButtonClickEvent: "leftButtonClickEvent", scrollEvent: "scrollEvent", modalClosed: "modalClosed" }, ngImport: i0, template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n          [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n          [dismissableMask]=\"dismissableMask\"\r\n          [appendTo]=\"appendTo\"\r\n          [ngClass]=\"headerClassMap[headerColor]\" [closable]=\"closable\"\r\n          [footerTemplate]=\"isFooterVisible ? footer  : undefined\"\r\n          (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n  <ng-template pTemplate=\"content\">\r\n    <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n  </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n  <div class=\"w-full flex\"\r\n       [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n    <lib-button\r\n      *ngIf=\"hasLeftButton\"\r\n      [disabled]=\"leftDisabled\"\r\n      (click)=\"leftButtonClick($event)\"\r\n      [label]=\"leftBtnLabel\"\r\n      [color]=\"leftBtnColor\"\r\n      [icon]=\"leftBtnIcon\"\r\n      [hasIcon]=\"leftHasIcon\"\r\n    ></lib-button>\r\n    <lib-button\r\n      [disabled]=\"disabled\"\r\n      (click)=\"buttonCloseModal($event)\"\r\n      [label]=\"btnLabel\"\r\n      [color]=\"btnColor\"\r\n      [icon]=\"btnIcon\"\r\n      [hasIcon]=\"hasIcon\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"], dependencies: [{ kind: "component", type: Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-modal', imports: [
-                        Dialog,
-                        NgClass,
-                        PrimeTemplate,
-                        NgTemplateOutlet,
-                        NgIf,
-                        ButtonComponent,
-                    ], template: "<p-dialog [header]='header' [position]='position' [(visible)]='visible' [modal]='modal' [draggable]='draggable'\r\n          [resizable]='resizable' [style]=\"{width: width, height: height, zindex: 10000}\"\r\n          [dismissableMask]=\"dismissableMask\"\r\n          [appendTo]=\"appendTo\"\r\n          [ngClass]=\"headerClassMap[headerColor]\" [closable]=\"closable\"\r\n          [footerTemplate]=\"isFooterVisible ? footer  : undefined\"\r\n          (onHide)=\"handleHide()\" closeTabindex=\"0\">\r\n  <ng-template pTemplate=\"content\">\r\n    <ng-container [ngTemplateOutlet]=\"dynamicContentTemplate\"></ng-container>\r\n  </ng-template>\r\n</p-dialog>\r\n\r\n<ng-template #footer>\r\n  <div class=\"w-full flex\"\r\n       [ngClass]=\"{'justify-content-end': !hasLeftButton, 'justify-content-between': hasLeftButton}\">\r\n    <lib-button\r\n      *ngIf=\"hasLeftButton\"\r\n      [disabled]=\"leftDisabled\"\r\n      (click)=\"leftButtonClick($event)\"\r\n      [label]=\"leftBtnLabel\"\r\n      [color]=\"leftBtnColor\"\r\n      [icon]=\"leftBtnIcon\"\r\n      [hasIcon]=\"leftHasIcon\"\r\n    ></lib-button>\r\n    <lib-button\r\n      [disabled]=\"disabled\"\r\n      (click)=\"buttonCloseModal($event)\"\r\n      [label]=\"btnLabel\"\r\n      [color]=\"btnColor\"\r\n      [icon]=\"btnIcon\"\r\n      [hasIcon]=\"hasIcon\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n", styles: [":host ::ng-deep .info .p-dialog .p-dialog-header{background:#529bda!important;color:#fff!important}:host ::ng-deep .info .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}:host ::ng-deep .secondary .p-dialog .p-dialog-header{background:#facd9c!important}:host ::ng-deep .warning .p-dialog .p-dialog-header{background:#fdca40!important}:host ::ng-deep .danger .p-dialog .p-dialog-header{background:#b2414d!important;color:#fff!important}:host ::ng-deep .danger .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog{width:90vw!important;height:90vh!important}}:host ::ng-deep .primary .p-dialog .p-dialog-header{background:#3e7c94!important;color:#fff!important}:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}@media screen and (max-width:768px){:host ::ng-deep .primary .p-dialog .p-dialog-content{padding:1rem}:host ::ng-deep .primary .p-dialog .p-dialog-content p{font-size:15px}}:host ::ng-deep .p-dialog .p-dialog-footer button{margin:0!important}\n"] }]
-        }], propDecorators: { header: [{
-                type: Input
-            }], headerColor: [{
-                type: Input
-            }], width: [{
-                type: Input
-            }], height: [{
-                type: Input
-            }], dynamicContentTemplate: [{
-                type: Input
-            }], resizable: [{
-                type: Input
-            }], draggable: [{
-                type: Input
-            }], visible: [{
-                type: Input
-            }], closable: [{
-                type: Input
-            }], modal: [{
-                type: Input
-            }], body: [{
-                type: Input
-            }], position: [{
-                type: Input
-            }], mode: [{
-                type: Input
-            }], btnLabel: [{
-                type: Input
-            }], btnColor: [{
-                type: Input
-            }], btnIcon: [{
-                type: Input
-            }], hasIcon: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], hasLeftButton: [{
-                type: Input
-            }], appendTo: [{
-                type: Input
-            }], leftBtnLabel: [{
-                type: Input
-            }], leftBtnColor: [{
-                type: Input
-            }], leftBtnIcon: [{
-                type: Input
-            }], leftHasIcon: [{
-                type: Input
-            }], leftDisabled: [{
-                type: Input
-            }], buttonClickEvent: [{
-                type: Output
-            }], visibleChange: [{
-                type: Output
-            }], leftButtonClickEvent: [{
-                type: Output
-            }], scrollEvent: [{
-                type: Output
-            }], modalClosed: [{
-                type: Output
-            }], isFooterVisible: [{
-                type: Input
-            }], dismissableMask: [{
-                type: Input
-            }] } });
-
 class NoDataFoundComponent {
     translateService;
     message = '';