npm - @n-isi-platform/design-system - Versions diffs - 1.0.24 → 1.0.25 - Mend

@n-isi-platform/design-system 1.0.24 → 1.0.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/fesm2022/n-isi-platform-design-system.mjs +39 -21
package/fesm2022/n-isi-platform-design-system.mjs.map +1 -1
package/lib/input/input.component.d.ts +4 -0
package/models/enums/input/input-type.enum.d.ts +2 -0
package/package.json +1 -1

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

@@ -33,13 +33,15 @@ import * as i1$6 from 'primeng/confirmdialog';
 import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import * as i1$7 from 'primeng/table';
 import { TableModule } from 'primeng/table';
-import * as i2 from 'primeng/datepicker';
+import * as i2 from 'primeng/keyfilter';
+import { KeyFilterModule } from 'primeng/keyfilter';
+import * as i2$1 from 'primeng/datepicker';
 import { DatePickerModule } from 'primeng/datepicker';
-import * as i2$1 from 'primeng/textarea';
+import * as i2$2 from 'primeng/textarea';
 import { TextareaModule } from 'primeng/textarea';
 import * as i3$1 from 'primeng/select';
 import { SelectModule } from 'primeng/select';
-import * as i2$2 from 'primeng/toggleswitch';
+import * as i2$3 from 'primeng/toggleswitch';
 import { ToggleSwitchModule } from 'primeng/toggleswitch';
 import { Tag } from 'primeng/tag';
 import { Divider } from 'primeng/divider';
@@ -49,7 +51,7 @@ import * as i4$1 from 'primeng/chip';
 import { ChipModule } from 'primeng/chip';
 import * as i5$1 from 'primeng/fileupload';
 import { FileUploadModule } from 'primeng/fileupload';
-import * as i2$3 from 'primeng/menubar';
+import * as i2$4 from 'primeng/menubar';
 import { MenubarModule } from 'primeng/menubar';
 import { OverlayBadgeModule } from 'primeng/overlaybadge';
 import * as i1$8 from 'primeng/config';
@@ -642,7 +644,7 @@ class AccordionComponent {
     }
     ButtonColor = ButtonColor;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: AccordionComponent, isStandalone: true, selector: "lib-accordion[headerTitle]", inputs: { isHeaderEditable: "isHeaderEditable", isAccordionDeletable: "isAccordionDeletable", isAccordionCloneable: "isAccordionCloneable", headerTitle: "headerTitle", selected: "selected", icon: "icon", headerTitlePlaceholder: "headerTitlePlaceholder", headerTitleEditable: "headerTitleEditable", group: "group", controlName: "controlName", name: "name", canDisable: "canDisable", toggleLabel: "toggleLabel", toggleControlName: "toggleControlName" }, outputs: { clickEvent: "clickEvent", clickToggleEvent: "clickToggleEvent", clickCloneEvent: "clickCloneEvent" }, ngImport: i0, template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n  <p-accordion-panel [value]=\"1\">\r\n    <p-accordion-header>\r\n        <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n          <ng-container>\r\n            <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n            </div>\r\n            <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n                    (keydown.space)=\"$event.stopPropagation()\"/>\r\n            </div>\r\n            <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n              *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n            <div class=\"controls-lg-screen\">\r\n              <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </div>\r\n    </p-accordion-header>\r\n      <p-accordion-content>\r\n        <ng-content></ng-content>\r\n      </p-accordion-content>\r\n  </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n  <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n  <div class=\"controls\">\r\n    <div class=\"flex align-items-center\">\r\n      <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n        <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n        <p-selectButton\r\n          (click)=\"clickToggleButton($event)\"\r\n          [options]=\"stateOptions\"\r\n          [formControlName]=\"toggleControlName\"\r\n          optionLabel=\"label\"\r\n          optionValue=\"value\"\r\n        ></p-selectButton>\r\n      </form>\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"ml-5 clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n    </div>\r\n\r\n    <lib-button\r\n      *ngIf=\"isAccordionDeletable\"\r\n      class=\"ml-5 delete-button\"\r\n      label=\"Izbri\u0161i okence\"\r\n      [hasIcon]=\"true\"\r\n      icon=\"pi pi-trash\"\r\n      (clickEvent)=\"click($event)\"\r\n      [color]=\"ButtonColor.danger\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n  <div class=\"flex-column p-1\">\r\n    <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n      <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n      <p-selectButton\r\n        (click)=\"clickToggleButton($event)\"\r\n        [options]=\"stateOptions\"\r\n        [formControlName]=\"toggleControlName\"\r\n        optionLabel=\"label\"\r\n        optionValue=\"value\"\r\n      ></p-selectButton>\r\n    </form>\r\n\r\n    <div class=\"flex align-items-center mt-2\">\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n\r\n      <lib-button\r\n        *ngIf=\"isAccordionDeletable\"\r\n        class=\"ml-2 delete-button\"\r\n        label=\"Izbri\u0161i okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-trash\"\r\n        (clickEvent)=\"click($event)\"\r\n        [color]=\"ButtonColor.danger\"\r\n      ></lib-button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width: 1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width: 1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width: 1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width: 1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width: 1260px){.controls-lg-screen{display:none}}\n"], dependencies: [{ kind: "component", type: Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i1$3.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i1$3.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i1$3.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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: "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: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "size", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { 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"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: AccordionComponent, isStandalone: true, selector: "lib-accordion[headerTitle]", inputs: { isHeaderEditable: "isHeaderEditable", isAccordionDeletable: "isAccordionDeletable", isAccordionCloneable: "isAccordionCloneable", headerTitle: "headerTitle", selected: "selected", icon: "icon", headerTitlePlaceholder: "headerTitlePlaceholder", headerTitleEditable: "headerTitleEditable", group: "group", controlName: "controlName", name: "name", canDisable: "canDisable", toggleLabel: "toggleLabel", toggleControlName: "toggleControlName" }, outputs: { clickEvent: "clickEvent", clickToggleEvent: "clickToggleEvent", clickCloneEvent: "clickCloneEvent" }, ngImport: i0, template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n  <p-accordion-panel [value]=\"1\">\r\n    <p-accordion-header>\r\n        <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n          <ng-container>\r\n            <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n            </div>\r\n            <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n                    (keydown.space)=\"$event.stopPropagation()\"/>\r\n            </div>\r\n            <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n              *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n            <div class=\"controls-lg-screen\">\r\n              <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </div>\r\n    </p-accordion-header>\r\n      <p-accordion-content>\r\n        <ng-content></ng-content>\r\n      </p-accordion-content>\r\n  </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n  <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n  <div class=\"controls\">\r\n    <div class=\"flex align-items-center\">\r\n      <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n        <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n        <p-selectButton\r\n          (click)=\"clickToggleButton($event)\"\r\n          [options]=\"stateOptions\"\r\n          [formControlName]=\"toggleControlName\"\r\n          optionLabel=\"label\"\r\n          optionValue=\"value\"\r\n        ></p-selectButton>\r\n      </form>\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"ml-5 clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n    </div>\r\n\r\n    <lib-button\r\n      *ngIf=\"isAccordionDeletable\"\r\n      class=\"ml-5 delete-button\"\r\n      label=\"Izbri\u0161i okence\"\r\n      [hasIcon]=\"true\"\r\n      icon=\"pi pi-trash\"\r\n      (clickEvent)=\"click($event)\"\r\n      [color]=\"ButtonColor.danger\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n  <div class=\"flex-column p-1\">\r\n    <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n      <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n      <p-selectButton\r\n        (click)=\"clickToggleButton($event)\"\r\n        [options]=\"stateOptions\"\r\n        [formControlName]=\"toggleControlName\"\r\n        optionLabel=\"label\"\r\n        optionValue=\"value\"\r\n      ></p-selectButton>\r\n    </form>\r\n\r\n    <div class=\"flex align-items-center mt-2\">\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n\r\n      <lib-button\r\n        *ngIf=\"isAccordionDeletable\"\r\n        class=\"ml-2 delete-button\"\r\n        label=\"Izbri\u0161i okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-trash\"\r\n        (clickEvent)=\"click($event)\"\r\n        [color]=\"ButtonColor.danger\"\r\n      ></lib-button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width:1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width:1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width:1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width:1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width:1260px){.controls-lg-screen{display:none}}\n"], dependencies: [{ kind: "component", type: Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i1$3.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i1$3.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i1$3.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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: "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: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "size", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { 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: AccordionComponent, decorators: [{
             type: Component,
@@ -658,7 +660,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         PopoverModule,
                         SelectButton,
                         ButtonComponent,
-                    ], template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n  <p-accordion-panel [value]=\"1\">\r\n    <p-accordion-header>\r\n        <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n          <ng-container>\r\n            <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n            </div>\r\n            <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n                    (keydown.space)=\"$event.stopPropagation()\"/>\r\n            </div>\r\n            <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n              *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n            <div class=\"controls-lg-screen\">\r\n              <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </div>\r\n    </p-accordion-header>\r\n      <p-accordion-content>\r\n        <ng-content></ng-content>\r\n      </p-accordion-content>\r\n  </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n  <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n  <div class=\"controls\">\r\n    <div class=\"flex align-items-center\">\r\n      <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n        <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n        <p-selectButton\r\n          (click)=\"clickToggleButton($event)\"\r\n          [options]=\"stateOptions\"\r\n          [formControlName]=\"toggleControlName\"\r\n          optionLabel=\"label\"\r\n          optionValue=\"value\"\r\n        ></p-selectButton>\r\n      </form>\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"ml-5 clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n    </div>\r\n\r\n    <lib-button\r\n      *ngIf=\"isAccordionDeletable\"\r\n      class=\"ml-5 delete-button\"\r\n      label=\"Izbri\u0161i okence\"\r\n      [hasIcon]=\"true\"\r\n      icon=\"pi pi-trash\"\r\n      (clickEvent)=\"click($event)\"\r\n      [color]=\"ButtonColor.danger\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n  <div class=\"flex-column p-1\">\r\n    <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n      <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n      <p-selectButton\r\n        (click)=\"clickToggleButton($event)\"\r\n        [options]=\"stateOptions\"\r\n        [formControlName]=\"toggleControlName\"\r\n        optionLabel=\"label\"\r\n        optionValue=\"value\"\r\n      ></p-selectButton>\r\n    </form>\r\n\r\n    <div class=\"flex align-items-center mt-2\">\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n\r\n      <lib-button\r\n        *ngIf=\"isAccordionDeletable\"\r\n        class=\"ml-2 delete-button\"\r\n        label=\"Izbri\u0161i okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-trash\"\r\n        (clickEvent)=\"click($event)\"\r\n        [color]=\"ButtonColor.danger\"\r\n      ></lib-button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width: 1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width: 1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width: 1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width: 1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width: 1260px){.controls-lg-screen{display:none}}\n"] }]
+                    ], template: "<p-accordion class=\"w-full\" [value]=\"selected ? 1 : 0\" [id]=\"headerTitle\">\r\n  <p-accordion-panel [value]=\"1\">\r\n    <p-accordion-header>\r\n        <div class=\"flex justify-content-between align-items-center overflow-auto\">\r\n          <ng-container>\r\n            <div class=\"flex align-items-center\" *ngIf=\"!isHeaderEditable\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <span class=\"vertical-align-middle\">{{ headerTitle }}</span>\r\n            </div>\r\n            <div class=\"flex align-items-center\" *ngIf=\"isHeaderEditable\" [formGroup]=\"group\">\r\n              <i [ngClass]=\"icon\"></i>\r\n              <input type=\"text\" pInputText [formControlName]=\"controlName\" (click)=\"$event.stopPropagation()\"\r\n                    (keydown.space)=\"$event.stopPropagation()\"/>\r\n            </div>\r\n            <i class=\"pi pi-ellipsis-v controls-mobile\" (click)=\"controlsMenu.toggle($event)\"\r\n              *ngIf=\"canDisable || isAccordionDeletable\"></i>\r\n            <div class=\"controls-lg-screen\">\r\n              <ng-container *ngIf=\"canDisable || isAccordionDeletable\" [ngTemplateOutlet]=\"controls\"></ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </div>\r\n    </p-accordion-header>\r\n      <p-accordion-content>\r\n        <ng-content></ng-content>\r\n      </p-accordion-content>\r\n  </p-accordion-panel>\r\n</p-accordion>\r\n\r\n<p-popover #controlsMenu>\r\n  <ng-container [ngTemplateOutlet]=\"smallerDevicesControls\"></ng-container>\r\n</p-popover>\r\n\r\n<ng-template #controls>\r\n  <div class=\"controls\">\r\n    <div class=\"flex align-items-center\">\r\n      <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n        <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n        <p-selectButton\r\n          (click)=\"clickToggleButton($event)\"\r\n          [options]=\"stateOptions\"\r\n          [formControlName]=\"toggleControlName\"\r\n          optionLabel=\"label\"\r\n          optionValue=\"value\"\r\n        ></p-selectButton>\r\n      </form>\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"ml-5 clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n    </div>\r\n\r\n    <lib-button\r\n      *ngIf=\"isAccordionDeletable\"\r\n      class=\"ml-5 delete-button\"\r\n      label=\"Izbri\u0161i okence\"\r\n      [hasIcon]=\"true\"\r\n      icon=\"pi pi-trash\"\r\n      (clickEvent)=\"click($event)\"\r\n      [color]=\"ButtonColor.danger\"\r\n    ></lib-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #smallerDevicesControls>\r\n  <div class=\"flex-column p-1\">\r\n    <form [formGroup]=\"group\" class=\"flex align-items-center ml-5\" *ngIf=\"canDisable\">\r\n      <label class=\"mr-2\">{{ toggleLabel }}</label>\r\n      <p-selectButton\r\n        (click)=\"clickToggleButton($event)\"\r\n        [options]=\"stateOptions\"\r\n        [formControlName]=\"toggleControlName\"\r\n        optionLabel=\"label\"\r\n        optionValue=\"value\"\r\n      ></p-selectButton>\r\n    </form>\r\n\r\n    <div class=\"flex align-items-center mt-2\">\r\n      <lib-button\r\n        *ngIf=\"isAccordionCloneable\"\r\n        class=\"clone-button\"\r\n        label=\"Kopiraj okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-clone\"\r\n        (clickEvent)=\"clickCloneButton($event)\"\r\n        [color]=\"ButtonColor.warning\"\r\n      ></lib-button>\r\n\r\n      <lib-button\r\n        *ngIf=\"isAccordionDeletable\"\r\n        class=\"ml-2 delete-button\"\r\n        label=\"Izbri\u0161i okence\"\r\n        [hasIcon]=\"true\"\r\n        icon=\"pi pi-trash\"\r\n        (clickEvent)=\"click($event)\"\r\n        [color]=\"ButtonColor.danger\"\r\n      ></lib-button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [":host ::ng-deep .p-accordionpanel:not(.p-disabled).p-accordionpanel-active>.p-accordionheader{color:#fff!important;background-color:#3e7c94}:host ::ng-deep .p-accordion .p-accordionheader{background-color:#3e7c94;color:#fff}:host ::ng-deep .p-accordion .p-accordionheader:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-accordion .p-accordionheader:hover{background:#facd9c!important}:host ::ng-deep .p-accordion .p-accordionheader:not(.p-disabled).p-highlight .p-accordionheader-link{color:#fff}:host ::ng-deep .p-accordion .p-accordionheader .p-accordion-toggle-icon{margin-top:-8px;position:absolute;right:.5em;top:50%}:host ::ng-deep .p-accordion .p-accordionheader .delete-button{position:absolute;right:8em;top:50%;transform:translateY(-50%)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-right{transform:rotate(90deg)}:host ::ng-deep .p-accordion .p-accordionheader .pi-chevron-down{transform:rotate(180deg)}:host ::ng-deep .p-accordion .p-accordioncontent-content{margin-top:8px}@media screen and (max-width:1260px){:host ::ng-deep .p-inputtext,:host ::ng-deep label{font-size:12px}:host ::ng-deep .delete-button .p-button,:host ::ng-deep .clone-button .p-button{font-size:12px}:host ::ng-deep .delete-button .p-button .p-button-label,:host ::ng-deep .clone-button .p-button .p-button-label{display:none}:host ::ng-deep .delete-button .p-button .p-button-icon,:host ::ng-deep .clone-button .p-button .p-button-icon{margin-left:0}}:host ::ng-deep .p-selectbutton .p-button{background:#fff;color:#3e7c94}@media screen and (max-width:1260px){:host ::ng-deep .p-selectbutton .p-button{font-size:12px}}:host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#ffa142;color:#fff}.controls{display:flex;align-items:center;justify-content:space-between}@media screen and (max-width:1260px){.controls{flex-direction:column;justify-content:start;align-items:start}.controls form,.controls .delete-button{margin:0!important;padding:5px 15px!important}.controls form{border-bottom:1px solid #3E7C94}}.controls-mobile{display:none}@media screen and (max-width:1260px){.controls-mobile{margin-left:15px;display:block}}.controls-lg-screen{display:block}@media screen and (max-width:1260px){.controls-lg-screen{display:none}}\n"] }]
         }], propDecorators: { isHeaderEditable: [{
                 type: Input
             }], isAccordionDeletable: [{
@@ -791,11 +793,11 @@ class ErrorComponent {
     hasGroupError = false;
     errorId;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ErrorComponent, isStandalone: true, selector: "lib-error", inputs: { hasError: "hasError", isTouched: "isTouched", isSubmitTriggered: "isSubmitTriggered", isNestedFormSubmit: "isNestedFormSubmit", isDirty: "isDirty", isRequired: "isRequired", hasGroupError: "hasGroupError", errorId: "errorId" }, ngImport: i0, template: "<small class=\"required\" aria-live=\"polite\" [id]=\"errorId\">\r\n  <ng-container *ngIf=\"hasError\">\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && hasError.required\">\r\n      {{ 'errors.isRequired' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotBlank\">\r\n      {{ 'errors.isNotBlank' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.isNotBlank && hasError.isCoordinate\">\r\n      {{ 'errors.isCoordinate' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotDecimal)\">\r\n      {{ 'errors.decimal' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.min)\">\r\n      {{ 'errors.minNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.min && hasError.max)\">\r\n      {{ 'errors.maxNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.email)\">\r\n      {{ 'errors.email' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.isNotValidPhoneNumber)\">\r\n      {{ 'errors.phoneNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isMultipleOfFive)\">\r\n      {{ 'errors.isMultipleOfFive' | translate }}\r\n    </ng-container>\r\n  </ng-container>\r\n</small>\r\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ErrorComponent, isStandalone: true, selector: "lib-error", inputs: { hasError: "hasError", isTouched: "isTouched", isSubmitTriggered: "isSubmitTriggered", isNestedFormSubmit: "isNestedFormSubmit", isDirty: "isDirty", isRequired: "isRequired", hasGroupError: "hasGroupError", errorId: "errorId" }, ngImport: i0, template: "<small class=\"required\" aria-live=\"polite\" [id]=\"errorId\">\r\n  <ng-container *ngIf=\"hasError\">\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && hasError.required\">\r\n      {{ 'errors.isRequired' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotBlank\">\r\n      {{ 'errors.isNotBlank' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.isNotBlank && hasError.isCoordinate\">\r\n      {{ 'errors.isCoordinate' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotDecimal)\">\r\n      {{ 'errors.decimal' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.min)\">\r\n      {{ 'errors.minNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.min && hasError.max)\">\r\n      {{ 'errors.maxNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.email)\">\r\n      {{ 'errors.email' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.isNotValidPhoneNumber)\">\r\n      {{ 'errors.phoneNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.pattern)\">\r\n      {{ 'errors.invalidInput' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isMultipleOfFive)\">\r\n      {{ 'errors.isMultipleOfFive' | translate }}\r\n    </ng-container>\r\n  </ng-container>\r\n</small>\r\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ErrorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-error', imports: [NgIf, TranslateModule], template: "<small class=\"required\" aria-live=\"polite\" [id]=\"errorId\">\r\n  <ng-container *ngIf=\"hasError\">\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && hasError.required\">\r\n      {{ 'errors.isRequired' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotBlank\">\r\n      {{ 'errors.isNotBlank' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.isNotBlank && hasError.isCoordinate\">\r\n      {{ 'errors.isCoordinate' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotDecimal)\">\r\n      {{ 'errors.decimal' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.min)\">\r\n      {{ 'errors.minNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.min && hasError.max)\">\r\n      {{ 'errors.maxNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.email)\">\r\n      {{ 'errors.email' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.isNotValidPhoneNumber)\">\r\n      {{ 'errors.phoneNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isMultipleOfFive)\">\r\n      {{ 'errors.isMultipleOfFive' | translate }}\r\n    </ng-container>\r\n  </ng-container>\r\n</small>\r\n" }]
+            args: [{ selector: 'lib-error', imports: [NgIf, TranslateModule], template: "<small class=\"required\" aria-live=\"polite\" [id]=\"errorId\">\r\n  <ng-container *ngIf=\"hasError\">\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && hasError.required\">\r\n      {{ 'errors.isRequired' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotBlank\">\r\n      {{ 'errors.isNotBlank' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"(isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.isNotBlank && hasError.isCoordinate\">\r\n      {{ 'errors.isCoordinate' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isNotDecimal)\">\r\n      {{ 'errors.decimal' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.min)\">\r\n      {{ 'errors.minNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasError.min && hasError.max)\">\r\n      {{ 'errors.maxNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.email)\">\r\n      {{ 'errors.email' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.isNotValidPhoneNumber)\">\r\n      {{ 'errors.phoneNumber' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && !hasGroupError && hasError.pattern)\">\r\n      {{ 'errors.invalidInput' | translate }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"((isTouched || isSubmitTriggered || isNestedFormSubmit) && !hasError.required && hasError.isMultipleOfFive)\">\r\n      {{ 'errors.isMultipleOfFive' | translate }}\r\n    </ng-container>\r\n  </ng-container>\r\n</small>\r\n" }]
         }], propDecorators: { hasError: [{
                 type: Input
             }], isTouched: [{
@@ -1140,7 +1142,7 @@ class ConfirmModalComponent {
         this.acceptClickEvent.emit(event);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ConfirmModalComponent, isStandalone: true, selector: "lib-confirm-modal", inputs: { acceptBtnLabel: "acceptBtnLabel", acceptBtnIcon: "acceptBtnIcon", rejectBtnLabel: "rejectBtnLabel", rejectBtnIcon: "rejectBtnIcon", dialogHeaderColor: "dialogHeaderColor" }, outputs: { rejectClickEvent: "rejectClickEvent", acceptClickEvent: "acceptClickEvent" }, ngImport: i0, template: "<p-confirmdialog [ngClass]=\"headerClassMap[dialogHeaderColor]\"\r\n  #cd [style]=\"{width: 'max-content'}\">\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"confirm-button-container\">\r\n      <p-button styleClass=\"p-button-danger\" [icon]=\"rejectBtnIcon\" [label]=\"rejectBtnLabel\" (click)=\"reject($event);\"></p-button>\r\n      <p-button styleClass=\"p-button-primary\"  [icon]=\"acceptBtnIcon\" [label]=\"acceptBtnLabel\" (click)=\"accept($event);\"></p-button>\r\n    </div>\r\n  </ng-template>\r\n</p-confirmdialog>\r\n", styles: [":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}: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}:host ::ng-deep .p-dialog{width:25vw!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog{width:85vw!important}}:host ::ng-deep .p-dialog .p-dialog-header{border:none!important}:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}:host ::ng-deep .p-dialog .p-dialog-footer .confirm-button-container{width:100%;display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i1$6.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: 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"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ConfirmModalComponent, isStandalone: true, selector: "lib-confirm-modal", inputs: { acceptBtnLabel: "acceptBtnLabel", acceptBtnIcon: "acceptBtnIcon", rejectBtnLabel: "rejectBtnLabel", rejectBtnIcon: "rejectBtnIcon", dialogHeaderColor: "dialogHeaderColor" }, outputs: { rejectClickEvent: "rejectClickEvent", acceptClickEvent: "acceptClickEvent" }, ngImport: i0, template: "<p-confirmdialog [ngClass]=\"headerClassMap[dialogHeaderColor]\"\r\n  #cd [style]=\"{width: 'max-content'}\">\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"confirm-button-container\">\r\n      <p-button styleClass=\"p-button-danger\" [icon]=\"rejectBtnIcon\" [label]=\"rejectBtnLabel\" (click)=\"reject($event);\"></p-button>\r\n      <p-button styleClass=\"p-button-primary\"  [icon]=\"acceptBtnIcon\" [label]=\"acceptBtnLabel\" (click)=\"accept($event);\"></p-button>\r\n    </div>\r\n  </ng-template>\r\n</p-confirmdialog>\r\n", styles: [":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}: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}:host ::ng-deep .p-dialog{width:25vw!important}@media screen and (max-width:768px){:host ::ng-deep .p-dialog{width:85vw!important}}:host ::ng-deep .p-dialog .p-dialog-header{border:none!important}:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}:host ::ng-deep .p-dialog .p-dialog-footer .confirm-button-container{width:100%;display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i1$6.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: 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"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ConfirmModalComponent, decorators: [{
             type: Component,
@@ -1149,7 +1151,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         PrimeTemplate,
                         ConfirmDialogModule,
                         Button,
-                    ], template: "<p-confirmdialog [ngClass]=\"headerClassMap[dialogHeaderColor]\"\r\n  #cd [style]=\"{width: 'max-content'}\">\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"confirm-button-container\">\r\n      <p-button styleClass=\"p-button-danger\" [icon]=\"rejectBtnIcon\" [label]=\"rejectBtnLabel\" (click)=\"reject($event);\"></p-button>\r\n      <p-button styleClass=\"p-button-primary\"  [icon]=\"acceptBtnIcon\" [label]=\"acceptBtnLabel\" (click)=\"accept($event);\"></p-button>\r\n    </div>\r\n  </ng-template>\r\n</p-confirmdialog>\r\n", styles: [":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}: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}:host ::ng-deep .p-dialog{width:25vw!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog{width:85vw!important}}:host ::ng-deep .p-dialog .p-dialog-header{border:none!important}:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width: 768px){:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}:host ::ng-deep .p-dialog .p-dialog-footer .confirm-button-container{width:100%;display:flex;justify-content:space-between}\n"] }]
+                    ], template: "<p-confirmdialog [ngClass]=\"headerClassMap[dialogHeaderColor]\"\r\n  #cd [style]=\"{width: 'max-content'}\">\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"confirm-button-container\">\r\n      <p-button styleClass=\"p-button-danger\" [icon]=\"rejectBtnIcon\" [label]=\"rejectBtnLabel\" (click)=\"reject($event);\"></p-button>\r\n      <p-button styleClass=\"p-button-primary\"  [icon]=\"acceptBtnIcon\" [label]=\"acceptBtnLabel\" (click)=\"accept($event);\"></p-button>\r\n    </div>\r\n  </ng-template>\r\n</p-confirmdialog>\r\n", styles: [":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}: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}:host ::ng-deep .p-dialog{width:25vw!important}@media screen and (max-width:768px){:host ::ng-deep .p-dialog{width:85vw!important}}:host ::ng-deep .p-dialog .p-dialog-header{border:none!important}:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{color:#fff!important}@media screen and (max-width:768px){:host ::ng-deep .p-dialog .p-dialog-header .p-dialog-title{font-weight:500;font-size:1rem}}:host ::ng-deep .p-dialog .p-dialog-footer .confirm-button-container{width:100%;display:flex;justify-content:space-between}\n"] }]
         }], propDecorators: { acceptBtnLabel: [{
                 type: Input
             }], acceptBtnIcon: [{
@@ -1169,6 +1171,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
 var InputType;
 (function (InputType) {
     InputType["text"] = "text";
+    InputType["alpha"] = "alpha";
+    InputType["alphaNumeric"] = "alphaNumeric";
     InputType["number"] = "number";
     InputType["email"] = "email";
 })(InputType || (InputType = {}));
@@ -1208,8 +1212,21 @@ class InputComponent {
     hasGap = true;
     hasTitle = false;
     maxLength = null;
+    pKeyFilter;
+    alpha = /^[A-Za-zCcŠšŽžÐdCcÀ-ÿ\s]+$/;
+    numbersOnly = /^[0-9]*$/;
+    alphanumeric = /^[0-9A-Za-zČčŠšŽžĐđĆćÀ-ÿ\s]+$/;
     ngOnInit() {
         this._isTooltipVisible = !!this.tooltipText;
+        if (this.type === InputType.alpha) {
+            this.pKeyFilter = this.alpha;
+        }
+        else if (this.type === InputType.number) {
+            this.pKeyFilter = this.numbersOnly;
+        }
+        else if (this.type === InputType.alphaNumeric) {
+            this.pKeyFilter = this.alphanumeric;
+        }
     }
     onNumberKeyDown(event) {
         const invalidKeys = ['e', 'E', '+', '-', ',', '.'];
@@ -1219,7 +1236,7 @@ class InputComponent {
     }
     TooltipHoverEventEnum = TooltipHoverEventEnum;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: InputComponent, isStandalone: true, selector: "lib-input[group][controlName][name]", inputs: { name: "name", type: "type", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", group: "group", controlName: "controlName", isRequired: "isRequired", isLabelVisible: "isLabelVisible", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", groupError: "groupError", hasGap: "hasGap", hasTitle: "hasTitle", maxLength: "maxLength" }, ngImport: i0, template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n  <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n    <label [title]=\"hasTitle ? 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  <input\r\n    [type]='type'\r\n    [id]=\"name\"\r\n    pInputText\r\n    [placeholder]='placeholder ?? \" \"'\r\n    [formControlName]=\"controlName\"\r\n    [min]=\"type === 'number' && 1\"\r\n    [max]=\"type === 'number' && 10\"\r\n    [maxlength]=\"maxLength\"    \r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [ngClass]=\"{ 'ng-dirty ng-invalid':  (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n    (keydown)=\"type === 'number' ? onNumberKeyDown($event) : null\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  />\r\n</div>\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    [hasGroupError]=\"groupError\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n", styles: [".p-component{border:1.75px solid #3E7C94!important}.p-component::placeholder{font-style:italic!important;color:#848484!important}.p-component:hover{border:1.75px solid #ffa142!important}.p-component:focus{box-shadow:0 0 2px 3px #ffa142!important}label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ 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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { 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: InputComponent, isStandalone: true, selector: "lib-input[group][controlName][name]", inputs: { name: "name", type: "type", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", group: "group", controlName: "controlName", isRequired: "isRequired", isLabelVisible: "isLabelVisible", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", groupError: "groupError", hasGap: "hasGap", hasTitle: "hasTitle", maxLength: "maxLength" }, ngImport: i0, template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n  <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n    <label [title]=\"hasTitle ? 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  <input\r\n    [type]='type'\r\n    [id]=\"name\"\r\n    [pKeyFilter]=\"pKeyFilter\"\r\n    pInputText\r\n    [placeholder]='placeholder ?? \" \"'\r\n    [formControlName]=\"controlName\"\r\n    [min]=\"type === 'number' && 1\"\r\n    [max]=\"type === 'number' && 10\"\r\n    [maxlength]=\"maxLength\"    \r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [ngClass]=\"{ 'ng-dirty ng-invalid':  (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n    (keydown)=\"type === 'number' ? onNumberKeyDown($event) : null\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  />\r\n</div>\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    [hasGroupError]=\"groupError\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n", styles: [".p-component{border:1.75px solid #3E7C94!important}.p-component::placeholder{font-style:italic!important;color:#848484!important}.p-component:hover{border:1.75px solid #ffa142!important}.p-component:focus{box-shadow:0 0 2px 3px #ffa142!important}label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ 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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: KeyFilterModule }, { kind: "directive", type: i2.KeyFilter, selector: "[pKeyFilter]", inputs: ["pValidateOnly", "pKeyFilter"], outputs: ["ngModelChange"] }, { 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: "directive", type: InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { 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: InputComponent, decorators: [{
             type: Component,
@@ -1227,11 +1244,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         FormsModule,
                         ReactiveFormsModule,
                         NgClass,
+                        KeyFilterModule,
                         NgIf,
                         TooltipComponent,
                         InputText,
                         ErrorComponent,
-                    ], template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n  <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n    <label [title]=\"hasTitle ? 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  <input\r\n    [type]='type'\r\n    [id]=\"name\"\r\n    pInputText\r\n    [placeholder]='placeholder ?? \" \"'\r\n    [formControlName]=\"controlName\"\r\n    [min]=\"type === 'number' && 1\"\r\n    [max]=\"type === 'number' && 10\"\r\n    [maxlength]=\"maxLength\"    \r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [ngClass]=\"{ 'ng-dirty ng-invalid':  (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n    (keydown)=\"type === 'number' ? onNumberKeyDown($event) : null\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  />\r\n</div>\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    [hasGroupError]=\"groupError\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n", styles: [".p-component{border:1.75px solid #3E7C94!important}.p-component::placeholder{font-style:italic!important;color:#848484!important}.p-component:hover{border:1.75px solid #ffa142!important}.p-component:focus{box-shadow:0 0 2px 3px #ffa142!important}label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+                    ], template: "<div class=\"flex flex-column\" [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n  <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n    <label [title]=\"hasTitle ? 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  <input\r\n    [type]='type'\r\n    [id]=\"name\"\r\n    [pKeyFilter]=\"pKeyFilter\"\r\n    pInputText\r\n    [placeholder]='placeholder ?? \" \"'\r\n    [formControlName]=\"controlName\"\r\n    [min]=\"type === 'number' && 1\"\r\n    [max]=\"type === 'number' && 10\"\r\n    [maxlength]=\"maxLength\"    \r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [ngClass]=\"{ 'ng-dirty ng-invalid':  (group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError }\"\r\n    (keydown)=\"type === 'number' ? onNumberKeyDown($event) : null\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  />\r\n</div>\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    [hasGroupError]=\"groupError\"\r\n    [errorId]=\"name+'Error'\"\r\n  ></lib-error>\r\n", styles: [".p-component{border:1.75px solid #3E7C94!important}.p-component::placeholder{font-style:italic!important;color:#848484!important}.p-component:hover{border:1.75px solid #ffa142!important}.p-component:focus{box-shadow:0 0 2px 3px #ffa142!important}label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
         }], propDecorators: { name: [{
                 type: Input
             }], type: [{
@@ -1368,7 +1386,7 @@ class DateInputComponent {
     }
     getTomorrowDate = getTomorrowDate;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: DateInputComponent, isStandalone: true, selector: "lib-date-input[group][controlName][name]", inputs: { isLabelVisible: "isLabelVisible", name: "name", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", dateFormat: "dateFormat", group: "group", controlName: "controlName", showIcon: "showIcon", selectionMode: "selectionMode", touchUI: "touchUI", formStatus: "formStatus", showClear: "showClear", isPublicDate: "isPublicDate", minDate: "minDate", maxDate: "maxDate", minDateToday: "minDateToday", maxDateSixMonths: "maxDateSixMonths", maxDateThreeMonths: "maxDateThreeMonths", maxDateRangeOneYear: "maxDateRangeOneYear", setMinAndMax: "setMinAndMax", hasGap: "hasGap", disabledDates: "disabledDates", appendTo: "appendTo", groupError: "groupError", showTime: "showTime", availableDates: "availableDates", disabledDays: "disabledDays", disabledWeekends: "disabledWeekends" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<form class='flex flex-column' [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n  <div class=\"flex\" *ngIf=\"isLabelVisible\">\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\r\n  <p-datepicker\r\n    [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [appendTo]=\"appendTo\"\r\n    *ngIf=\"setMinAndMax\"\r\n    [inputId]=\"name\"\r\n    (onSelect)=\"onSelect.emit($event)\"\r\n    [placeholder]='placeholder'\r\n    [dateFormat]=\"dateFormat\"\r\n    [showIcon]=\"showIcon\"\r\n    [selectionMode]=\"selectionMode\"\r\n    [formControlName]=\"controlName\"\r\n    [touchUI]=\"touchUI\"\r\n    [minDate]=\"minDate || getDateFifteenDaysAgo()\"\r\n    [maxDate]=\"maxDate\"\r\n    [showClear]=\"showClear\"\r\n    (onClear)=\"group.get(controlName)?.reset()\"\r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n    [disabledDays]=\"disabledDays\"\r\n    [disabledDates]=\"disabledDates\"\r\n    [showTime]=\"showTime\"\r\n    hourFormat=\"24\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  >\r\n    <!-- Mare; ideja da barva dolo\u010Dene dneve (npr. takrat ki ni prostih terminov) -->\r\n    <!-- 24.05.2024 Mare; zaenkrat ne potrebujemo ve\u010D, ker so neprosti dnevi kar disabled -->\r\n    <ng-template pTemplate=\"date\" let-date>\r\n      <div>{{date.day}}</div>\r\n    </ng-template>\r\n  </p-datepicker>\r\n\r\n  <p-datepicker\r\n    [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [appendTo]=\"appendTo\"\r\n    *ngIf=\"!setMinAndMax\"\r\n    (onSelect)=\"onSelect.emit($event)\"\r\n    [inputId]=\"name\"\r\n    [placeholder]='placeholder'\r\n    [dateFormat]=\"dateFormat\"\r\n    [showIcon]=\"showIcon\"\r\n    [selectionMode]=\"selectionMode\"\r\n    [formControlName]=\"controlName\"\r\n    [touchUI]=\"touchUI\"\r\n    [showClear]=\"showClear\"\r\n    (onClear)=\"group.get(controlName)?.reset()\"\r\n    [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [disabledDays]=\"disabledDays\"\r\n    [disabledDates]=\"disabledDates\"\r\n    [showTime]=\"showTime\"\r\n    hourFormat=\"24\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  ></p-datepicker>\r\n</form>\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  [hasGroupError]=\"groupError\"\r\n  [errorId]=\"name+'Error'\"\r\n></lib-error>\r\n", styles: [":host ::ng-deep{width:100%}:host ::ng-deep .p-datepicker-dropdown{background-color:#3e7c94;color:#fff;border-color:#3e7c94}:host ::ng-deep .p-datepicker-dropdown:hover{background-color:#1b495a!important;border-color:#1b495a!important;color:#fff!important}:host ::ng-deep .p-datepicker-title>*{color:#fff!important;font-weight:700}:host ::ng-deep .p-datepicker-clear-icon{padding-right:8px;color:#6d7375;cursor:pointer}:host ::ng-deep .p-datepicker{min-width:max-content!important;width:100%;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-datepicker::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-datepicker:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-datepicker:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-datepicker table td>span.p-highlight{color:#000;background:#3e7c94}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus span{outline:none}:host ::ng-deep .p-datepicker-prev-button,:host ::ng-deep .p-datepicker-next-button{color:#fff!important}:host ::ng-deep .p-inputtext{border:none}:host ::ng-deep .appointment-not-available{background:#ff7373;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .appointment-available{background:#e0fde7;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button{border-radius:0 8px 8px 0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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: "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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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: DateInputComponent, isStandalone: true, selector: "lib-date-input[group][controlName][name]", inputs: { isLabelVisible: "isLabelVisible", name: "name", label: "label", placeholder: "placeholder", accessibilityText: "accessibilityText", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", dateFormat: "dateFormat", group: "group", controlName: "controlName", showIcon: "showIcon", selectionMode: "selectionMode", touchUI: "touchUI", formStatus: "formStatus", showClear: "showClear", isPublicDate: "isPublicDate", minDate: "minDate", maxDate: "maxDate", minDateToday: "minDateToday", maxDateSixMonths: "maxDateSixMonths", maxDateThreeMonths: "maxDateThreeMonths", maxDateRangeOneYear: "maxDateRangeOneYear", setMinAndMax: "setMinAndMax", hasGap: "hasGap", disabledDates: "disabledDates", appendTo: "appendTo", groupError: "groupError", showTime: "showTime", availableDates: "availableDates", disabledDays: "disabledDays", disabledWeekends: "disabledWeekends" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<form class='flex flex-column' [formGroup]=\"group\" [ngClass]=\"{ 'gap-1': hasGap }\">\r\n  <div class=\"flex\" *ngIf=\"isLabelVisible\">\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\r\n  <p-datepicker\r\n    [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [appendTo]=\"appendTo\"\r\n    *ngIf=\"setMinAndMax\"\r\n    [inputId]=\"name\"\r\n    (onSelect)=\"onSelect.emit($event)\"\r\n    [placeholder]='placeholder'\r\n    [dateFormat]=\"dateFormat\"\r\n    [showIcon]=\"showIcon\"\r\n    [selectionMode]=\"selectionMode\"\r\n    [formControlName]=\"controlName\"\r\n    [touchUI]=\"touchUI\"\r\n    [minDate]=\"minDate || getDateFifteenDaysAgo()\"\r\n    [maxDate]=\"maxDate\"\r\n    [showClear]=\"showClear\"\r\n    (onClear)=\"group.get(controlName)?.reset()\"\r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n    [disabledDays]=\"disabledDays\"\r\n    [disabledDates]=\"disabledDates\"\r\n    [showTime]=\"showTime\"\r\n    hourFormat=\"24\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  >\r\n    <!-- Mare; ideja da barva dolo\u010Dene dneve (npr. takrat ki ni prostih terminov) -->\r\n    <!-- 24.05.2024 Mare; zaenkrat ne potrebujemo ve\u010D, ker so neprosti dnevi kar disabled -->\r\n    <ng-template pTemplate=\"date\" let-date>\r\n      <div>{{date.day}}</div>\r\n    </ng-template>\r\n  </p-datepicker>\r\n\r\n  <p-datepicker\r\n    [class.ng-invalid.ng-dirty]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [appendTo]=\"appendTo\"\r\n    *ngIf=\"!setMinAndMax\"\r\n    (onSelect)=\"onSelect.emit($event)\"\r\n    [inputId]=\"name\"\r\n    [placeholder]='placeholder'\r\n    [dateFormat]=\"dateFormat\"\r\n    [showIcon]=\"showIcon\"\r\n    [selectionMode]=\"selectionMode\"\r\n    [formControlName]=\"controlName\"\r\n    [touchUI]=\"touchUI\"\r\n    [showClear]=\"showClear\"\r\n    (onClear)=\"group.get(controlName)?.reset()\"\r\n    [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered) }\"\r\n    [attr.aria-label]=\"accessibilityText\"\r\n    [disabledDays]=\"disabledDays\"\r\n    [disabledDates]=\"disabledDates\"\r\n    [showTime]=\"showTime\"\r\n    hourFormat=\"24\"\r\n    [attr.aria-describedby]=\"name + 'Error'\"\r\n    [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered)) || groupError\"\r\n    [attr.aria-required]=\"isRequired\"\r\n  ></p-datepicker>\r\n</form>\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  [hasGroupError]=\"groupError\"\r\n  [errorId]=\"name+'Error'\"\r\n></lib-error>\r\n", styles: [":host ::ng-deep{width:100%}:host ::ng-deep .p-datepicker-dropdown{background-color:#3e7c94;color:#fff;border-color:#3e7c94}:host ::ng-deep .p-datepicker-dropdown:hover{background-color:#1b495a!important;border-color:#1b495a!important;color:#fff!important}:host ::ng-deep .p-datepicker-title>*{color:#fff!important;font-weight:700}:host ::ng-deep .p-datepicker-clear-icon{padding-right:8px;color:#6d7375;cursor:pointer}:host ::ng-deep .p-datepicker{min-width:max-content!important;width:100%;border:1.75px solid #3E7C94!important}:host ::ng-deep .p-datepicker::placeholder{font-style:italic!important;color:#848484!important}:host ::ng-deep .p-datepicker:hover{border:1.75px solid #ffa142!important}:host ::ng-deep .p-datepicker:focus{box-shadow:0 0 2px 3px #ffa142!important}:host ::ng-deep .p-datepicker table td>span.p-highlight{color:#000;background:#3e7c94}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}:host ::ng-deep .p-datepicker:not(.p-disabled).p-focus span{outline:none}:host ::ng-deep .p-datepicker-prev-button,:host ::ng-deep .p-datepicker-next-button{color:#fff!important}:host ::ng-deep .p-inputtext{border:none}:host ::ng-deep .appointment-not-available{background:#ff7373;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .appointment-available{background:#e0fde7;width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host ::ng-deep .p-button{border-radius:0 8px 8px 0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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: "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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$1.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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: DateInputComponent, decorators: [{
             type: Component,
@@ -1473,7 +1491,7 @@ class TextareaComponent {
     }
     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$1.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" }, 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"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
@@ -1668,7 +1686,7 @@ class ToggleSwitchComponent {
         this.changeChecked(false);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ToggleSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ToggleSwitchComponent, isStandalone: true, selector: "lib-toggle-switch", inputs: { group: "group", controlName: "controlName", isFormElement: "isFormElement", checked: "checked", disabled: "disabled" }, outputs: { getValueEvent: "getValueEvent", checkedChanged: "checkedChanged" }, ngImport: i0, template: "<div class=\"flex flex-column mt-2\" [formGroup]=\"group\" *ngIf=\"isFormElement\">\r\n  <p-toggleswitch\r\n    (onChange)=\"toggleValue($event, true)\"\r\n    [formControlName]=\"controlName\"\r\n  ></p-toggleswitch>\r\n</div>\r\n<div class=\"flex flex-column mt-2\" *ngIf=\"!isFormElement\">\r\n  <p-toggleswitch [disabled]=\"disabled\" [(ngModel)]=\"checked\" (onChange)=\"toggleValue($event, false)\"></p-toggleswitch>\r\n</div>\r\n", styles: [":host ::ng-deep .p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider{background:#3e7c94!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider{border-radius:15px;background:#d7d7d7!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider:before{border-radius:50%}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: ToggleSwitchModule }, { kind: "component", type: i2$2.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ToggleSwitchComponent, isStandalone: true, selector: "lib-toggle-switch", inputs: { group: "group", controlName: "controlName", isFormElement: "isFormElement", checked: "checked", disabled: "disabled" }, outputs: { getValueEvent: "getValueEvent", checkedChanged: "checkedChanged" }, ngImport: i0, template: "<div class=\"flex flex-column mt-2\" [formGroup]=\"group\" *ngIf=\"isFormElement\">\r\n  <p-toggleswitch\r\n    (onChange)=\"toggleValue($event, true)\"\r\n    [formControlName]=\"controlName\"\r\n  ></p-toggleswitch>\r\n</div>\r\n<div class=\"flex flex-column mt-2\" *ngIf=\"!isFormElement\">\r\n  <p-toggleswitch [disabled]=\"disabled\" [(ngModel)]=\"checked\" (onChange)=\"toggleValue($event, false)\"></p-toggleswitch>\r\n</div>\r\n", styles: [":host ::ng-deep .p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider{background:#3e7c94!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider{border-radius:15px;background:#d7d7d7!important}:host ::ng-deep .p-toggleswitch .p-toggleswitch-slider:before{border-radius:50%}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: ToggleSwitchModule }, { kind: "component", type: i2$3.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ToggleSwitchComponent, decorators: [{
             type: Component,
@@ -1957,7 +1975,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"] }, { 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,
@@ -1981,7 +1999,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         ButtonLinkComponent,
                         TranslateModule,
                         DatePipe,
-                    ], 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"] }]
+                    ], 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"] }]
         }], propDecorators: { table: [{
                 type: ViewChild,
                 args: ['dt', { static: false }]
@@ -2691,7 +2709,7 @@ class FilterHeaderComponent {
     filterItems = [];
     constructor() { }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FilterHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: FilterHeaderComponent, isStandalone: true, selector: "app-filter-header", inputs: { filterItems: "filterItems" }, ngImport: i0, template: "<!-- app.component.html -->\r\n\r\n<p-menubar class=\"accordion_menubar \">\r\n  <ng-template pTemplate=\"start\">\r\n    <div class=\"filter-chips\"  >\r\n      <p-chip\r\n        *ngFor=\"let item of filterItems\"\r\n        [label]=\"item\"\r\n        styleClass=\"filter-chip\">\r\n      </p-chip>\r\n    </div>\r\n  </ng-template>\r\n</p-menubar>\r\n", styles: [".accordion_menubar{width:100%}.accordion_menubar .filter-chips{display:flex;gap:.5rem;flex-wrap:wrap}.accordion_menubar .filter-chip{font-size:1rem;padding:.4rem 1rem}@media (max-width: 1024px){.accordion_menubar .filter-chips{gap:.3rem;justify-content:center}.accordion_menubar .filter-chip{font-size:.95rem;padding:.35rem .9rem}}@media (max-width: 600px){.accordion_menubar .filter-chips{flex-direction:column;gap:.25rem;align-items:stretch}.accordion_menubar .filter-chip{font-size:.9rem;padding:.3rem .7rem;width:100%}}@media screen and (min-width: 768px){.filter-accordion .date_fields{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1200px){.filter-accordion .date_fields{grid-template-columns:repeat(4,1fr)}.filter-accordion .grid_container{grid-template-columns:repeat(3,1fr)}}:host ::ng-deep .filter-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}:host ::ng-deep .filter-chips .p-chip{background:#f0f0f0;padding:.5rem}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon{color:#666;margin-left:.5rem;cursor:pointer}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon:hover{color:#333}:host ::ng-deep .filter-chips .p-chip .filter-value{margin-left:.5rem;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MenubarModule }, { kind: "component", type: i2$3.Menubar, selector: "p-menubar", inputs: ["model", "style", "styleClass", "autoZIndex", "baseZIndex", "autoDisplay", "autoHide", "breakpoint", "autoHideDelay", "id", "ariaLabel", "ariaLabelledBy"], outputs: ["onFocus", "onBlur"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: i4$1.Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "style", "styleClass", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: FilterHeaderComponent, isStandalone: true, selector: "app-filter-header", inputs: { filterItems: "filterItems" }, ngImport: i0, template: "<!-- app.component.html -->\r\n\r\n<p-menubar class=\"accordion_menubar \">\r\n  <ng-template pTemplate=\"start\">\r\n    <div class=\"filter-chips\"  >\r\n      <p-chip\r\n        *ngFor=\"let item of filterItems\"\r\n        [label]=\"item\"\r\n        styleClass=\"filter-chip\">\r\n      </p-chip>\r\n    </div>\r\n  </ng-template>\r\n</p-menubar>\r\n", styles: [".accordion_menubar{width:100%}.accordion_menubar .filter-chips{display:flex;gap:.5rem;flex-wrap:wrap}.accordion_menubar .filter-chip{font-size:1rem;padding:.4rem 1rem}@media(max-width:1024px){.accordion_menubar .filter-chips{gap:.3rem;justify-content:center}.accordion_menubar .filter-chip{font-size:.95rem;padding:.35rem .9rem}}@media(max-width:600px){.accordion_menubar .filter-chips{flex-direction:column;gap:.25rem;align-items:stretch}.accordion_menubar .filter-chip{font-size:.9rem;padding:.3rem .7rem;width:100%}}@media screen and (min-width:768px){.filter-accordion .date_fields{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:1200px){.filter-accordion .date_fields{grid-template-columns:repeat(4,1fr)}.filter-accordion .grid_container{grid-template-columns:repeat(3,1fr)}}:host ::ng-deep .filter-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}:host ::ng-deep .filter-chips .p-chip{background:#f0f0f0;padding:.5rem}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon{color:#666;margin-left:.5rem;cursor:pointer}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon:hover{color:#333}:host ::ng-deep .filter-chips .p-chip .filter-value{margin-left:.5rem;font-weight:500}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MenubarModule }, { kind: "component", type: i2$4.Menubar, selector: "p-menubar", inputs: ["model", "style", "styleClass", "autoZIndex", "baseZIndex", "autoDisplay", "autoHide", "breakpoint", "autoHideDelay", "id", "ariaLabel", "ariaLabelledBy"], outputs: ["onFocus", "onBlur"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: i4$1.Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "style", "styleClass", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FilterHeaderComponent, decorators: [{
             type: Component,
@@ -2702,7 +2720,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         CommonModule,
                         MenubarModule,
                         ChipModule,
-                    ], template: "<!-- app.component.html -->\r\n\r\n<p-menubar class=\"accordion_menubar \">\r\n  <ng-template pTemplate=\"start\">\r\n    <div class=\"filter-chips\"  >\r\n      <p-chip\r\n        *ngFor=\"let item of filterItems\"\r\n        [label]=\"item\"\r\n        styleClass=\"filter-chip\">\r\n      </p-chip>\r\n    </div>\r\n  </ng-template>\r\n</p-menubar>\r\n", styles: [".accordion_menubar{width:100%}.accordion_menubar .filter-chips{display:flex;gap:.5rem;flex-wrap:wrap}.accordion_menubar .filter-chip{font-size:1rem;padding:.4rem 1rem}@media (max-width: 1024px){.accordion_menubar .filter-chips{gap:.3rem;justify-content:center}.accordion_menubar .filter-chip{font-size:.95rem;padding:.35rem .9rem}}@media (max-width: 600px){.accordion_menubar .filter-chips{flex-direction:column;gap:.25rem;align-items:stretch}.accordion_menubar .filter-chip{font-size:.9rem;padding:.3rem .7rem;width:100%}}@media screen and (min-width: 768px){.filter-accordion .date_fields{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1200px){.filter-accordion .date_fields{grid-template-columns:repeat(4,1fr)}.filter-accordion .grid_container{grid-template-columns:repeat(3,1fr)}}:host ::ng-deep .filter-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}:host ::ng-deep .filter-chips .p-chip{background:#f0f0f0;padding:.5rem}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon{color:#666;margin-left:.5rem;cursor:pointer}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon:hover{color:#333}:host ::ng-deep .filter-chips .p-chip .filter-value{margin-left:.5rem;font-weight:500}\n"] }]
+                    ], template: "<!-- app.component.html -->\r\n\r\n<p-menubar class=\"accordion_menubar \">\r\n  <ng-template pTemplate=\"start\">\r\n    <div class=\"filter-chips\"  >\r\n      <p-chip\r\n        *ngFor=\"let item of filterItems\"\r\n        [label]=\"item\"\r\n        styleClass=\"filter-chip\">\r\n      </p-chip>\r\n    </div>\r\n  </ng-template>\r\n</p-menubar>\r\n", styles: [".accordion_menubar{width:100%}.accordion_menubar .filter-chips{display:flex;gap:.5rem;flex-wrap:wrap}.accordion_menubar .filter-chip{font-size:1rem;padding:.4rem 1rem}@media(max-width:1024px){.accordion_menubar .filter-chips{gap:.3rem;justify-content:center}.accordion_menubar .filter-chip{font-size:.95rem;padding:.35rem .9rem}}@media(max-width:600px){.accordion_menubar .filter-chips{flex-direction:column;gap:.25rem;align-items:stretch}.accordion_menubar .filter-chip{font-size:.9rem;padding:.3rem .7rem;width:100%}}@media screen and (min-width:768px){.filter-accordion .date_fields{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:1200px){.filter-accordion .date_fields{grid-template-columns:repeat(4,1fr)}.filter-accordion .grid_container{grid-template-columns:repeat(3,1fr)}}:host ::ng-deep .filter-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}:host ::ng-deep .filter-chips .p-chip{background:#f0f0f0;padding:.5rem}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon{color:#666;margin-left:.5rem;cursor:pointer}:host ::ng-deep .filter-chips .p-chip .p-chip-remove-icon:hover{color:#333}:host ::ng-deep .filter-chips .p-chip .filter-value{margin-left:.5rem;font-weight:500}\n"] }]
         }], ctorParameters: () => [], propDecorators: { filterItems: [{
                 type: Input
             }] } });
@@ -3013,7 +3031,7 @@ class ModalComponent {
         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"] }] });
+    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,
@@ -3024,7 +3042,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                         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"] }]
+                    ], 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: [{