@verisoft/ui-core 20.1.1 → 20.1.3

package/fesm2022/verisoft-ui-core.mjs

@@ -0,0 +1,2026 @@
+import * as i0 from '@angular/core';
+import { SimpleChange, InjectionToken, inject, Input, Component, Injectable, EventEmitter, Output, signal, ChangeDetectorRef, HostListener, Directive, Optional, Inject, TemplateRef, ContentChild, input, Pipe } from '@angular/core';
+import { startWith, switchMap, merge, map, debounceTime, BehaviorSubject, Subject, takeUntil, filter, tap, of, catchError } from 'rxjs';
+import * as i1 from '@angular/forms';
+import { FormControlName, FormControlDirective, NgModel, FormControl, ReactiveFormsModule } from '@angular/forms';
+import { ERROR_PROVIDER_TOKEN, BASE_URL_PATH, normalizeRequest, DEFAULT_SEARCH_LIMIT, convertDatasource, BaseHttpService, toCzechDateTimeString } from '@verisoft/core';
+import { cloneDeep } from 'lodash-es';
+import { TranslateService } from '@ngx-translate/core';
+import * as i1$1 from '@angular/router';
+import { ActivatedRoute, Router, NavigationEnd } from '@angular/router';
+import { Store, createSelector, createFeatureSelector } from '@ngrx/store';
+import { createResetStateAction, createInitNewDetailAction, createInitDetailAction, createUpdateDetailAction, createUpdateFormStateAction, createUpdateDetailSetErrorsAction } from '@verisoft/store';
+import { v4 } from 'uuid';
+import { HttpClient } from '@angular/common/http';
+
+function setComponentProperties(component, value, firstChange = false) {
+    if (!value || !component) {
+        return;
+    }
+    const simpleChanges = Object.keys(value).reduce((changes, property) => {
+        const indexedComponent = component;
+        const indexedValue = value;
+        const previousValue = indexedComponent[property];
+        const currentValue = indexedValue[property];
+        if (currentValue !== previousValue) {
+            indexedComponent[property] = currentValue;
+            const change = new SimpleChange(previousValue, currentValue, firstChange);
+            return { ...changes, [property]: change };
+        }
+        return changes;
+    }, {});
+    const changeableComponent = component;
+    if (changeableComponent['ngOnChanges']) {
+        changeableComponent.ngOnChanges(simpleChanges);
+    }
+}
+
+var ControlSeverity;
+(function (ControlSeverity) {
+    ControlSeverity["success"] = "success";
+    ControlSeverity["info"] = "info";
+    ControlSeverity["warning"] = "warning";
+    ControlSeverity["danger"] = "danger";
+    ControlSeverity["help"] = "help";
+    ControlSeverity["primary"] = "primary";
+    ControlSeverity["secondary"] = "secondary";
+    ControlSeverity["contrast"] = "contrast";
+})(ControlSeverity || (ControlSeverity = {}));
+var GovControlSeverity;
+(function (GovControlSeverity) {
+    GovControlSeverity["primary"] = "primary";
+    GovControlSeverity["secondary"] = "secondary";
+    GovControlSeverity["neutral"] = "neutral";
+    GovControlSeverity["error"] = "error";
+    GovControlSeverity["success"] = "success";
+    GovControlSeverity["warning"] = "warning";
+})(GovControlSeverity || (GovControlSeverity = {}));
+var GovButtonType;
+(function (GovButtonType) {
+    GovButtonType["solid"] = "solid";
+    GovButtonType["outlined"] = "outlined";
+    GovButtonType["base"] = "base";
+    GovButtonType["link"] = "link";
+})(GovButtonType || (GovButtonType = {}));
+var IconPosition;
+(function (IconPosition) {
+    IconPosition["left"] = "left";
+    IconPosition["right"] = "right";
+})(IconPosition || (IconPosition = {}));
+var SlotPosition;
+(function (SlotPosition) {
+    SlotPosition["top"] = "top";
+    SlotPosition["bottom"] = "bottom";
+})(SlotPosition || (SlotPosition = {}));
+var Position;
+(function (Position) {
+    Position["top"] = "top";
+    Position["bottom"] = "bottom";
+    Position["left"] = "left";
+    Position["right"] = "right";
+})(Position || (Position = {}));
+var FieldSize;
+(function (FieldSize) {
+    FieldSize["small"] = "small";
+    FieldSize["medium"] = "medium";
+    FieldSize["large"] = "large";
+    FieldSize["xl"] = "xl";
+})(FieldSize || (FieldSize = {}));
+var FieldAlign;
+(function (FieldAlign) {
+    FieldAlign["left"] = "left";
+    FieldAlign["center"] = "center";
+    FieldAlign["right"] = "right";
+})(FieldAlign || (FieldAlign = {}));
+var FieldType;
+(function (FieldType) {
+    FieldType["text"] = "text";
+    FieldType["number"] = "number";
+    FieldType["password"] = "password";
+    FieldType["search"] = "search";
+    FieldType["date"] = "date";
+})(FieldType || (FieldType = {}));
+var LayoutType;
+(function (LayoutType) {
+    LayoutType["horizontal"] = "horizontal";
+    LayoutType["vertical"] = "vertical";
+})(LayoutType || (LayoutType = {}));
+
+const DEFAULT_DEBOUNCE_TIME = 300;
+const DEFAULT_PAGINATION = [10, 25, 50, 100];
+const MAX_COLUMN_CHAR_COUNT = 30;
+
+function setDataToArray(targetArray, data, offset = 0, total = undefined, defaultItem = undefined) {
+    const totalItems = total ?? data.length + offset;
+    if (!targetArray) {
+        targetArray = Array(totalItems).fill(defaultItem);
+    }
+    if (targetArray.length < totalItems) {
+        targetArray = targetArray.concat(new Array(totalItems - targetArray.length).fill(defaultItem));
+    }
+    for (let i = 0; i < data.length; i++) {
+        targetArray[i + offset] = data[i] ?? defaultItem;
+    }
+    return targetArray;
+}
+
+function isFilterEmpty(filter) {
+    if (filter == undefined) {
+        return true;
+    }
+    return !Object.entries(filter).some((x) => x[1] != undefined);
+}
+
+function queryListChanged(list) {
+    return list.changes.pipe(startWith({}), switchMap(() => {
+        const actionPropertyChanges$ = list
+            .toArray()
+            .filter((action) => action.propertyChanged)
+            .map((action) => action.propertyChanged);
+        return merge(...actionPropertyChanges$).pipe(startWith({}), map(() => list.toArray()));
+    }), debounceTime(50));
+}
+
+function downloadText(filename, text, mimeType = 'text/plain') {
+    const blob = new Blob([text], { type: mimeType });
+    downloadFile(filename, blob);
+}
+function downloadFile(filename, blob) {
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = filename;
+    a.click();
+    window.URL.revokeObjectURL(url);
+}
+
+const ACTION_BUTTON_GROUP_COMPONENT_TOKEN = new InjectionToken('ActionButtonGroupComponentToken');
+
+const noop = () => {
+    /* */
+};
+class BaseFormInputComponent {
+    control;
+    ngControl;
+    errorService = inject(ERROR_PROVIDER_TOKEN);
+    formControl;
+    constructor(control) {
+        this.control = control;
+        this.ngControl = control;
+        if (this.control) {
+            this.ngControl.valueAccessor = this;
+        }
+    }
+    label;
+    required = false;
+    readonly;
+    disabled;
+    tooltip;
+    formDisplay = 'flex';
+    clearable = true;
+    placeholder = '';
+    testId;
+    inputId = Math.random().toString(36).substring(2);
+    selectionChanged = noop;
+    onTouch = noop;
+    registerOnChange(fn) {
+        this.selectionChanged = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouch = fn;
+    }
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    writeValue(value) { }
+    ngOnInit() {
+        if (this.ngControl) {
+            if (this.ngControl instanceof FormControlName) {
+                this.formControl =
+                    this.ngControl.control ||
+                        this.ngControl.formDirective?.form.controls[this.ngControl.name];
+            }
+            else if (this.ngControl instanceof FormControlDirective ||
+                this.ngControl instanceof NgModel) {
+                this.formControl = this.ngControl.control;
+                if (this.ngControl instanceof NgModel) {
+                    this.formControl.valueChanges.subscribe(() => this.ngControl?.viewToModelUpdate(this.control?.value));
+                }
+            }
+            else {
+                this.formControl = new FormControl();
+            }
+        }
+        else {
+            this.formControl = new FormControl();
+        }
+    }
+    isRequired() {
+        if (this.ngControl) {
+            const validator = this.ngControl?.control?.validator?.({});
+            return this.required || (validator && validator['required']);
+        }
+        return this.required;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BaseFormInputComponent, deps: [{ token: i1.NgControl }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.1", type: BaseFormInputComponent, isStandalone: true, selector: "ng-component", inputs: { label: "label", required: "required", readonly: "readonly", disabled: "disabled", tooltip: "tooltip", formDisplay: "formDisplay", clearable: "clearable", placeholder: "placeholder", testId: "testId" }, ngImport: i0, template: '', isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BaseFormInputComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: '',
+                    imports: [ReactiveFormsModule]
+                }]
+        }], ctorParameters: () => [{ type: i1.NgControl }], propDecorators: { label: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], tooltip: [{
+                type: Input
+            }], formDisplay: [{
+                type: Input
+            }], clearable: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], testId: [{
+                type: Input
+            }] } });
+
+class ScreenSizeService {
+    isMobileBlock = new BehaviorSubject(false);
+    prevState = false;
+    constructor() {
+        this.checkScreenSize();
+        window.addEventListener('resize', async () => {
+            await this.checkScreenSize();
+        });
+    }
+    async checkScreenSize() {
+        const isMobile = window.matchMedia('(max-width: 768px)').matches;
+        if (isMobile !== this.prevState) {
+            this.prevState = isMobile;
+            this.isMobileBlock.next(isMobile);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ScreenSizeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ScreenSizeService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ScreenSizeService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class DialogService {
+    showEvent = new EventEmitter();
+    closeEvent = new EventEmitter();
+    showDialog(data) {
+        const mappedData = this.mapInputAndOutpus(data);
+        this.showEvent.emit({
+            ...data,
+            data: mappedData,
+        });
+    }
+    mapInputAndOutpus(data) {
+        const inputsAndOutputs = data.data;
+        return {
+            ...data.data,
+            ...(Object.keys(inputsAndOutputs ?? {})
+                .filter((key) => typeof inputsAndOutputs[key] === 'function')
+                .reduce((acc, key) => {
+                acc[key] = (value) => {
+                    if (typeof inputsAndOutputs[key] === 'function') {
+                        inputsAndOutputs[key](value);
+                    }
+                };
+                return acc;
+            }, {})),
+        };
+    }
+    closeModal() {
+        this.closeEvent.emit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DialogService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DialogService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], propDecorators: { showEvent: [{
+                type: Output
+            }], closeEvent: [{
+                type: Output
+            }] } });
+
+class PreventUnsavedChangesDirective {
+    dialogService = inject(DialogService);
+    translateService = inject(TranslateService);
+    Icons;
+    canDeactivate(component) {
+        if (!component || !component.canDeactivate) {
+            return true;
+        }
+        const result = component.canDeactivate();
+        return result;
+    }
+    showConfirmationDialog() {
+        const resultSubject = new Subject();
+        const title = this.translateService.instant('VALIDATIONS.UNSAVED_CHANGES');
+        const message = this.translateService.instant('VALIDATIONS.LEAVING_UNSAVED_FORM');
+        const leaveButton = this.translateService.instant('BUTTONS.LEAVE');
+        const stayButton = this.translateService.instant('BUTTONS.STAY');
+        this.dialogService.showDialog({
+            title: title,
+            headerIcon: this.Icons.infoCircle,
+            innerHTML: `<p>${message}</p>`,
+            showCancelButton: true,
+            confirmButtonText: stayButton,
+            cancelButtonText: leaveButton,
+            confirmButtonFn: () => {
+                resultSubject.next(false);
+                resultSubject.complete();
+                this.dialogService.closeModal();
+            },
+            cancelButtonFn: () => {
+                resultSubject.next(true);
+                resultSubject.complete();
+                this.dialogService.closeModal();
+            },
+        });
+        return resultSubject.asObservable();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PreventUnsavedChangesDirective, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PreventUnsavedChangesDirective, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PreventUnsavedChangesDirective, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class TableService {
+    reload = signal(Symbol(), ...(ngDevMode ? [{ debugName: "reload" }] : []));
+    /**
+     * If name is set, reload a specific table with the set`[tableName]`
+     *
+     * If name is NOT set, reload all tables in the current DOM
+     * */
+    forceReload(name) {
+        if (name) {
+            this.reload.set({ name: name, symbol: Symbol() });
+        }
+        else {
+            this.reload.set(Symbol());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class BaseInputControls {
+    value;
+    ngControl;
+    label;
+    required;
+}
+
+function isFormStateEqual(current, other) {
+    if (!current && !other) {
+        return true;
+    }
+    if (current && other) {
+        return current.dirty === other.dirty && current.valid === other.valid;
+    }
+    return false;
+}
+
+class BaseFormDirective {
+    data;
+    dataChange = new EventEmitter();
+    statusChange = new EventEmitter();
+    formSubmit = new EventEmitter();
+    formClear = new EventEmitter();
+    formDestroyed$ = new Subject();
+    keys = [];
+    formGroup;
+    cd = inject(ChangeDetectorRef);
+    valueInitialization = false;
+    lastState;
+    guardViewChild;
+    formSubmitted = false;
+    guard = inject(PreventUnsavedChangesDirective);
+    unloadHandler(event) {
+        if (this.formGroup.dirty) {
+            event.preventDefault();
+        }
+    }
+    canDeactivate() {
+        if (this.formGroup.dirty && !this.formSubmitted) {
+            const result = this.guard.showConfirmationDialog();
+            return result;
+        }
+        return true;
+    }
+    ngOnInit() {
+        this.initializeFormGroup();
+    }
+    ngOnChanges(changes) {
+        if (changes['data'] && this.formGroup) {
+            this.valueInitialization = true;
+            const dirty = this.formGroup.dirty;
+            this.formGroup.patchValue(this.fromModel(this.data), {
+                emitEvent: false,
+                onlySelf: true,
+            });
+            this.formGroup.updateValueAndValidity();
+            if (!dirty) {
+                this.formGroup.markAsPristine();
+            }
+            this.valueInitialization = false;
+            this.createAndEmitIfFormStateChanged();
+        }
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+    }
+    ngOnDestroy() {
+        this.formDestroyed$.next();
+        this.formDestroyed$.complete();
+    }
+    createCompleteData() {
+        const change = this.toModel(this.formGroup?.value);
+        this.recursiveObjectAttributesTransformation(change);
+        const updatedData = this.applyChanges(cloneDeep(this.data), cloneDeep(change));
+        return updatedData;
+    }
+    submit() {
+        this.formSubmitted = true;
+        this.formGroup.markAllAsTouched();
+        if (!this.formGroup.invalid) {
+            this.formSubmit.emit(this.createCompleteData());
+        }
+        this.formGroup.markAsPristine();
+    }
+    clear() {
+        this.formClear.emit();
+    }
+    initializeFormGroup() {
+        this.formGroup = this.createFormGroup();
+        this.valueInitialization = true;
+        this.formGroup.patchValue(this.fromModel(this.data), {
+            emitEvent: false,
+            onlySelf: true,
+        });
+        this.formGroup.markAsPristine();
+        this.initValueChanges();
+        this.initStatusChanges();
+        this.valueInitialization = false;
+    }
+    initValueChanges() {
+        this.formGroup.valueChanges
+            .pipe(takeUntil(this.formDestroyed$), filter(() => !this.valueInitialization), map((value) => {
+            const change = this.toModel(value);
+            this.recursiveObjectAttributesTransformation(change);
+            const updatedData = this.applyChanges(cloneDeep(this.data), cloneDeep(change));
+            return updatedData;
+        }))
+            .subscribe((updatedData) => {
+            this.dataChange.emit(updatedData);
+        });
+    }
+    initStatusChanges() {
+        this.formGroup.statusChanges
+            .pipe(takeUntil(this.formDestroyed$))
+            .subscribe(() => {
+            if (!this.valueInitialization) {
+                this.createAndEmitIfFormStateChanged();
+            }
+        });
+        this.createAndEmitIfFormStateChanged();
+    }
+    createAndEmitIfFormStateChanged() {
+        const formState = {
+            valid: !this.formGroup.invalid,
+            dirty: this.formGroup.dirty,
+        };
+        if (!isFormStateEqual(formState, this.lastState)) {
+            this.lastState = formState;
+            this.statusChange.emit(formState);
+        }
+    }
+    applyChanges(data, changes) {
+        return Object.assign(data || {}, changes);
+    }
+    toModel(data) {
+        return data || {};
+    }
+    fromModel(data) {
+        return { ...(data || {}) };
+    }
+    recursiveObjectAttributesTransformation(obj) {
+        this.recursiveObjectAttributesTraversal(obj, this.transformEmptyStringToNullStringFn);
+    }
+    recursiveObjectAttributesTraversal(obj, transformationFn) {
+        if (obj === null ||
+            transformationFn === null ||
+            typeof transformationFn !== 'function') {
+            return;
+        }
+        const traverse = (obj) => {
+            for (const key in obj) {
+                // eslint-disable-next-line no-prototype-builtins
+                if (obj.hasOwnProperty(key)) {
+                    transformationFn(obj, key);
+                    if (typeof obj[key] === 'object') {
+                        traverse(obj[key]);
+                    }
+                }
+            }
+        };
+        traverse(obj);
+    }
+    transformEmptyStringToNullStringFn(obj, key) {
+        // if empty string - transformation to null string
+        if (typeof obj[key] === 'string' && obj[key] === '') {
+            try {
+                obj[key] = null;
+            }
+            catch (error) {
+                console.error(`Cannot modify ${key}: ${error}`);
+            }
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BaseFormDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: BaseFormDirective, isStandalone: true, selector: "[v-baseForm]", inputs: { data: "data" }, outputs: { dataChange: "dataChange", statusChange: "statusChange", formSubmit: "formSubmit", formClear: "formClear" }, host: { listeners: { "window:beforeunload": "unloadHandler($event)" } }, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BaseFormDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[v-baseForm]',
+                    standalone: true,
+                }]
+        }], propDecorators: { data: [{
+                type: Input
+            }], dataChange: [{
+                type: Output
+            }], statusChange: [{
+                type: Output
+            }], formSubmit: [{
+                type: Output
+            }], formClear: [{
+                type: Output
+            }], unloadHandler: [{
+                type: HostListener,
+                args: ['window:beforeunload', ['$event']]
+            }] } });
+
+class UnsubscribeComponent {
+    destroyed$ = new Subject();
+    ngOnDestroy() {
+        this.destroyed$.next();
+        this.destroyed$.complete();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: UnsubscribeComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: UnsubscribeComponent, isStandalone: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: UnsubscribeComponent, decorators: [{
+            type: Directive
+        }] });
+
+class DetailStoreDirective extends UnsubscribeComponent {
+    form;
+    detailsRepository;
+    autoBind = true;
+    detailId;
+    ngrxFeatureKey;
+    destroyForm = true;
+    readonly = false;
+    readonlyControlNames = [];
+    store = inject(Store);
+    cdr = inject(ChangeDetectorRef);
+    route = inject(ActivatedRoute);
+    itemCache = null;
+    loaded;
+    ngOnInit() {
+        if (!this.loaded) {
+            this.listenFormState();
+        }
+        this.listenFormChange();
+        this.listenFormStatusChange();
+    }
+    ngAfterViewInit() {
+        if (this.autoBind && !this.loaded) {
+            this.initForm();
+        }
+    }
+    ngOnDestroy() {
+        super.ngOnDestroy();
+        if (this.destroyForm) {
+            this.store.dispatch(createResetStateAction(this.detailsRepository)());
+        }
+    }
+    initForm() {
+        if (this.detailId === 'create') {
+            this.store.dispatch(createInitNewDetailAction(this.detailsRepository)());
+        }
+        else {
+            this.store.dispatch(createInitDetailAction(this.detailsRepository)({ obj: this.detailId }));
+        }
+        if (this.readonly) {
+            this.form.formGroup.disable();
+            return;
+        }
+        this.readonlyControlNames.forEach(x => {
+            this.form.formGroup.get(x)?.disable();
+        });
+    }
+    listenFormState() {
+        const selectIncomeData = createSelector(createFeatureSelector(this.ngrxFeatureKey), (state) => state?.[this.detailsRepository]);
+        this.store
+            .select(selectIncomeData)
+            .pipe(takeUntil(this.destroyed$))
+            .subscribe(({ item, loaded, backendValidationErrors } = {
+            item: undefined,
+            loaded: false,
+            saveItemState: { saveInProgress: false },
+            backendValidationErrors: []
+        }) => {
+            if (item
+                && ((item.validationErrors || item.validationWarnings) && !this.form.formGroup.dirty)
+                || backendValidationErrors.length) {
+                this.handleValidation('propertyName', item.validationWarnings || [], 'validationWarning', 'warningMessage');
+                this.handleValidation('propertyName', item.validationErrors || [], 'validationError', 'errorMessage');
+                if (this.itemCache && this.isStateChanged(item) && backendValidationErrors.length) {
+                    backendValidationErrors = this.dispatchErrors(item, backendValidationErrors);
+                }
+                this.handleBackendValidation(backendValidationErrors);
+                this.cdr.markForCheck();
+            }
+            this.itemCache = item;
+            this.loaded = loaded;
+            this.cdr.detectChanges();
+        });
+    }
+    listenFormChange() {
+        this.form.dataChange.pipe(takeUntil(this.destroyed$)).subscribe((item) => {
+            this.store.dispatch(createUpdateDetailAction(this.detailsRepository)({ item }));
+        });
+    }
+    listenFormStatusChange() {
+        this.form.statusChange
+            .pipe(takeUntil(this.destroyed$))
+            .subscribe((formState) => {
+            this.store.dispatch(createUpdateFormStateAction(this.detailsRepository)({ formState }));
+        });
+    }
+    handleValidation = (controlName, errors, errorKey, messageKey) => {
+        if (errors.length > 0)
+            return;
+        errors.forEach((error) => {
+            const control = this.form.formGroup.get(error[controlName]);
+            if (control) {
+                control.disabled
+                    ? control.disable({ emitEvent: false, onlySelf: true })
+                    : control.enable({ emitEvent: false, onlySelf: true });
+                control.setErrors({ [errorKey]: error[messageKey] }, { emitEvent: true });
+                control.markAsDirty();
+            }
+        });
+    };
+    handleBackendValidation(errors) {
+        errors.forEach(({ parameters, code }) => {
+            const control = this.form.formGroup.get(this.normalizePropertyNames(parameters));
+            if (!control)
+                return;
+            control[control.disabled ? "disable" : "enable"]({ emitEvent: false, onlySelf: true });
+            control.setErrors({ "validationError": code }, { emitEvent: true });
+            control.markAsDirty();
+        });
+    }
+    dispatchErrors(item, errors) {
+        const error = errors.filter((e) => {
+            return this.itemCache[this.normalizePropertyNames(e.parameters)] === item[this.normalizePropertyNames(e.parameters)];
+        });
+        this.store.dispatch(createUpdateDetailSetErrorsAction(this.detailsRepository)({ error }));
+        return error;
+    }
+    normalizePropertyNames(input) {
+        return String(input[0]).toLocaleLowerCase() + String(input).slice(1);
+    }
+    isStateChanged(item) {
+        return item !== this.itemCache;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DetailStoreDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: DetailStoreDirective, isStandalone: true, selector: "[v-useDetailStore]", inputs: { form: "form", detailsRepository: "detailsRepository", autoBind: "autoBind", detailId: "detailId", ngrxFeatureKey: "ngrxFeatureKey", destroyForm: "destroyForm", readonly: "readonly", readonlyControlNames: "readonlyControlNames" }, exportAs: ["useDetailStore"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DetailStoreDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[v-useDetailStore]',
+                    exportAs: 'useDetailStore',
+                    standalone: true,
+                }]
+        }], propDecorators: { form: [{
+                type: Input,
+                args: [{ required: true }]
+            }], detailsRepository: [{
+                type: Input,
+                args: [{ required: true }]
+            }], autoBind: [{
+                type: Input
+            }], detailId: [{
+                type: Input
+            }], ngrxFeatureKey: [{
+                type: Input,
+                args: [{ required: true }]
+            }], destroyForm: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], readonlyControlNames: [{
+                type: Input
+            }] } });
+
+const BREADCRUMB_COMPONENT_TOKEN = new InjectionToken('BreadcrumbComponentToken');
+
+class BreadcrumbService {
+    routeChange = new EventEmitter();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BreadcrumbService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BreadcrumbService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BreadcrumbService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], propDecorators: { routeChange: [{
+                type: Output
+            }] } });
+
+class BreadcrumbCoreComponent extends UnsubscribeComponent {
+    items = [];
+    homeRoute = '/';
+    useHomeRoute = false;
+    static ROUTE_DATA_BREADCRUMB = 'breadcrumb';
+    static ROUTE_DATA_BREADCRUMB_URL = 'breadcrumb_url';
+    static ROUTE_DATA_NO_BREADCRUMB_ROUTE = 'breadcrumb_no_route';
+    static BREADCRUMB_HIDE = 'breadcrumb_hide';
+    home = { icon: 'pi pi-home', routerLink: this.homeRoute };
+    router = inject(Router);
+    activatedRoute = inject(ActivatedRoute);
+    breadcrumbService = inject(BreadcrumbService);
+    cdr = inject(ChangeDetectorRef);
+    ngOnInit() {
+        this.initBreadcrumbsCreation();
+        this.initRouteChangeListen();
+    }
+    initBreadcrumbsCreation() {
+        this.router.events
+            .pipe(filter((event) => event instanceof NavigationEnd), takeUntil(this.destroyed$))
+            .subscribe(() => (this.items = this.createBreadcrumbs(this.activatedRoute.root)));
+    }
+    initRouteChangeListen() {
+        this.breadcrumbService.routeChange
+            .pipe(filter((x) => x.label !== 'Undefined'), takeUntil(this.destroyed$))
+            .subscribe((x) => {
+            this.items = [
+                ...this.items,
+                {
+                    label: x.label,
+                    routerLink: x.routerLink,
+                    url: x.url,
+                    class: 'breadcrumb',
+                },
+            ];
+            this.cdr.detectChanges();
+        });
+    }
+    createBreadcrumbs(route, routerLink = '', breadcrumbs = []) {
+        const children = route.children;
+        if (children.length === 0) {
+            return breadcrumbs;
+        }
+        for (const child of children) {
+            const routeURL = child.snapshot.url
+                .map((segment) => segment.path)
+                .join('/');
+            if (!child.snapshot.data[BreadcrumbCoreComponent.BREADCRUMB_HIDE]) {
+                if (BreadcrumbCoreComponent.ROUTE_DATA_BREADCRUMB_URL !== undefined) {
+                    const route = child.snapshot.data[BreadcrumbCoreComponent.ROUTE_DATA_BREADCRUMB_URL];
+                    routerLink += `/${route}`;
+                }
+                if (!BreadcrumbCoreComponent.ROUTE_DATA_BREADCRUMB_URL && routeURL !== '') {
+                    routerLink += `/${routeURL}`;
+                }
+                const label = child.snapshot.data[BreadcrumbCoreComponent.ROUTE_DATA_BREADCRUMB];
+                if (label &&
+                    BreadcrumbCoreComponent.ROUTE_DATA_NO_BREADCRUMB_ROUTE &&
+                    child.snapshot.data[BreadcrumbCoreComponent.ROUTE_DATA_NO_BREADCRUMB_ROUTE]) {
+                    breadcrumbs.push({ label, routerLink: undefined });
+                }
+                else if (label && child.snapshot.routeConfig?.path !== '') {
+                    breadcrumbs.push({ label, routerLink: routerLink });
+                }
+            }
+            return this.createBreadcrumbs(child, routerLink, breadcrumbs);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BreadcrumbCoreComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: BreadcrumbCoreComponent, isStandalone: true, inputs: { items: "items", homeRoute: "homeRoute", useHomeRoute: "useHomeRoute" }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: BreadcrumbCoreComponent, decorators: [{
+            type: Directive,
+            args: [{}]
+        }], propDecorators: { items: [{
+                type: Input
+            }], homeRoute: [{
+                type: Input
+            }], useHomeRoute: [{
+                type: Input
+            }] } });
+
+const BUTTON_COMPONENT_TOKEN = new InjectionToken('ButtonComponentToken');
+
+const DROPDOWN_BUTTON_COMPONENT_TOKEN = new InjectionToken('DropdownButtonComponentToken');
+
+const CALENDAR_COMPONENT_TOKEN = new InjectionToken('CalendarComponentToken');
+
+const CHECKBOX_COMPONENT_TOKEN = new InjectionToken('CheckboxComponentToken');
+
+const CONFIRM_DIALOG_COMPONENT_TOKEN = new InjectionToken('ConfirmDialogComponentToken');
+
+const DROPDOWN_COMPONENT_TOKEN = new InjectionToken('DropdownComponentToken');
+
+const FILTER_COMPONENT_TOKEN = new InjectionToken('FilterComponentToken');
+
+const FORM_FIELD_COMPONENT_TOKEN = new InjectionToken('FormFieldComponentToken');
+
+const GENERIC_FIELD_COMPONENT_TOKEN = new InjectionToken('GenericFieldComponentToken');
+
+var GenericFieldType;
+(function (GenericFieldType) {
+    GenericFieldType["dropdown"] = "dropdown";
+    GenericFieldType["checkbox"] = "checkbox";
+    GenericFieldType["simplecheckbox"] = "simplecheckbox";
+    GenericFieldType["calendar"] = "calendar";
+    GenericFieldType["multiselect"] = "multiselect";
+    GenericFieldType["text"] = "text";
+})(GenericFieldType || (GenericFieldType = {}));
+
+const HEADER_COMPONENT_TOKEN = new InjectionToken('HeaderComponentToken');
+const SETTINGS_MENU = new InjectionToken('SETTINGS_MENU');
+
+const INPUT_GROUP_COMPONENT_TOKEN = new InjectionToken('HeaderComponentToken');
+
+const LOADER_COMPONENT_TOKEN = new InjectionToken('LoaderComponentToken');
+
+const MULTISELECT_COMPONENT_TOKEN = new InjectionToken('MultiselectComponentToken');
+
+const NUMBER_INPUT_COMPONENT_TOKEN = new InjectionToken('NumberInputComponentToken');
+
+const PAGE_HEADER_COMPONENT_TOKEN = new InjectionToken('PageHeaderComponentToken');
+
+class PageHeaderService {
+    pageHeader = new EventEmitter();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PageHeaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PageHeaderService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PageHeaderService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], propDecorators: { pageHeader: [{
+                type: Output
+            }] } });
+
+class PageHeaderCoreComponent extends UnsubscribeComponent {
+    router;
+    cdr;
+    headerService;
+    title;
+    subtitle;
+    showBackButton;
+    size = FieldSize.small;
+    constructor(router, cdr, headerService) {
+        super();
+        this.router = router;
+        this.cdr = cdr;
+        this.headerService = headerService;
+    }
+    ngOnInit() {
+        this.headerService.pageHeader
+            .pipe(takeUntil(this.destroyed$))
+            .subscribe((x) => {
+            this.title = x.title;
+            this.subtitle = x.subtitle;
+            this.showBackButton = x.showBackButton ?? false;
+            this.cdr.detectChanges();
+        });
+    }
+    locationBack() {
+        history.back();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PageHeaderCoreComponent, deps: [{ token: i1$1.Router }, { token: i0.ChangeDetectorRef }, { token: PageHeaderService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: PageHeaderCoreComponent, isStandalone: true, inputs: { title: "title", subtitle: "subtitle", showBackButton: "showBackButton", size: "size" }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: PageHeaderCoreComponent, decorators: [{
+            type: Directive,
+            args: [{}]
+        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i0.ChangeDetectorRef }, { type: PageHeaderService }], propDecorators: { title: [{
+                type: Input
+            }], subtitle: [{
+                type: Input
+            }], showBackButton: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }] } });
+
+const PASSWORD_COMPONENT_TOKEN = new InjectionToken('PasswordComponentToken');
+var PasswordStrength;
+(function (PasswordStrength) {
+    PasswordStrength[PasswordStrength["None"] = 0] = "None";
+    PasswordStrength[PasswordStrength["Low"] = 1] = "Low";
+    PasswordStrength[PasswordStrength["Medium"] = 2] = "Medium";
+    PasswordStrength[PasswordStrength["High"] = 3] = "High";
+    PasswordStrength[PasswordStrength["Superb"] = 4] = "Superb";
+})(PasswordStrength || (PasswordStrength = {}));
+
+const RADIOBUTTON_COMPONENT_TOKEN = new InjectionToken('RadiobuttonComponentToken');
+
+const SECTION_COMPONENT_TOKEN = new InjectionToken('SectionComponentToken');
+
+const MENU_TOKEN = new InjectionToken('MENU');
+const LOGO_ROUTER_ROUTE = new InjectionToken('LOGO_ROUTER_ROUTE');
+const SIDE_MENU_COMPONENT_TOKEN = new InjectionToken('SideMenuComponentToken');
+const SIDE_MENU_STATE_TOKEN = new InjectionToken('SideMenuStateToken');
+
+class SideMenuService {
+    _menuItems = new BehaviorSubject([]);
+    stateToken = inject(SIDE_MENU_STATE_TOKEN);
+    menuItems$ = this._menuItems.asObservable();
+    menuMinimalized = false;
+    setMenu(items) {
+        this.resetSidemenuState(items);
+        this._menuItems.next(items);
+    }
+    saveMinimalizedState(minimalized) {
+        this.stateToken.minimalized = minimalized;
+        localStorage.setItem('SideMenuStateToken', JSON.stringify(this.stateToken));
+    }
+    saveExpandedState(item) {
+        const expanded = this.stateToken.expanded?.find((i) => i === item.label);
+        if (!expanded) {
+            this.stateToken.expanded?.push(item.label);
+            localStorage.setItem('SideMenuStateToken', JSON.stringify(this.stateToken));
+            return;
+        }
+        this.stateToken.expanded = this.stateToken.expanded?.filter((i) => i !== item.label);
+        localStorage.setItem('SideMenuStateToken', JSON.stringify(this.stateToken));
+    }
+    resetSidemenuState(items) {
+        if (typeof this.stateToken === 'string') {
+            this.stateToken = JSON.parse(this.stateToken);
+        }
+        this.menuMinimalized = this.stateToken.minimalized;
+        const localStorageValue = this.stateToken.expanded;
+        if (!localStorageValue)
+            return;
+        if (items) {
+            for (let index = 0; index < items.length; index++) {
+                const element = items[index];
+                element.expanded = !!localStorageValue.find((i) => i === element.label);
+            }
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: SideMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: SideMenuService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: SideMenuService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class SideMenuProviderService {
+    menu;
+    menuService;
+    constructor(menu = [], menuService) {
+        this.menu = menu;
+        this.menuService = menuService;
+        menuService.setMenu(menu);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: SideMenuProviderService, deps: [{ token: MENU_TOKEN, optional: true }, { token: SideMenuService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: SideMenuProviderService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: SideMenuProviderService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [MENU_TOKEN]
+                }] }, { type: SideMenuService }] });
+
+class MenuServiceDirective extends UnsubscribeComponent {
+    menuService = inject(SideMenuService);
+    cdr = inject(ChangeDetectorRef);
+    sideMenu = inject(SIDE_MENU_COMPONENT_TOKEN);
+    ngAfterViewInit() {
+        this.menuService.menuItems$.pipe(takeUntil(this.destroyed$)).subscribe((items) => {
+            if (this.sideMenu) {
+                this.sideMenu.items = items;
+            }
+        });
+        this.cdr.detectChanges();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: MenuServiceDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: MenuServiceDirective, isStandalone: true, selector: "v-side-menu[useMenuService]", exportAs: ["useMenuService"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: MenuServiceDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'v-side-menu[useMenuService]',
+                    exportAs: 'useMenuService',
+                    standalone: true,
+                }]
+        }] });
+
+const SLIDER_COMPONENT_TOKEN = new InjectionToken('SliderComponentToken');
+
+const SNACKBAR_COMPONENT_TOKEN = new InjectionToken('SnackbarComponentToken');
+
+const STEPPER_COMPONENT_TOKEN = new InjectionToken('StepperComponentToken');
+
+const SWITCH_COMPONENT_TOKEN = new InjectionToken('SwitchComponentToken');
+
+const TAB_VIEW_COMPONENT_TOKEN = new InjectionToken('TabVIewComponentToken');
+
+const TABLE_COMPONENT_TOKEN = new InjectionToken('TabVIewComponentToken');
+const TABLE_COLUMN_PROVIDER = new InjectionToken('TABLE_COLUMN_PROVIDER');
+var TableSelectionMode;
+(function (TableSelectionMode) {
+    TableSelectionMode["single"] = "single";
+    TableSelectionMode["multiple"] = "multiple";
+})(TableSelectionMode || (TableSelectionMode = {}));
+var TableButtonSeverity;
+(function (TableButtonSeverity) {
+    TableButtonSeverity["success"] = "success";
+    TableButtonSeverity["info"] = "info";
+    TableButtonSeverity["warning"] = "warning";
+    TableButtonSeverity["danger"] = "danger";
+    TableButtonSeverity["help"] = "help";
+    TableButtonSeverity["primary"] = "primary";
+    TableButtonSeverity["secondary"] = "secondary";
+    TableButtonSeverity["contrast"] = "contrast";
+})(TableButtonSeverity || (TableButtonSeverity = {}));
+var ColumnVisibility;
+(function (ColumnVisibility) {
+    ColumnVisibility["visible"] = "visible";
+    ColumnVisibility["hidden"] = "hidden";
+    ColumnVisibility["default"] = "default";
+})(ColumnVisibility || (ColumnVisibility = {}));
+function LinkRenderer(text, href) {
+    return (row, index) => {
+        return '<a href="' + href + '">' + text + '</a>';
+    };
+}
+function routerRenderer(link, text) {
+    return (row, index) => {
+        return { text: text, link: link };
+    };
+}
+function Renderer(fnc) {
+    return (row) => {
+        return fnc(row);
+    };
+}
+class ColumnModel {
+    configuration;
+    sortDirection = undefined;
+    columnClass;
+    queryParams;
+    routerLink;
+    valueGetter;
+    headerGetter;
+    template;
+    actions;
+    sortable;
+    id;
+    // eslint-disable-next-line @typescript-eslint/ban-types
+    format;
+    textAlign;
+    width;
+    forceVisibility = ColumnVisibility.default;
+    visible = true;
+    constructor(configuration) {
+        this.configuration = configuration;
+        this.id = this.configuration.id;
+        if (this.configuration.format) {
+            this.format = this.configuration.format;
+        }
+        if (this.configuration.value) {
+            this.valueGetter = (row, index) => {
+                const value = this.configuration.value?.(row, index) ?? '-';
+                return this.format ? this.format(value, row) : value;
+            };
+        }
+        else {
+            this.valueGetter = (row) => {
+                const value = (row?.[this.configuration.id]) ?? '';
+                return this.format ? this.format(value, row) : value;
+            };
+        }
+        if (this.configuration.actions) {
+            this.actions = this.configuration.actions;
+        }
+        if (this.configuration.routerLink) {
+            this.routerLink = this.configuration.routerLink;
+        }
+        if (this.configuration.columnClass) {
+            this.columnClass = this.configuration.columnClass;
+        }
+        if (this.configuration.template) {
+            this.template = this.configuration.template;
+        }
+        if (this.configuration.headerName) {
+            this.headerGetter = (typeof this.configuration.headerName === 'string'
+                ? () => this.configuration.headerName ?? ''
+                : (columnId, index) => (this.configuration.headerName)?.(columnId, index) ?? this.id);
+        }
+        else {
+            this.headerGetter = () => "";
+        }
+        if (this.configuration.queryParams) {
+            this.queryParams = this.configuration.queryParams;
+        }
+        if (this.routerLink) {
+            this.columnClass += ' ' + 'link';
+        }
+        if (this.configuration.sortable !== undefined) {
+            this.sortable = this.configuration.sortable;
+        }
+        else {
+            this.sortable = true;
+        }
+        if (this.configuration.width) {
+            this.width = typeof this.configuration.width === "number" ? this.configuration.width + 'px' : this.configuration.width;
+        }
+        if (this.configuration.textAlign !== undefined) {
+            this.textAlign = this.configuration.textAlign;
+        }
+        if (this.configuration.forceVisibility) {
+            this.forceVisibility = this.configuration.forceVisibility;
+        }
+        if (this.configuration.visible !== undefined) {
+            this.visible = this.configuration.visible;
+        }
+    }
+}
+class RowModel {
+    row;
+    index;
+    id;
+    selected;
+    marked;
+    focused;
+    expanded;
+    fnc;
+    customRoute;
+    constructor(row, selected, expanded, marked, index, fnc, customRoute, entityKey) {
+        this.row = row;
+        this.id = row['id'] ?? v4();
+        this.index = index;
+        this.selected = selected;
+        this.expanded = expanded;
+        this.marked = marked;
+        this.fnc = fnc;
+        this.customRoute = createCustomRoute(row, entityKey, customRoute);
+    }
+}
+function createCustomRoute(row, entityKey, customRoute) {
+    return customRoute && entityKey
+        ? `${customRoute}/` + row[entityKey]
+        : undefined;
+}
+
+class TableColumnDirective {
+    template;
+    index = 0;
+    id;
+    columnClass;
+    sortable;
+    routerLink;
+    queryParams;
+    headerName;
+    width;
+    textAlign = FieldAlign.left;
+    format;
+    forceVisibility = ColumnVisibility.default;
+    visible = true;
+    getDefinition() {
+        return {
+            id: this.id,
+            columnClass: this.columnClass,
+            template: this.template,
+            headerName: this.headerName,
+            routerLink: this.routerLink,
+            queryParams: this.queryParams,
+            sortable: this.sortable,
+            width: this.width,
+            format: this.format,
+            textAlign: this.textAlign,
+            forceVisibility: this.forceVisibility,
+            visible: this.visible,
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: TableColumnDirective, isStandalone: true, selector: "v-table-column", inputs: { index: "index", id: "id", columnClass: "columnClass", sortable: "sortable", routerLink: "routerLink", queryParams: "queryParams", headerName: "headerName", width: "width", textAlign: "textAlign", format: "format", forceVisibility: "forceVisibility", visible: "visible" }, providers: [
+            {
+                provide: TABLE_COLUMN_PROVIDER,
+                useExisting: TableColumnDirective,
+                multi: true,
+            },
+        ], queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableColumnDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'v-table-column',
+                    standalone: true,
+                    providers: [
+                        {
+                            provide: TABLE_COLUMN_PROVIDER,
+                            useExisting: TableColumnDirective,
+                            multi: true,
+                        },
+                    ],
+                }]
+        }], propDecorators: { template: [{
+                type: ContentChild,
+                args: [TemplateRef]
+            }], index: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], columnClass: [{
+                type: Input
+            }], sortable: [{
+                type: Input
+            }], routerLink: [{
+                type: Input
+            }], queryParams: [{
+                type: Input
+            }], headerName: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], textAlign: [{
+                type: Input
+            }], format: [{
+                type: Input
+            }], forceVisibility: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }] } });
+
+class ColumnConfiguration {
+    id;
+    column = {};
+    constructor(id) {
+        this.id = id;
+        this.column.id = id;
+    }
+    headerName(headerName) {
+        this.column.headerName = headerName;
+        return this;
+    }
+    sortable(sortable) {
+        this.column.sortable = sortable;
+        return this;
+    }
+    columnClass(columnClass) {
+        this.column.columnClass = columnClass;
+        return this;
+    }
+    valueFunction(value) {
+        this.column.value = value;
+        return this;
+    }
+    type(type) {
+        this.column.type = type;
+        return this;
+    }
+    build() {
+        return this.column;
+    }
+}
+
+class TableBuilder {
+    columns = [];
+    addColumn(id, config) {
+        const columnConfig = new ColumnConfiguration(id);
+        config?.(columnConfig);
+        this.columns.push(columnConfig.build());
+        return this;
+    }
+    addTextColumn(id, config) {
+        return this.addColumn(id, (x) => {
+            config?.(x);
+            x.type('text');
+        });
+    }
+    addNumberColumn(id, config) {
+        return this.addColumn(id, (x) => {
+            config?.(x);
+            x.type('number').columnClass('text-end');
+        });
+    }
+    addDateColumn(id, config) {
+        return this.addColumn(id, (x) => {
+            config?.(x);
+            x.type('date').valueFunction((row) => covertFromDateToUserLocale(row, id));
+        });
+    }
+    addBooleanColumn(id, config) {
+        return this.addColumn(id, (x) => {
+            config?.(x);
+            x.type('boolean');
+        });
+    }
+    addEnumColumn(id, config) {
+        return this.addColumn(id, (x) => {
+            config?.(x);
+            x.type('enum');
+        });
+    }
+    build() {
+        return this.columns;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableBuilder, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableBuilder, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableBuilder, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+function covertFromDateToUserLocale(row, id) {
+    const value = row[id];
+    if (value === undefined) {
+        return '';
+    }
+    const locale = navigator.language;
+    if (value instanceof Date) {
+        return value.toLocaleDateString(locale);
+    }
+    if (typeof value === 'string' && !isNaN(Date.parse(value))) {
+        return new Date(value).toLocaleDateString(locale);
+    }
+    return value;
+}
+
+const TABLE_FILTER_COMPONENT_TOKEN = new InjectionToken('TableFilterComponentToken');
+
+const TEXTAREA_COMPONENT_TOKEN = new InjectionToken('TextareaComponentToken');
+
+const TEXTFIELD_COMPONENT_TOKEN = new InjectionToken('TextfieldComponentToken');
+
+const TOOLTIP_COMPONENT_TOKEN = new InjectionToken('TooltipComponentToken');
+
+const ICONS_COMPONENT_TOKEN = new InjectionToken('IconsComponentToken');
+
+class IconsComponent {
+    library = input('native', ...(ngDevMode ? [{ debugName: "library" }] : []));
+    name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
+    size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : []));
+    severity = input(...(ngDevMode ? [undefined, { debugName: "severity" }] : []));
+    class = input(...(ngDevMode ? [undefined, { debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: IconsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.1", type: IconsComponent, isStandalone: true, selector: "ng-component", inputs: { library: { classPropertyName: "library", publicName: "library", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            {
+                provide: ICONS_COMPONENT_TOKEN,
+                useExisting: IconsComponent
+            }
+        ], ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: IconsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    template: '',
+                    providers: [
+                        {
+                            provide: ICONS_COMPONENT_TOKEN,
+                            useExisting: IconsComponent
+                        }
+                    ]
+                }]
+        }] });
+
+const TAG_COMPONENT_TOKEN = new InjectionToken('TagComponentToken');
+
+class DatasourceDirective extends UnsubscribeComponent {
+    datasource;
+    autoBind = true;
+    loadingText = '... loading ...';
+    filterField = 'fulltext';
+    transformFn;
+    extraFilter;
+    get activeComponent() {
+        return (this.dropdownComponent ??
+            this.multiSelectComponent ??
+            this.genericField);
+    }
+    httpClient = inject(HttpClient);
+    baseUrl = inject(BASE_URL_PATH);
+    changeDetectorRef = inject(ChangeDetectorRef);
+    isAllDataLoaded = false;
+    parameters$ = new BehaviorSubject({});
+    lastParameter = {};
+    dropdownComponent = inject(DROPDOWN_COMPONENT_TOKEN, { optional: true });
+    multiSelectComponent = inject(MULTISELECT_COMPONENT_TOKEN, {
+        optional: true,
+    });
+    genericField = inject(GENERIC_FIELD_COMPONENT_TOKEN, { optional: true });
+    dataSourceService;
+    loadingPlaceholderItem = {};
+    ngOnInit() {
+        this.activeComponent.showed
+            .pipe(takeUntil(this.destroyed$))
+            .subscribe(() => {
+            if (!this.autoBind &&
+                !this.activeComponent.options &&
+                !this.activeComponent.loading) {
+                this.parameters$.next({});
+            }
+        });
+        this.activeComponent.lazyLoad
+            .pipe(takeUntil(this.destroyed$))
+            .subscribe((value) => {
+            this.parameters$.next({ offset: value?.offset, limit: value?.limit });
+        });
+        this.activeComponent.filtered
+            .pipe(takeUntil(this.destroyed$))
+            .subscribe((value) => {
+            const property = this.filterField ?? this.activeComponent.optionLabel;
+            if (property) {
+                this.parameters$.next({
+                    offset: 0,
+                    filter: {
+                        [property]: value.filter ? value.filter : undefined,
+                        ...(this.extraFilter ?? {})
+                    },
+                    useNewData: true,
+                });
+            }
+        });
+        this.parameters$
+            .pipe(takeUntil(this.destroyed$), filter(request => !this.isDataForRequestLoaded(request)), map((request) => {
+            const extendedParams = normalizeRequest({ ...this.lastParameter, ...request }, DEFAULT_SEARCH_LIMIT);
+            extendedParams.useNewData = request.useNewData ?? false;
+            return extendedParams;
+        }), tap((request) => {
+            this.lastParameter = request;
+        }), debounceTime(DEFAULT_DEBOUNCE_TIME), tap(() => {
+            this.changeComponent(this.activeComponent, {
+                loading: true,
+            });
+        }), switchMap((request) => this.dataSourceService
+            ? this.dataSourceService(request).pipe(map((response) => ({ request, response })))
+            : of({
+                request,
+                response: {
+                    data: [],
+                    total: 0,
+                    limit: request.limit,
+                    offset: request.offset,
+                },
+            })), catchError((request) => {
+            this.changeComponent(this.activeComponent, {
+                loading: false,
+            });
+            return of({
+                request: request,
+                response: {
+                    data: [],
+                    total: 0,
+                    limit: request.limit,
+                    offset: request.offset,
+                },
+            });
+        }))
+            .subscribe(({ request, response }) => this.setDataToControl(request, response));
+    }
+    ngOnChanges(changes) {
+        if (changes['datasource']) {
+            this.dataSourceService = convertDatasource(this.datasource, this.baseUrl, this.httpClient);
+            if (this.autoBind) {
+                this.parameters$.next({ offset: 0 });
+            }
+        }
+    }
+    isDataForRequestLoaded(request) {
+        if (request.useNewData) {
+            return false;
+        }
+        const offset = request.offset ?? 0;
+        const limit = request.limit ?? DEFAULT_SEARCH_LIMIT;
+        const options = this.activeComponent.options;
+        if (!options) {
+            return false;
+        }
+        if (options.length < offset + limit) {
+            return false;
+        }
+        const allItemsFilled = options.slice(offset, offset + limit).every(item => item !== undefined && item != this.loadingPlaceholderItem);
+        return allItemsFilled;
+    }
+    setDataToControl(request, result) {
+        this.isAllDataLoaded = result.total <= result.data.length;
+        const data = result.data;
+        const total = result.total;
+        const offset = request.offset;
+        const transferedData = this.transformFn
+            ? data.map((x) => this.transformFn?.(x))
+            : data;
+        if (this.activeComponent.optionLabel) {
+            this.loadingPlaceholderItem[this.activeComponent.optionLabel] =
+                this.loadingText;
+        }
+        if (this.activeComponent.optionValue) {
+            this.loadingPlaceholderItem[this.activeComponent.optionValue] = -1;
+        }
+        const options = request.useNewData ? undefined : this.activeComponent.options;
+        const newOptions = setDataToArray(options, transferedData, offset, total, this.loadingPlaceholderItem);
+        this.changeComponent(this.activeComponent, {
+            options: newOptions,
+            loading: false,
+            lazy: !this.isAllDataLoaded,
+        });
+    }
+    changeComponent(component, value) {
+        setComponentProperties(component, value);
+        this.changeDetectorRef.detectChanges();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DatasourceDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: DatasourceDirective, isStandalone: true, selector: "v-dropdown[useDatasource], v-multiselect[useDatasource], v-generic-field[useDatasource]", inputs: { datasource: "datasource", autoBind: "autoBind", loadingText: "loadingText", filterField: "filterField", transformFn: "transformFn", extraFilter: "extraFilter" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: DatasourceDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    'v-dropdown[useDatasource], v-multiselect[useDatasource], v-generic-field[useDatasource]',
+                    standalone: true,
+                }]
+        }], propDecorators: { datasource: [{
+                type: Input
+            }], autoBind: [{
+                type: Input
+            }], loadingText: [{
+                type: Input
+            }], filterField: [{
+                type: Input
+            }], transformFn: [{
+                type: Input
+            }], extraFilter: [{
+                type: Input
+            }] } });
+
+class TableDatasourceDirective extends UnsubscribeComponent {
+    store = inject(Store);
+    autoBind = true;
+    tableName;
+    debounceTime = DEFAULT_DEBOUNCE_TIME;
+    datasource;
+    extraFilter;
+    transformFn;
+    tableComponent = inject(TABLE_COMPONENT_TOKEN, {
+        self: true,
+    });
+    changeDetectorRef = inject(ChangeDetectorRef);
+    httpClient = inject(HttpClient);
+    baseUrl = inject(BASE_URL_PATH);
+    dataSourceService;
+    parameters$ = new BehaviorSubject({});
+    params$ = this.parameters$.asObservable();
+    ngOnInit() {
+        if (!this.tableName) {
+            throw new Error('Property tableName must be defined.');
+        }
+        this.tableComponent.lazyLoad.pipe(takeUntil(this.destroyed$)).subscribe((value) => {
+            this.parameters$.next({
+                offset: value?.offset,
+                limit: value?.limit,
+                filter: { ...value?.filter, ...this.extraFilter },
+                sort: value?.sort,
+            });
+        });
+        this.parameters$
+            .pipe(takeUntil(this.destroyed$), map((request) => normalizeRequest({
+            ...request,
+            filter: { ...request.filter, ...this.extraFilter },
+        })), debounceTime(this.debounceTime), tap(() => {
+            this.changeComponent(this.tableComponent, {
+                lazy: true,
+                loading: true,
+            });
+        }), switchMap((request) => this.dataSourceService
+            ? this.dataSourceService(request).pipe(map((response) => ({ request, response })))
+            : of({
+                request,
+                response: {
+                    data: [],
+                    total: 0,
+                    limit: request.limit,
+                    offset: request.offset,
+                },
+            })), catchError((request) => {
+            this.changeComponent(this.tableComponent, {
+                loading: false,
+            });
+            return of({
+                request: request,
+                response: {
+                    data: [],
+                    total: 0,
+                    limit: request.limit,
+                    offset: request.offset,
+                },
+            });
+        }))
+            .subscribe(({ request, response }) => this.setDataToControl(request, response));
+    }
+    ngOnChanges(changes) {
+        if (changes['datasource']) {
+            this.dataSourceService = convertDatasource(this.datasource, this.baseUrl, this.httpClient);
+            if (this.autoBind) {
+                this.parameters$.next({ offset: 0 });
+            }
+        }
+    }
+    reload() {
+        this.parameters$.next({ ...this.parameters$.value });
+    }
+    changeComponent(component, value) {
+        setComponentProperties(component, value);
+        this.changeDetectorRef.detectChanges();
+    }
+    setDataToControl(request, result) {
+        const data = result.data;
+        const total = result.total;
+        const transferedData = this.transformFn ? data.map((x) => this.transformFn?.(x)) : data;
+        this.changeComponent(this.tableComponent, {
+            lazy: !isFilterEmpty(request.filter) || data?.length < total || this.datasource instanceof BaseHttpService,
+            data: transferedData,
+            loading: false,
+            total,
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableDatasourceDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: TableDatasourceDirective, isStandalone: true, selector: "v-table[useDatasource]", inputs: { autoBind: "autoBind", tableName: "tableName", debounceTime: "debounceTime", datasource: "datasource", extraFilter: "extraFilter", transformFn: "transformFn" }, exportAs: ["useDatasource"], usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableDatasourceDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'v-table[useDatasource]',
+                    exportAs: 'useDatasource',
+                    standalone: true,
+                }]
+        }], propDecorators: { autoBind: [{
+                type: Input
+            }], tableName: [{
+                type: Input,
+                args: [{ required: true }]
+            }], debounceTime: [{
+                type: Input
+            }], datasource: [{
+                type: Input
+            }], extraFilter: [{
+                type: Input
+            }], transformFn: [{
+                type: Input
+            }] } });
+
+class ButtonShortCutDirective {
+    shortCutFn;
+    shortCutKey;
+    keyMap = {};
+    onKeyDown(event) {
+        this.keyMap[event.key.toLowerCase()] = true;
+        this.checkShortcut();
+    }
+    onKeyUp(event) {
+        this.keyMap[event.key.toLowerCase()] = false;
+    }
+    checkShortcut() {
+        if (this.shortCutKey && this.shortCutFn) {
+            const keys = this.shortCutKey.toLowerCase().split('+');
+            const isShortcutPressed = keys.every((key) => this.keyMap[key]);
+            if (isShortcutPressed) {
+                this.shortCutFn?.();
+                keys.forEach((key) => (this.keyMap[key] = false));
+            }
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ButtonShortCutDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: ButtonShortCutDirective, isStandalone: true, selector: "v-button[useShortCut]", inputs: { shortCutFn: "shortCutFn", shortCutKey: "shortCutKey" }, host: { listeners: { "document:keydown": "onKeyDown($event)", "document:keyup": "onKeyUp($event)" } }, exportAs: ["useShortCut"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ButtonShortCutDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'v-button[useShortCut]',
+                    exportAs: 'useShortCut',
+                    standalone: true,
+                }]
+        }], propDecorators: { shortCutFn: [{
+                type: Input
+            }], shortCutKey: [{
+                type: Input
+            }], onKeyDown: [{
+                type: HostListener,
+                args: ['document:keydown', ['$event']]
+            }], onKeyUp: [{
+                type: HostListener,
+                args: ['document:keyup', ['$event']]
+            }] } });
+
+class TableFilterDirective {
+    filterComponent;
+    filterChange$ = new Subject();
+    subscription = undefined;
+    tableComponent = inject(TABLE_COMPONENT_TOKEN);
+    changeDetectorRef = inject(ChangeDetectorRef);
+    ngOnChanges(changes) {
+        if (changes['filterComponent']) {
+            this.unRegister();
+            this.register();
+        }
+    }
+    onFilterChange(value) {
+        if (this.tableComponent?.filter !== value) {
+            setComponentProperties(this.tableComponent, {
+                filter: value,
+                currentPage: 1,
+            });
+            this.changeDetectorRef.detectChanges();
+        }
+    }
+    ngOnDestroy() {
+        this.unRegister();
+    }
+    unRegister() {
+        this.subscription?.unsubscribe();
+    }
+    register() {
+        this.filterComponent.registerOnChange((value) => {
+            this.filterChange$.next(value);
+        });
+        this.subscription = this.filterChange$
+            .pipe(debounceTime(this.filterComponent.debounceTime ? 0 : DEFAULT_DEBOUNCE_TIME))
+            .subscribe((value) => this.onFilterChange(value));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.1", type: TableFilterDirective, isStandalone: true, selector: "v-table[useFilter]", inputs: { filterComponent: "filterComponent" }, exportAs: ["tableFilterDirective"], usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: TableFilterDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'v-table[useFilter]',
+                    standalone: true,
+                    exportAs: 'tableFilterDirective',
+                }]
+        }], propDecorators: { filterComponent: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+const ErrorCodesFns = {
+    required: () => `This field is required!`,
+    email: () => `Email is in wrong format!`,
+    iban: () => `IBAN is in wrong format!`,
+    lowStrength: () => `Password too weak!`,
+    customPasswordRequirements: () => `Password does not meet minimal requirements.`,
+    fieldsNotMatching: () => `Passwords are not the same!`,
+    validationError: (value) => `${value}`,
+};
+
+function getFirstErrorFromControl(control) {
+    if (!control || !control.errors) {
+        return null;
+    }
+    const errors = control.errors ?? false;
+    if (errors) {
+        const key = Object.keys(control.errors)[0];
+        const value = control.errors[key];
+        return { key, value };
+    }
+    return null;
+}
+function getFirstError(errors) {
+    if (errors) {
+        const key = Object.keys(errors)[0];
+        const value = errors[key];
+        return { key, value };
+    }
+    return null;
+}
+
+const EMPTY$1 = '';
+class ErrorPipe {
+    transform(errors) {
+        if (!errors) {
+            return EMPTY$1;
+        }
+        const error = getFirstError(errors);
+        if (error) {
+            const errorFn = ErrorCodesFns[error.key];
+            if (!errorFn) {
+                return EMPTY$1;
+            }
+            return ErrorCodesFns[error.key](error.value);
+        }
+        return EMPTY$1;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ErrorPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: ErrorPipe, isStandalone: true, name: "error" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ErrorPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'error',
+                    standalone: true,
+                }]
+        }] });
+
+const WarningCodesFns = {
+    validationWarning: (value) => `${value}`,
+};
+
+const EMPTY = '';
+class WarningPipe {
+    transform(warnings) {
+        if (!warnings) {
+            return EMPTY;
+        }
+        const error = getFirstError(warnings);
+        if (error) {
+            const errorFn = WarningCodesFns[error.key];
+            if (!errorFn) {
+                return EMPTY;
+            }
+            return WarningCodesFns[error.key](error.value);
+        }
+        return EMPTY;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: WarningPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: WarningPipe, isStandalone: true, name: "warning" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: WarningPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'warning',
+                    standalone: true,
+                }]
+        }] });
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+class KeyOrFunctionPipe {
+    transform(keyOrFn, row) {
+        if (keyOrFn instanceof Function) {
+            return keyOrFn(row);
+        }
+        else if (typeof keyOrFn === 'string') {
+            const value = row[keyOrFn];
+            if (value) {
+                return value;
+            }
+        }
+        else if (typeof keyOrFn === 'boolean') {
+            return keyOrFn;
+        }
+        return '';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: KeyOrFunctionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: KeyOrFunctionPipe, isStandalone: true, name: "keyOrFn", pure: false });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: KeyOrFunctionPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'keyOrFn',
+                    pure: false,
+                    standalone: true,
+                }]
+        }] });
+
+class EnumToListPipe {
+    transform(data) {
+        return Object.keys(data)
+            .filter(key => isNaN(Number(key)))
+            .map(key => ({
+            label: key,
+            value: data[key],
+        }));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: EnumToListPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: EnumToListPipe, isStandalone: true, name: "enumToList" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: EnumToListPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'enumToList',
+                    standalone: true,
+                }]
+        }] });
+
+/* eslint-disable @typescript-eslint/ban-types */
+class Format {
+    static concatArray(value, itemFormatter, delimeter = ';') {
+        if (!value) {
+            return '';
+        }
+        return value
+            .map(item => itemFormatter ? itemFormatter(item) : item)
+            .filter(item => item !== undefined && item !== null)
+            .join(`${delimeter} `);
+    }
+    static czechDate(value) {
+        return toCzechDateTimeString(value);
+    }
+    static date(value) {
+        if (!value) {
+            return '';
+        }
+        if (typeof value === 'string') {
+            value = new Date(value);
+        }
+        return value.getDate() + '. ' + (value.getMonth() + 1) + '. ' + value.getFullYear();
+    }
+    static dateAndTime(value) {
+        if (!value) {
+            return '';
+        }
+        if (typeof value === 'string') {
+            value = new Date(value);
+        }
+        return ('0' + value.getDate()).slice(-2)
+            + '.' + ('0' + (value.getMonth() + 1)).slice(-2)
+            + '.' + value.getFullYear() + ' ' + ('0' + value.getHours()).slice(-2)
+            + ':' + ('0' + value.getMinutes()).slice(-2) + ':' + ('0' + value.getSeconds()).slice(-2);
+    }
+    static convertToUserLocaleDate(value) {
+        if (!value) {
+            return '';
+        }
+        if (typeof value === 'string') {
+            value = new Date(value);
+        }
+        return value.toLocaleDateString(navigator.language, { timeZone: 'UTC' });
+    }
+    static bool(value) {
+        if (value) {
+            return 'Yes';
+        }
+        else {
+            return 'No';
+        }
+    }
+    static boolWithIcon(value) {
+        if (value) {
+            return `<span>✓</span>`;
+        }
+        else {
+            return `<span>⨯</span>`;
+        }
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ACTION_BUTTON_GROUP_COMPONENT_TOKEN, BREADCRUMB_COMPONENT_TOKEN, BUTTON_COMPONENT_TOKEN, BaseFormDirective, BaseFormInputComponent, BaseInputControls, BreadcrumbCoreComponent, BreadcrumbService, ButtonShortCutDirective, CALENDAR_COMPONENT_TOKEN, CHECKBOX_COMPONENT_TOKEN, CONFIRM_DIALOG_COMPONENT_TOKEN, ColumnConfiguration, ColumnModel, ColumnVisibility, ControlSeverity, DEFAULT_DEBOUNCE_TIME, DEFAULT_PAGINATION, DROPDOWN_BUTTON_COMPONENT_TOKEN, DROPDOWN_COMPONENT_TOKEN, DatasourceDirective, DetailStoreDirective, DialogService, EnumToListPipe, ErrorCodesFns, ErrorPipe, FILTER_COMPONENT_TOKEN, FORM_FIELD_COMPONENT_TOKEN, FieldAlign, FieldSize, FieldType, Format, GENERIC_FIELD_COMPONENT_TOKEN, GenericFieldType, GovButtonType, GovControlSeverity, HEADER_COMPONENT_TOKEN, ICONS_COMPONENT_TOKEN, INPUT_GROUP_COMPONENT_TOKEN, IconPosition, IconsComponent, KeyOrFunctionPipe, LOADER_COMPONENT_TOKEN, LOGO_ROUTER_ROUTE, LayoutType, LinkRenderer, MAX_COLUMN_CHAR_COUNT, MENU_TOKEN, MULTISELECT_COMPONENT_TOKEN, MenuServiceDirective, NUMBER_INPUT_COMPONENT_TOKEN, PAGE_HEADER_COMPONENT_TOKEN, PASSWORD_COMPONENT_TOKEN, PageHeaderCoreComponent, PageHeaderService, PasswordStrength, Position, PreventUnsavedChangesDirective, RADIOBUTTON_COMPONENT_TOKEN, Renderer, RowModel, SECTION_COMPONENT_TOKEN, SETTINGS_MENU, SIDE_MENU_COMPONENT_TOKEN, SIDE_MENU_STATE_TOKEN, SLIDER_COMPONENT_TOKEN, SNACKBAR_COMPONENT_TOKEN, STEPPER_COMPONENT_TOKEN, SWITCH_COMPONENT_TOKEN, ScreenSizeService, SideMenuProviderService, SideMenuService, SlotPosition, TABLE_COLUMN_PROVIDER, TABLE_COMPONENT_TOKEN, TABLE_FILTER_COMPONENT_TOKEN, TAB_VIEW_COMPONENT_TOKEN, TAG_COMPONENT_TOKEN, TEXTAREA_COMPONENT_TOKEN, TEXTFIELD_COMPONENT_TOKEN, TOOLTIP_COMPONENT_TOKEN, TableBuilder, TableButtonSeverity, TableColumnDirective, TableDatasourceDirective, TableFilterDirective, TableSelectionMode, TableService, UnsubscribeComponent, WarningCodesFns, WarningPipe, downloadFile, downloadText, getFirstError, getFirstErrorFromControl, isFilterEmpty, isFormStateEqual, queryListChanged, routerRenderer, setComponentProperties, setDataToArray };
+//# sourceMappingURL=verisoft-ui-core.mjs.map