@yuuvis/client-framework 2.1.12 → 2.1.13

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

@@ -0,0 +1,120 @@
+import * as i0 from '@angular/core';
+import { inject, input, output, signal, effect, linkedSignal, Component } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import * as i4 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import { MatDivider } from '@angular/material/divider';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i3 from '@angular/material/menu';
+import { MatMenuModule } from '@angular/material/menu';
+import * as i1 from '@yuuvis/client-core';
+import { SystemService, TranslateService, TranslateModule } from '@yuuvis/client-core';
+
+const MATERIAL_MODULES = [MatIconModule, MatMenuModule, MatButtonModule, MatDivider];
+class SortComponent {
+    #systemService;
+    #rememberSort;
+    #reEvaluate;
+    constructor() {
+        this.#systemService = inject(SystemService);
+        this.translate = inject(TranslateService);
+        this.sortOptions = input([]);
+        this.storageKey = input();
+        this.sortChanged = output();
+        this.orderOptions = signal([
+            { label: this.translate.instant('yuv.sort.ascending'), value: 'asc', type: 'order', selected: true },
+            { label: this.translate.instant('yuv.sort.descending'), value: 'desc', type: 'order', selected: false }
+        ]);
+        this.#rememberSort = effect(() => {
+            const storageKey = this.storageKey();
+            if (storageKey) {
+                const storage = localStorage.getItem(storageKey);
+                if (storage) {
+                    try {
+                        const data = JSON.parse(storage);
+                        this.sortFields.update((fields) => fields.map((field) => field.type === 'sort' && field.value === data.field
+                            ? { ...field, selected: true }
+                            : field.type === 'order' && field.value === data.order
+                                ? { ...field, selected: true }
+                                : { ...field, selected: false }));
+                    }
+                    catch (error) {
+                        console.error('Error parsing sort data from localStorage:', error);
+                    }
+                }
+            }
+        });
+        this.#reEvaluate = signal(null);
+        this.sortFields = linkedSignal({
+            source: () => ({ sortOptions: this.sortOptions(), orderOptions: this.orderOptions(), evaluate: this.#reEvaluate() }),
+            computation: ({ sortOptions, orderOptions }) => [
+                ...sortOptions.map((f) => ({
+                    label: this.#systemService.getLocalizedLabel(f) || f,
+                    value: f,
+                    type: 'sort',
+                    selected: false
+                })),
+                ...orderOptions
+            ]
+        });
+        this.translate.onLangChange.pipe(takeUntilDestroyed()).subscribe({ next: () => this.#reEvaluate.set(new Date()) });
+    }
+    selectSort(option) {
+        this.sortFields.update((fields) => fields.map((field) => (field.type === option.type ? { ...field, selected: field.value === option.value } : field)));
+        const selectedFields = this.sortFields().filter((field) => field.selected);
+        const fields = selectedFields.reduce((acc, field) => {
+            if (field.type === 'sort')
+                acc.field = field.value;
+            if (field.type === 'order')
+                acc.order = field.value;
+            return acc;
+        }, { field: '', order: 'asc' });
+        const storageKey = this.storageKey();
+        storageKey && localStorage.setItem(storageKey, JSON.stringify(fields));
+        this.sortChanged.emit(fields);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: SortComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: SortComponent, isStandalone: true, selector: "yuv-sort", inputs: { sortOptions: { classPropertyName: "sortOptions", publicName: "sortOptions", isSignal: true, isRequired: false, transformFunction: null }, storageKey: { classPropertyName: "storageKey", publicName: "storageKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortChanged: "sortChanged" }, ngImport: i0, template: `<button mat-icon-button [matMenuTriggerFor]="menu" title="{{ 'yuv.sort.tooltip' | translate }}">
+      <mat-icon>swap_vert</mat-icon>
+    </button>
+
+    <mat-menu #menu="matMenu" class="sort-menu" [ariaLabel]="'yuv.sort.tooltip' | translate">
+      @for (option of sortFields(); track $index) {
+        <button mat-menu-item class="sort-menu-item" [class.selected]="option.selected" (click)="selectSort(option)" [attr.aria-label]="option.label">
+          <mat-icon>{{ option.selected ? 'radio_button_checked' : '' }}</mat-icon>
+
+          <span>{{ option.label }}</span>
+        </button>
+        @if (sortFields().length - 3 === $index) {
+          <mat-divider></mat-divider>
+        }
+      }
+    </mat-menu>`, isInline: true, styles: [":host{display:block}.mat-mdc-menu-item.sort-menu-item.selected .mat-icon{scale:.5}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.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: i3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3.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: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: SortComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'yuv-sort', imports: [TranslateModule, ...MATERIAL_MODULES], template: `<button mat-icon-button [matMenuTriggerFor]="menu" title="{{ 'yuv.sort.tooltip' | translate }}">
+      <mat-icon>swap_vert</mat-icon>
+    </button>
+
+    <mat-menu #menu="matMenu" class="sort-menu" [ariaLabel]="'yuv.sort.tooltip' | translate">
+      @for (option of sortFields(); track $index) {
+        <button mat-menu-item class="sort-menu-item" [class.selected]="option.selected" (click)="selectSort(option)" [attr.aria-label]="option.label">
+          <mat-icon>{{ option.selected ? 'radio_button_checked' : '' }}</mat-icon>
+
+          <span>{{ option.label }}</span>
+        </button>
+        @if (sortFields().length - 3 === $index) {
+          <mat-divider></mat-divider>
+        }
+      }
+    </mat-menu>`, styles: [":host{display:block}.mat-mdc-menu-item.sort-menu-item.selected .mat-icon{scale:.5}\n"] }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SortComponent };
+//# sourceMappingURL=yuuvis-client-framework-sort.mjs.map

package/fesm2022/yuuvis-client-framework-sort.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"yuuvis-client-framework-sort.mjs","sources":["../../../../../libs/yuuvis/client-framework/sort/src/lib/sort/sort.component.ts","../../../../../libs/yuuvis/client-framework/sort/src/yuuvis-client-framework-sort.ts"],"sourcesContent":["import { Component, effect, inject, input, linkedSignal, output, signal } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatDivider } from '@angular/material/divider';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatMenuModule } from '@angular/material/menu';\nimport { SystemService, TranslateModule, TranslateService } from '@yuuvis/client-core';\nimport { SortMenuOption, SortType } from './models';\n\nconst MATERIAL_MODULES = [MatIconModule, MatMenuModule, MatButtonModule, MatDivider];\n\n@Component({\n  selector: 'yuv-sort',\n  imports: [TranslateModule, ...MATERIAL_MODULES],\n  template: `<button mat-icon-button [matMenuTriggerFor]=\"menu\" title=\"{{ 'yuv.sort.tooltip' | translate }}\">\n      <mat-icon>swap_vert</mat-icon>\n    </button>\n\n    <mat-menu #menu=\"matMenu\" class=\"sort-menu\" [ariaLabel]=\"'yuv.sort.tooltip' | translate\">\n      @for (option of sortFields(); track $index) {\n        <button mat-menu-item class=\"sort-menu-item\" [class.selected]=\"option.selected\" (click)=\"selectSort(option)\" [attr.aria-label]=\"option.label\">\n          <mat-icon>{{ option.selected ? 'radio_button_checked' : '' }}</mat-icon>\n\n          <span>{{ option.label }}</span>\n        </button>\n        @if (sortFields().length - 3 === $index) {\n          <mat-divider></mat-divider>\n        }\n      }\n    </mat-menu>`,\n  styleUrl: './sort.component.scss'\n})\nexport class SortComponent {\n  readonly #systemService = inject(SystemService);\n  readonly translate = inject(TranslateService);\n\n  sortOptions = input<string[]>([]);\n  storageKey = input<string>();\n  sortChanged = output<{ field: string; order: SortType }>();\n\n  orderOptions = signal<SortMenuOption[]>([\n    { label: this.translate.instant('yuv.sort.ascending'), value: 'asc', type: 'order', selected: true },\n    { label: this.translate.instant('yuv.sort.descending'), value: 'desc', type: 'order', selected: false }\n  ]);\n\n  #rememberSort = effect(() => {\n    const storageKey = this.storageKey();\n    if (storageKey) {\n      const storage = localStorage.getItem(storageKey);\n      if (storage) {\n        try {\n          const data = JSON.parse(storage);\n          this.sortFields.update((fields) =>\n            fields.map((field) =>\n              field.type === 'sort' && field.value === data.field\n                ? { ...field, selected: true }\n                : field.type === 'order' && field.value === data.order\n                  ? { ...field, selected: true }\n                  : { ...field, selected: false }\n            )\n          );\n        } catch (error) {\n          console.error('Error parsing sort data from localStorage:', error);\n        }\n      }\n    }\n  });\n\n  #reEvaluate = signal<Date | null>(null);\n  sortFields = linkedSignal({\n    source: () => ({ sortOptions: this.sortOptions(), orderOptions: this.orderOptions(), evaluate: this.#reEvaluate() }),\n    computation: ({ sortOptions, orderOptions }) => [\n      ...sortOptions.map((f) => ({\n        label: this.#systemService.getLocalizedLabel(f) || f,\n        value: f,\n        type: 'sort' as const,\n        selected: false\n      })),\n      ...orderOptions\n    ]\n  });\n\n  constructor() {\n    this.translate.onLangChange.pipe(takeUntilDestroyed()).subscribe({ next: () => this.#reEvaluate.set(new Date()) });\n  }\n\n  selectSort(option: SortMenuOption) {\n    this.sortFields.update((fields) => fields.map((field) => (field.type === option.type ? { ...field, selected: field.value === option.value } : field)));\n    const selectedFields = this.sortFields().filter((field) => field.selected);\n    const fields = selectedFields.reduce(\n      (acc, field) => {\n        if (field.type === 'sort') acc.field = field.value;\n        if (field.type === 'order') acc.order = field.value as SortType;\n        return acc;\n      },\n      { field: '', order: 'asc' as SortType }\n    );\n\n    const storageKey = this.storageKey();\n    storageKey && localStorage.setItem(storageKey, JSON.stringify(fields));\n    this.sortChanged.emit(fields);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/forms/lib/elements/datetime/datetime.component.d.ts

@@ -28,7 +28,7 @@ export declare class DatetimeComponent extends AbstractMatFormField<Date | null>
      */
     withTime: import("@angular/core").InputSignal<boolean>;
     openCalendar(): void;
-    propagateChange: (fn: () => void) => void;
+    propagateChange: (_: any) => void;
     validationChange: () => void;
     writeValue(value: any): void;
     registerOnChange(fn: () => void): void;

package/lib/assets/i18n/de.json

@@ -109,6 +109,9 @@
   "yuv.sequence-list.form.task": "Aufgabe",
   "yuv.simple-search.label": "Suchen",
   "yuv.simple-search.submit": "Suche starten",
+  "yuv.sort.tooltip": "Sortieren",
+  "yuv.sort.ascending": "Aufsteigend",
+  "yuv.sort.descending": "Absteigend",
   "yuv.tile-config.button.close": "Schließen",
   "yuv.tile-config.button.reset": "Zurücksetzen",
   "yuv.tile-config.button.save": "Änderungen speichern",

package/lib/assets/i18n/en.json

@@ -109,6 +109,9 @@
   "yuv.sequence-list.form.task": "Task",
   "yuv.simple-search.label": "Search",
   "yuv.simple-search.submit": "Submit search",
+  "yuv.sort.tooltip": "Sort",
+  "yuv.sort.ascending": "Ascending",
+  "yuv.sort.descending": "Descending",
   "yuv.tile-config.button.close": "Close",
   "yuv.tile-config.button.reset": "Reset",
   "yuv.tile-config.button.save": "Save changes",

package/metadata-form/lib/metadata-form-field/metadata-form-field.component.d.ts

@@ -1,6 +1,7 @@
 import { TemplateRef } from '@angular/core';
 import { ObjectTypeField } from '@yuuvis/client-core';
 import { MetadataFormFieldContext } from './metadata-form-field.interface';
+import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
 import * as i1 from "@yuuvis/client-framework/common";
 /**
@@ -12,6 +13,7 @@ export declare class MetadataFormFieldComponent {
     #private;
     elementTemplate: import("@angular/core").WritableSignal<TemplateRef<any> | undefined>;
     readonly: boolean;
+    formChangedSubject: import("@angular/core").InputSignal<Subject<void> | undefined>;
     formField: import("@angular/core").InputSignal<ObjectTypeField>;
     context: import("@angular/core").Signal<MetadataFormFieldContext>;
     /**
@@ -19,5 +21,5 @@ export declare class MetadataFormFieldComponent {
      */
     situation: import("@angular/core").InputSignal<string | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MetadataFormFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MetadataFormFieldComponent, "yuv-metadata-form-field", never, { "formField": { "alias": "field"; "required": true; "isSignal": true; }; "situation": { "alias": "situation"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NoopValueAccessorDirective; inputs: {}; outputs: {}; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MetadataFormFieldComponent, "yuv-metadata-form-field", never, { "formChangedSubject": { "alias": "formChangedSubject"; "required": false; "isSignal": true; }; "formField": { "alias": "field"; "required": true; "isSignal": true; }; "situation": { "alias": "situation"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NoopValueAccessorDirective; inputs: {}; outputs: {}; }]>;
 }

package/metadata-form/lib/metadata-form-field/metadata-form-field.interface.d.ts

@@ -1,5 +1,6 @@
 import { AbstractControl } from '@angular/forms';
 import { ObjectTypeField } from '@yuuvis/client-core';
+import { Subject } from 'rxjs';
 /**
  * Context provided to each metadata form field.
  */
@@ -8,4 +9,5 @@ export interface MetadataFormFieldContext {
     situation: string;
     field: ObjectTypeField;
     ctrl?: AbstractControl<any, any>;
+    formChangedSubject?: Subject<void>;
 }

package/metadata-form/lib/object-metadata-element-label.directive.d.ts

@@ -1,5 +1,5 @@
 import { OnInit } from '@angular/core';
-import { AbstractControl } from '@angular/forms';
+import { MetadataFormFieldContext } from './metadata-form-field/metadata-form-field.interface';
 import * as i0 from "@angular/core";
 /**
  * Directive to apply styles to an object metadata element label based on its control status.
@@ -11,7 +11,7 @@ import * as i0 from "@angular/core";
  */
 export declare class ObjectMetadataElementLabelDirective implements OnInit {
     #private;
-    yuvObjectMetadataElementLabel: import("@angular/core").InputSignal<AbstractControl<any, any> | undefined>;
+    yuvObjectMetadataElementLabel: import("@angular/core").InputSignal<MetadataFormFieldContext | undefined>;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ObjectMetadataElementLabelDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ObjectMetadataElementLabelDirective, "[yuvObjectMetadataElementLabel]", never, { "yuvObjectMetadataElementLabel": { "alias": "yuvObjectMetadataElementLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;

package/object-form/lib/object-form-element/object-form-element.component.d.ts

@@ -7,6 +7,7 @@ import * as i0 from "@angular/core";
 export declare class ObjectFormElementComponent {
     #private;
     createForm: import("@angular/core").WritableSignal<boolean>;
+    formChangedSubject: import("rxjs").Subject<void>;
     formControlName?: string;
     formElementRef: any;
     errors?: string[];

package/object-form/lib/object-form.service.d.ts

@@ -1,12 +1,14 @@
 import { Type } from '@angular/core';
 import { ObjectFormControlWrapper, ObjectFormGroup } from '@yuuvis/client-core';
 import { IObjectFormElementExtension, ObjectFormElementExtension } from './object-form-extension.interface';
+import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
 /**
  * @ignore
  */
 export declare class ObjectFormService {
     #private;
+    formStatusChanged: Subject<void>;
     setElementExtensions(formExtensions: IObjectFormElementExtension[]): void;
     getElementExtensions(propertyName: string): Type<ObjectFormElementExtension>[];
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuuvis/client-framework",
-  "version": "2.1.12",
+  "version": "2.1.13",
   "author": "OPTIMAL SYSTEMS GmbH <npm@optimal-systems.de>",
   "license": "MIT",
   "peerDependencies": {
@@ -8,15 +8,15 @@
     "@angular/common": "^19.2.1",
     "@angular/core": "^19.2.1",
     "angular-gridster2": "^19.0.0",
-    "@yuuvis/client-core": "^2.1.12",
-    "@yuuvis/client-shell-core": "^2.1.12",
+    "@yuuvis/client-core": "^2.1.13",
+    "@yuuvis/client-shell-core": "^2.1.13",
     "ng-dynamic-component": "^10.8.2",
     "modern-normalize": "^3.0.1"
   },
   "dependencies": {
     "@angular/material": "^19.2.15",
     "@ngrx/signals": "^19.2.0",
-    "@yuuvis/material": "2.1.12",
+    "@yuuvis/material": "2.1.13",
     "@yuuvis/media-viewer": "^2.0.4",
     "angular-split": "^19.0.0",
     "tslib": "^2.3.0"
@@ -135,6 +135,10 @@
       "types": "./simple-search/index.d.ts",
       "default": "./fesm2022/yuuvis-client-framework-simple-search.mjs"
     },
+    "./sort": {
+      "types": "./sort/index.d.ts",
+      "default": "./fesm2022/yuuvis-client-framework-sort.mjs"
+    },
     "./split-view": {
       "types": "./split-view/index.d.ts",
       "default": "./fesm2022/yuuvis-client-framework-split-view.mjs"

package/sort/README.md

@@ -0,0 +1,3 @@
+# @yuuvis/client-framework/sort
+
+Secondary entry point of `@yuuvis/client-framework`. It can be used by importing from `@yuuvis/client-framework/sort`.

package/sort/index.d.ts

@@ -0,0 +1,2 @@
+export * from './lib/sort/models';
+export * from './lib/sort/sort.component';

package/sort/lib/sort/models/index.d.ts

@@ -0,0 +1 @@
+export * from './sort.interface';

package/sort/lib/sort/models/sort.interface.d.ts

@@ -0,0 +1,7 @@
+export interface SortMenuOption {
+    label: string;
+    value: string;
+    type: 'sort' | 'order';
+    selected: boolean;
+}
+export type SortType = 'asc' | 'desc';

package/sort/lib/sort/sort.component.d.ts

@@ -0,0 +1,19 @@
+import { TranslateService } from '@yuuvis/client-core';
+import { SortMenuOption, SortType } from './models';
+import * as i0 from "@angular/core";
+export declare class SortComponent {
+    #private;
+    readonly translate: TranslateService;
+    sortOptions: import("@angular/core").InputSignal<string[]>;
+    storageKey: import("@angular/core").InputSignal<string | undefined>;
+    sortChanged: import("@angular/core").OutputEmitterRef<{
+        field: string;
+        order: SortType;
+    }>;
+    orderOptions: import("@angular/core").WritableSignal<SortMenuOption[]>;
+    sortFields: import("@angular/core").WritableSignal<SortMenuOption[]>;
+    constructor();
+    selectSort(option: SortMenuOption): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SortComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SortComponent, "yuv-sort", never, { "sortOptions": { "alias": "sortOptions"; "required": false; "isSignal": true; }; "storageKey": { "alias": "storageKey"; "required": false; "isSignal": true; }; }, { "sortChanged": "sortChanged"; }, never, never, true, never>;
+}