@yuuvis/client-framework 3.0.0-beta.20.0 → 3.0.0-beta.21.0

package/fesm2022/yuuvis-client-framework-forms.mjs

@@ -45,9 +45,9 @@ class EditTableDataComponent {
         this.#errorMessage = inject(FormTranslateService);
         this.#dialogData = inject(MAT_DIALOG_DATA);
         this.#dialogRef = inject((MatDialogRef));
-        this.errorMessage = signal(null, ...(ngDevMode ? [{ debugName: "errorMessage" }] : []));
+        this.errorMessage = signal(null, ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
         this.tableForm = this.#fb.group({});
-        this.isInnerTableForm = input(true, ...(ngDevMode ? [{ debugName: "isInnerTableForm" }] : []));
+        this.isInnerTableForm = input(true, ...(ngDevMode ? [{ debugName: "isInnerTableForm" }] : /* istanbul ignore next */ []));
         this.formElement = this.#dialogData.formElement || {};
         this.columns = (this.formElement['elements'] || []).map((c) => ({
             ...c,
@@ -113,16 +113,16 @@ class EditTableDataComponent {
             return Object.keys(errors).length ? errors : null;
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EditTableDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: EditTableDataComponent, isStandalone: true, selector: "yuv-edit-table-data", inputs: { isInnerTableForm: { classPropertyName: "isInnerTableForm", publicName: "isInnerTableForm", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EditTableDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: EditTableDataComponent, isStandalone: true, selector: "yuv-edit-table-data", inputs: { isInnerTableForm: { classPropertyName: "isInnerTableForm", publicName: "isInnerTableForm", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => EditTableDataComponent),
                 multi: true
             }
-        ], ngImport: i0, template: "<yuv-dialog [headertitle]=\"(adding ? 'yuv.form.element.data.grid.add.headline' : 'yuv.form.element.data.grid.edit.headline') | translate: { headline: header }\">\n  <main>\n    <div [formGroup]=\"tableForm\">\n      <div class=\"fields\">\n        @for (element of columns; track $index) {\n          <div [attr.data-name]=\"element.name\" class=\"form-field\">\n            <yuv-metadata-form-field [field]=\"element\" [formControlName]=\"element.name\" [situation]=\"situation\"></yuv-metadata-form-field>\n          </div>\n        }\n      </div>\n    </div>\n  </main>\n\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancel()\">{{ 'yuv.form.element.data.grid.edit.cancel' | translate }}</button>\n    <button ymtButton=\"primary\" (click)=\"submit()\" [disabled]=\"!tableForm.dirty || !tableForm.valid\">\n      @if (adding) {\n        {{ 'yuv.form.element.data.grid.edit.add' | translate }}\n      } @else {\n        {{ 'yuv.object-metadata.button.save' | translate }}\n      }\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host .fields{padding:var(--ymt-spacing-m)}:host .fields .form-field:not(:last-child){margin-block-end:var(--ymt-spacing-s)}:host .err-msg{font:var(--ymt-font-body-subtle);color:var(--ymt-danger);padding:var(--ymt-spacing-2xs) 0;border:0}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: MetadataFormFieldComponent, selector: "yuv-metadata-form-field", inputs: ["formChangedSubject", "field", "situation"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "<yuv-dialog [headertitle]=\"(adding ? 'yuv.form.element.data.grid.add.headline' : 'yuv.form.element.data.grid.edit.headline') | translate: { headline: header }\">\n  <main>\n    <div [formGroup]=\"tableForm\">\n      <div class=\"fields\">\n        @for (element of columns; track $index) {\n          <div [attr.data-name]=\"element.name\" class=\"form-field\">\n            <yuv-metadata-form-field [field]=\"element\" [formControlName]=\"element.name\" [situation]=\"situation\"></yuv-metadata-form-field>\n          </div>\n        }\n      </div>\n    </div>\n  </main>\n\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancel()\">{{ 'yuv.form.element.data.grid.edit.cancel' | translate }}</button>\n    <button ymtButton=\"primary\" (click)=\"submit()\" [disabled]=\"!tableForm.dirty || !tableForm.valid\">\n      @if (adding) {\n        {{ 'yuv.form.element.data.grid.edit.add' | translate }}\n      } @else {\n        {{ 'yuv.object-metadata.button.save' | translate }}\n      }\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host .fields{padding:var(--ymt-spacing-m)}:host .fields .form-field:not(:last-child){margin-block-end:var(--ymt-spacing-s)}:host .err-msg{font:var(--ymt-font-body-subtle);color:var(--ymt-danger);padding:var(--ymt-spacing-2xs) 0;border:0}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: MetadataFormFieldComponent, selector: "yuv-metadata-form-field", inputs: ["formChangedSubject", "field", "situation"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EditTableDataComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EditTableDataComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-edit-table-data', standalone: true, imports: [
                         ReactiveFormsModule,
@@ -159,23 +159,23 @@ class DataGridComponent {
         this.translate = inject(TranslateService);
         this.#cdRef = inject(ChangeDetectorRef);
         this.el = inject((ElementRef));
-        this.situation = input(Situation.EDIT, ...(ngDevMode ? [{ debugName: "situation" }] : []));
-        this.formElement = input(undefined, ...(ngDevMode ? [{ debugName: "formElement" }] : []));
-        this.mappedFormElement = signal(undefined, ...(ngDevMode ? [{ debugName: "mappedFormElement" }] : []));
-        this.formControl = input(undefined, ...(ngDevMode ? [{ debugName: "formControl" }] : []));
-        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.situation = input(Situation.EDIT, ...(ngDevMode ? [{ debugName: "situation" }] : /* istanbul ignore next */ []));
+        this.formElement = input(undefined, ...(ngDevMode ? [{ debugName: "formElement" }] : /* istanbul ignore next */ []));
+        this.mappedFormElement = signal(undefined, ...(ngDevMode ? [{ debugName: "mappedFormElement" }] : /* istanbul ignore next */ []));
+        this.formControl = input(undefined, ...(ngDevMode ? [{ debugName: "formControl" }] : /* istanbul ignore next */ []));
+        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         // context to also apply form labels state (e.g. dirty, error) to the data grid label
-        this.formFieldContext = input(...(ngDevMode ? [undefined, { debugName: "formFieldContext" }] : []));
-        this.size = input(DataGridSizeType.AUTO, ...(ngDevMode ? [{ debugName: "size" }] : []));
-        this.dataSource = signal([], ...(ngDevMode ? [{ debugName: "dataSource" }] : []));
+        this.formFieldContext = input(...(ngDevMode ? [undefined, { debugName: "formFieldContext" }] : /* istanbul ignore next */ []));
+        this.size = input(DataGridSizeType.AUTO, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.dataSource = signal([], ...(ngDevMode ? [{ debugName: "dataSource" }] : /* istanbul ignore next */ []));
         this.tableLabel = computed(() => {
             const formElement = this.formElement();
             return formElement
                 ? this.#systemService.getLocalizedResource(`${formElement['name']}_label`)
                 : formElement && formElement['label'];
-        }, ...(ngDevMode ? [{ debugName: "tableLabel" }] : []));
-        this.selectedRow = signal(null, ...(ngDevMode ? [{ debugName: "selectedRow" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "tableLabel" }] : /* istanbul ignore next */ []));
+        this.selectedRow = signal(null, ...(ngDevMode ? [{ debugName: "selectedRow" }] : /* istanbul ignore next */ []));
         this.isRequired = false;
         this.isInvalid = false;
         this.initalTableUpdate = true;
@@ -183,30 +183,17 @@ class DataGridComponent {
             add: YUV_ICONS.add,
             more: YUV_ICONS.more
         };
-        this.displayedColumnsWithActions = linkedSignal(...(ngDevMode ? [{ debugName: "displayedColumnsWithActions", source: this.readonly,
-                computation: (readonly, previous) => {
-                    if (readonly) {
-                        const idx = (previous?.value || []).findIndex((c) => c === 'actions');
-                        if (idx && idx > -1)
-                            (previous?.value || []).splice(idx, 1);
-                    }
-                    return previous ? previous.value : [];
-                } }] : [{
-                source: this.readonly,
-                computation: (readonly, previous) => {
-                    if (readonly) {
-                        const idx = (previous?.value || []).findIndex((c) => c === 'actions');
-                        if (idx && idx > -1)
-                            (previous?.value || []).splice(idx, 1);
-                    }
-                    return previous ? previous.value : [];
+        this.displayedColumnsWithActions = linkedSignal({ ...(ngDevMode ? { debugName: "displayedColumnsWithActions" } : /* istanbul ignore next */ {}), source: this.readonly,
+            computation: (readonly, previous) => {
+                if (readonly) {
+                    const idx = (previous?.value || []).findIndex((c) => c === 'actions');
+                    if (idx && idx > -1)
+                        (previous?.value || []).splice(idx, 1);
                 }
-            }]));
-        this.displayedColumns = linkedSignal(...(ngDevMode ? [{ debugName: "displayedColumns", source: this.readonly,
-                computation: (readonly, previous) => readonly ? (previous?.value || []).filter((c) => c.columnDef !== 'actions') : previous?.value || [] }] : [{
-                source: this.readonly,
-                computation: (readonly, previous) => readonly ? (previous?.value || []).filter((c) => c.columnDef !== 'actions') : previous?.value || []
-            }]));
+                return previous ? previous.value : [];
+            } });
+        this.displayedColumns = linkedSignal({ ...(ngDevMode ? { debugName: "displayedColumns" } : /* istanbul ignore next */ {}), source: this.readonly,
+            computation: (readonly, previous) => readonly ? (previous?.value || []).filter((c) => c.columnDef !== 'actions') : previous?.value || [] });
         this.#loadData = effect(() => {
             const formElement = this.formElement();
             // if the form element is created from the ObjectTypeField it contains 'columnDefinitions' instead of 'elements'
@@ -235,12 +222,12 @@ class DataGridComponent {
                 return row;
             });
             untracked(() => formElement && this.#updateTable(elements, data));
-        }, ...(ngDevMode ? [{ debugName: "#loadData" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#loadData" }] : /* istanbul ignore next */ []));
         this.#sourceData = effect(() => {
             const dataSource = this.dataSource();
             !this.initalTableUpdate && this.writeValue(dataSource.filter((row) => !row.isAddRow));
             this.initalTableUpdate = false;
-        }, ...(ngDevMode ? [{ debugName: "#sourceData" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#sourceData" }] : /* istanbul ignore next */ []));
         this.propagateChange = () => { };
         this.onTouched = () => { };
     }
@@ -361,8 +348,8 @@ class DataGridComponent {
             return;
         this.onTouched();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DataGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: DataGridComponent, isStandalone: true, selector: "yuv-data-grid", inputs: { situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, formElement: { classPropertyName: "formElement", publicName: "formElement", isSignal: true, isRequired: false, transformFunction: null }, formControl: { classPropertyName: "formControl", publicName: "formControl", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, formFieldContext: { classPropertyName: "formFieldContext", publicName: "formFieldContext", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "focusout": "onHostFocusOut($event)" }, classAttribute: "yuv-data-grid" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DataGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DataGridComponent, isStandalone: true, selector: "yuv-data-grid", inputs: { situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, formElement: { classPropertyName: "formElement", publicName: "formElement", isSignal: true, isRequired: false, transformFunction: null }, formControl: { classPropertyName: "formControl", publicName: "formControl", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, formFieldContext: { classPropertyName: "formFieldContext", publicName: "formFieldContext", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "focusout": "onHostFocusOut($event)" }, classAttribute: "yuv-data-grid" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => DataGridComponent),
@@ -375,7 +362,7 @@ class DataGridComponent {
             }
         ], ngImport: i0, template: "<fieldset [attr.aria-required]=\"isRequired\" [attr.aria-invalid]=\"isInvalid\">\n  <legend class=\"ymt-hide-sr\">\n    {{ tableLabel() }}\n    @if (isRequired) {\n      *\n    }\n  </legend>\n  <header class=\"yuv-data-grid__header\">\n    <span\n      [yuvObjectMetadataElementLabel]=\"formFieldContext()\"\n      class=\"yuv-data-grid__header-title label\"\n      [ngClass]=\"{ 'yuv-data-grid__header-title--invalid': isInvalid }\"\n      aria-hidden=\"true\"\n    >\n      {{ tableLabel() }}\n      @if (isRequired) {\n        *\n      }\n    </span>\n\n    @if (!readonly()) {\n      <button ymtIconButton (click)=\"addRow()\" class=\"yuv-data-grid__header-action\" [matTooltip]=\"'yuv.form.element.data.grid.add-row.button.tooltip' | translate\">\n        <mat-icon>add</mat-icon>\n      </button>\n    }\n  </header>\n\n  @let displayedCol = displayedColumns();\n  @let displayedColActions = displayedColumnsWithActions();\n  @let data = dataSource();\n\n  <div class=\"yuv-data-grid__table\" [ngClass]=\"size()\">\n    <table mat-table [dataSource]=\"data\" class=\"mat-elevation-z8\">\n      <caption class=\"ymt-hide-sr\">\n        {{\n          tableLabel()\n        }}\n      </caption>\n\n      @for (column of displayedCol; track column) {\n        @if (column.columnDef === 'actions') {\n          <!-- <h1>Actions</h1> -->\n          <ng-container [matColumnDef]=\"column.columnDef\" stickyEnd>\n            <th mat-header-cell *matHeaderCellDef aria-label=\"row actions\"></th>\n            <td class=\"yuv-data-grid__cell--editable\" mat-cell *matCellDef=\"let element\">\n              <div class=\"yuv-data-grid__table-actions\">\n                <!-- Only show the button in the last (empty) row -->\n                <button ymtIconButton icon-button-size=\"small\" class=\"table-options-menu-bar-item\" [matMenuTriggerFor]=\"menu\" (click)=\"onMenuTrigger(element)\" [matTooltip]=\"'yuv.form.element.data.grid.row.button.actions.tooltip' | translate\"  >\n                  <mat-icon>more_vert</mat-icon>\n                </button>\n              </div>\n            </td>\n          </ng-container>\n        } @else {\n          <ng-container [matColumnDef]=\"column.columnDef\">\n            <th mat-header-cell *matHeaderCellDef [attr.aria-label]=\"column.header\" [title]=\"column.header\">{{ column.header }}</th>\n            <td\n              [ngClass]=\"{ 'number-cell': column.type === 'integer' || column.type === 'decimal', 'yuv-data-grid__cell--editable': !readonly() }\"\n              mat-cell\n              *matCellDef=\"let element\"\n            >\n              <ng-template *yuvRenderer=\"column.cell(element)\"></ng-template>\n            </td>\n          </ng-container>\n        }\n\n        <tr class=\"mat-row\" *matNoDataRow>\n          <td class=\"mat-cell no-data-cell\" [attr.colspan]=\"column.length\"></td>\n        </tr>\n      }\n\n      <tr mat-header-row *matHeaderRowDef=\"displayedColActions; sticky: ['header-1']\"></tr>\n\n      <tr (dblclick)=\"editRow(row)\" [class.selected-row]=\"row === selectedRow()\" mat-row *matRowDef=\"let row; columns: displayedColActions\"></tr>\n    </table>\n    @if (data.length === 0) {\n      <span class=\"no-data\">{{ 'yuv.form.element.data.grid.noData' | translate }}</span>\n    }\n  </div>\n</fieldset>\n<mat-menu #menu=\"matMenu\">\n  <button mat-menu-item (click)=\"editRow(selectedRow())\">{{ 'yuv.form.element.data.grid.edit' | translate }}</button>\n  <button mat-menu-item (click)=\"removeRow(selectedRow())\">{{ 'yuv.form.element.data.grid.remove' | translate }}</button>\n</mat-menu>\n", styles: [":host{--table-size-small: 200px;--table-size-medium: 400px;--table-size-large: 600px;--table-size-extra-large: 800px;max-width:100%;width:100%;border:1px solid var(--ymt-outline-variant);border-radius:var(--ymt-corner-s);overflow:hidden;position:relative}:host .yuv-data-grid__header{display:flex;justify-content:space-between;align-items:center;padding:var(--ymt-spacing-xs)}:host .yuv-data-grid__header-title{transform:scale(var(--mat-mdc-form-field-floating-label-scale, .75))}:host .yuv-data-grid__header-title--invalid{background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);align-self:baseline}:host .yuv-data-grid__cell--editable{-webkit-user-select:none;user-select:none}:host .yuv-data-grid__table{overflow:auto;white-space:nowrap}:host .yuv-data-grid__table.small{height:var(--table-size-small)}:host .yuv-data-grid__table.medium{height:var(--table-size-medium)}:host .yuv-data-grid__table.large{height:var(--table-size-large)}:host .yuv-data-grid__table.extra-large{height:var(--table-size-extra-large)}:host .yuv-data-grid__table .no-data{display:block;width:100%;background-color:var(--ymt-surface);text-align:center;padding:var(--ymt-spacing-s);font:var(--ymt-font-body);color:var(--ymt-text-color-subtle);font-style:italic}:host .yuv-data-grid__table-actions{display:flex;align-items:center;justify-content:flex-end}:host.yuv-data-grid{display:block}:host.yuv-data-grid ::ng-deep tr.cdk-row td.number-cell{text-align:right}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i3.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: RendererDirective, selector: "[yuvRenderer]", inputs: ["yuvRenderer"] }, { kind: "directive", type: ObjectMetadataElementLabelDirective, selector: "[yuvObjectMetadataElementLabel]", inputs: ["yuvObjectMetadataElementLabel"] }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DataGridComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DataGridComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-data-grid', standalone: true, imports: [
                         NgClass,
@@ -415,27 +402,27 @@ class DatetimeComponent extends AbstractMatFormField {
         this.pickerCmp = viewChild.required(DatepickerComponent);
         this.ngControl = injectNgControl(this);
         this.fc = new FormControl(null);
-        this._locale = signal(this.translate.getCurrentLang(), ...(ngDevMode ? [{ debugName: "_locale" }] : []));
-        this.locale = input(this.translate.getCurrentLang(), ...(ngDevMode ? [{ debugName: "locale" }] : []));
+        this._locale = signal(this.translate.getCurrentLang(), ...(ngDevMode ? [{ debugName: "_locale" }] : /* istanbul ignore next */ []));
+        this.locale = input(this.translate.getCurrentLang(), ...(ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []));
         this.#localeEffect = effect(() => {
             this._locale.set(this.locale() || this.translate.getCurrentLang());
-        }, ...(ngDevMode ? [{ debugName: "#localeEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#localeEffect" }] : /* istanbul ignore next */ []));
         /**
          * Whether or not to allow only values in the future (default: false)
          */
-        this.onlyFutureDates = input(false, ...(ngDevMode ? [{ debugName: "onlyFutureDates" }] : []));
+        this.onlyFutureDates = input(false, ...(ngDevMode ? [{ debugName: "onlyFutureDates" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         /**
          * Whether to show the calendar icon that opens the date picker calendar (default: true)
          */
-        this.calendar = input(true, ...(ngDevMode ? [{ debugName: "calendar" }] : []));
+        this.calendar = input(true, ...(ngDevMode ? [{ debugName: "calendar" }] : /* istanbul ignore next */ []));
         /**
          * Enables setting time as well (default: false)
          */
-        this.withTime = input(false, ...(ngDevMode ? [{ debugName: "withTime" }] : []));
+        this.withTime = input(false, ...(ngDevMode ? [{ debugName: "withTime" }] : /* istanbul ignore next */ []));
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this.propagateChange = (_) => { };
     }
@@ -514,10 +501,10 @@ class DatetimeComponent extends AbstractMatFormField {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DatetimeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.19", type: DatetimeComponent, isStandalone: true, selector: "yuv-datetime", inputs: { locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, onlyFutureDates: { classPropertyName: "onlyFutureDates", publicName: "onlyFutureDates", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, withTime: { classPropertyName: "withTime", publicName: "withTime", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: DatetimeComponent }], viewQueries: [{ propertyName: "pickerCmp", first: true, predicate: DatepickerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<yuv-datepicker\n  [calendar]=\"calendar()\"\n  [disabled]=\"readonly()\"\n  [withTime]=\"withTime()\"\n  [locale]=\"_locale()\"\n  [labels]=\"labels!\"\n  [onlyFutureDates]=\"onlyFutureDates()\"\n  [formControl]=\"fc\"\n></yuv-datepicker>\n", styles: [":host{display:flex;overflow-x:auto;--ymt-scrollbar-outer-size: 0px;--ymt-scrollbar-inner-size: 0px}:host yuv-datepicker{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: YuvDatepickerModule }, { kind: "component", type: i2$1.DatepickerComponent, selector: "yuv-datepicker", inputs: ["calendar", "readonly", "hour12", "locale", "labels", "withTime", "onlyFutureDates", "minDate", "maxDate", "disabled"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatDatepickerModule }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatetimeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.9", type: DatetimeComponent, isStandalone: true, selector: "yuv-datetime", inputs: { locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, onlyFutureDates: { classPropertyName: "onlyFutureDates", publicName: "onlyFutureDates", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, withTime: { classPropertyName: "withTime", publicName: "withTime", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: DatetimeComponent }], viewQueries: [{ propertyName: "pickerCmp", first: true, predicate: DatepickerComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<yuv-datepicker\n  [calendar]=\"calendar()\"\n  [disabled]=\"readonly()\"\n  [withTime]=\"withTime()\"\n  [locale]=\"_locale()\"\n  [labels]=\"labels!\"\n  [onlyFutureDates]=\"onlyFutureDates()\"\n  [formControl]=\"fc\"\n></yuv-datepicker>\n", styles: [":host{display:flex;overflow-x:auto;--ymt-scrollbar-outer-size: 0px;--ymt-scrollbar-inner-size: 0px}:host yuv-datepicker{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: YuvDatepickerModule }, { kind: "component", type: i2$1.DatepickerComponent, selector: "yuv-datepicker", inputs: ["calendar", "readonly", "hour12", "locale", "labels", "withTime", "onlyFutureDates", "minDate", "maxDate", "disabled"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatDatepickerModule }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DatetimeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatetimeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-datetime', standalone: true, imports: [ReactiveFormsModule, YuvDatepickerModule, MatInputModule, MatDatepickerModule], providers: [{ provide: MatFormFieldControl, useExisting: DatetimeComponent }], template: "<yuv-datepicker\n  [calendar]=\"calendar()\"\n  [disabled]=\"readonly()\"\n  [withTime]=\"withTime()\"\n  [locale]=\"_locale()\"\n  [labels]=\"labels!\"\n  [onlyFutureDates]=\"onlyFutureDates()\"\n  [formControl]=\"fc\"\n></yuv-datepicker>\n", styles: [":host{display:flex;overflow-x:auto;--ymt-scrollbar-outer-size: 0px;--ymt-scrollbar-inner-size: 0px}:host yuv-datepicker{flex:1}\n"] }]
         }], propDecorators: { pickerCmp: [{ type: i0.ViewChild, args: [i0.forwardRef(() => DatepickerComponent), { isSignal: true }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], onlyFutureDates: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyFutureDates", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], calendar: [{ type: i0.Input, args: [{ isSignal: true, alias: "calendar", required: false }] }], withTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "withTime", required: false }] }] } });
@@ -529,17 +516,17 @@ class DatetimeRangeComponent extends AbstractMatFormField {
         /**
          * Enables setting time as well (default: false)
          */
-        this.withTimeInput = input(false, ...(ngDevMode ? [{ debugName: "withTimeInput", alias: 'withTime' }] : [{ alias: 'withTime' }]));
-        this.withTime = linkedSignal(this.withTimeInput, ...(ngDevMode ? [{ debugName: "withTime" }] : []));
+        this.withTimeInput = input(false, { ...(ngDevMode ? { debugName: "withTimeInput" } : /* istanbul ignore next */ {}), alias: 'withTime' });
+        this.withTime = linkedSignal(this.withTimeInput, ...(ngDevMode ? [{ debugName: "withTime" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         // TODO: this should be set by the form and not by the consumer of the component,
         // otherwise there would be two sources of truth for the situation (one in the form and one in the component)
         // also not used!!!!
-        this.operator = input(Operator.EQUAL, ...(ngDevMode ? [{ debugName: "operator" }] : []));
-        this.situation = input(...(ngDevMode ? [undefined, { debugName: "situation" }] : []));
+        this.operator = input(Operator.EQUAL, ...(ngDevMode ? [{ debugName: "operator" }] : /* istanbul ignore next */ []));
+        this.situation = input(...(ngDevMode ? [undefined, { debugName: "situation" }] : /* istanbul ignore next */ []));
         this._isValid = true;
         this.ngControl = injectNgControl(this);
         // options for search situation
@@ -678,10 +665,10 @@ class DatetimeRangeComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DatetimeRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: DatetimeRangeComponent, isStandalone: true, selector: "yuv-datetime-range", inputs: { withTimeInput: { classPropertyName: "withTimeInput", publicName: "withTime", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, operator: { classPropertyName: "operator", publicName: "operator", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: DatetimeRangeComponent }], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"rangeForm\">\n  @if (rangeForm.value.operator === 'gtelte') {\n    <yuv-datetime [withTime]=\"withTime()\" formControlName=\"dateValueFrom\"></yuv-datetime>\n  }\n\n  <mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" formControlName=\"operator\" [disabled]=\"readonly()\">\n    @for (o of availableSearchOptions; track $index) {\n      <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n    }\n  </mat-select>\n\n  <yuv-datetime [withTime]=\"withTime()\" formControlName=\"dateValue\"></yuv-datetime>\n</form>\n", styles: [":host form{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--ymt-spacing-s)}:host form yuv-datetime{flex:1 1 auto}:host form mat-select{padding:0;width:calc(2ch + 1em);border-radius:2px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DatetimeComponent, selector: "yuv-datetime", inputs: ["locale", "onlyFutureDates", "readonly", "calendar", "withTime"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatetimeRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DatetimeRangeComponent, isStandalone: true, selector: "yuv-datetime-range", inputs: { withTimeInput: { classPropertyName: "withTimeInput", publicName: "withTime", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, operator: { classPropertyName: "operator", publicName: "operator", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: DatetimeRangeComponent }], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"rangeForm\">\n  @if (rangeForm.value.operator === 'gtelte') {\n    <yuv-datetime [withTime]=\"withTime()\" formControlName=\"dateValueFrom\"></yuv-datetime>\n  }\n\n  <mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" formControlName=\"operator\" [disabled]=\"readonly()\">\n    @for (o of availableSearchOptions; track $index) {\n      <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n    }\n  </mat-select>\n\n  <yuv-datetime [withTime]=\"withTime()\" formControlName=\"dateValue\"></yuv-datetime>\n</form>\n", styles: [":host form{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--ymt-spacing-s)}:host form yuv-datetime{flex:1 1 auto}:host form mat-select{padding:0;width:calc(2ch + 1em);border-radius:2px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DatetimeComponent, selector: "yuv-datetime", inputs: ["locale", "onlyFutureDates", "readonly", "calendar", "withTime"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DatetimeRangeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DatetimeRangeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-datetime-range', standalone: true, imports: [FormsModule, MatDatepickerModule, MatSelectModule, ReactiveFormsModule, DatetimeComponent], providers: [{ provide: MatFormFieldControl, useExisting: DatetimeRangeComponent }], template: "<form [formGroup]=\"rangeForm\">\n  @if (rangeForm.value.operator === 'gtelte') {\n    <yuv-datetime [withTime]=\"withTime()\" formControlName=\"dateValueFrom\"></yuv-datetime>\n  }\n\n  <mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" formControlName=\"operator\" [disabled]=\"readonly()\">\n    @for (o of availableSearchOptions; track $index) {\n      <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n    }\n  </mat-select>\n\n  <yuv-datetime [withTime]=\"withTime()\" formControlName=\"dateValue\"></yuv-datetime>\n</form>\n", styles: [":host form{display:flex;flex-flow:row nowrap;align-items:center;gap:var(--ymt-spacing-s)}:host form yuv-datetime{flex:1 1 auto}:host form mat-select{padding:0;width:calc(2ch + 1em);border-radius:2px}\n"] }]
         }], propDecorators: { withTimeInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "withTime", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], operator: [{ type: i0.Input, args: [{ isSignal: true, alias: "operator", required: false }] }], situation: [{ type: i0.Input, args: [{ isSignal: true, alias: "situation", required: false }] }] } });
@@ -709,46 +696,46 @@ class NumberComponent extends AbstractMatFormField {
         /**
          * Number of decimal places
          */
-        this.scale = input(undefined, ...(ngDevMode ? [{ debugName: "scale" }] : []));
-        this.#scale = computed(() => Math.min(this.scale() || 0, 30), ...(ngDevMode ? [{ debugName: "#scale" }] : []));
+        this.scale = input(undefined, ...(ngDevMode ? [{ debugName: "scale" }] : /* istanbul ignore next */ []));
+        this.#scale = computed(() => Math.min(this.scale() || 0, 30), ...(ngDevMode ? [{ debugName: "#scale" }] : /* istanbul ignore next */ []));
         /**
          * Overall amount of digits allowed (including decimal places)
          */
-        this.precision = input(undefined, ...(ngDevMode ? [{ debugName: "precision" }] : []));
-        this.#precision = computed(() => Math.min(this.precision() || 100, 100), ...(ngDevMode ? [{ debugName: "#precision" }] : []));
+        this.precision = input(undefined, ...(ngDevMode ? [{ debugName: "precision" }] : /* istanbul ignore next */ []));
+        this.#precision = computed(() => Math.min(this.precision() || 100, 100), ...(ngDevMode ? [{ debugName: "#precision" }] : /* istanbul ignore next */ []));
         /**
          *  Set to true to group number by pattern
          */
-        this.grouping = input(false, ...(ngDevMode ? [{ debugName: "grouping" }] : []));
-        this.#grouping = computed(() => this.grouping() ?? true, ...(ngDevMode ? [{ debugName: "#grouping" }] : []));
+        this.grouping = input(false, ...(ngDevMode ? [{ debugName: "grouping" }] : /* istanbul ignore next */ []));
+        this.#grouping = computed(() => this.grouping() ?? true, ...(ngDevMode ? [{ debugName: "#grouping" }] : /* istanbul ignore next */ []));
         /**
          * The pattern to group number value by
          */
-        this.groupPattern = input(undefined, ...(ngDevMode ? [{ debugName: "groupPattern" }] : []));
+        this.groupPattern = input(undefined, ...(ngDevMode ? [{ debugName: "groupPattern" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         /**
          * set minimum input value
          */
-        this.minValue = input(undefined, ...(ngDevMode ? [{ debugName: "minValue" }] : []));
+        this.minValue = input(undefined, ...(ngDevMode ? [{ debugName: "minValue" }] : /* istanbul ignore next */ []));
         /**
          * set maximum input value
          *
          */
-        this.maxValue = input(undefined, ...(ngDevMode ? [{ debugName: "maxValue" }] : []));
+        this.maxValue = input(undefined, ...(ngDevMode ? [{ debugName: "maxValue" }] : /* istanbul ignore next */ []));
         /**
          * classification property adds some semantics to the value of this component.
          * If you provide a value of `filesize` numbers typed into the control will be
          * handled like file sizes (calculates differnt units)
          */
-        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : []));
+        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
         this.#classificationsEffect = effect(() => {
             const classifications = this.classifications();
             this.transformPipe =
                 classifications && classifications.includes(Classification.NUMBER_FILESIZE) ? new FileSizePipe(this.translate) : new LocaleNumberPipe(this.translate);
-        }, ...(ngDevMode ? [{ debugName: "#classificationsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#classificationsEffect" }] : /* istanbul ignore next */ []));
         // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
         this.propagateChange = (_) => { };
     }
@@ -866,11 +853,11 @@ class NumberComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NumberComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.19", type: NumberComponent, isStandalone: true, selector: "yuv-number", inputs: { scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, precision: { classPropertyName: "precision", publicName: "precision", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null }, groupPattern: { classPropertyName: "groupPattern", publicName: "groupPattern", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: NumberComponent }], usesInheritance: true, ngImport: i0, template: '<input type="string" [formControl]="innerCtrl" (focus)="unformat()" (blur)="format()" [readonly]="readonly()" />', isInline: true, styles: [":host{display:flex}:host input{width:100%;border:0;outline:0;background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NumberComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: NumberComponent, isStandalone: true, selector: "yuv-number", inputs: { scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, precision: { classPropertyName: "precision", publicName: "precision", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null }, groupPattern: { classPropertyName: "groupPattern", publicName: "groupPattern", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: NumberComponent }], usesInheritance: true, ngImport: i0, template: '<input type="string" [formControl]="innerCtrl" (focus)="unformat()" (blur)="format()" [readonly]="readonly()" />', isInline: true, styles: [":host{display:flex}:host input{width:100%;border:0;outline:0;background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
 _a = NumberComponent;
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NumberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NumberComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-number', standalone: true, imports: [ReactiveFormsModule], template: '<input type="string" [formControl]="innerCtrl" (focus)="unformat()" (blur)="format()" [readonly]="readonly()" />', providers: [{ provide: MatFormFieldControl, useExisting: NumberComponent }], styles: [":host{display:flex}:host input{width:100%;border:0;outline:0;background:transparent}\n"] }]
         }], propDecorators: { scale: [{ type: i0.Input, args: [{ isSignal: true, alias: "scale", required: false }] }], precision: [{ type: i0.Input, args: [{ isSignal: true, alias: "precision", required: false }] }], grouping: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouping", required: false }] }], groupPattern: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupPattern", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], minValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "minValue", required: false }] }], maxValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxValue", required: false }] }], classifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "classifications", required: false }] }] } });
@@ -891,39 +878,39 @@ class NumberRangeComponent extends AbstractMatFormField {
         /**
          * Number of decimal places
          */
-        this.scale = input(undefined, ...(ngDevMode ? [{ debugName: "scale" }] : []));
+        this.scale = input(undefined, ...(ngDevMode ? [{ debugName: "scale" }] : /* istanbul ignore next */ []));
         /**
          * Overall amount of digits allowed (including decimal places)
          */
-        this.precision = input(undefined, ...(ngDevMode ? [{ debugName: "precision" }] : []));
+        this.precision = input(undefined, ...(ngDevMode ? [{ debugName: "precision" }] : /* istanbul ignore next */ []));
         /**
          *  Set to true to group number by pattern
          */
-        this.grouping = input(false, ...(ngDevMode ? [{ debugName: "grouping" }] : []));
+        this.grouping = input(false, ...(ngDevMode ? [{ debugName: "grouping" }] : /* istanbul ignore next */ []));
         /**
          * The pattern to group number value by
          */
-        this.pattern = input(undefined, ...(ngDevMode ? [{ debugName: "pattern" }] : []));
+        this.pattern = input(undefined, ...(ngDevMode ? [{ debugName: "pattern" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         /**
          * classification property adds some semantics to the value of this component.
          * If you provide a value of `filesize` numbers typed into the control will be
          * handled like file sizes (calculates differnt units)
          */
-        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : []));
+        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
         /**
          * set minimum input value
          */
-        this.minValue = input(undefined, ...(ngDevMode ? [{ debugName: "minValue" }] : []));
+        this.minValue = input(undefined, ...(ngDevMode ? [{ debugName: "minValue" }] : /* istanbul ignore next */ []));
         /**
          * set maximum input value
          *
          */
-        this.maxValue = input(undefined, ...(ngDevMode ? [{ debugName: "maxValue" }] : []));
-        this.situation = input(Situation.EDIT, ...(ngDevMode ? [{ debugName: "situation" }] : []));
+        this.maxValue = input(undefined, ...(ngDevMode ? [{ debugName: "maxValue" }] : /* istanbul ignore next */ []));
+        this.situation = input(Situation.EDIT, ...(ngDevMode ? [{ debugName: "situation" }] : /* istanbul ignore next */ []));
         this.isValid = true;
         this.ngControl = injectNgControl(this);
         // options for search situation
@@ -1071,10 +1058,10 @@ class NumberRangeComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NumberRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: NumberRangeComponent, isStandalone: true, selector: "yuv-number-range", inputs: { scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, precision: { classPropertyName: "precision", publicName: "precision", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null }, pattern: { classPropertyName: "pattern", publicName: "pattern", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: NumberRangeComponent }], usesInheritance: true, ngImport: i0, template: "<form class=\"yuv-number-range\" [formGroup]=\"rangeForm\">\n  @if (rangeForm.value.operator === 'gtelte') {\n    <yuv-number\n      class=\"first\"\n      [readonly]=\"readonly()\"\n      [scale]=\"scale()\"\n      [precision]=\"precision()\"\n      [grouping]=\"grouping()\"\n      [groupPattern]=\"pattern()\"\n      formControlName=\"numberValueFrom\"\n      [classifications]=\"classifications()\"\n      [minValue]=\"minValue()\"\n      [maxValue]=\"maxValue()\"\n    ></yuv-number>\n  }\n\n  <mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" formControlName=\"operator\" [disabled]=\"readonly()\">\n    @for (o of availableSearchOptions; track $index) {\n      <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n    }\n  </mat-select>\n\n  <yuv-number\n    [scale]=\"scale()\"\n    [readonly]=\"readonly()\"\n    [precision]=\"precision()\"\n    [grouping]=\"grouping()\"\n    [groupPattern]=\"pattern()\"\n    formControlName=\"numberValue\"\n    [classifications]=\"classifications()\"\n    [minValue]=\"minValue()\"\n    [maxValue]=\"maxValue()\"\n  >\n  </yuv-number>\n</form>\n", styles: [":host>form{display:inline-flex;flex-flow:row nowrap;align-items:center;gap:var(--ymt-spacing-s)}:host>form yuv-number{flex:1 1 auto}:host>form mat-select{padding:0;width:calc(2ch + 1em);border-radius:2px}\n"], dependencies: [{ kind: "component", type: NumberComponent, selector: "yuv-number", inputs: ["scale", "precision", "grouping", "groupPattern", "readonly", "minValue", "maxValue", "classifications"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NumberRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: NumberRangeComponent, isStandalone: true, selector: "yuv-number-range", inputs: { scale: { classPropertyName: "scale", publicName: "scale", isSignal: true, isRequired: false, transformFunction: null }, precision: { classPropertyName: "precision", publicName: "precision", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null }, pattern: { classPropertyName: "pattern", publicName: "pattern", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: true, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: NumberRangeComponent }], usesInheritance: true, ngImport: i0, template: "<form class=\"yuv-number-range\" [formGroup]=\"rangeForm\">\n  @if (rangeForm.value.operator === 'gtelte') {\n    <yuv-number\n      class=\"first\"\n      [readonly]=\"readonly()\"\n      [scale]=\"scale()\"\n      [precision]=\"precision()\"\n      [grouping]=\"grouping()\"\n      [groupPattern]=\"pattern()\"\n      formControlName=\"numberValueFrom\"\n      [classifications]=\"classifications()\"\n      [minValue]=\"minValue()\"\n      [maxValue]=\"maxValue()\"\n    ></yuv-number>\n  }\n\n  <mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" formControlName=\"operator\" [disabled]=\"readonly()\">\n    @for (o of availableSearchOptions; track $index) {\n      <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n    }\n  </mat-select>\n\n  <yuv-number\n    [scale]=\"scale()\"\n    [readonly]=\"readonly()\"\n    [precision]=\"precision()\"\n    [grouping]=\"grouping()\"\n    [groupPattern]=\"pattern()\"\n    formControlName=\"numberValue\"\n    [classifications]=\"classifications()\"\n    [minValue]=\"minValue()\"\n    [maxValue]=\"maxValue()\"\n  >\n  </yuv-number>\n</form>\n", styles: [":host>form{display:inline-flex;flex-flow:row nowrap;align-items:center;gap:var(--ymt-spacing-s)}:host>form yuv-number{flex:1 1 auto}:host>form mat-select{padding:0;width:calc(2ch + 1em);border-radius:2px}\n"], dependencies: [{ kind: "component", type: NumberComponent, selector: "yuv-number", inputs: ["scale", "precision", "grouping", "groupPattern", "readonly", "minValue", "maxValue", "classifications"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NumberRangeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NumberRangeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-number-range', standalone: true, imports: [NumberComponent, MatSelectModule, FormsModule, ReactiveFormsModule], providers: [{ provide: MatFormFieldControl, useExisting: NumberRangeComponent }], template: "<form class=\"yuv-number-range\" [formGroup]=\"rangeForm\">\n  @if (rangeForm.value.operator === 'gtelte') {\n    <yuv-number\n      class=\"first\"\n      [readonly]=\"readonly()\"\n      [scale]=\"scale()\"\n      [precision]=\"precision()\"\n      [grouping]=\"grouping()\"\n      [groupPattern]=\"pattern()\"\n      formControlName=\"numberValueFrom\"\n      [classifications]=\"classifications()\"\n      [minValue]=\"minValue()\"\n      [maxValue]=\"maxValue()\"\n    ></yuv-number>\n  }\n\n  <mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" formControlName=\"operator\" [disabled]=\"readonly()\">\n    @for (o of availableSearchOptions; track $index) {\n      <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n    }\n  </mat-select>\n\n  <yuv-number\n    [scale]=\"scale()\"\n    [readonly]=\"readonly()\"\n    [precision]=\"precision()\"\n    [grouping]=\"grouping()\"\n    [groupPattern]=\"pattern()\"\n    formControlName=\"numberValue\"\n    [classifications]=\"classifications()\"\n    [minValue]=\"minValue()\"\n    [maxValue]=\"maxValue()\"\n  >\n  </yuv-number>\n</form>\n", styles: [":host>form{display:inline-flex;flex-flow:row nowrap;align-items:center;gap:var(--ymt-spacing-s)}:host>form yuv-number{flex:1 1 auto}:host>form mat-select{padding:0;width:calc(2ch + 1em);border-radius:2px}\n"] }]
         }], propDecorators: { scale: [{ type: i0.Input, args: [{ isSignal: true, alias: "scale", required: false }] }], precision: [{ type: i0.Input, args: [{ isSignal: true, alias: "precision", required: false }] }], grouping: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouping", required: false }] }], pattern: [{ type: i0.Input, args: [{ isSignal: true, alias: "pattern", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], classifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "classifications", required: false }] }], minValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "minValue", required: false }] }], maxValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxValue", required: false }] }], situation: [{ type: i0.Input, args: [{ isSignal: true, alias: "situation", required: false }] }] } });
@@ -1104,7 +1091,7 @@ class OrganizationComponent extends AbstractMatFormField {
         this.#dRef = inject(DestroyRef);
         this.translate = inject(TranslateService);
         this.minLength = 2;
-        this.busy = signal(false, ...(ngDevMode ? [{ debugName: "busy" }] : []));
+        this.busy = signal(false, ...(ngDevMode ? [{ debugName: "busy" }] : /* istanbul ignore next */ []));
         this.acFormControl = new FormControl(undefined);
         this.ngControl = injectNgControl(this);
         this._innerValue = [];
@@ -1112,11 +1099,11 @@ class OrganizationComponent extends AbstractMatFormField {
         /**
          * Possibles values are `EDIT` (default),`SEARCH`,`CREATE`. In search situation validation of the form element will be turned off, so you are able to enter search terms that do not meet the elements validators.
          */
-        this.situation = input(undefined, ...(ngDevMode ? [{ debugName: "situation" }] : []));
+        this.situation = input(undefined, ...(ngDevMode ? [{ debugName: "situation" }] : /* istanbul ignore next */ []));
         /**
          * Indicator that multiple strings could be inserted, they will be rendered as chips (default: false).
          */
-        this.multiselect = input(false, ...(ngDevMode ? [{ debugName: "multiselect" }] : []));
+        this.multiselect = input(false, ...(ngDevMode ? [{ debugName: "multiselect" }] : /* istanbul ignore next */ []));
         /**
          * Additional semantics for the form element.
          */
@@ -1130,8 +1117,8 @@ class OrganizationComponent extends AbstractMatFormField {
                 }
             }
             return Classification.STRING_ORGANIZATION;
-        }, ...(ngDevMode ? [{ debugName: "#organizationType" }] : []));
-        this.classifications = input(undefined, ...(ngDevMode ? [{ debugName: "classifications" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#organizationType" }] : /* istanbul ignore next */ []));
+        this.classifications = input(undefined, ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
         this.#filterRoles = computed(() => {
             const t = this.#organizationType();
             const c = this.classifications();
@@ -1145,20 +1132,20 @@ class OrganizationComponent extends AbstractMatFormField {
                 }
             }
             return [];
-        }, ...(ngDevMode ? [{ debugName: "#filterRoles" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#filterRoles" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         /**
          * Whether or not to exclude the current user from autocomplete result
          */
-        this.excludeMe = input(false, ...(ngDevMode ? [{ debugName: "excludeMe" }] : []));
+        this.excludeMe = input(false, ...(ngDevMode ? [{ debugName: "excludeMe" }] : /* istanbul ignore next */ []));
         /**
          * Whether or not the emitted value should be an object containing id and title
          * or, if set to false only the ID
          */
-        this.withMetadata = input(false, ...(ngDevMode ? [{ debugName: "withMetadata" }] : []));
+        this.withMetadata = input(false, ...(ngDevMode ? [{ debugName: "withMetadata" }] : /* istanbul ignore next */ []));
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this.propagateChange = (_) => { };
     }
@@ -1308,10 +1295,10 @@ class OrganizationComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: OrganizationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: OrganizationComponent, isStandalone: true, selector: "yuv-organization", inputs: { situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, excludeMe: { classPropertyName: "excludeMe", publicName: "excludeMe", isSignal: true, isRequired: false, transformFunction: null }, withMetadata: { classPropertyName: "withMetadata", publicName: "withMetadata", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: OrganizationComponent }], usesInheritance: true, ngImport: i0, template: "<yuv-autocomplete\n  [required]=\"required\"\n  [busy]=\"busy()\"\n  [formControl]=\"acFormControl\"\n  #autocomplete\n  [placeholder]=\"placeholder\"\n  [disabled]=\"readonly()\"\n  [autocompleteValues]=\"autocompleteRes\"\n  [forceSelection]=\"true\"\n  [distinctValues]=\"true\"\n  (autocompleteFnc)=\"autocompleteFn($event)\"\n  [multiple]=\"true\"\n  [maxItems]=\"multiselect() ? -1 : 1\"\n>\n  <!-- template for item inside the dropdown -->\n  <ng-template #optionTemplate let-item>\n    @if (item.value) {\n      <span class=\"chip\">{{ item.value.title }}</span>\n    }\n  </ng-template>\n\n  <!-- template for chip -->\n  <ng-template #chipTemplate let-item>\n    @if (item.value) {\n      <span class=\"chip\" [ngClass]=\"{ notFound: item.value.notFound }\" [matTooltip]=\"item.value.titleString\">\n        {{ item.value.title || '...' }}\n      </span>\n    }\n  </ng-template>\n</yuv-autocomplete>\n\n<mat-icon class=\"ymt-icon--size-s\" [matTooltip]=\"'yuv.form.element.organization.classify.icon.title' | translate\">\n  {{ multiselect() ? 'group' : 'person' }}\n</mat-icon>\n", styles: [":host{display:flex;align-items:center}:host .chip.notFound{color:var(--ymt-on-danger-container);text-decoration:line-through}:host .chip.notFound:before{content:\"!\";display:inline-block;background-color:var(--ymt-danger-container);color:#fff;border-radius:2px;padding-inline:.3em;text-decoration:none;margin-inline-end:.75em}:host yuv-autocomplete{flex:1}:host mat-icon{color:var(--ymt-text-color-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: YuvAutocompleteModule }, { kind: "component", type: i3$1.AutocompleteComponent, selector: "yuv-autocomplete", inputs: ["ariaLabel", "busy", "multiple", "distinctValues", "addOnBlur", "minLength", "maxItems", "forceSelection", "autocompleteValues"], outputs: ["autocompleteFnc", "acBlur"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: OrganizationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: OrganizationComponent, isStandalone: true, selector: "yuv-organization", inputs: { situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, excludeMe: { classPropertyName: "excludeMe", publicName: "excludeMe", isSignal: true, isRequired: false, transformFunction: null }, withMetadata: { classPropertyName: "withMetadata", publicName: "withMetadata", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: OrganizationComponent }], usesInheritance: true, ngImport: i0, template: "<yuv-autocomplete\n  [required]=\"required\"\n  [busy]=\"busy()\"\n  [formControl]=\"acFormControl\"\n  #autocomplete\n  [placeholder]=\"placeholder\"\n  [disabled]=\"readonly()\"\n  [autocompleteValues]=\"autocompleteRes\"\n  [forceSelection]=\"true\"\n  [distinctValues]=\"true\"\n  (autocompleteFnc)=\"autocompleteFn($event)\"\n  [multiple]=\"true\"\n  [maxItems]=\"multiselect() ? -1 : 1\"\n>\n  <!-- template for item inside the dropdown -->\n  <ng-template #optionTemplate let-item>\n    @if (item.value) {\n      <span class=\"chip\">{{ item.value.title }}</span>\n    }\n  </ng-template>\n\n  <!-- template for chip -->\n  <ng-template #chipTemplate let-item>\n    @if (item.value) {\n      <span class=\"chip\" [ngClass]=\"{ notFound: item.value.notFound }\" [matTooltip]=\"item.value.titleString\">\n        {{ item.value.title || '...' }}\n      </span>\n    }\n  </ng-template>\n</yuv-autocomplete>\n\n<mat-icon class=\"ymt-icon--size-s\" [matTooltip]=\"'yuv.form.element.organization.classify.icon.title' | translate\">\n  {{ multiselect() ? 'group' : 'person' }}\n</mat-icon>\n", styles: [":host{display:flex;align-items:center}:host .chip.notFound{color:var(--ymt-on-danger-container);text-decoration:line-through}:host .chip.notFound:before{content:\"!\";display:inline-block;background-color:var(--ymt-danger-container);color:#fff;border-radius:2px;padding-inline:.3em;text-decoration:none;margin-inline-end:.75em}:host yuv-autocomplete{flex:1}:host mat-icon{color:var(--ymt-text-color-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: YuvAutocompleteModule }, { kind: "component", type: i3$1.AutocompleteComponent, selector: "yuv-autocomplete", inputs: ["ariaLabel", "busy", "multiple", "distinctValues", "addOnBlur", "minLength", "maxItems", "forceSelection", "autocompleteValues"], outputs: ["autocompleteFnc", "acBlur"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: OrganizationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: OrganizationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-organization', standalone: true, imports: [
                         CommonModule,
@@ -1346,26 +1333,26 @@ class OrganizationSetComponent extends AbstractMatFormField {
         /**
          * Possibles values are `EDIT` (default),`SEARCH`,`CREATE`. In search situation validation of the form element will be turned off, so you are able to enter search terms that do not meet the elements validators.
          */
-        this.situation = input(undefined, ...(ngDevMode ? [{ debugName: "situation" }] : []));
+        this.situation = input(undefined, ...(ngDevMode ? [{ debugName: "situation" }] : /* istanbul ignore next */ []));
         /**
          * Indicator that multiple strings could be inserted, they will be rendered as chips (default: false).
          */
-        this.multiselect = input(false, ...(ngDevMode ? [{ debugName: "multiselect" }] : []));
+        this.multiselect = input(false, ...(ngDevMode ? [{ debugName: "multiselect" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         /**
          * Whether or not the emitted value should be an object containing id and title
          * or, if set to false only the ID
          */
-        this.withMetadata = input(false, ...(ngDevMode ? [{ debugName: "withMetadata" }] : []));
+        this.withMetadata = input(false, ...(ngDevMode ? [{ debugName: "withMetadata" }] : /* istanbul ignore next */ []));
         /**
          * Minimum length of the autocomplete input before a query is sent to the server.
          */
-        this.autocompleteMinLength = input(2, ...(ngDevMode ? [{ debugName: "autocompleteMinLength" }] : []));
-        this.classifications = input(undefined, ...(ngDevMode ? [{ debugName: "classifications" }] : []));
-        this.types = input(undefined, ...(ngDevMode ? [{ debugName: "types" }] : []));
+        this.autocompleteMinLength = input(2, ...(ngDevMode ? [{ debugName: "autocompleteMinLength" }] : /* istanbul ignore next */ []));
+        this.classifications = input(undefined, ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
+        this.types = input(undefined, ...(ngDevMode ? [{ debugName: "types" }] : /* istanbul ignore next */ []));
         this.#targetTypes = linkedSignal(() => {
             const c = this.classifications();
             const types = this.types();
@@ -1379,8 +1366,8 @@ class OrganizationSetComponent extends AbstractMatFormField {
                 return types;
             }
             return [];
-        }, ...(ngDevMode ? [{ debugName: "#targetTypes" }] : []));
-        this.busy = signal(false, ...(ngDevMode ? [{ debugName: "busy" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#targetTypes" }] : /* istanbul ignore next */ []));
+        this.busy = signal(false, ...(ngDevMode ? [{ debugName: "busy" }] : /* istanbul ignore next */ []));
         this.acFormControl = new FormControl(undefined);
         this.ngControl = injectNgControl(this);
         this.innerValue = [];
@@ -1472,10 +1459,10 @@ class OrganizationSetComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: OrganizationSetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.19", type: OrganizationSetComponent, isStandalone: true, selector: "yuv-organization-set", inputs: { situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, withMetadata: { classPropertyName: "withMetadata", publicName: "withMetadata", isSignal: true, isRequired: false, transformFunction: null }, autocompleteMinLength: { classPropertyName: "autocompleteMinLength", publicName: "autocompleteMinLength", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, types: { classPropertyName: "types", publicName: "types", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: OrganizationSetComponent }], usesInheritance: true, ngImport: i0, template: "<yuv-autocomplete\n  [busy]=\"busy()\"\n  [formControl]=\"acFormControl\"\n  #autocomplete\n  [placeholder]=\"placeholder\"\n  [disabled]=\"readonly()\"\n  [autocompleteValues]=\"autocompleteRes\"\n  [forceSelection]=\"true\"\n  (autocompleteFnc)=\"autocompleteFn($event)\"\n  [multiple]=\"true\"\n  [maxItems]=\"multiselect() ? -1 : 1\"\n>\n  <!-- template for item inside the dropdown -->\n  <ng-template #optionTemplate let-item>\n    <span class=\"chip\">{{ item.value.title }}</span>\n  </ng-template>\n\n  <!-- template for chip -->\n  <ng-template #chipTemplate let-item>\n    <span class=\"chip\">\n      {{ item.value.title || '...' }}\n    </span>\n  </ng-template>\n</yuv-autocomplete>\n\n<mat-icon class=\"ymt-icon--size-s\" [matTooltip]=\"'yuv.form.element.organization-set.classify.icon.title' | translate\">\n  {{ multiselect() ? 'group' : 'person' }}\n</mat-icon>\n", styles: [":host{display:flex;align-items:center}:host yuv-autocomplete{flex:1}:host mat-icon{color:var(--ymt-text-color-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: YuvAutocompleteModule }, { kind: "component", type: i3$1.AutocompleteComponent, selector: "yuv-autocomplete", inputs: ["ariaLabel", "busy", "multiple", "distinctValues", "addOnBlur", "minLength", "maxItems", "forceSelection", "autocompleteValues"], outputs: ["autocompleteFnc", "acBlur"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: TranslatePipe$1, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: OrganizationSetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: OrganizationSetComponent, isStandalone: true, selector: "yuv-organization-set", inputs: { situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, withMetadata: { classPropertyName: "withMetadata", publicName: "withMetadata", isSignal: true, isRequired: false, transformFunction: null }, autocompleteMinLength: { classPropertyName: "autocompleteMinLength", publicName: "autocompleteMinLength", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, types: { classPropertyName: "types", publicName: "types", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: OrganizationSetComponent }], usesInheritance: true, ngImport: i0, template: "<yuv-autocomplete\n  [busy]=\"busy()\"\n  [formControl]=\"acFormControl\"\n  #autocomplete\n  [placeholder]=\"placeholder\"\n  [disabled]=\"readonly()\"\n  [autocompleteValues]=\"autocompleteRes\"\n  [forceSelection]=\"true\"\n  (autocompleteFnc)=\"autocompleteFn($event)\"\n  [multiple]=\"true\"\n  [maxItems]=\"multiselect() ? -1 : 1\"\n>\n  <!-- template for item inside the dropdown -->\n  <ng-template #optionTemplate let-item>\n    <span class=\"chip\">{{ item.value.title }}</span>\n  </ng-template>\n\n  <!-- template for chip -->\n  <ng-template #chipTemplate let-item>\n    <span class=\"chip\">\n      {{ item.value.title || '...' }}\n    </span>\n  </ng-template>\n</yuv-autocomplete>\n\n<mat-icon class=\"ymt-icon--size-s\" [matTooltip]=\"'yuv.form.element.organization-set.classify.icon.title' | translate\">\n  {{ multiselect() ? 'group' : 'person' }}\n</mat-icon>\n", styles: [":host{display:flex;align-items:center}:host yuv-autocomplete{flex:1}:host mat-icon{color:var(--ymt-text-color-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: YuvAutocompleteModule }, { kind: "component", type: i3$1.AutocompleteComponent, selector: "yuv-autocomplete", inputs: ["ariaLabel", "busy", "multiple", "distinctValues", "addOnBlur", "minLength", "maxItems", "forceSelection", "autocompleteValues"], outputs: ["autocompleteFnc", "acBlur"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: TranslatePipe$1, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: OrganizationSetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: OrganizationSetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-organization-set', imports: [FormsModule, YuvAutocompleteModule, MatTooltipModule, MatIconModule, ReactiveFormsModule, TranslatePipe$1], providers: [{ provide: MatFormFieldControl, useExisting: OrganizationSetComponent }], template: "<yuv-autocomplete\n  [busy]=\"busy()\"\n  [formControl]=\"acFormControl\"\n  #autocomplete\n  [placeholder]=\"placeholder\"\n  [disabled]=\"readonly()\"\n  [autocompleteValues]=\"autocompleteRes\"\n  [forceSelection]=\"true\"\n  (autocompleteFnc)=\"autocompleteFn($event)\"\n  [multiple]=\"true\"\n  [maxItems]=\"multiselect() ? -1 : 1\"\n>\n  <!-- template for item inside the dropdown -->\n  <ng-template #optionTemplate let-item>\n    <span class=\"chip\">{{ item.value.title }}</span>\n  </ng-template>\n\n  <!-- template for chip -->\n  <ng-template #chipTemplate let-item>\n    <span class=\"chip\">\n      {{ item.value.title || '...' }}\n    </span>\n  </ng-template>\n</yuv-autocomplete>\n\n<mat-icon class=\"ymt-icon--size-s\" [matTooltip]=\"'yuv.form.element.organization-set.classify.icon.title' | translate\">\n  {{ multiselect() ? 'group' : 'person' }}\n</mat-icon>\n", styles: [":host{display:flex;align-items:center}:host yuv-autocomplete{flex:1}:host mat-icon{color:var(--ymt-text-color-subtle)}\n"] }]
         }], propDecorators: { situation: [{ type: i0.Input, args: [{ isSignal: true, alias: "situation", required: false }] }], multiselect: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiselect", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], withMetadata: [{ type: i0.Input, args: [{ isSignal: true, alias: "withMetadata", required: false }] }], autocompleteMinLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocompleteMinLength", required: false }] }], classifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "classifications", required: false }] }], types: [{ type: i0.Input, args: [{ isSignal: true, alias: "types", required: false }] }] } });
@@ -1488,7 +1475,7 @@ class DateRangePickerComponent {
         this.form = this.#fb.group({
             range: this.#fb.control(this.#dialogData.range)
         });
-        this.range = input(this.#dialogData.range, ...(ngDevMode ? [{ debugName: "range" }] : []));
+        this.range = input(this.#dialogData.range, ...(ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []));
         this.rangeChange = output();
         this.#rangeEffect = effect(() => {
             const range = this.range();
@@ -1497,7 +1484,7 @@ class DateRangePickerComponent {
                 return;
             }
             this.form.patchValue({ range });
-        }, ...(ngDevMode ? [{ debugName: "#rangeEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#rangeEffect" }] : /* istanbul ignore next */ []));
     }
     #fb;
     #dialogData;
@@ -1507,10 +1494,10 @@ class DateRangePickerComponent {
         this.rangeChange.emit(this.form.value.range || undefined);
         this.#dialogRef.close(this.form.value.range);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DateRangePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.19", type: DateRangePickerComponent, isStandalone: true, selector: "yuv-date-range-picker", inputs: { range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, ngImport: i0, template: "<yuv-dialog [headertitel]=\"'yuv.form.element.range-select-date.custom.overlay.title' | translate\">\n  <main>\n    <form id=\"date-range-picker-form\" [formGroup]=\"form\" (ngSubmit)=\"apply()\">\n      <yuv-datetime-range [withTime]=\"false\" formControlName=\"range\"></yuv-datetime-range>\n    </form>\n  </main>\n  <footer>\n    <button form=\"date-range-picker-form\" ymtButton=\"primary\" [disabled]=\"form.invalid\">\n      {{ 'yuv.form.element.range-select-date.custom.overlay.button.apply' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host form{display:grid;grid-template-columns:1fr auto;grid-template-rows:repeat(3,auto);grid-template-areas:\"title title\" \"input input\" \". button\";gap:var(--ymt-spacing-m);padding:var(--ymt-spacing-m)}:host form h2{grid-area:title;margin:0}:host form yuv-datetime-range{grid-area:input;border:1px solid var(--ymt-text-color-subtle);padding:1px 2px;border-radius:2px}:host form button{grid-area:button}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DatetimeRangeComponent, selector: "yuv-datetime-range", inputs: ["withTime", "readonly", "operator", "situation"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DateRangePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: DateRangePickerComponent, isStandalone: true, selector: "yuv-date-range-picker", inputs: { range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, ngImport: i0, template: "<yuv-dialog [headertitel]=\"'yuv.form.element.range-select-date.custom.overlay.title' | translate\">\n  <main>\n    <form id=\"date-range-picker-form\" [formGroup]=\"form\" (ngSubmit)=\"apply()\">\n      <yuv-datetime-range [withTime]=\"false\" formControlName=\"range\"></yuv-datetime-range>\n    </form>\n  </main>\n  <footer>\n    <button form=\"date-range-picker-form\" ymtButton=\"primary\" [disabled]=\"form.invalid\">\n      {{ 'yuv.form.element.range-select-date.custom.overlay.button.apply' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host form{display:grid;grid-template-columns:1fr auto;grid-template-rows:repeat(3,auto);grid-template-areas:\"title title\" \"input input\" \". button\";gap:var(--ymt-spacing-m);padding:var(--ymt-spacing-m)}:host form h2{grid-area:title;margin:0}:host form yuv-datetime-range{grid-area:input;border:1px solid var(--ymt-text-color-subtle);padding:1px 2px;border-radius:2px}:host form button{grid-area:button}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DatetimeRangeComponent, selector: "yuv-datetime-range", inputs: ["withTime", "readonly", "operator", "situation"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DateRangePickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DateRangePickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-date-range-picker', standalone: true, imports: [ReactiveFormsModule, TranslatePipe, DatetimeRangeComponent, YmtButtonDirective, DialogComponent], template: "<yuv-dialog [headertitel]=\"'yuv.form.element.range-select-date.custom.overlay.title' | translate\">\n  <main>\n    <form id=\"date-range-picker-form\" [formGroup]=\"form\" (ngSubmit)=\"apply()\">\n      <yuv-datetime-range [withTime]=\"false\" formControlName=\"range\"></yuv-datetime-range>\n    </form>\n  </main>\n  <footer>\n    <button form=\"date-range-picker-form\" ymtButton=\"primary\" [disabled]=\"form.invalid\">\n      {{ 'yuv.form.element.range-select-date.custom.overlay.button.apply' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host form{display:grid;grid-template-columns:1fr auto;grid-template-rows:repeat(3,auto);grid-template-areas:\"title title\" \"input input\" \". button\";gap:var(--ymt-spacing-m);padding:var(--ymt-spacing-m)}:host form h2{grid-area:title;margin:0}:host form yuv-datetime-range{grid-area:input;border:1px solid var(--ymt-text-color-subtle);padding:1px 2px;border-radius:2px}:host form button{grid-area:button}\n"] }]
         }], propDecorators: { range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }], rangeChange: [{ type: i0.Output, args: ["rangeChange"] }] } });
@@ -1545,7 +1532,7 @@ class RangeSelectDateComponent extends AbstractMatFormField {
         this.#dialog = inject(MatDialog);
         this.#ANY_OPTION = 'any';
         this.#CUSTOM_OPTION = 'custom';
-        this.options = signal([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+        this.options = signal([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
         this.fc = new FormControl(this.#ANY_OPTION, {
             nonNullable: true
         });
@@ -1553,11 +1540,11 @@ class RangeSelectDateComponent extends AbstractMatFormField {
         /**
          * Range values to be used in the dropdown.
          */
-        this.ranges = input(['today', 'yesterday', 'thisWeek', 'thisMonth', 'thisYear'], ...(ngDevMode ? [{ debugName: "ranges" }] : []));
+        this.ranges = input(['today', 'yesterday', 'thisWeek', 'thisMonth', 'thisYear'], ...(ngDevMode ? [{ debugName: "ranges" }] : /* istanbul ignore next */ []));
         /**
          * Whether to show the custom date range option.
          */
-        this.customRange = input(true, ...(ngDevMode ? [{ debugName: "customRange" }] : []));
+        this.customRange = input(true, ...(ngDevMode ? [{ debugName: "customRange" }] : /* istanbul ignore next */ []));
         // ControlValueAccessor implementation
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this.propagateChange = (_) => { };
@@ -1678,10 +1665,10 @@ class RangeSelectDateComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RangeSelectDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: RangeSelectDateComponent, isStandalone: true, selector: "yuv-range-select-date", inputs: { ranges: { classPropertyName: "ranges", publicName: "ranges", isSignal: true, isRequired: false, transformFunction: null }, customRange: { classPropertyName: "customRange", publicName: "customRange", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: RangeSelectDateComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [formControl]=\"fc\" [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\">\n  @for (o of options(); track $index) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [":host{display:flex}:host mat-select{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RangeSelectDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: RangeSelectDateComponent, isStandalone: true, selector: "yuv-range-select-date", inputs: { ranges: { classPropertyName: "ranges", publicName: "ranges", isSignal: true, isRequired: false, transformFunction: null }, customRange: { classPropertyName: "customRange", publicName: "customRange", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: RangeSelectDateComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [formControl]=\"fc\" [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\">\n  @for (o of options(); track $index) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [":host{display:flex}:host mat-select{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RangeSelectDateComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RangeSelectDateComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-range-select-date', standalone: true, imports: [MatSelectModule, ReactiveFormsModule], providers: [{ provide: MatFormFieldControl, useExisting: RangeSelectDateComponent }], template: "<mat-select [formControl]=\"fc\" [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\">\n  @for (o of options(); track $index) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [":host{display:flex}:host mat-select{flex:1}\n"] }]
         }], ctorParameters: () => [], propDecorators: { ranges: [{ type: i0.Input, args: [{ isSignal: true, alias: "ranges", required: false }] }], customRange: [{ type: i0.Input, args: [{ isSignal: true, alias: "customRange", required: false }] }] } });
@@ -1705,7 +1692,7 @@ class RangeSelectFilesizeComponent extends AbstractMatFormField {
         super();
         this.translate = inject(TranslateService$1);
         this.#ANY_OPTION = 'any';
-        this.options = signal([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+        this.options = signal([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
         this.fc = new FormControl(this.#ANY_OPTION, {
             nonNullable: true
         });
@@ -1713,7 +1700,7 @@ class RangeSelectFilesizeComponent extends AbstractMatFormField {
         /**
          * Range values to be used in the dropdown.
          */
-        this.ranges = input(['small', 'medium', 'large', 'verylarge'], ...(ngDevMode ? [{ debugName: "ranges" }] : []));
+        this.ranges = input(['small', 'medium', 'large', 'verylarge'], ...(ngDevMode ? [{ debugName: "ranges" }] : /* istanbul ignore next */ []));
         // ControlValueAccessor implementation
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         this.propagateChange = (_) => { };
@@ -1761,10 +1748,10 @@ class RangeSelectFilesizeComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RangeSelectFilesizeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: RangeSelectFilesizeComponent, isStandalone: true, selector: "yuv-range-select-filesize", inputs: { ranges: { classPropertyName: "ranges", publicName: "ranges", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: RangeSelectFilesizeComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" [formControl]=\"fc\">\n  @for (o of options(); track $index) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [":host{display:flex}:host mat-select{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RangeSelectFilesizeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: RangeSelectFilesizeComponent, isStandalone: true, selector: "yuv-range-select-filesize", inputs: { ranges: { classPropertyName: "ranges", publicName: "ranges", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: RangeSelectFilesizeComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" [formControl]=\"fc\">\n  @for (o of options(); track $index) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [":host{display:flex}:host mat-select{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RangeSelectFilesizeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RangeSelectFilesizeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-range-select-filesize', standalone: true, imports: [MatSelectModule, ReactiveFormsModule], providers: [{ provide: MatFormFieldControl, useExisting: RangeSelectFilesizeComponent }], template: "<mat-select [panelWidth]=\"null\" [hideSingleSelectionIndicator]=\"true\" [formControl]=\"fc\">\n  @for (o of options(); track $index) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [":host{display:flex}:host mat-select{flex:1}\n"] }]
         }], ctorParameters: () => [], propDecorators: { ranges: [{ type: i0.Input, args: [{ isSignal: true, alias: "ranges", required: false }] }] } });
@@ -1800,31 +1787,31 @@ class StringComponent extends AbstractMatFormField {
         /**
          * Indicator that multiple strings could be inserted, they will be rendered as chips (default: false).
          */
-        this.multiselect = input(false, ...(ngDevMode ? [{ debugName: "multiselect" }] : []));
+        this.multiselect = input(false, ...(ngDevMode ? [{ debugName: "multiselect" }] : /* istanbul ignore next */ []));
         /**
          * Will prevent the input from being changed (default: false)
          */
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         /**
          * Enable autofucus for the input (default: false)
          */
-        this.autofocus = input(false, ...(ngDevMode ? [{ debugName: "autofocus" }] : []));
+        this.autofocus = input(false, ...(ngDevMode ? [{ debugName: "autofocus" }] : /* istanbul ignore next */ []));
         /**
          * Possibles values are `EDIT` (default),`SEARCH`,`CREATE`. In search situation validation of the form element will be turned off, so you are able to enter search terms that do not meet the elements validators.
          */
-        this.situation = input(undefined, ...(ngDevMode ? [{ debugName: "situation" }] : []));
+        this.situation = input(undefined, ...(ngDevMode ? [{ debugName: "situation" }] : /* istanbul ignore next */ []));
         /**
          * Regular expression to validate the input value against
          */
-        this.regex = input(undefined, ...(ngDevMode ? [{ debugName: "regex" }] : []));
+        this.regex = input(undefined, ...(ngDevMode ? [{ debugName: "regex" }] : /* istanbul ignore next */ []));
         /**
          * Minimal number of characters
          */
-        this.minLength = input(undefined, ...(ngDevMode ? [{ debugName: "minLength" }] : []));
+        this.minLength = input(undefined, ...(ngDevMode ? [{ debugName: "minLength" }] : /* istanbul ignore next */ []));
         /**
          * Maximum number of characters
          */
-        this.maxLength = input(undefined, ...(ngDevMode ? [{ debugName: "maxLength" }] : []));
+        this.maxLength = input(undefined, ...(ngDevMode ? [{ debugName: "maxLength" }] : /* istanbul ignore next */ []));
         this.valid = false;
         this.validationErrors = [];
         this.#classifications = [];
@@ -2044,10 +2031,10 @@ class StringComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: StringComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: StringComponent, isStandalone: true, selector: "yuv-string", inputs: { multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: false, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, regex: { classPropertyName: "regex", publicName: "regex", isSignal: true, isRequired: false, transformFunction: null }, minLength: { classPropertyName: "minLength", publicName: "minLength", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.readonly": "readonly()" } }, providers: [{ provide: MatFormFieldControl, useExisting: StringComponent }], usesInheritance: true, ngImport: i0, template: "@if ((!rows || rows <= 1) && !multiselect()) {\n  <input matInput type=\"text\" (blur)=\"onBlur()\" [readonly]=\"readonly()\" [formControl]=\"fc\" />\n} @else if ((!rows || rows <= 1) && multiselect()) {\n  <!-- single line input with multiselect-->\n  <yuv-scroll-buttons>\n    <mat-chip-grid #chipGrid [formControl]=\"fc\">\n      @for (v of value; track v) {\n        <mat-chip-row (removed)=\"chipsRemove(v)\" [editable]=\"true\" (edited)=\"chipsEdit(v, $event)\">\n          {{ v }}\n          <button matChipRemove>\n            <mat-icon>cancel</mat-icon>\n          </button>\n        </mat-chip-row>\n      }\n      <input\n        [matChipInputFor]=\"chipGrid\"\n        [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n        [matChipInputAddOnBlur]=\"true\"\n        (matChipInputTokenEnd)=\"chipsAdd($event)\"\n      />\n    </mat-chip-grid>\n  </yuv-scroll-buttons>\n} @else if (rows && rows > 1) {\n  <!-- multi line text inputs -->\n  <textarea matInput class=\"input-textarea\" (blur)=\"onBlur()\" [rows]=\"rows\" [readonly]=\"readonly()\" [formControl]=\"fc\"></textarea>\n}\n\n@if (classify) {\n  <div class=\"classify\">\n    @if (value && !validationErrors.length && (classify.hrefPrefix !== '' || !multiselect() || value.length <= 1)) {\n      <a href=\"{{ classify.hrefPrefix + formatedValue }}\">\n        <mat-icon>{{ classify.icon }}</mat-icon>\n      </a>\n    } @else {\n      <mat-icon>{{ classify.icon }}</mat-icon>\n    }\n  </div>\n}\n", styles: [":host{display:flex;flex-flow:row nowrap;flex:1;align-items:center}:host:has(mat-chip-grid){min-width:0}:host mat-chip-grid{flex:1}:host textarea.input-textarea{width:100%;resize:none;background-color:transparent;border:0;outline:0}:host input{display:flex;flex-wrap:wrap;align-items:center;width:100%;border:0;outline:0;background:transparent}:host.readonly .classify{pointer-events:all}:host .classify a{color:var(--ymt-text-color-subtle);text-decoration:none}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1$4.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$4.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$4.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ScrollButtonsComponent, selector: "yuv-scroll-buttons", inputs: ["scrollAmount"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: StringComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: StringComponent, isStandalone: true, selector: "yuv-string", inputs: { multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: false, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null }, regex: { classPropertyName: "regex", publicName: "regex", isSignal: true, isRequired: false, transformFunction: null }, minLength: { classPropertyName: "minLength", publicName: "minLength", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.readonly": "readonly()" } }, providers: [{ provide: MatFormFieldControl, useExisting: StringComponent }], usesInheritance: true, ngImport: i0, template: "@if ((!rows || rows <= 1) && !multiselect()) {\n  <input matInput type=\"text\" (blur)=\"onBlur()\" [readonly]=\"readonly()\" [formControl]=\"fc\" />\n} @else if ((!rows || rows <= 1) && multiselect()) {\n  <!-- single line input with multiselect-->\n  <yuv-scroll-buttons>\n    <mat-chip-grid #chipGrid [formControl]=\"fc\">\n      @for (v of value; track v) {\n        <mat-chip-row (removed)=\"chipsRemove(v)\" [editable]=\"true\" (edited)=\"chipsEdit(v, $event)\">\n          {{ v }}\n          <button matChipRemove>\n            <mat-icon>cancel</mat-icon>\n          </button>\n        </mat-chip-row>\n      }\n      <input\n        [matChipInputFor]=\"chipGrid\"\n        [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n        [matChipInputAddOnBlur]=\"true\"\n        (matChipInputTokenEnd)=\"chipsAdd($event)\"\n      />\n    </mat-chip-grid>\n  </yuv-scroll-buttons>\n} @else if (rows && rows > 1) {\n  <!-- multi line text inputs -->\n  <textarea matInput class=\"input-textarea\" (blur)=\"onBlur()\" [rows]=\"rows\" [readonly]=\"readonly()\" [formControl]=\"fc\"></textarea>\n}\n\n@if (classify) {\n  <div class=\"classify\">\n    @if (value && !validationErrors.length && (classify.hrefPrefix !== '' || !multiselect() || value.length <= 1)) {\n      <a href=\"{{ classify.hrefPrefix + formatedValue }}\">\n        <mat-icon>{{ classify.icon }}</mat-icon>\n      </a>\n    } @else {\n      <mat-icon>{{ classify.icon }}</mat-icon>\n    }\n  </div>\n}\n", styles: [":host{display:flex;flex-flow:row nowrap;flex:1;align-items:center}:host:has(mat-chip-grid){min-width:0}:host mat-chip-grid{flex:1}:host textarea.input-textarea{width:100%;resize:none;background-color:transparent;border:0;outline:0}:host input{display:flex;flex-wrap:wrap;align-items:center;width:100%;border:0;outline:0;background:transparent}:host.readonly .classify{pointer-events:all}:host .classify a{color:var(--ymt-text-color-subtle);text-decoration:none}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i1$4.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$4.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$4.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ScrollButtonsComponent, selector: "yuv-scroll-buttons", inputs: ["scrollAmount"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: StringComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: StringComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-string', standalone: true, imports: [MatChipsModule, MatIconModule, ReactiveFormsModule, FormsModule, ScrollButtonsComponent], providers: [{ provide: MatFormFieldControl, useExisting: StringComponent }], host: {
                         '[class.readonly]': 'readonly()'
@@ -2064,19 +2051,19 @@ class CatalogComponent extends AbstractMatFormField {
         this.#system = inject(SystemService);
         this.#dRef = inject(DestroyRef);
         this.translate = inject(TranslateService);
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-        this.multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : []));
-        this._options = signal([], ...(ngDevMode ? [{ debugName: "_options" }] : []));
-        this.options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+        this._options = signal([], ...(ngDevMode ? [{ debugName: "_options" }] : /* istanbul ignore next */ []));
+        this.options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
         this.#optionsEffect = effect(() => {
             untracked(() => {
                 this.#setOptions(this.options() || [], false);
             });
-        }, ...(ngDevMode ? [{ debugName: "#optionsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#optionsEffect" }] : /* istanbul ignore next */ []));
         /**
          * Additional semantics for the form element.
          */
-        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : []));
+        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
         this.#classificationEffect = effect(() => {
             const cls = this.classifications();
             untracked(() => {
@@ -2085,11 +2072,11 @@ class CatalogComponent extends AbstractMatFormField {
                     this.#setOptions(ce.options, false);
                 }
             });
-        }, ...(ngDevMode ? [{ debugName: "#classificationEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#classificationEffect" }] : /* istanbul ignore next */ []));
         /**
          * Possibles values are `EDIT` (default),`SEARCH`,`CREATE`. In search situation validation of the form element will be turned off, so you are able to enter search terms that do not meet the elements validators.
          */
-        this.situation = input(...(ngDevMode ? [undefined, { debugName: "situation" }] : []));
+        this.situation = input(...(ngDevMode ? [undefined, { debugName: "situation" }] : /* istanbul ignore next */ []));
         this.ngControl = injectNgControl(this);
         this.fc = new FormControl(undefined);
         // eslint-disable-next-line @typescript-eslint/no-empty-function
@@ -2150,10 +2137,10 @@ class CatalogComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CatalogComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: CatalogComponent, isStandalone: true, selector: "yuv-catalog", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: CatalogComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [multiple]=\"multiple()\" [disabled]=\"readonly()\" [formControl]=\"fc\">\n  @for (o of _options(); track o) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CatalogComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: CatalogComponent, isStandalone: true, selector: "yuv-catalog", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: CatalogComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [multiple]=\"multiple()\" [disabled]=\"readonly()\" [formControl]=\"fc\">\n  @for (o of _options(); track o) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: CatalogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: CatalogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-catalog', imports: [MatSelectModule, ReactiveFormsModule], providers: [{ provide: MatFormFieldControl, useExisting: CatalogComponent }], template: "<mat-select [multiple]=\"multiple()\" [disabled]=\"readonly()\" [formControl]=\"fc\">\n  @for (o of _options(); track o) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>\n" }]
         }], propDecorators: { readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], classifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "classifications", required: false }] }], situation: [{ type: i0.Input, args: [{ isSignal: true, alias: "situation", required: false }] }] } });
@@ -2175,20 +2162,20 @@ class I18nCatalogComponent extends AbstractMatFormField {
         this.#system = inject(SystemService);
         this.#dRef = inject(DestroyRef);
         this.translate = inject(TranslateService);
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-        this.multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : []));
-        this.propertyName = input(undefined, ...(ngDevMode ? [{ debugName: "propertyName" }] : []));
-        this._options = signal([], ...(ngDevMode ? [{ debugName: "_options" }] : []));
-        this.options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+        this.propertyName = input(undefined, ...(ngDevMode ? [{ debugName: "propertyName" }] : /* istanbul ignore next */ []));
+        this._options = signal([], ...(ngDevMode ? [{ debugName: "_options" }] : /* istanbul ignore next */ []));
+        this.options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
         this.#optionsEffect = effect(() => {
             untracked(() => {
                 this.#setOptions(this.options());
             });
-        }, ...(ngDevMode ? [{ debugName: "#optionsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#optionsEffect" }] : /* istanbul ignore next */ []));
         /**
          * Additional semantics for the form element.
          */
-        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : []));
+        this.classifications = input([], ...(ngDevMode ? [{ debugName: "classifications" }] : /* istanbul ignore next */ []));
         this.#classificationEffect = effect(() => {
             const cls = this.classifications();
             untracked(() => {
@@ -2197,11 +2184,11 @@ class I18nCatalogComponent extends AbstractMatFormField {
                     this.#setOptions(ce.options);
                 }
             });
-        }, ...(ngDevMode ? [{ debugName: "#classificationEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#classificationEffect" }] : /* istanbul ignore next */ []));
         /**
          * Possibles values are `EDIT` (default),`SEARCH`,`CREATE`. In search situation validation of the form element will be turned off, so you are able to enter search terms that do not meet the elements validators.
          */
-        this.situation = input(...(ngDevMode ? [undefined, { debugName: "situation" }] : []));
+        this.situation = input(...(ngDevMode ? [undefined, { debugName: "situation" }] : /* istanbul ignore next */ []));
         this.ngControl = injectNgControl(this);
         this.fc = new FormControl(undefined);
         // eslint-disable-next-line @typescript-eslint/no-empty-function
@@ -2259,10 +2246,10 @@ class I18nCatalogComponent extends AbstractMatFormField {
     ngOnDestroy() {
         super.onNgOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: I18nCatalogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: I18nCatalogComponent, isStandalone: true, selector: "yuv-i18n-catalog", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, propertyName: { classPropertyName: "propertyName", publicName: "propertyName", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: I18nCatalogComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [multiple]=\"multiple()\" [disabled]=\"readonly()\" [formControl]=\"fc\">\n  @for (o of _options(); track o) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: I18nCatalogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: I18nCatalogComponent, isStandalone: true, selector: "yuv-i18n-catalog", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, propertyName: { classPropertyName: "propertyName", publicName: "propertyName", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, classifications: { classPropertyName: "classifications", publicName: "classifications", isSignal: true, isRequired: false, transformFunction: null }, situation: { classPropertyName: "situation", publicName: "situation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: MatFormFieldControl, useExisting: I18nCatalogComponent }], usesInheritance: true, ngImport: i0, template: "<mat-select [multiple]=\"multiple()\" [disabled]=\"readonly()\" [formControl]=\"fc\">\n  @for (o of _options(); track o) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i1$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: I18nCatalogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: I18nCatalogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-i18n-catalog', imports: [MatSelectModule, ReactiveFormsModule], providers: [{ provide: MatFormFieldControl, useExisting: I18nCatalogComponent }], template: "<mat-select [multiple]=\"multiple()\" [disabled]=\"readonly()\" [formControl]=\"fc\">\n  @for (o of _options(); track o) {\n    <mat-option [value]=\"o.value\">{{ o.label }}</mat-option>\n  }\n</mat-select>" }]
         }], ctorParameters: () => [], propDecorators: { readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], propertyName: [{ type: i0.Input, args: [{ isSignal: true, alias: "propertyName", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], classifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "classifications", required: false }] }], situation: [{ type: i0.Input, args: [{ isSignal: true, alias: "situation", required: false }] }] } });
@@ -2282,8 +2269,8 @@ const formElementCmps = [
  * Module for the forms library.
  */
 class YuvFormsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: YuvFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: YuvFormsModule, imports: [StringComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YuvFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: YuvFormsModule, imports: [StringComponent,
             NumberComponent,
             NumberRangeComponent,
             DatetimeComponent,
@@ -2300,9 +2287,9 @@ class YuvFormsModule {
             StringComponent,
             CatalogComponent,
             I18nCatalogComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: YuvFormsModule, imports: [formElementCmps] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YuvFormsModule, imports: [formElementCmps] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: YuvFormsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: YuvFormsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...formElementCmps],