@yuuvis/client-framework 3.22.1 → 3.24.0

package/lib/assets/i18n/de.json

@@ -175,6 +175,7 @@
   "yuv.smart-search.combinator.and": "UND",
   "yuv.smart-search.combinator.as-well-as": "sowie",
   "yuv.smart-search.combinator.or": "ODER",
+  "yuv.smart-search.condition.dynamic-aria": "Auszufüllendes Feld: {{label}}",
   "yuv.smart-search.condition.edit-aria": "Bedingung bearbeiten: {{label}}",
   "yuv.smart-search.condition.mark-dynamic": "Als auszufüllendes Feld festlegen",
   "yuv.smart-search.condition.remove": "Bedingung entfernen",
@@ -206,6 +207,7 @@
   "yuv.smart-search.operator.like": "ähnlich",
   "yuv.smart-search.operator.not-empty": "ist nicht leer",
   "yuv.smart-search.operator.select": "Operator auswählen…",
+  "yuv.smart-search.type.add-type.tooltip": "Typ hinzufügen",
   "yuv.smart-search.type.confirm": "Typen bestätigen",
   "yuv.smart-search.type.remove": "Typ entfernen",
   "yuv.smart-search.type.remove-draft": "Ausgewählten Typ entfernen",

package/lib/assets/i18n/en.json

@@ -175,6 +175,7 @@
   "yuv.smart-search.combinator.and": "AND",
   "yuv.smart-search.combinator.as-well-as": "as well as",
   "yuv.smart-search.combinator.or": "OR",
+  "yuv.smart-search.condition.dynamic-aria": "Input field: {{label}}",
   "yuv.smart-search.condition.edit-aria": "Edit condition: {{label}}",
   "yuv.smart-search.condition.mark-dynamic": "Make this an input field",
   "yuv.smart-search.condition.remove": "Remove condition",
@@ -206,6 +207,7 @@
   "yuv.smart-search.operator.like": "similar",
   "yuv.smart-search.operator.not-empty": "is not empty",
   "yuv.smart-search.operator.select": "Select operator...",
+  "yuv.smart-search.type.add-type.tooltip": "Add type",
   "yuv.smart-search.type.confirm": "Confirm types",
   "yuv.smart-search.type.remove": "Remove type",
   "yuv.smart-search.type.remove-draft": "Remove selected type",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuuvis/client-framework",
-  "version": "3.22.1",
+  "version": "3.24.0",
   "author": "OPTIMAL SYSTEMS GmbH <npm@optimal-systems.de>",
   "license": "MIT",
   "peerDependencies": {
@@ -8,16 +8,16 @@
     "@angular/common": "^21.2.19",
     "@angular/core": "^21.2.19",
     "angular-gridster2": "^21.0.1",
-    "@yuuvis/client-core": "^3.22.1",
-    "@yuuvis/client-shell-core": "^3.22.1",
-    "@yuuvis/client-components": "^3.22.1",
+    "@yuuvis/client-core": "^3.24.0",
+    "@yuuvis/client-shell-core": "^3.24.0",
+    "@yuuvis/client-components": "^3.24.0",
     "ng-dynamic-component": "^10.8.2",
     "modern-normalize": "^3.0.1"
   },
   "dependencies": {
     "@angular/material": "^21.2.14",
     "@ngrx/signals": "^21.1.0",
-    "@yuuvis/material": "^3.22.1",
+    "@yuuvis/material": "^3.24.0",
     "@yuuvis/media-viewer": "^4.1.0",
     "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, AbstractControl } from '@angular/forms';
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy, ElementRef, WritableSignal, AfterViewInit } from '@angular/core';
+import { OnInit, OnDestroy, ElementRef, DoCheck, 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';
@@ -41,6 +41,37 @@ declare class CatalogComponent extends AbstractMatFormField<string | string[]> i
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<CatalogComponent, "yuv-catalog", never, { "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "classifications": { "alias": "classifications"; "required": false; "isSignal": true; }; "situation": { "alias": "situation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/**
+ * Form input for a color value. Renders a hex text input alongside a native color picker
+ * swatch; both stay in sync. The value is a hex color string (e.g. `#2A70AC`).
+ *
+ * Implements `ControlValueAccessor` so it can be used within Angular forms and Material form
+ * fields.
+ *
+ * @example
+ * <mat-form-field>
+ *   <mat-label>Primary color</mat-label>
+ *   <yuv-color formControlName="primaryColor"></yuv-color>
+ * </mat-form-field>
+ */
+declare class ColorComponent extends AbstractMatFormField<string> implements ControlValueAccessor, OnInit, OnDestroy {
+    #private;
+    /** the color swatch (native `<input type="color">`, always a full 6-digit hex) */
+    readonly colorFc: FormControl<string>;
+    /** the editable hex text input (source of truth for the value) */
+    readonly textFc: FormControl<string | null>;
+    ngControl: _angular_forms.NgControl | null;
+    propagateChange: (_: string | null) => void;
+    writeValue(value: string): void;
+    registerOnChange(fn: (value: string | null) => void): void;
+    registerOnTouched(): void;
+    setDisabledState(isDisabled: boolean): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ColorComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ColorComponent, "yuv-color", never, {}, {}, never, never, true, never>;
+}
+
 declare enum DataGridSizeType {
     SMALL = "small",
     MEDIUM = "medium",
@@ -49,6 +80,99 @@ declare enum DataGridSizeType {
     AUTO = "auto"
 }
 
+/**
+ * Column of a table element as it is provided to the row editing dialog.
+ */
+type TableRowColumn = Record<string, unknown> & {
+    name: string;
+};
+
+/**
+ * @ignore
+ * Scripting element for one cell of the table row that is being edited. Mirrors the
+ * properties form scripts know from the elements of `scope.model`, but applies changes
+ * to the controls of the row editing dialog instead of the object form.
+ */
+declare class TableRowScopeElement {
+    private readonly element;
+    private readonly onChange;
+    constructor(element: TableRowColumn, onChange: (name: string, change: TableRowScriptingChange) => void);
+    /**
+     * Called when the user changed the cell value. Triggers the elements `onchange` callback
+     * with the element itself and the rows model (siblings), like form scripts get it for table rows.
+     */
+    update(value: unknown, rowModel: TableRowScriptingModel): void;
+    set value(value: unknown);
+    get value(): unknown;
+    set required(required: boolean);
+    get required(): boolean;
+    set readonly(readonly: boolean);
+    get readonly(): boolean;
+    set error(error: TableRowScriptingError);
+    get error(): TableRowScriptingError;
+    set onchange(onchange: TableRowScriptingChangeHandler | null);
+    get onchange(): TableRowScriptingChangeHandler | null;
+    get name(): string;
+    get label(): unknown;
+    get description(): unknown;
+    get type(): unknown;
+    get classifications(): unknown;
+    get scale(): unknown;
+    get precision(): unknown;
+}
+
+type TableRowScriptingModel = Record<string, TableRowScopeElement>;
+
+/**
+ * The 'row' object passed as second argument to a table element's `onrowedit` form script callback.
+ * @see documentation: Form scripting - The 'row' object
+ */
+interface TableRowScriptingRow {
+    index: number;
+    persisted: boolean;
+    saveEnabled: boolean;
+    model: TableRowScriptingModel;
+}
+
+/**
+ * Callback run when the row editing dialog of a table opens.
+ * @param table the table element (see `TableRowEditSupport.resolveRowEditTable`)
+ * @param row the row being edited
+ */
+type TableRowEditCallback = (table: unknown, row: TableRowScriptingRow) => void;
+
+/**
+ * Optional properties a table form element (the `formElement` input of `yuv-data-grid`) may provide
+ * to hook into the row editing dialog, e.g. to support the `onrowedit` form script callback.
+ * Hosts that don't need row scripting simply omit them.
+ */
+interface TableRowEditSupport {
+    /** called whenever the row editing dialog opens */
+    onrowedit?: TableRowEditCallback | null;
+    /**
+     * Resolves the element passed as first argument to `onrowedit` (e.g. the table element of a
+     * form scripting scope). Called when the dialog opens. Defaults to the form element itself.
+     */
+    resolveRowEditTable?: () => unknown;
+}
+
+type TableRowScriptingChangeHandler = (element: TableRowScopeElement, rowModel: TableRowScriptingModel) => any;
+
+/**
+ * Change of a row cell property applied by a form script.
+ */
+interface TableRowScriptingChange {
+    name: 'value' | 'required' | 'readonly' | 'error';
+    newValue: unknown;
+}
+
+/**
+ * Error a form script may set on a row cell, the same shape as for elements of `scope.model`.
+ */
+type TableRowScriptingError = {
+    msg: string;
+} | null;
+
 declare class DataGridComponent implements ControlValueAccessor, Validator {
     #private;
     readonly translate: TranslateService;
@@ -128,7 +252,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 | string | null> implements ControlValueAccessor, OnInit {
+declare class DatetimeComponent extends AbstractMatFormField<Date | string | null> implements ControlValueAccessor, OnInit, DoCheck {
     #private;
     private translate;
     pickerCmp: _angular_core.Signal<DatepickerComponent>;
@@ -161,6 +285,7 @@ declare class DatetimeComponent extends AbstractMatFormField<Date | string | nul
     setDisabledState?(isDisabled: boolean): void;
     onValueChange(e: any): void;
     ngOnInit(): void;
+    ngDoCheck(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatetimeComponent, never>;
     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>;
 }
@@ -797,7 +922,13 @@ declare class YuvFormsModule {
 
 declare class FormUtils {
     static getErrorState(control: AbstractControl): boolean;
+    /**
+     * Writes the errors of a form element's inner control onto the hosting control without
+     * dropping the host's own validation result (e.g. `required` set up by the surrounding form).
+     * `host.setErrors(inner.errors)` alone would wipe those whenever the inner control is valid.
+     */
+    static mergeInnerErrors(host: AbstractControl, inner: AbstractControl): void;
 }
 
-export { CatalogComponent, DataGridComponent, DatetimeComponent, DatetimeRangeComponent, DynamicCatalogComponent, FormUtils, I18nCatalogComponent, NumberComponent, NumberRangeComponent, OrganizationComponent, OrganizationSetComponent, RangeSelectDateComponent, RangeSelectFilesizeComponent, ReferenceComponent, StringComponent, YuvFormsModule };
-export type { RangeSelectDateValue, RangeSelectFilesizeValue };
+export { CatalogComponent, ColorComponent, DataGridComponent, DatetimeComponent, DatetimeRangeComponent, DynamicCatalogComponent, FormUtils, I18nCatalogComponent, NumberComponent, NumberRangeComponent, OrganizationComponent, OrganizationSetComponent, RangeSelectDateComponent, RangeSelectFilesizeComponent, ReferenceComponent, StringComponent, TableRowScopeElement, YuvFormsModule };
+export type { RangeSelectDateValue, RangeSelectFilesizeValue, TableRowEditCallback, TableRowEditSupport, TableRowScriptingChangeHandler, TableRowScriptingError, TableRowScriptingModel, TableRowScriptingRow };

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

@@ -112,8 +112,8 @@ declare class QueryListComponent<T = any> {
      *
      * Accepts either a structured `SearchQuery` object (field filters, sort orders, etc.)
      * or a raw CMIS query string. The query is re-executed reactively every time this
-     * input changes. Set to `null` or `undefined` to clear the list without triggering
-     * a new request.
+     * input changes. Set to `null` or `undefined` to stop searching: a request still in
+     * flight is cancelled, and the list keeps showing the result it has.
      */
     query: _angular_core.InputSignal<string | SearchQuery | null | undefined>;
     /**
@@ -326,8 +326,10 @@ declare class QueryListComponent<T = any> {
     /**
      * Indicates whether a search request is currently in flight.
      *
-     * Set to `true` immediately before a query or page request is dispatched to the
-     * search service, and back to `false` once the response (or error) arrives.
+     * `true` from the moment a query or page request is dispatched to the search service until
+     * the latest request settles (response, error or cancellation). A request superseded by a
+     * newer one is cancelled, and `busy` stays `true` across that switch. Derived from the request
+     * in flight but still writable: a value set from outside holds until the loading state changes.
      * Bind this to a loading indicator or `BusyOverlayDirective` in the parent template:
      * ```html
      * <yuv-query-list #qList ...>...</yuv-query-list>
@@ -335,6 +337,7 @@ declare class QueryListComponent<T = any> {
      * ```
      */
     busy: _angular_core.WritableSignal<boolean>;
+    private readonly paginator;
     constructor();
     /** Resolves the tracking key for a result item in the `@for` loop. */
     trackItem(item: T, index: number): unknown;
@@ -451,7 +454,7 @@ declare class QueryListComponent<T = any> {
      * appear in the current query (e.g. because the index has not been updated), drop it
      * in temporarily so the user sees it immediately without a full refresh.
      *
-     * Drop-in items are cleared automatically when the user navigates to a different page.
+     * Drop-in items are cleared automatically once a page the user navigates to is shown.
      * Call `dropItems([])` to remove them programmatically.
      *
      * @param items    Items to prepend. Must be of type `T` (same as query result items).
@@ -531,8 +534,9 @@ declare class QueryListComponent<T = any> {
     /**
      * Re-executes the current query without changing the page or query parameters.
      *
-     * If pagination is active, re-fetches the same page the user is currently on.
-     * If no pagination is active, re-runs the original query from scratch.
+     * Re-runs what the list is about to show or is showing: a request still in flight, otherwise
+     * the page the user is currently on, or the query from scratch if it has only one page. If that
+     * page no longer exists — its objects were deleted — the list moves to the last page there is.
      *
      * Use this to reflect server-side changes (e.g. after a create/delete operation)
      * without navigating away from the current view.
@@ -551,11 +555,14 @@ declare class QueryListComponent<T = any> {
     /**
      * Handles a page-change event emitted by the `mat-paginator`.
      *
-     * Converts the zero-based `pageEvent.pageIndex` to the one-based page number
-     * expected by `goToPage()` and delegates the request.
+     * Loads the page for the zero-based `pageEvent.pageIndex`, like `goToPage()`, and clears the
+     * drop-in items once that page is shown. If it fails to load, they stay.
      *
      * Bound to `(page)` on the `mat-paginator` in the template.
      *
+     * Ignored while the paginator still shows the previous query's result — a new query is loading or
+     * failed to load — since its page numbers mean nothing for the current query.
+     *
      * @param pageEvent The pagination event emitted by `MatPaginatorModule`.
      */
     changePage(pageEvent: PageEvent): void;
@@ -564,9 +571,10 @@ declare class QueryListComponent<T = any> {
      *
      * Sets `busy` to `true` for the duration of the request. On success, updates
      * the pagination state, clears all optimistic overrides (they are page-scoped),
-     * and replaces `#items` with the new page's results.
-     *
-     * Also used internally by `refresh()` to reload the currently active page.
+     * and replaces `#items` with the new page's results. A request still in flight — an earlier
+     * page change or a new query — is cancelled. If loading the page fails, the list and the
+     * paginator stay on the page that was loaded before. A page past the last one loads the last
+     * page instead.
      *
      * @param page One-based page number to navigate to.
      */