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

package/datepicker/index.d.ts

@@ -1,6 +1,380 @@
-export * from './lib/datepicker.module';
-export * from './lib/datepicker.component';
-export * from './lib/datepicker.interface';
-export * from './lib/calendar/calendar.component';
-export * from './lib/datepicker-calendar/datepicker-calendar-trigger.component';
-export * from './lib/time-input/time-input.component';
+import * as _angular_core from '@angular/core';
+import { OnInit, ElementRef, OnDestroy } from '@angular/core';
+import { ValidationErrors, AbstractControl, FormGroup, FormBuilder, ControlValueAccessor, Validator, FormControl, UntypedFormControl } from '@angular/forms';
+import { Observable } from 'rxjs';
+import * as i1 from '@yuuvis/client-framework/common';
+
+interface DatepickerLabels {
+    calendarApply: string;
+    calendarCancel: string;
+    shortcut: {
+        today: string;
+    };
+}
+interface DatepickerCalendarTriggerTarget {
+    openCalendar: () => void;
+}
+interface DatepickerValueChange {
+    value: Date | null;
+    propagateChange: boolean;
+}
+interface DatepickerValidationOptions {
+    withTime?: boolean;
+    onlyFutureDates?: boolean;
+    minDate?: Date;
+    maxDate?: Date;
+}
+interface DatepickerCalendarOptions extends DatepickerValidationOptions {
+    hour12?: boolean;
+    locale?: string;
+    labels?: DatepickerLabels;
+}
+type DayPeriod = 'am' | 'pm';
+interface DayPeriodLabels {
+    am: string;
+    pm: string;
+}
+declare const DEFAULT_DAY_PERIOD_LABELS: {
+    am: string;
+    pm: string;
+};
+
+interface TimeValue {
+    hour: number;
+    minute: number;
+    dayPeriod?: DayPeriod;
+}
+
+interface CalendarItem {
+    id: string;
+    day: number;
+    inactive?: boolean;
+    disabled?: boolean;
+}
+declare class CalendarComponent implements OnInit {
+    #private;
+    private datepickerService;
+    calEl: _angular_core.Signal<ElementRef<any>>;
+    private _initialized;
+    maxYear: number;
+    minYear: number;
+    year?: number;
+    _offsetYear?: number;
+    month?: number;
+    time?: TimeValue;
+    /**
+     * Allow only date inputs after this date
+     */
+    minDate: _angular_core.InputSignal<Date | undefined>;
+    /**
+     * Allow only date inputs before this date
+     */
+    maxDate: _angular_core.InputSignal<Date | undefined>;
+    /**
+     * Allow only date inputs that are after today
+     */
+    onlyFutureDates: _angular_core.InputSignal<boolean>;
+    date: _angular_core.ModelSignal<Date | undefined>;
+    months: {
+        label: string;
+        value: number;
+    }[];
+    private DEFAULT_FIRST_DAY_OF_WEEK;
+    private _firstDayOfWeek;
+    daysOfWeek: string[];
+    dayPeriodLabels: DayPeriodLabels;
+    locale: _angular_core.InputSignal<string | undefined>;
+    withTime: _angular_core.InputSignal<boolean>;
+    hour12: _angular_core.InputSignal<boolean>;
+    selectedIndex: number;
+    focusedIndex: number;
+    private _focusPos;
+    calendarDays: CalendarItem[];
+    private _numberOfWeeks;
+    ngOnInit(): void;
+    private _dateToTime;
+    selectByIndex(i: number, setFocusPosition?: boolean): void;
+    select(d: Date | string | number, setFocusPosition?: boolean, silent?: boolean): void;
+    selectMonthOfYear(month: number, year?: number, skipImmediateSelect?: boolean): void;
+    selectYear(year: number, skipImmediateSelect?: boolean): void;
+    onYearInputKeydown(e: KeyboardEvent): void;
+    onTimeChange(e: TimeValue): void;
+    private _setLocale;
+    private _reset;
+    private _buildMonth;
+    private _getDayId;
+    protected handleKeyboardEvent(event: KeyboardEvent): void;
+    private _getCalendarIndex;
+    private _stopEvent;
+    private _setFocusPos;
+    private _setFocusPosByCalendarIndex;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CalendarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CalendarComponent, "yuv-calendar", never, { "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "onlyFutureDates": { "alias": "onlyFutureDates"; "required": false; "isSignal": true; }; "date": { "alias": "date"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "withTime": { "alias": "withTime"; "required": false; "isSignal": true; }; "hour12": { "alias": "hour12"; "required": false; "isSignal": true; }; }, { "date": "dateChange"; }, never, never, true, never>;
+}
+
+declare class DatepickerService {
+    private _value;
+    private _valueChangeSource;
+    valueChange$: Observable<DatepickerValueChange>;
+    private _validationChangeSource;
+    validationChange$: Observable<boolean>;
+    DEFAULT_LANGUAGE: string;
+    yearOffset: number;
+    datePattern?: string;
+    private _language;
+    private _languageSource;
+    language$: Observable<string>;
+    private _validationErrors;
+    private _options;
+    /**
+     * Handler for paste events from the components inputs. If the clipboard
+     * contains a whole date it will be covered by the service.
+     * @param event the ClipboardEvent
+     * @returns true if the paste event has been processed by the service, false otherwise
+     */
+    onPaste(e: string | ClipboardEvent): boolean;
+    setLanguage(isoCode: string): void;
+    getDatePattern(locale: string, withTime: boolean, hour12: boolean): string;
+    isDifferent(d1: Date | null, d2: Date | null): boolean;
+    setValue(date: Date | null, silent?: boolean): void;
+    setOption(options: DatepickerValidationOptions): void;
+    hasErrors(): boolean;
+    getErrors(): ValidationErrors | null;
+    setErrors(err: ValidationErrors): void;
+    removeErrors(err: string[]): void;
+    private _emitValidationChange;
+    getIntlOptions(withTime?: boolean, hour12?: boolean): Intl.DateTimeFormatOptions;
+    /**
+     * Returns locale specific values for AM/PM
+     * @param locale locale string
+     * @returns
+     */
+    getDayPeriodLabels(locale: string): DayPeriodLabels;
+    private _validateValue;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatepickerService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<DatepickerService>;
+}
+
+/**
+ *
+ */
+declare class DateInputComponent implements OnInit, OnDestroy {
+    private datepickerService;
+    private fb;
+    private elRef;
+    readonly dateInputEls: _angular_core.Signal<readonly ElementRef<any>[]>;
+    private _subs;
+    private _formValueSub?;
+    private _formStateSub?;
+    protected date: Date | null;
+    private _intlOptions?;
+    dateAttribute?: string;
+    set disabled(d: boolean);
+    private _disabled;
+    invalid: _angular_core.WritableSignal<boolean>;
+    private _refreshPlaceholder;
+    _placeholder?: string;
+    set placeholder(p: string);
+    private _locale;
+    private _withTime;
+    set withTime(b: boolean);
+    get withTime(): boolean;
+    private _hour12;
+    set hour12(b: boolean);
+    get hour12(): boolean;
+    get hoursControl(): AbstractControl;
+    dateTokens: Intl.DateTimeFormatPart[];
+    dateInputForm?: FormGroup;
+    currentDayPeriod?: DayPeriod;
+    dayPeriodLabels: DayPeriodLabels;
+    constructor(datepickerService: DatepickerService, fb: FormBuilder, elRef: ElementRef);
+    private _setupForm;
+    private _setInvalidInputError;
+    private _checkAndPropagateForm;
+    private _formToDate;
+    private _focusInput;
+    onFormClick(event: MouseEvent): void;
+    onDateInputBlur(): void;
+    focusFirstInput(): void;
+    private _getFocusableElements;
+    private _getPatch;
+    reset(): void;
+    getFormattedValue(): string | null;
+    onInputNext(): void;
+    onInputPrev(): void;
+    toggleDayPeriod(): void;
+    private _init;
+    private _setPlaceholder;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DateInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DateInputComponent, "yuv-date-input", never, { "disabled": { "alias": "disabled"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "withTime": { "alias": "withTime"; "required": false; }; "hour12": { "alias": "hour12"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class DatepickerComponent implements ControlValueAccessor, Validator, OnInit, OnDestroy {
+    #private;
+    private _subs;
+    readonly dateInputCmp: _angular_core.Signal<DateInputComponent>;
+    allSelected: _angular_core.WritableSignal<boolean>;
+    keydownHandler(e: KeyboardEvent): void;
+    clickHandler(): void;
+    focusOutHandler(): void;
+    /**
+     * Whether or not to show a calendar picker
+     */
+    readonly calendar: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether or not the component is readonly
+     */
+    readonly readonly: _angular_core.InputSignal<boolean>;
+    _hour12: boolean;
+    /**
+     * Whether or not to 12-hour format vs. default 24h format.
+     * By default the component will try to figure out which hour cycle to
+     * use based on the locale. Setting hour12 property to either `
+     * `true`or `false will overwrite that.
+     */
+    set hour12(b: boolean);
+    private _detectHourCycle;
+    private _locale;
+    set locale(iso: string);
+    get locale(): string;
+    private _defaultLabelslabels;
+    private _labels;
+    set labels(l: DatepickerLabels | undefined);
+    get labels(): DatepickerLabels | undefined;
+    private _withTime;
+    /**
+     * Whether or not to also include time
+     */
+    set withTime(b: boolean);
+    get withTime(): boolean;
+    /**
+     * Allow only date inputs that are after today
+     */
+    set onlyFutureDates(b: boolean);
+    /**
+     * Allow only date inputs after this date
+     */
+    set minDate(d: Date);
+    /**
+     * Allow only date inputs before this date
+     */
+    set maxDate(d: Date);
+    disabled: boolean;
+    calendarValue: Date | null;
+    copyToClipboard(): void;
+    clear(): void;
+    openCalendar(): void;
+    onCalendarDateApply(date: Date): void;
+    onTextInputStatusChange(e: {
+        valid: boolean;
+    }): void;
+    closeCalendar(): void;
+    onDateInputBlur(): void;
+    validate(ac: AbstractControl): ValidationErrors | null;
+    propagateChange: (_: any) => void;
+    validationChange: () => void;
+    writeValue(value: any): void;
+    registerOnChange(fn: () => void): void;
+    registerOnValidatorChange?(fn: () => void): void;
+    registerOnTouched(fn: () => void): void;
+    private _getHourCycle;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatepickerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatepickerComponent, "yuv-datepicker", never, { "calendar": { "alias": "calendar"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "hour12": { "alias": "hour12"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "withTime": { "alias": "withTime"; "required": false; }; "onlyFutureDates": { "alias": "onlyFutureDates"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.FocusWithinDirective; inputs: {}; outputs: {}; }]>;
+}
+
+declare class DatepickerCalendarTriggerComponent {
+    for: _angular_core.InputSignal<DatepickerCalendarTriggerTarget>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatepickerCalendarTriggerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatepickerCalendarTriggerComponent, "yuv-datepicker-calendar-trigger", never, { "for": { "alias": "for"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class YuvDatepickerModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<YuvDatepickerModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<YuvDatepickerModule, never, [typeof CalendarComponent, typeof DatepickerComponent, typeof DatepickerCalendarTriggerComponent], [typeof CalendarComponent, typeof DatepickerComponent, typeof DatepickerCalendarTriggerComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<YuvDatepickerModule>;
+}
+
+declare class DateInputElementComponent implements ControlValueAccessor, Validator {
+    private datepickerService;
+    _value?: string;
+    pasteHandler(event: ClipboardEvent): void;
+    keyDownHandler(event: KeyboardEvent): void;
+    readonly maxLength: _angular_core.InputSignal<number>;
+    maxValue: number | undefined;
+    minValue: number;
+    disabled: boolean;
+    placeholder: _angular_core.InputSignal<string>;
+    readonly next: _angular_core.OutputEmitterRef<void>;
+    readonly prev: _angular_core.OutputEmitterRef<void>;
+    fc: FormControl<any>;
+    protected _isNumber(v: any): boolean;
+    private _stopEvent;
+    onInputChange(iv: string): void;
+    onBlur(): void;
+    wheelHandler(event: WheelEvent): void;
+    keydownHandler(event: KeyboardEvent): void;
+    focusHandler(event: FocusEvent): void;
+    protected _setValue(n: any, silent?: boolean): void;
+    increaseValue(step?: number): void;
+    decreaseValue(step?: number): void;
+    private _applyOffset;
+    private _propagate;
+    propagateChange: (_: any) => void;
+    validationChange: () => void;
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnValidatorChange?(fn: () => void): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState?(isDisabled: boolean): void;
+    private _isValidInput;
+    validate(c: UntypedFormControl): {
+        dateInputElement: {
+            valid: boolean;
+        };
+    } | null;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DateInputElementComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DateInputElementComponent, "yuv-date-input-element", never, { "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; }; "minValue": { "alias": "minValue"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; }, { "next": "next"; "prev": "prev"; }, never, never, true, never>;
+}
+
+declare class DateInputHourElementComponent extends DateInputElementComponent {
+    set dayPeriod(p: 'am' | 'pm' | undefined);
+    readonly dayPeriodChange: _angular_core.OutputEmitterRef<"am" | "pm">;
+    constructor();
+    writeValue(value: any): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DateInputHourElementComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DateInputHourElementComponent, "yuv-date-input-hour-element", never, { "dayPeriod": { "alias": "dayPeriod"; "required": false; }; }, { "dayPeriodChange": "dayPeriodChange"; }, never, never, true, never>;
+}
+
+declare class TimeInputComponent implements ControlValueAccessor, Validator {
+    private fb;
+    readonly hourInput: _angular_core.Signal<DateInputHourElementComponent>;
+    readonly minuteInput: _angular_core.Signal<DateInputElementComponent>;
+    private _time?;
+    protected _hour12: boolean;
+    get hour12(): boolean;
+    set hour12(b: boolean);
+    readonly dayPeriodLabels: _angular_core.InputSignal<DayPeriodLabels>;
+    private _currentDayPeriod?;
+    set currentDayPeriod(p: DayPeriod | undefined);
+    get currentDayPeriod(): DayPeriod | undefined;
+    form: FormGroup;
+    constructor(fb: FormBuilder);
+    private _propagate;
+    private _patch;
+    propagateChange: (_: any) => void;
+    validationChange: () => void;
+    writeValue(value: TimeValue): void;
+    registerOnChange(fn: any): void;
+    registerOnValidatorChange?(fn: () => void): void;
+    registerOnTouched(fn: any): void;
+    validate(ac: AbstractControl): ValidationErrors | null;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TimeInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TimeInputComponent, "yuv-time-input", never, { "hour12": { "alias": "hour12"; "required": false; }; "dayPeriodLabels": { "alias": "dayPeriodLabels"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { CalendarComponent, DEFAULT_DAY_PERIOD_LABELS, DatepickerCalendarTriggerComponent, DatepickerComponent, TimeInputComponent, YuvDatepickerModule };
+export type { CalendarItem, DatepickerCalendarOptions, DatepickerCalendarTriggerTarget, DatepickerLabels, DatepickerValidationOptions, DatepickerValueChange, DayPeriod, DayPeriodLabels };

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

@@ -2,16 +2,15 @@ import * as i0 from '@angular/core';
 import { NgModule, inject, signal, Component, input, output, viewChild, viewChildren, computed, afterRenderEffect, untracked, Injector, runInInjectionContext, Injectable, effect, Input, Directive } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i2 from '@ngx-translate/core';
 import { TranslateModule, TranslateService as TranslateService$1 } from '@ngx-translate/core';
 import { MAT_DIALOG_DATA, MatDialogRef, MatDialog } from '@angular/material/dialog';
-import * as i2$1 from '@angular/material/icon';
+import * as i2 from '@angular/material/icon';
 import { MatIconModule, MatIconRegistry } from '@angular/material/icon';
-import { ClipboardService, TranslateService, DmsService, TranslateModule as TranslateModule$1, RetentionService, SystemType, Utils } from '@yuuvis/client-core';
+import { ClipboardService, TranslateService, DmsService, TranslatePipe, RetentionService, SystemType, Utils } from '@yuuvis/client-core';
 import { of, map, forkJoin } from 'rxjs';
-import { DialogComponent } from '@yuuvis/client-framework/common';
 import { MatButtonModule } from '@angular/material/button';
 import { MatProgressBar } from '@angular/material/progress-bar';
+import { DialogComponent } from '@yuuvis/client-framework/common';
 import { YmtButtonDirective } from '@yuuvis/material';
 import { A11yModule } from '@angular/cdk/a11y';
 import { YuvListModule } from '@yuuvis/client-framework/list';
@@ -22,11 +21,11 @@ import { MatTooltip } from '@angular/material/tooltip';
  * Module for the actions library.
  */
 class ActionsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ActionsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.20", ngImport: i0, type: ActionsModule, imports: [CommonModule, TranslateModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ActionsModule, imports: [CommonModule, TranslateModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ActionsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: ActionsModule, imports: [CommonModule, TranslateModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ActionsModule, imports: [CommonModule, TranslateModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ActionsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ActionsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, TranslateModule]
@@ -120,8 +119,8 @@ class DeleteComponent {
         this.translate = inject(TranslateService);
         this.#dialogData = inject(MAT_DIALOG_DATA);
         this.#dialogRef = inject((MatDialogRef));
-        this.errors = signal([]);
-        this.deleting = signal(false);
+        this.errors = signal([], ...(ngDevMode ? [{ debugName: "errors" }] : []));
+        this.deleting = signal(false, ...(ngDevMode ? [{ debugName: "deleting" }] : []));
         this.deleteItems = this.#dialogData.items;
         this.context = this.#dialogData.context;
     }
@@ -168,12 +167,12 @@ class DeleteComponent {
     cancel() {
         this.#dialogRef.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DeleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: DeleteComponent, isStandalone: true, selector: "yuv-delete", ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.action-menu.action.delete.dms.object.label' | translate\">\n  <main class=\"yuv-delete\" [ngClass]=\"{ deleting: deleting() }\">\n    <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n\n    @if (errors().length) {\n      <ul class=\"errors\">\n        @for (e of errors(); track $index) {\n          <li class=\"error\">\n            <span class=\"subject\">{{ e.subject }}</span>\n            <span class=\"message\">{{ e.message }}</span>\n          </li>\n        }\n      </ul>\n    } @else {\n      <p>{{ 'yuv.action-menu.action.delete.dms.object.confirm.message' | translate }}</p>\n    }\n  </main>\n  <footer class=\"form-buttons\">\n    <button ymtButton=\"secondary\" [disabled]=\"deleting()\" (click)=\"cancel()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.cancel' | translate }}\n    </button>\n\n    <button ymtButton=\"primary\" [disabled]=\"deleting() || !!errors().length\" (click)=\"run()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.ok' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [".yuv-delete{display:flex;flex-flow:column;justify-content:center;padding:var(--ymt-spacing-m);position:relative}.yuv-delete .progress-bar{position:absolute;inset-block-start:0;inset-inline-start:0;inset-inline-end:0}.yuv-delete:not(.deleting) .progress-bar{opacity:0}.yuv-delete p{margin:0}.yuv-delete ul.errors{list-style:none;margin:0;background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);padding:var(--ymt-spacing-xs);border-radius:.5rem;display:flex;flex-flow:column;gap:.5rem}.yuv-delete ul.errors .error{display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon subject\" \"icon message\";row-gap:.2em;column-gap:1em;align-items:center}.yuv-delete ul.errors .error .subject{grid-area:subject;font-weight:700}.yuv-delete ul.errors .error .message{grid-area:message;font-weight:400;font-style:italic;display:block}.yuv-delete ul.errors .error:before{align-self:start;font-weight:700;grid-area:icon;content:\"!\";outline:2px solid currentColor;border-radius:2px;width:1em;display:grid;place-items:center}.yuv-delete .form-buttons{display:flex;flex-flow:row-reverse;justify-content:flex-end;justify-content:end;gap:var(--ymt-spacing-2xs);align-items:center;margin-block-start:var(--ymt-spacing-xl)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule$1 }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DeleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: DeleteComponent, isStandalone: true, selector: "yuv-delete", ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.action-menu.action.delete.dms.object.label' | translate\">\n  <main class=\"yuv-delete\" [ngClass]=\"{ deleting: deleting() }\">\n    <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n\n    @if (errors().length) {\n      <ul class=\"errors\">\n        @for (e of errors(); track $index) {\n          <li class=\"error\">\n            <span class=\"subject\">{{ e.subject }}</span>\n            <span class=\"message\">{{ e.message }}</span>\n          </li>\n        }\n      </ul>\n    } @else {\n      <p>{{ 'yuv.action-menu.action.delete.dms.object.confirm.message' | translate }}</p>\n    }\n  </main>\n  <footer class=\"form-buttons\">\n    <button ymtButton=\"secondary\" [disabled]=\"deleting()\" (click)=\"cancel()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.cancel' | translate }}\n    </button>\n\n    <button ymtButton=\"primary\" [disabled]=\"deleting() || !!errors().length\" (click)=\"run()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.ok' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [".yuv-delete{display:flex;flex-flow:column;justify-content:center;padding:var(--ymt-spacing-m);position:relative}.yuv-delete .progress-bar{position:absolute;inset-block-start:0;inset-inline-start:0;inset-inline-end:0}.yuv-delete:not(.deleting) .progress-bar{opacity:0}.yuv-delete p{margin:0}.yuv-delete ul.errors{list-style:none;margin:0;background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);padding:var(--ymt-spacing-xs);border-radius:.5rem;display:flex;flex-flow:column;gap:.5rem}.yuv-delete ul.errors .error{display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon subject\" \"icon message\";row-gap:.2em;column-gap:1em;align-items:center}.yuv-delete ul.errors .error .subject{grid-area:subject;font-weight:700}.yuv-delete ul.errors .error .message{grid-area:message;font-weight:400;font-style:italic;display:block}.yuv-delete ul.errors .error:before{align-self:start;font-weight:700;grid-area:icon;content:\"!\";outline:2px solid currentColor;border-radius:2px;width:1em;display:grid;place-items:center}.yuv-delete .form-buttons{display:flex;flex-flow:row-reverse;justify-content:flex-end;justify-content:end;gap:var(--ymt-spacing-2xs);align-items:center;margin-block-start:var(--ymt-spacing-xl)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DeleteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: DeleteComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'yuv-delete', standalone: true, imports: [CommonModule, TranslateModule$1, MatButtonModule, DialogComponent, MatProgressBar, YmtButtonDirective], template: "<yuv-dialog [headertitle]=\"'yuv.action-menu.action.delete.dms.object.label' | translate\">\n  <main class=\"yuv-delete\" [ngClass]=\"{ deleting: deleting() }\">\n    <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n\n    @if (errors().length) {\n      <ul class=\"errors\">\n        @for (e of errors(); track $index) {\n          <li class=\"error\">\n            <span class=\"subject\">{{ e.subject }}</span>\n            <span class=\"message\">{{ e.message }}</span>\n          </li>\n        }\n      </ul>\n    } @else {\n      <p>{{ 'yuv.action-menu.action.delete.dms.object.confirm.message' | translate }}</p>\n    }\n  </main>\n  <footer class=\"form-buttons\">\n    <button ymtButton=\"secondary\" [disabled]=\"deleting()\" (click)=\"cancel()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.cancel' | translate }}\n    </button>\n\n    <button ymtButton=\"primary\" [disabled]=\"deleting() || !!errors().length\" (click)=\"run()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.ok' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [".yuv-delete{display:flex;flex-flow:column;justify-content:center;padding:var(--ymt-spacing-m);position:relative}.yuv-delete .progress-bar{position:absolute;inset-block-start:0;inset-inline-start:0;inset-inline-end:0}.yuv-delete:not(.deleting) .progress-bar{opacity:0}.yuv-delete p{margin:0}.yuv-delete ul.errors{list-style:none;margin:0;background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);padding:var(--ymt-spacing-xs);border-radius:.5rem;display:flex;flex-flow:column;gap:.5rem}.yuv-delete ul.errors .error{display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon subject\" \"icon message\";row-gap:.2em;column-gap:1em;align-items:center}.yuv-delete ul.errors .error .subject{grid-area:subject;font-weight:700}.yuv-delete ul.errors .error .message{grid-area:message;font-weight:400;font-style:italic;display:block}.yuv-delete ul.errors .error:before{align-self:start;font-weight:700;grid-area:icon;content:\"!\";outline:2px solid currentColor;border-radius:2px;width:1em;display:grid;place-items:center}.yuv-delete .form-buttons{display:flex;flex-flow:row-reverse;justify-content:flex-end;justify-content:end;gap:var(--ymt-spacing-2xs);align-items:center;margin-block-start:var(--ymt-spacing-xl)}\n"] }]
+            args: [{ selector: 'yuv-delete', standalone: true, imports: [CommonModule, TranslatePipe, MatButtonModule, DialogComponent, MatProgressBar, YmtButtonDirective], template: "<yuv-dialog [headertitle]=\"'yuv.action-menu.action.delete.dms.object.label' | translate\">\n  <main class=\"yuv-delete\" [ngClass]=\"{ deleting: deleting() }\">\n    <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n\n    @if (errors().length) {\n      <ul class=\"errors\">\n        @for (e of errors(); track $index) {\n          <li class=\"error\">\n            <span class=\"subject\">{{ e.subject }}</span>\n            <span class=\"message\">{{ e.message }}</span>\n          </li>\n        }\n      </ul>\n    } @else {\n      <p>{{ 'yuv.action-menu.action.delete.dms.object.confirm.message' | translate }}</p>\n    }\n  </main>\n  <footer class=\"form-buttons\">\n    <button ymtButton=\"secondary\" [disabled]=\"deleting()\" (click)=\"cancel()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.cancel' | translate }}\n    </button>\n\n    <button ymtButton=\"primary\" [disabled]=\"deleting() || !!errors().length\" (click)=\"run()\">\n      {{ 'yuv.action-menu.action.delete.dms.object.confirm.ok' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [".yuv-delete{display:flex;flex-flow:column;justify-content:center;padding:var(--ymt-spacing-m);position:relative}.yuv-delete .progress-bar{position:absolute;inset-block-start:0;inset-inline-start:0;inset-inline-end:0}.yuv-delete:not(.deleting) .progress-bar{opacity:0}.yuv-delete p{margin:0}.yuv-delete ul.errors{list-style:none;margin:0;background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);padding:var(--ymt-spacing-xs);border-radius:.5rem;display:flex;flex-flow:column;gap:.5rem}.yuv-delete ul.errors .error{display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon subject\" \"icon message\";row-gap:.2em;column-gap:1em;align-items:center}.yuv-delete ul.errors .error .subject{grid-area:subject;font-weight:700}.yuv-delete ul.errors .error .message{grid-area:message;font-weight:400;font-style:italic;display:block}.yuv-delete ul.errors .error:before{align-self:start;font-weight:700;grid-area:icon;content:\"!\";outline:2px solid currentColor;border-radius:2px;width:1em;display:grid;place-items:center}.yuv-delete .form-buttons{display:flex;flex-flow:row-reverse;justify-content:flex-end;justify-content:end;gap:var(--ymt-spacing-2xs);align-items:center;margin-block-start:var(--ymt-spacing-xl)}\n"] }]
         }] });
 
 class DeleteAction extends AbstractContextAction {
@@ -239,13 +238,13 @@ class DownloadAction extends AbstractContextAction {
 
 class ContextmenuComponent {
     constructor() {
-        this.actions = input([]);
-        this.selection = input([]);
+        this.actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : []));
+        this.selection = input([], ...(ngDevMode ? [{ debugName: "selection" }] : []));
         this.itemSelect = output();
         this.translate = inject(TranslateService$1);
-        this.cdkMenu = viewChild(CdkMenu);
-        this.menuItems = viewChildren(CdkMenuItem);
-        this.sortedActions = computed(() => [...this.actions()].sort((a, b) => a.label.localeCompare(b.label, this.translate.currentLang)));
+        this.cdkMenu = viewChild(CdkMenu, ...(ngDevMode ? [{ debugName: "cdkMenu" }] : []));
+        this.menuItems = viewChildren(CdkMenuItem, ...(ngDevMode ? [{ debugName: "menuItems" }] : []));
+        this.sortedActions = computed(() => [...this.actions()].sort((a, b) => a.label.localeCompare(b.label, this.translate.getCurrentLang())), ...(ngDevMode ? [{ debugName: "sortedActions" }] : []));
         afterRenderEffect(() => {
             //Focus First Item when @for is finished
             const firstElement = this.menuItems()[0];
@@ -258,13 +257,13 @@ class ContextmenuComponent {
     onItemTrigger({ action }) {
         this.itemSelect.emit({ action });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ContextmenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ContextmenuComponent, isStandalone: true, selector: "yuv-contextmenu", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelect: "itemSelect" }, providers: [MatTooltip], viewQueries: [{ propertyName: "cdkMenu", first: true, predicate: CdkMenu, descendants: true, isSignal: true }, { propertyName: "menuItems", predicate: CdkMenuItem, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"context-menu\" cdkMenu>\n  @for (a of sortedActions(); track a.id;) {\n    <div\n      class=\"context-menu__item\"\n      [ngClass]=\"{'context-menu__item--disabled' : a.disabled}\"\n      cdkMenuItem\n      [cdkMenuItemDisabled]=\"a.disabled\"\n      [matTooltip]=\"a.description\"\n      [attr.aria-label]=\"'Execute Action: ' + a.label\"\n      (cdkMenuItemTriggered)=\"onItemTrigger({action: a})\"\n    >\n      <mat-icon class=\"context-menu__item-icon ymt-icon--size-s\">{{ a.icon }}</mat-icon>\n      {{ a.label }}\n    </div>\n  }\n</div>\n", styles: [".context-menu{display:flex;flex-direction:column;background-color:var(--mat-sys-surface-container-low);border:var(--ymt-outline-width) solid var(--ymt-outline-variant);color:var(--ymt-on-surface);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs) 0;letter-spacing:var(--ymt-font-body-tracking);max-height:300px;max-width:300px;overflow-y:auto;overflow-x:hidden}.context-menu__item{all:unset;display:flex;align-items:center;gap:var(--ymt-spacing-s);cursor:pointer;font:var(--ymt-font-body);padding:var(--ymt-spacing-s) var(--ymt-spacing-m)}.context-menu__item:hover,.context-menu__item:focus{background-color:var(--mat-sys-surface-container-highest)}.context-menu__item.cdk-keyboard-focused:focus-visible{outline-offset:calc(var(--ymt-focus-indicator-size) * -2);outline:var(--ymt-focus-indicator-inner) solid var(--ymt-focus-indicator-size);box-shadow:inset 0 0 0 var(--ymt-focus-indicator-size) var(--ymt-focus-indicator-outer)}.context-menu__item--disabled{opacity:var(--ymt-disabled-opacity)}.context-menu__item-icon{align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: CdkMenuItem, selector: "[cdkMenuItem]", inputs: ["cdkMenuItemDisabled", "cdkMenuitemTypeaheadLabel"], outputs: ["cdkMenuItemTriggered"], exportAs: ["cdkMenuItem"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContextmenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: ContextmenuComponent, isStandalone: true, selector: "yuv-contextmenu", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelect: "itemSelect" }, providers: [MatTooltip], viewQueries: [{ propertyName: "cdkMenu", first: true, predicate: CdkMenu, descendants: true, isSignal: true }, { propertyName: "menuItems", predicate: CdkMenuItem, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"context-menu\" cdkMenu>\n  @for (a of sortedActions(); track a.id;) {\n    <div\n      class=\"context-menu__item\"\n      [ngClass]=\"{'context-menu__item--disabled' : a.disabled}\"\n      cdkMenuItem\n      [cdkMenuItemDisabled]=\"a.disabled\"\n      [matTooltip]=\"a.description\"\n      [attr.aria-label]=\"'Execute Action: ' + a.label\"\n      (cdkMenuItemTriggered)=\"onItemTrigger({action: a})\"\n    >\n      <mat-icon class=\"context-menu__item-icon ymt-icon--size-s\">{{ a.icon }}</mat-icon>\n      {{ a.label }}\n    </div>\n  }\n</div>\n", styles: [".context-menu{display:flex;flex-direction:column;background-color:var(--mat-sys-surface-container-low);border:var(--ymt-outline-width) solid var(--ymt-outline-variant);color:var(--ymt-on-surface);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs) 0;letter-spacing:var(--ymt-font-body-tracking);max-height:300px;max-width:300px;overflow-y:auto;overflow-x:hidden}.context-menu__item{all:unset;display:flex;align-items:center;gap:var(--ymt-spacing-s);cursor:pointer;font:var(--ymt-font-body);padding:var(--ymt-spacing-s) var(--ymt-spacing-m)}.context-menu__item:hover,.context-menu__item:focus{background-color:var(--mat-sys-surface-container-highest)}.context-menu__item.cdk-keyboard-focused:focus-visible{outline-offset:calc(var(--ymt-focus-indicator-size) * -2);outline:var(--ymt-focus-indicator-inner) solid var(--ymt-focus-indicator-size);box-shadow:inset 0 0 0 var(--ymt-focus-indicator-size) var(--ymt-focus-indicator-outer)}.context-menu__item--disabled{opacity:var(--ymt-disabled-opacity)}.context-menu__item-icon{align-items:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: CdkMenuItem, selector: "[cdkMenuItem]", inputs: ["cdkMenuItemDisabled", "cdkMenuitemTypeaheadLabel"], outputs: ["cdkMenuItemTriggered"], exportAs: ["cdkMenuItem"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ContextmenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ContextmenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-contextmenu', standalone: true, imports: [CommonModule, MatIconModule, YuvListModule, A11yModule, CdkMenu, CdkMenuItem, MatTooltip], providers: [MatTooltip], template: "<div class=\"context-menu\" cdkMenu>\n  @for (a of sortedActions(); track a.id;) {\n    <div\n      class=\"context-menu__item\"\n      [ngClass]=\"{'context-menu__item--disabled' : a.disabled}\"\n      cdkMenuItem\n      [cdkMenuItemDisabled]=\"a.disabled\"\n      [matTooltip]=\"a.description\"\n      [attr.aria-label]=\"'Execute Action: ' + a.label\"\n      (cdkMenuItemTriggered)=\"onItemTrigger({action: a})\"\n    >\n      <mat-icon class=\"context-menu__item-icon ymt-icon--size-s\">{{ a.icon }}</mat-icon>\n      {{ a.label }}\n    </div>\n  }\n</div>\n", styles: [".context-menu{display:flex;flex-direction:column;background-color:var(--mat-sys-surface-container-low);border:var(--ymt-outline-width) solid var(--ymt-outline-variant);color:var(--ymt-on-surface);border-radius:var(--ymt-corner-s);padding:var(--ymt-spacing-xs) 0;letter-spacing:var(--ymt-font-body-tracking);max-height:300px;max-width:300px;overflow-y:auto;overflow-x:hidden}.context-menu__item{all:unset;display:flex;align-items:center;gap:var(--ymt-spacing-s);cursor:pointer;font:var(--ymt-font-body);padding:var(--ymt-spacing-s) var(--ymt-spacing-m)}.context-menu__item:hover,.context-menu__item:focus{background-color:var(--mat-sys-surface-container-highest)}.context-menu__item.cdk-keyboard-focused:focus-visible{outline-offset:calc(var(--ymt-focus-indicator-size) * -2);outline:var(--ymt-focus-indicator-inner) solid var(--ymt-focus-indicator-size);box-shadow:inset 0 0 0 var(--ymt-focus-indicator-size) var(--ymt-focus-indicator-outer)}.context-menu__item--disabled{opacity:var(--ymt-disabled-opacity)}.context-menu__item-icon{align-items:flex-start}\n"] }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], itemSelect: [{ type: i0.Output, args: ["itemSelect"] }], cdkMenu: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkMenu), { isSignal: true }] }], menuItems: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => CdkMenuItem), { isSignal: true }] }] } });
 
 class ActionsService {
     constructor() {
@@ -385,10 +384,10 @@ class ActionsService {
             { id: BASE_ACTION.cut, action: CutAction }
         ]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ActionsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ActionsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ActionsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ActionsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ActionsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: ActionsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -399,8 +398,8 @@ class YuvContextMenuTriggerDirective extends CdkContextMenuTrigger {
     #contextMenuEvent;
     constructor() {
         super();
-        this.triggerWhen = input(null, { alias: 'yuvContextMenuTriggerWhen' });
-        this.#contextMenuEvent = signal(null);
+        this.triggerWhen = input(null, ...(ngDevMode ? [{ debugName: "triggerWhen", alias: 'yuvContextMenuTriggerWhen' }] : [{ alias: 'yuvContextMenuTriggerWhen' }]));
+        this.#contextMenuEvent = signal(null, ...(ngDevMode ? [{ debugName: "#contextMenuEvent" }] : []));
         effect(() => {
             const event = this.#contextMenuEvent();
             const triggerWhen = this.triggerWhen();
@@ -414,13 +413,13 @@ class YuvContextMenuTriggerDirective extends CdkContextMenuTrigger {
     _openOnContextMenu(event) {
         this.#contextMenuEvent.set(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: YuvContextMenuTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.20", type: YuvContextMenuTriggerDirective, isStandalone: true, selector: "[yuvContextMenuTrigger]", inputs: { menuTemplateRef: { classPropertyName: "menuTemplateRef", publicName: "yuvContextMenuTrigger", isSignal: false, isRequired: false, transformFunction: null }, triggerWhen: { classPropertyName: "triggerWhen", publicName: "yuvContextMenuTriggerWhen", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: YuvContextMenuTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.19", type: YuvContextMenuTriggerDirective, isStandalone: true, selector: "[yuvContextMenuTrigger]", inputs: { menuTemplateRef: { classPropertyName: "menuTemplateRef", publicName: "yuvContextMenuTrigger", isSignal: false, isRequired: false, transformFunction: null }, triggerWhen: { classPropertyName: "triggerWhen", publicName: "yuvContextMenuTriggerWhen", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             { provide: MENU_TRIGGER, useExisting: YuvContextMenuTriggerDirective },
             { provide: MENU_STACK, useClass: MenuStack }
         ], exportAs: ["yuvContextMenuTrigger"], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: YuvContextMenuTriggerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: YuvContextMenuTriggerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[yuvContextMenuTrigger]',
@@ -434,7 +433,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
         }], ctorParameters: () => [], propDecorators: { menuTemplateRef: [{
                 type: Input,
                 args: [{ alias: 'yuvContextMenuTrigger' }]
-            }] } });
+            }], triggerWhen: [{ type: i0.Input, args: [{ isSignal: true, alias: "yuvContextMenuTriggerWhen", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.