@yuuvis/client-framework 3.2.2 → 3.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuuvis/client-framework",
-  "version": "3.2.2",
+  "version": "3.3.0",
   "author": "OPTIMAL SYSTEMS GmbH <npm@optimal-systems.de>",
   "license": "MIT",
   "peerDependencies": {
@@ -8,16 +8,16 @@
     "@angular/common": "^21.2.9",
     "@angular/core": "^21.2.9",
     "angular-gridster2": "^21.0.1",
-    "@yuuvis/client-core": "^3.2.2",
-    "@yuuvis/client-shell-core": "^3.2.2",
-    "@yuuvis/client-components": "^3.2.2",
+    "@yuuvis/client-core": "^3.3.0",
+    "@yuuvis/client-shell-core": "^3.3.0",
+    "@yuuvis/client-components": "^3.3.0",
     "ng-dynamic-component": "^10.8.2",
     "modern-normalize": "^3.0.1"
   },
   "dependencies": {
     "@angular/material": "^21.2.7",
     "@ngrx/signals": "^21.1.0",
-    "@yuuvis/material": "^3.2.2",
+    "@yuuvis/material": "^3.3.0",
     "@yuuvis/media-viewer": "^3.0.1",
     "angular-split": "^20.0.0",
     "vis-network": "^10.0.2",

package/types/yuuvis-client-framework-forms.d.ts

@@ -1,7 +1,7 @@
 import * as _angular_forms from '@angular/forms';
 import { ControlValueAccessor, FormControl, Validator, FormGroup, ValidationErrors, AbstractControl } from '@angular/forms';
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy, ElementRef, AfterViewInit } from '@angular/core';
+import { OnInit, OnDestroy, ElementRef, WritableSignal, AfterViewInit } from '@angular/core';
 import { AbstractMatFormField } from '@yuuvis/client-framework/common';
 import { TranslateService, Situation, ObjectFormControl, RangeValue, Operator, LocaleNumberPipe, FileSizePipe, OrganizationSetEntry, DateRange, FilesizeRange, FormattedMailTo } from '@yuuvis/client-core';
 import { MetadataFormFieldContext } from '@yuuvis/client-framework/metadata-form';
@@ -11,7 +11,6 @@ import { MatChipInputEvent, MatChipEditedEvent } from '@angular/material/chips';
 
 declare class CatalogComponent extends AbstractMatFormField<string | string[]> implements ControlValueAccessor, OnInit, OnDestroy {
     #private;
-    private readonly translate;
     readonly: _angular_core.InputSignal<boolean>;
     multiple: _angular_core.InputSignal<boolean>;
     _options: _angular_core.WritableSignal<{
@@ -24,15 +23,17 @@ declare class CatalogComponent extends AbstractMatFormField<string | string[]> i
      */
     classifications: _angular_core.InputSignal<string[]>;
     /**
-     * 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.
+     * 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.
      */
     situation: _angular_core.InputSignal<string | undefined>;
     ngControl: _angular_forms.NgControl | null;
-    readonly fc: FormControl<string | string[] | null | undefined>;
+    readonly formCtrl: FormControl<string | string[] | null | undefined>;
     propagateChange: (_: any) => void;
     writeValue(value: string | string[]): void;
     registerOnChange(fn: any): void;
-    registerOnTouched(fn: any): void;
+    registerOnTouched(): void;
     setDisabledState?(isDisabled: boolean): void;
     ngOnInit(): void;
     ngOnDestroy(): void;
@@ -123,7 +124,7 @@ declare class DatetimeRangeComponent extends AbstractMatFormField<RangeValue<Dat
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatetimeRangeComponent, "yuv-datetime-range", never, { "withTimeInput": { "alias": "withTime"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "operator": { "alias": "operator"; "required": false; "isSignal": true; }; "situation": { "alias": "situation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-declare class DatetimeComponent extends AbstractMatFormField<Date | null> implements ControlValueAccessor, OnInit {
+declare class DatetimeComponent extends AbstractMatFormField<Date | string | null> implements ControlValueAccessor, OnInit {
     #private;
     private translate;
     pickerCmp: _angular_core.Signal<DatepickerComponent>;
@@ -150,7 +151,7 @@ declare class DatetimeComponent extends AbstractMatFormField<Date | null> implem
     withTime: _angular_core.InputSignal<boolean>;
     openCalendar(): void;
     propagateChange: (_: any) => void;
-    writeValue(value: any): void;
+    writeValue(value: string | Date): void;
     registerOnChange(fn: () => void): void;
     registerOnTouched(): void;
     setDisabledState?(isDisabled: boolean): void;
@@ -160,15 +161,24 @@ declare class DatetimeComponent extends AbstractMatFormField<Date | null> implem
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatetimeComponent, "yuv-datetime", never, { "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "onlyFutureDates": { "alias": "onlyFutureDates"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "calendar": { "alias": "calendar"; "required": false; "isSignal": true; }; "withTime": { "alias": "withTime"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+interface DynamicCatalogOption {
+    value: string;
+    label: string;
+    disabled: boolean;
+    invalid?: boolean;
+}
+interface SelectedDisplay {
+    value: string;
+    label: string;
+    invalid: boolean;
+}
 declare class DynamicCatalogComponent extends AbstractMatFormField<string | string[]> implements ControlValueAccessor, OnInit, OnDestroy {
     #private;
     catalog: _angular_core.InputSignal<string>;
     readonly: _angular_core.InputSignal<boolean>;
     multiple: _angular_core.InputSignal<boolean>;
-    options: _angular_core.WritableSignal<{
-        value: string;
-        label: string;
-    }[] | undefined>;
+    options: WritableSignal<DynamicCatalogOption[]>;
+    selectedDisplay: _angular_core.Signal<SelectedDisplay[]>;
     /**
      * 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

package/types/yuuvis-client-framework-query-list.d.ts

@@ -217,9 +217,11 @@ declare class QueryListComponent<T = any> {
      * exceeds this value, pagination controls are shown and the user can navigate between
      * pages via `changePage()` / `goToPage()`.
      *
-     * @default SearchService.DEFAULT_QUERY_SIZE
+     * Resolution order (see `effectivePageSize`): explicit `pageSize` input takes precedence,
+     * otherwise `(query as SearchQuery).size` is used if set, otherwise
+     * `SearchService.DEFAULT_QUERY_SIZE` is used.
      */
-    pageSize: _angular_core.InputSignal<number>;
+    pageSize: _angular_core.InputSignal<number | undefined>;
     /**
      * Enables mouse drag-to-select on list items.
      *
@@ -274,6 +276,21 @@ declare class QueryListComponent<T = any> {
      * (e.g. to show a visual indicator or adjust layout) without accessing internal state.
      */
     dropInSize: _angular_core.Signal<number>;
+    /**
+     * Resolved page size used by both the `mat-paginator` and every server request.
+     *
+     * Falls back through three sources, in order:
+     * 1. The explicit `pageSize` input, when the consumer has provided one.
+     * 2. `(query as SearchQuery).size`, when the query is a `SearchQuery` object that
+     *    already declares its own page size — keeps server response and paginator in
+     *    sync when the consumer only configures the query.
+     * 3. `SearchService.DEFAULT_QUERY_SIZE` as the final default.
+     *
+     * Used internally to avoid the bug where `mat-paginator` and the server pageination
+     * use different page sizes (paginator showing e.g. "1-25 of 43" while `getPage()`
+     * asks the server for skip=50 — landing on an empty page).
+     */
+    effectivePageSize: _angular_core.Signal<number>;
     /**
      * The final list of items rendered by the template.
      *

package/types/yuuvis-client-framework-tile-list.d.ts

@@ -154,9 +154,11 @@ declare class TileListComponent implements OnInit {
      * this value, pagination controls appear. Reducing this number improves initial load
      * time; increasing it reduces the need for pagination.
      *
-     * @default SearchService.DEFAULT_QUERY_SIZE
+     * When omitted, the inner `QueryListComponent` falls back to `(query as SearchQuery).size`
+     * if set, otherwise to `SearchService.DEFAULT_QUERY_SIZE` — keeping the paginator and
+     * the server in sync without requiring the consumer to set this input explicitly.
      */
-    pageSize: _angular_core.InputSignal<number>;
+    pageSize: _angular_core.InputSignal<number | undefined>;
     /**
      * Enables multi-selection mode.
      *