@lenne.tech/ng-base 13.12.0 → 13.13.0

package/esm2020/base-components/components/model-table/model-table.component.mjs

@@ -0,0 +1,137 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { GraphQLRequestType } from '@lenne.tech/ng-base/shared';
+import * as i0 from "@angular/core";
+import * as i1 from "@lenne.tech/ng-base/shared";
+import * as i2 from "../model-form/model-form.component";
+import * as i3 from "@angular/common";
+export class ModelTableComponent {
+    constructor(graphQLMetaService, graphQLService) {
+        this.graphQLMetaService = graphQLMetaService;
+        this.graphQLService = graphQLService;
+        this.createMode = false;
+        this.create = true;
+        this.update = true;
+        this.delete = true;
+        this.tableFields = ['id', 'name', 'title', 'description', 'email', 'createdAt', 'updatedAt'];
+        this.idSelected = new EventEmitter();
+        this.createModeChanged = new EventEmitter();
+        this.objects = [];
+        this.availableFields = [];
+        this.selectedId = '';
+    }
+    ngOnInit() {
+        this.graphQLMetaService.getMeta().subscribe((meta) => {
+            this.meta = meta;
+            if (this.modelName) {
+                this.init();
+            }
+            if (this.objectId) {
+                this.selectedId = this.objectId;
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        if (changes['modelName'] && this.meta) {
+            this.init();
+        }
+        if (changes['objectId'] && this.meta) {
+            if (this.selectedId !== this.objectId) {
+                this.selectedId = this.objectId;
+            }
+        }
+    }
+    /**
+     * We're using the `meta` service to get the fields that are available for the `find` query for the model we're working
+     * with. We're then using that information to populate the `availableFields` array
+     */
+    init() {
+        this.availableFields = [];
+        const possibleFields = this.meta.getFields('find' + this.capitalizeFirstLetter(this.modelName) + 's');
+        const keys = Object.keys(possibleFields);
+        this.tableFields?.forEach((field) => {
+            if (keys.includes(field)) {
+                this.availableFields.push(field);
+            }
+        });
+        this.loadObjects(this.availableFields);
+    }
+    /**
+     * When the user clicks the "Create New" button, the createModeChanged event is emitted, which is then handled by the
+     * parent component
+     */
+    createNewObject() {
+        this.createMode = true;
+        this.createModeChanged.emit(true);
+    }
+    /**
+     * It loads the objects from the database and stores them in the objects variable
+     *
+     * @param fields - string[] - The fields you want to load from the database.
+     */
+    loadObjects(fields) {
+        this.objects = [];
+        this.graphQLService
+            .graphQl('find' + this.capitalizeFirstLetter(this.modelName) + 's', {
+            fields,
+            type: GraphQLRequestType.QUERY,
+        })
+            .subscribe({
+            next: (value) => {
+                this.objects = value;
+            },
+            error: (err) => {
+                console.log('Error on loading objects', err);
+            },
+        });
+    }
+    /**
+     * If the update property is true, then set the selectedId property to the id of the object passed in, and emit the
+     * selectedId property
+     *
+     * @param object - any - this is the object that is passed in from the child component.
+     */
+    selectId(object) {
+        if (!object) {
+            this.createMode = false;
+            this.createModeChanged.emit(false);
+        }
+        if (this.update) {
+            this.selectedId = object['id'];
+            this.idSelected.emit(this.selectedId);
+        }
+    }
+    /**
+     * It takes a string, capitalizes the first letter, and returns the modified string
+     *
+     * @param value - The string to capitalize.
+     * @returns The first letter of the string is being capitalized and the rest of the string is being returned.
+     */
+    capitalizeFirstLetter(value) {
+        return value.charAt(0).toUpperCase() + value.slice(1);
+    }
+}
+ModelTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ModelTableComponent, deps: [{ token: i1.GraphQLMetaService }, { token: i1.GraphQLService }], target: i0.ɵɵFactoryTarget.Component });
+ModelTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ModelTableComponent, selector: "base-model-table", inputs: { modelName: "modelName", objectId: "objectId", createMode: "createMode", create: "create", update: "update", delete: "delete", tableFields: "tableFields" }, outputs: { idSelected: "idSelected", createModeChanged: "createModeChanged" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!selectedId && !createMode\">\n  <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n    <h1 *ngIf=\"modelName\">{{ capitalizeFirstLetter(modelName) }}s</h1>\n    <div class=\"d-flex align-items-center\">\n      <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n    </div>\n  </div>\n  <table class=\"table table-hover table-responsive bg-white\">\n    <thead>\n      <tr>\n        <th scope=\"col\" *ngFor=\"let field of availableFields\">{{ capitalizeFirstLetter(field) }}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let object of objects\">\n        <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n          {{ object[field] }}\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n  <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n  <base-model-form\n    [modelName]=\"modelName\"\n    [id]=\"selectedId\"\n    (finished)=\"selectId('')\"\n    [delete]=\"delete\"\n  ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"], components: [{ type: i2.ModelFormComponent, selector: "base-model-form", inputs: ["modelName", "id", "delete"], outputs: ["finished"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ModelTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'base-model-table', template: "<div *ngIf=\"!selectedId && !createMode\">\n  <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n    <h1 *ngIf=\"modelName\">{{ capitalizeFirstLetter(modelName) }}s</h1>\n    <div class=\"d-flex align-items-center\">\n      <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n    </div>\n  </div>\n  <table class=\"table table-hover table-responsive bg-white\">\n    <thead>\n      <tr>\n        <th scope=\"col\" *ngFor=\"let field of availableFields\">{{ capitalizeFirstLetter(field) }}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let object of objects\">\n        <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n          {{ object[field] }}\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n  <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n  <base-model-form\n    [modelName]=\"modelName\"\n    [id]=\"selectedId\"\n    (finished)=\"selectId('')\"\n    [delete]=\"delete\"\n  ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.GraphQLMetaService }, { type: i1.GraphQLService }]; }, propDecorators: { modelName: [{
+                type: Input
+            }], objectId: [{
+                type: Input
+            }], createMode: [{
+                type: Input
+            }], create: [{
+                type: Input
+            }], update: [{
+                type: Input
+            }], delete: [{
+                type: Input
+            }], tableFields: [{
+                type: Input
+            }], idSelected: [{
+                type: Output
+            }], createModeChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kZWwtdGFibGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctYmFzZS9iYXNlLWNvbXBvbmVudHMvY29tcG9uZW50cy9tb2RlbC10YWJsZS9tb2RlbC10YWJsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1iYXNlL2Jhc2UtY29tcG9uZW50cy9jb21wb25lbnRzL21vZGVsLXRhYmxlL21vZGVsLXRhYmxlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBcUIsTUFBTSxFQUFpQixNQUFNLGVBQWUsQ0FBQztBQUN6RyxPQUFPLEVBQW1DLGtCQUFrQixFQUFrQixNQUFNLDRCQUE0QixDQUFDOzs7OztBQU9qSCxNQUFNLE9BQU8sbUJBQW1CO0lBaUI5QixZQUFvQixrQkFBc0MsRUFBVSxjQUE4QjtRQUE5RSx1QkFBa0IsR0FBbEIsa0JBQWtCLENBQW9CO1FBQVUsbUJBQWMsR0FBZCxjQUFjLENBQWdCO1FBZHpGLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFDbkIsV0FBTSxHQUFHLElBQUksQ0FBQztRQUNkLFdBQU0sR0FBRyxJQUFJLENBQUM7UUFDZCxXQUFNLEdBQUcsSUFBSSxDQUFDO1FBQ2QsZ0JBQVcsR0FBRyxDQUFDLElBQUksRUFBRSxNQUFNLEVBQUUsT0FBTyxFQUFFLGFBQWEsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFLFdBQVcsQ0FBQyxDQUFDO1FBRXZGLGVBQVUsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBQ3hDLHNCQUFpQixHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7UUFHMUQsWUFBTyxHQUFVLEVBQUUsQ0FBQztRQUNwQixvQkFBZSxHQUFhLEVBQUUsQ0FBQztRQUMvQixlQUFVLEdBQUcsRUFBRSxDQUFDO0lBRXFGLENBQUM7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QUksQ0FBQyxNQUFNLEVBQUU7WUFDZixJQUFJLENBQUMsVUFBVSxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQztZQUMvQixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7U0FDdkM7SUFDSCxDQUFDO0lBRUQ7Ozs7O09BS0c7SUFDSCxxQkFBcUIsQ0FBQyxLQUFhO1FBQ2pDLE9BQU8sS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxXQUFXLEVBQUUsR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ3hELENBQUM7O2dIQXhIVSxtQkFBbUI7b0dBQW5CLG1CQUFtQixrVUNSaEMsa3BDQWdDQTsyRkR4QmEsbUJBQW1CO2tCQUwvQixTQUFTOytCQUNFLGtCQUFrQjtzSUFLbkIsU0FBUztzQkFBakIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFFSSxVQUFVO3NCQUFuQixNQUFNO2dCQUNHLGlCQUFpQjtzQkFBMUIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25DaGFuZ2VzLCBPbkluaXQsIE91dHB1dCwgU2ltcGxlQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgR3JhcGhRTE1ldGEsIEdyYXBoUUxNZXRhU2VydmljZSwgR3JhcGhRTFJlcXVlc3RUeXBlLCBHcmFwaFFMU2VydmljZSB9IGZyb20gJ0BsZW5uZS50ZWNoL25nLWJhc2Uvc2hhcmVkJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYmFzZS1tb2RlbC10YWJsZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9tb2RlbC10YWJsZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL21vZGVsLXRhYmxlLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIE1vZGVsVGFibGVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIG1vZGVsTmFtZTogc3RyaW5nO1xuICBASW5wdXQoKSBvYmplY3RJZDogc3RyaW5nO1xuICBASW5wdXQoKSBjcmVhdGVNb2RlID0gZmFsc2U7XG4gIEBJbnB1dCgpIGNyZWF0ZSA9IHRydWU7XG4gIEBJbnB1dCgpIHVwZGF0ZSA9IHRydWU7XG4gIEBJbnB1dCgpIGRlbGV0ZSA9IHRydWU7XG4gIEBJbnB1dCgpIHRhYmxlRmllbGRzID0gWydpZCcsICduYW1lJywgJ3RpdGxlJywgJ2Rlc2NyaXB0aW9uJywgJ2VtYWlsJywgJ2NyZWF0ZWRBdCcsICd1cGRhdGVkQXQnXTtcblxuICBAT3V0cHV0KCkgaWRTZWxlY3RlZCA9IG5ldyBFdmVudEVtaXR0ZXI8c3RyaW5nPigpO1xuICBAT3V0cHV0KCkgY3JlYXRlTW9kZUNoYW5nZWQgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgbWV0YSE6IEdyYXBoUUxNZXRhO1xuICBvYmplY3RzOiBhbnlbXSA9IFtdO1xuICBhdmFpbGFibGVGaWVsZHM6IHN0cmluZ1tdID0gW107XG4gIHNlbGVjdGVkSWQgPSAnJztcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGdyYXBoUUxNZXRhU2VydmljZTogR3JhcGhRTE1ldGFTZXJ2aWNlLCBwcml2YXRlIGdyYXBoUUxTZXJ2aWNlOiBHcmFwaFFMU2VydmljZSkge31cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmdyYXBoUUxNZXRhU2VydmljZS5nZXRNZXRhKCkuc3Vic2NyaWJlKChtZXRhKSA9PiB7XG4gICAgICB0aGlzLm1ldGEgPSBtZXRhO1xuXG4gICAgICBpZiAodGhpcy5tb2RlbE5hbWUpIHtcbiAgICAgICAgdGhpcy5pbml0KCk7XG4gICAgICB9XG5cbiAgICAgIGlmICh0aGlzLm9iamVjdElkKSB7XG4gICAgICAgIHRoaXMuc2VsZWN0ZWRJZCA9IHRoaXMub2JqZWN0SWQ7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKSB7XG4gICAgaWYgKGNoYW5nZXNbJ21vZGVsTmFtZSddICYmIHRoaXMubWV0YSkge1xuICAgICAgdGhpcy5pbml0KCk7XG4gICAgfVxuXG4gICAgaWYgKGNoYW5nZXNbJ29iamVjdElkJ10gJiYgdGhpcy5tZXRhKSB7XG4gICAgICBpZiAodGhpcy5zZWxlY3RlZElkICE9PSB0aGlzLm9iamVjdElkKSB7XG4gICAgICAgIHRoaXMuc2VsZWN0ZWRJZCA9IHRoaXMub2JqZWN0SWQ7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIFdlJ3JlIHVzaW5nIHRoZSBgbWV0YWAgc2VydmljZSB0byBnZXQgdGhlIGZpZWxkcyB0aGF0IGFyZSBhdmFpbGFibGUgZm9yIHRoZSBgZmluZGAgcXVlcnkgZm9yIHRoZSBtb2RlbCB3ZSdyZSB3b3JraW5nXG4gICAqIHdpdGguIFdlJ3JlIHRoZW4gdXNpbmcgdGhhdCBpbmZvcm1hdGlvbiB0byBwb3B1bGF0ZSB0aGUgYGF2YWlsYWJsZUZpZWxkc2AgYXJyYXlcbiAgICovXG4gIGluaXQoKSB7XG4gICAgdGhpcy5hdmFpbGFibGVGaWVsZHMgPSBbXTtcbiAgICBjb25zdCBwb3NzaWJsZUZpZWxkcyA9IHRoaXMubWV0YS5nZXRGaWVsZHMoJ2ZpbmQnICsgdGhpcy5jYXBpdGFsaXplRmlyc3RMZXR0ZXIodGhpcy5tb2RlbE5hbWUpICsgJ3MnKTtcblxuICAgIGNvbnN0IGtleXMgPSBPYmplY3Qua2V5cyhwb3NzaWJsZUZpZWxkcyk7XG4gICAgdGhpcy50YWJsZUZpZWxkcz8uZm9yRWFjaCgoZmllbGQpID0+IHtcbiAgICAgIGlmIChrZXlzLmluY2x1ZGVzKGZpZWxkKSkge1xuICAgICAgICB0aGlzLmF2YWlsYWJsZUZpZWxkcy5wdXNoKGZpZWxkKTtcbiAgICAgIH1cbiAgICB9KTtcblxuICAgIHRoaXMubG9hZE9iamVjdHModGhpcy5hdmFpbGFibGVGaWVsZHMpO1xuICB9XG5cbiAgLyoqXG4gICAqIFdoZW4gdGhlIHVzZXIgY2xpY2tzIHRoZSBcIkNyZWF0ZSBOZXdcIiBidXR0b24sIHRoZSBjcmVhdGVNb2RlQ2hhbmdlZCBldmVudCBpcyBlbWl0dGVkLCB3aGljaCBpcyB0aGVuIGhhbmRsZWQgYnkgdGhlXG4gICAqIHBhcmVudCBjb21wb25lbnRcbiAgICovXG4gIGNyZWF0ZU5ld09iamVjdCgpIHtcbiAgICB0aGlzLmNyZWF0ZU1vZGUgPSB0cnVlO1xuICAgIHRoaXMuY3JlYXRlTW9kZUNoYW5nZWQuZW1pdCh0cnVlKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBJdCBsb2FkcyB0aGUgb2JqZWN0cyBmcm9tIHRoZSBkYXRhYmFzZSBhbmQgc3RvcmVzIHRoZW0gaW4gdGhlIG9iamVjdHMgdmFyaWFibGVcbiAgICpcbiAgICogQHBhcmFtIGZpZWxkcyAtIHN0cmluZ1tdIC0gVGhlIGZpZWxkcyB5b3Ugd2FudCB0byBsb2FkIGZyb20gdGhlIGRhdGFiYXNlLlxuICAgKi9cbiAgbG9hZE9iamVjdHMoZmllbGRzOiBzdHJpbmdbXSkge1xuICAgIHRoaXMub2JqZWN0cyA9IFtdO1xuICAgIHRoaXMuZ3JhcGhRTFNlcnZpY2VcbiAgICAgIC5ncmFwaFFsKCdmaW5kJyArIHRoaXMuY2FwaXRhbGl6ZUZpcnN0TGV0dGVyKHRoaXMubW9kZWxOYW1lKSArICdzJywge1xuICAgICAgICBmaWVsZHMsXG4gICAgICAgIHR5cGU6IEdyYXBoUUxSZXF1ZXN0VHlwZS5RVUVSWSxcbiAgICAgIH0pXG4gICAgICAuc3Vic2NyaWJlKHtcbiAgICAgICAgbmV4dDogKHZhbHVlKSA9PiB7XG4gICAgICAgICAgdGhpcy5vYmplY3RzID0gdmFsdWU7XG4gICAgICAgIH0sXG4gICAgICAgIGVycm9yOiAoZXJyKSA9PiB7XG4gICAgICAgICAgY29uc29sZS5sb2coJ0Vycm9yIG9uIGxvYWRpbmcgb2JqZWN0cycsIGVycik7XG4gICAgICAgIH0sXG4gICAgICB9KTtcbiAgfVxuXG4gIC8qKlxuICAgKiBJZiB0aGUgdXBkYXRlIHByb3BlcnR5IGlzIHRydWUsIHRoZW4gc2V0IHRoZSBzZWxlY3RlZElkIHByb3BlcnR5IHRvIHRoZSBpZCBvZiB0aGUgb2JqZWN0IHBhc3NlZCBpbiwgYW5kIGVtaXQgdGhlXG4gICAqIHNlbGVjdGVkSWQgcHJvcGVydHlcbiAgICpcbiAgICogQHBhcmFtIG9iamVjdCAtIGFueSAtIHRoaXMgaXMgdGhlIG9iamVjdCB0aGF0IGlzIHBhc3NlZCBpbiBmcm9tIHRoZSBjaGlsZCBjb21wb25lbnQuXG4gICAqL1xuICBzZWxlY3RJZChvYmplY3Q6IGFueSkge1xuICAgIGlmICghb2JqZWN0KSB7XG4gICAgICB0aGlzLmNyZWF0ZU1vZGUgPSBmYWxzZTtcbiAgICAgIHRoaXMuY3JlYXRlTW9kZUNoYW5nZWQuZW1pdChmYWxzZSk7XG4gICAgfVxuXG4gICAgaWYgKHRoaXMudXBkYXRlKSB7XG4gICAgICB0aGlzLnNlbGVjdGVkSWQgPSBvYmplY3RbJ2lkJ107XG4gICAgICB0aGlzLmlkU2VsZWN0ZWQuZW1pdCh0aGlzLnNlbGVjdGVkSWQpO1xuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBJdCB0YWtlcyBhIHN0cmluZywgY2FwaXRhbGl6ZXMgdGhlIGZpcnN0IGxldHRlciwgYW5kIHJldHVybnMgdGhlIG1vZGlmaWVkIHN0cmluZ1xuICAgKlxuICAgKiBAcGFyYW0gdmFsdWUgLSBUaGUgc3RyaW5nIHRvIGNhcGl0YWxpemUuXG4gICAqIEByZXR1cm5zIFRoZSBmaXJzdCBsZXR0ZXIgb2YgdGhlIHN0cmluZyBpcyBiZWluZyBjYXBpdGFsaXplZCBhbmQgdGhlIHJlc3Qgb2YgdGhlIHN0cmluZyBpcyBiZWluZyByZXR1cm5lZC5cbiAgICovXG4gIGNhcGl0YWxpemVGaXJzdExldHRlcih2YWx1ZTogc3RyaW5nKSB7XG4gICAgcmV0dXJuIHZhbHVlLmNoYXJBdCgwKS50b1VwcGVyQ2FzZSgpICsgdmFsdWUuc2xpY2UoMSk7XG4gIH1cbn1cbiIsIjxkaXYgKm5nSWY9XCIhc2VsZWN0ZWRJZCAmJiAhY3JlYXRlTW9kZVwiPlxuICA8ZGl2IGNsYXNzPVwidy0xMDAgZC1mbGV4IGZsZXgtcm93IGp1c3RpZnktY29udGVudC1iZXR3ZWVuIG1iLTRcIj5cbiAgICA8aDEgKm5nSWY9XCJtb2RlbE5hbWVcIj57eyBjYXBpdGFsaXplRmlyc3RMZXR0ZXIobW9kZWxOYW1lKSB9fXM8L2gxPlxuICAgIDxkaXYgY2xhc3M9XCJkLWZsZXggYWxpZ24taXRlbXMtY2VudGVyXCI+XG4gICAgICA8YnV0dG9uIGNsYXNzPVwiYnRuIGJ0bi1wcmltYXJ5XCIgKGNsaWNrKT1cImNyZWF0ZU5ld09iamVjdCgpXCIgKm5nSWY9XCJjcmVhdGVcIj5FcnN0ZWxsZW48L2J1dHRvbj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG4gIDx0YWJsZSBjbGFzcz1cInRhYmxlIHRhYmxlLWhvdmVyIHRhYmxlLXJlc3BvbnNpdmUgYmctd2hpdGVcIj5cbiAgICA8dGhlYWQ+XG4gICAgICA8dHI+XG4gICAgICAgIDx0aCBzY29wZT1cImNvbFwiICpuZ0Zvcj1cImxldCBmaWVsZCBvZiBhdmFpbGFibGVGaWVsZHNcIj57eyBjYXBpdGFsaXplRmlyc3RMZXR0ZXIoZmllbGQpIH19PC90aD5cbiAgICAgIDwvdHI+XG4gICAgPC90aGVhZD5cbiAgICA8dGJvZHk+XG4gICAgICA8dHIgKm5nRm9yPVwibGV0IG9iamVjdCBvZiBvYmplY3RzXCI+XG4gICAgICAgIDx0ZCBjbGFzcz1cImN1cnNvci1wb2ludGVyXCIgKm5nRm9yPVwibGV0IGZpZWxkIG9mIGF2YWlsYWJsZUZpZWxkc1wiIChjbGljayk9XCJzZWxlY3RJZChvYmplY3QpXCI+XG4gICAgICAgICAge3sgb2JqZWN0W2ZpZWxkXSB9fVxuICAgICAgICA8L3RkPlxuICAgICAgPC90cj5cbiAgICA8L3Rib2R5PlxuICA8L3RhYmxlPlxuPC9kaXY+XG5cbjxkaXYgY2xhc3M9XCJ3LTEwMFwiICpuZ0lmPVwic2VsZWN0ZWRJZCB8fCBjcmVhdGVNb2RlXCI+XG4gIDxidXR0b24gY2xhc3M9XCJidG4gYnRuLW91dGxpbmUtcHJpbWFyeSBtYi0zXCIgKGNsaWNrKT1cInNlbGVjdElkKCcnKVwiPlp1csO8Y2s8L2J1dHRvbj5cbiAgPGJhc2UtbW9kZWwtZm9ybVxuICAgIFttb2RlbE5hbWVdPVwibW9kZWxOYW1lXCJcbiAgICBbaWRdPVwic2VsZWN0ZWRJZFwiXG4gICAgKGZpbmlzaGVkKT1cInNlbGVjdElkKCcnKVwiXG4gICAgW2RlbGV0ZV09XCJkZWxldGVcIlxuICA+PC9iYXNlLW1vZGVsLWZvcm0+XG48L2Rpdj5cbiJdfQ==

package/esm2020/base-components/components/select/select.component.mjs

@@ -12,10 +12,10 @@ export class SelectComponent {
     }
 }
 SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: SelectComponent, selector: "base-select", inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", control: "control", tabIndex: "tabIndex", required: "required", multiple: "multiple", search: "search", options: "options" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <select\n    [id]=\"id\"\n    [name]=\"name\"\n    class=\"form-select\"\n    [attr.aria-label]=\"placeholder\"\n    [attr.data-live-search]=\"search\"\n    [formControl]=\"control\"\n    [required]=\"required\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [multiple]=\"multiple\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  >\n    <option [ngValue]=\"null\" selected>{{ placeholder }}</option>\n    <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n      {{ option.text }}\n    </option>\n  </select>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n  </div>\n</div>\n", styles: [""], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: SelectComponent, selector: "base-select", inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", control: "control", tabIndex: "tabIndex", required: "required", multiple: "multiple", search: "search", options: "options" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <select\n    [id]=\"id\"\n    [name]=\"name\"\n    class=\"form-select\"\n    [attr.aria-label]=\"placeholder\"\n    [attr.data-live-search]=\"search\"\n    [formControl]=\"control\"\n    [required]=\"required\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [multiple]=\"multiple\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  >\n    <option [ngValue]=\"null\" selected>{{ placeholder }}</option>\n    <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n      {{ option.text }}\n    </option>\n  </select>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n  </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'base-select', template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <select\n    [id]=\"id\"\n    [name]=\"name\"\n    class=\"form-select\"\n    [attr.aria-label]=\"placeholder\"\n    [attr.data-live-search]=\"search\"\n    [formControl]=\"control\"\n    [required]=\"required\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [multiple]=\"multiple\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  >\n    <option [ngValue]=\"null\" selected>{{ placeholder }}</option>\n    <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n      {{ option.text }}\n    </option>\n  </select>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'base-select', template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <select\n    [id]=\"id\"\n    [name]=\"name\"\n    class=\"form-select\"\n    [attr.aria-label]=\"placeholder\"\n    [attr.data-live-search]=\"search\"\n    [formControl]=\"control\"\n    [required]=\"required\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [multiple]=\"multiple\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  >\n    <option [ngValue]=\"null\" selected>{{ placeholder }}</option>\n    <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n      {{ option.text }}\n    </option>\n  </select>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n  </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"] }]
         }], propDecorators: { id: [{
                 type: Input
             }], name: [{

package/esm2020/base-components/components/tags/tags.component.mjs

@@ -98,10 +98,10 @@ export class TagsComponent {
     }
 }
 TagsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: TagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TagsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: TagsComponent, selector: "base-tags", inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", options: "options", custom: "custom", removeByKey: "removeByKey", required: "required" }, ngImport: i0, template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n\n  <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n    <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n      {{ tag }}\n      <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n    </div>\n  </div>\n  <input\n    [id]=\"id\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n    [(ngModel)]=\"inputValue\"\n    [autocomplete]=\"autocomplete ?? null\"\n    [tabIndex]=\"tabIndex ?? null\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onFocus()\"\n    type=\"text\"\n    class=\"form-control\"\n    (keyup)=\"enterKey($event)\"\n  />\n\n  <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n    <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option)\">{{ option }}</div>\n  </div>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n  </div>\n</div>\n", styles: [".tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+TagsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: TagsComponent, selector: "base-tags", inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", options: "options", custom: "custom", removeByKey: "removeByKey", required: "required" }, ngImport: i0, template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n\n  <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n    <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n      {{ tag }}\n      <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n    </div>\n  </div>\n  <input\n    [id]=\"id\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n    [(ngModel)]=\"inputValue\"\n    [autocomplete]=\"autocomplete ?? null\"\n    [tabIndex]=\"tabIndex ?? null\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onFocus()\"\n    type=\"text\"\n    class=\"form-control\"\n    (keyup)=\"enterKey($event)\"\n  />\n\n  <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n    <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option)\">{{ option }}</div>\n  </div>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n  </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: TagsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'base-tags', template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n\n  <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n    <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n      {{ tag }}\n      <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n    </div>\n  </div>\n  <input\n    [id]=\"id\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n    [(ngModel)]=\"inputValue\"\n    [autocomplete]=\"autocomplete ?? null\"\n    [tabIndex]=\"tabIndex ?? null\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onFocus()\"\n    type=\"text\"\n    class=\"form-control\"\n    (keyup)=\"enterKey($event)\"\n  />\n\n  <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n    <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option)\">{{ option }}</div>\n  </div>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n  </div>\n</div>\n", styles: [".tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"] }]
+            args: [{ selector: 'base-tags', template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n\n  <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n    <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n      {{ tag }}\n      <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n    </div>\n  </div>\n  <input\n    [id]=\"id\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n    [(ngModel)]=\"inputValue\"\n    [autocomplete]=\"autocomplete ?? null\"\n    [tabIndex]=\"tabIndex ?? null\"\n    (focus)=\"onFocus($event)\"\n    (blur)=\"onFocus()\"\n    type=\"text\"\n    class=\"form-control\"\n    (keyup)=\"enterKey($event)\"\n  />\n\n  <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n    <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option)\">{{ option }}</div>\n  </div>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n  </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"] }]
         }], propDecorators: { id: [{
                 type: Input
             }], name: [{

package/esm2020/base-components/components/textarea/textarea.component.mjs

@@ -11,10 +11,10 @@ export class TextareaComponent {
     }
 }
 TextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: TextareaComponent, selector: "base-textarea", inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", control: "control", rows: "rows", required: "required", tabIndex: "tabIndex" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <textarea\n    class=\"form-control\"\n    [id]=\"id\"\n    [name]=\"name\"\n    [rows]=\"rows\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"control\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  ></textarea>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n  </div>\n</div>\n", styles: [""], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
+TextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: TextareaComponent, selector: "base-textarea", inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", control: "control", rows: "rows", required: "required", tabIndex: "tabIndex" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <textarea\n    class=\"form-control\"\n    [id]=\"id\"\n    [name]=\"name\"\n    [rows]=\"rows\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"control\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  ></textarea>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n  </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'base-textarea', template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <textarea\n    class=\"form-control\"\n    [id]=\"id\"\n    [name]=\"name\"\n    [rows]=\"rows\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"control\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  ></textarea>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'base-textarea', template: "<div class=\"form-group mb-3\">\n  <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n  <textarea\n    class=\"form-control\"\n    [id]=\"id\"\n    [name]=\"name\"\n    [rows]=\"rows\"\n    [placeholder]=\"placeholder\"\n    [formControl]=\"control\"\n    [tabIndex]=\"tabIndex ?? null\"\n    [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n  ></textarea>\n\n  <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n    <div *ngIf=\"control?.errors?.['minlength']\">\n      Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n    </div>\n    <div *ngIf=\"control?.errors?.['maxlength']\">\n      Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n      {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n    </div>\n  </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"] }]
         }], propDecorators: { id: [{
                 type: Input
             }], name: [{

package/esm2020/base-components/public-api.mjs

@@ -13,4 +13,6 @@ export * from './components/toast/toast.component';
 export * from './components/loading-bar/loading-bar.component';
 export * from './components/skeleton-loader/skeleton-loader.component';
 export * from './components/breadcrumb/breadcrumb.component';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWJhc2UvYmFzZS1jb21wb25lbnRzL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxTQUFTO0FBQ1QsY0FBYywwQkFBMEIsQ0FBQztBQUV6QyxhQUFhO0FBQ2IsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLHNDQUFzQyxDQUFDO0FBQ3JELGNBQWMsMENBQTBDLENBQUM7QUFDekQsY0FBYywwQ0FBMEMsQ0FBQztBQUN6RCxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMsb0NBQW9DLENBQUM7QUFDbkQsY0FBYyxnREFBZ0QsQ0FBQztBQUMvRCxjQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLGNBQWMsOENBQThDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4cG9ydHMgZm9yIHB1YmxpYyBBUElcbiAqL1xuXG4vLyBNb2R1bGVcbmV4cG9ydCAqIGZyb20gJy4vYmFzZS1jb21wb25lbnRzLm1vZHVsZSc7XG5cbi8vIENvbXBvbmVudHNcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9pbnB1dC9pbnB1dC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3NlbGVjdC9zZWxlY3QuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9jaGVja2JveC9jaGVja2JveC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3RleHRhcmVhL3RleHRhcmVhLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvdGFncy90YWdzLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvdG9hc3QvdG9hc3QuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9sb2FkaW5nLWJhci9sb2FkaW5nLWJhci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3NrZWxldG9uLWxvYWRlci9za2VsZXRvbi1sb2FkZXIuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9icmVhZGNydW1iL2JyZWFkY3J1bWIuY29tcG9uZW50JztcbiJdfQ==
+export * from './components/model-form/model-form.component';
+export * from './components/model-table/model-table.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWJhc2UvYmFzZS1jb21wb25lbnRzL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxTQUFTO0FBQ1QsY0FBYywwQkFBMEIsQ0FBQztBQUV6QyxhQUFhO0FBQ2IsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLHNDQUFzQyxDQUFDO0FBQ3JELGNBQWMsMENBQTBDLENBQUM7QUFDekQsY0FBYywwQ0FBMEMsQ0FBQztBQUN6RCxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMsb0NBQW9DLENBQUM7QUFDbkQsY0FBYyxnREFBZ0QsQ0FBQztBQUMvRCxjQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLGNBQWMsOENBQThDLENBQUM7QUFDN0QsY0FBYyw4Q0FBOEMsQ0FBQztBQUM3RCxjQUFjLGdEQUFnRCxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHBvcnRzIGZvciBwdWJsaWMgQVBJXG4gKi9cblxuLy8gTW9kdWxlXG5leHBvcnQgKiBmcm9tICcuL2Jhc2UtY29tcG9uZW50cy5tb2R1bGUnO1xuXG4vLyBDb21wb25lbnRzXG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvaW5wdXQvaW5wdXQuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9zZWxlY3Qvc2VsZWN0LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy90ZXh0YXJlYS90ZXh0YXJlYS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3RhZ3MvdGFncy5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3RvYXN0L3RvYXN0LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbG9hZGluZy1iYXIvbG9hZGluZy1iYXIuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9za2VsZXRvbi1sb2FkZXIvc2tlbGV0b24tbG9hZGVyLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvYnJlYWRjcnVtYi9icmVhZGNydW1iLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbW9kZWwtZm9ybS9tb2RlbC1mb3JtLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbW9kZWwtdGFibGUvbW9kZWwtdGFibGUuY29tcG9uZW50JztcbiJdfQ==