@meshmakers/shared-ui 3.4.1480 → 3.5.0

package/fesm2022/meshmakers-shared-ui.mjs

@@ -1,13 +1,13 @@
 import * as i0 from '@angular/core';
-import { inject, signal, ViewChild, Input, ChangeDetectionStrategy, Component, Injectable, NgZone, TemplateRef, Directive, Pipe, EventEmitter, ChangeDetectorRef, ElementRef, Output, HostBinding, ContentChild, InjectionToken, HostListener, forwardRef, computed, effect, makeEnvironmentProviders } from '@angular/core';
-import * as i3$2 from '@progress/kendo-angular-dialog';
+import { inject, signal, ViewChild, Input, ChangeDetectionStrategy, Component, Injectable, ElementRef, InjectionToken, computed, NgZone, TemplateRef, Directive, Pipe, EventEmitter, ChangeDetectorRef, input, booleanAttribute, output, ViewEncapsulation, DestroyRef, effect, PLATFORM_ID, Output, HostBinding, ContentChild, HostListener, forwardRef, numberAttribute, makeEnvironmentProviders } from '@angular/core';
+import * as i3$1 from '@progress/kendo-angular-dialog';
 import { DialogContentBase, DialogRef, DialogActionsComponent, DialogService, WindowRef, WindowService, WindowModule, WindowCloseResult, DialogModule } from '@progress/kendo-angular-dialog';
 import { NotificationService } from '@progress/kendo-angular-notification';
-import * as i4 from '@progress/kendo-angular-buttons';
-import { ButtonComponent, ButtonModule, DropDownButtonComponent, SplitButtonComponent, ButtonsModule, ButtonGroupModule } from '@progress/kendo-angular-buttons';
-import * as i1$2 from '@angular/common';
-import { NgIf, CommonModule, NgComponentOutlet, NgTemplateOutlet, DatePipe, DecimalPipe, AsyncPipe, NgClass } from '@angular/common';
-import * as i3 from '@progress/kendo-angular-icons';
+import * as i1$1 from '@progress/kendo-angular-buttons';
+import { ButtonComponent, ButtonModule, DropDownButtonComponent, SplitButtonComponent, ButtonsModule, ButtonGroupModule, DropDownButtonModule } from '@progress/kendo-angular-buttons';
+import * as i1$3 from '@angular/common';
+import { NgIf, CommonModule, isPlatformBrowser, NgComponentOutlet, NgTemplateOutlet, DatePipe, DecimalPipe, AsyncPipe, NgClass } from '@angular/common';
+import * as i2 from '@progress/kendo-angular-icons';
 import { SVGIconComponent, SVGIconModule, IconsModule } from '@progress/kendo-angular-icons';
 import { firstValueFrom, fromEvent, BehaviorSubject, of, Subject, asyncScheduler, from, Subscription } from 'rxjs';
 import * as i1 from '@angular/forms';
@@ -17,26 +17,26 @@ import { LabelComponent, LabelModule } from '@progress/kendo-angular-label';
 import * as i5 from '@progress/kendo-angular-inputs';
 import { TextBoxComponent, CheckBoxComponent, SeparatorComponent, NumericTextBoxComponent, InputsModule, NumericTextBoxModule } from '@progress/kendo-angular-inputs';
 import { ProgressBarComponent } from '@progress/kendo-angular-progressbar';
-import { copyIcon, xIcon, filterIcon, filePdfIcon, fileExcelIcon, arrowRotateCwIcon, filterClearIcon, moreVerticalIcon, slidersIcon, saveIcon, cancelIcon, searchIcon, clockIcon, checkIcon } from '@progress/kendo-svg-icons';
-import { Router, NavigationEnd } from '@angular/router';
+import { copyIcon, xIcon, calculatorIcon, clockArrowRotateIcon, passwordIcon, cellsMergeIcon, unpinIcon, pinIcon, undoIcon, fileReportIcon, downloadIcon, importIcon, exportIcon, stopIcon, playIcon, xCircleIcon, uploadIcon, arrowRotateCwIcon, fileDataIcon, eraserIcon, trashIcon, hyperlinkOpenIcon, eyeIcon, pencilIcon, plusIcon, checkIcon, filterIcon, filePdfIcon, fileExcelIcon, filterClearIcon, moreVerticalIcon, slidersIcon, saveIcon, cancelIcon, searchIcon, clockIcon } from '@progress/kendo-svg-icons';
+import { Router, NavigationEnd, RouterLink, ActivatedRoute } from '@angular/router';
 import { filter, debounceTime, distinctUntilChanged, takeUntil, observeOn, tap, switchMap, catchError } from 'rxjs/operators';
 import { MessageService, CommandBaseService, CommandSettingsService, provideMmSharedServices } from '@meshmakers/shared-services';
-import * as i1$1 from '@progress/kendo-angular-grid';
-import { DataBindingDirective, GridComponent, ColumnComponent, ToolbarTemplateDirective, GridSpacerComponent, ExcelModule, PDFModule, CommandColumnComponent, CellTemplateDirective, CheckboxColumnComponent, CustomMessagesComponent, FilterCellTemplateDirective, StringFilterCellComponent, NumericFilterCellComponent, BooleanFilterCellComponent, DateFilterCellComponent } from '@progress/kendo-angular-grid';
-import * as i3$1 from '@progress/kendo-angular-dropdowns';
+import * as i1$2 from '@progress/kendo-angular-grid';
+import { DataBindingDirective, GridComponent, ColumnComponent, ToolbarTemplateDirective, GridSpacerComponent, ExcelModule, PDFModule, CommandColumnComponent, CellTemplateDirective, CheckboxColumnComponent, CustomMessagesComponent, FilterCellTemplateDirective, StringFilterCellComponent, NumericFilterCellComponent, BooleanFilterCellComponent, DateFilterCellComponent, NoRecordsTemplateDirective } from '@progress/kendo-angular-grid';
+import * as i3 from '@progress/kendo-angular-dropdowns';
 import { DropDownListComponent, ValueTemplateDirective, ItemTemplateDirective, AutoCompleteModule, DropDownListModule } from '@progress/kendo-angular-dropdowns';
 import { isCompositeFilterDescriptor } from '@progress/kendo-data-query';
 import { ContextMenuComponent, HierarchyBindingDirective } from '@progress/kendo-angular-menu';
 import cronstrue from 'cronstrue';
 import 'cronstrue/locales/de.js';
 import 'cronstrue/locales/en.js';
-import * as i2 from '@progress/kendo-angular-excel-export';
+import * as i2$1 from '@progress/kendo-angular-excel-export';
 import { DropPosition, ExpandDirective, TreeViewComponent, NodeTemplateDirective, DragAndDropDirective } from '@progress/kendo-angular-treeview';
-import * as i1$3 from '@progress/kendo-angular-layout';
+import * as i1$4 from '@progress/kendo-angular-layout';
 import { SplitterComponent, SplitterPaneComponent, TabStripModule } from '@progress/kendo-angular-layout';
 import * as i7 from '@progress/kendo-angular-indicators';
 import { LoaderModule, IndicatorsModule } from '@progress/kendo-angular-indicators';
-import * as i2$1 from '@progress/kendo-angular-dateinputs';
+import * as i2$2 from '@progress/kendo-angular-dateinputs';
 import { DatePickerModule, DateTimePickerModule } from '@progress/kendo-angular-dateinputs';
 import { CronExpressionParser } from 'cron-parser';
 
@@ -280,6 +280,20 @@ class ConfirmationWindowComponent extends DialogContentBase {
             }
         }
     }
+    host = inject((ElementRef));
+    /**
+     * Destructive confirmations start with the focus on the dismissing button (AB#5578): Enter must
+     * never confirm a delete. Backs up the service's `autoFocusedElement`.
+     */
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        if (this.data?.danger) {
+            setTimeout(() => {
+                const root = this.host.nativeElement.closest('.k-dialog') ?? this.host.nativeElement;
+                root.querySelector('[data-action="dismiss"], [data-action="cancel"]')?.focus();
+            });
+        }
+    }
     onButton1() {
         this.dialogRef.close((new ConfirmationWindowResult(this.button1Result)));
     }
@@ -290,7 +304,7 @@ class ConfirmationWindowComponent extends DialogContentBase {
         this.dialogRef.close((new ConfirmationWindowResult(this.button3Result)));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ConfirmationWindowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: ConfirmationWindowComponent, isStandalone: true, selector: "mm-confirmation-window", inputs: { data: "data" }, usesInheritance: true, ngImport: i0, template: "<div>{{data?.message}}</div>\n<kendo-dialog-actions>\n  <button kendoButton (click)=\"onButton1()\" themeColor=\"primary\">{{button1Text}}</button>\n  <button kendoButton (click)=\"onButton2()\" *ngIf=\"button2Text\">{{button2Text}}</button>\n  <button kendoButton (click)=\"onButton3()\" *ngIf=\"button3Text\">{{button3Text}}</button>\n</kendo-dialog-actions>\n\n", styles: [""], dependencies: [{ kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: ConfirmationWindowComponent, isStandalone: true, selector: "mm-confirmation-window", inputs: { data: "data" }, usesInheritance: true, ngImport: i0, template: "<div>{{data?.message}}</div>\n<!-- Button order (Studio action guideline \u00A72.2, app convention): dismissing buttons first (left),\n     the confirming / primary button last (right) - also for destructive confirmations. -->\n<kendo-dialog-actions>\n  <button kendoButton (click)=\"onButton3()\" *ngIf=\"button3Text\" data-action=\"cancel\">{{button3Text}}</button>\n  <button kendoButton (click)=\"onButton2()\" *ngIf=\"button2Text\" data-action=\"dismiss\">{{button2Text}}</button>\n  <button kendoButton (click)=\"onButton1()\" [themeColor]=\"data?.danger ? 'error' : 'primary'\" [attr.data-danger]=\"data?.danger ? 'true' : null\" data-action=\"confirm\">{{button1Text}}</button>\n</kendo-dialog-actions>\n", styles: [""], dependencies: [{ kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ConfirmationWindowComponent, decorators: [{
             type: Component,
@@ -298,14 +312,232 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                         DialogActionsComponent,
                         NgIf,
                         ButtonComponent
-                    ], changeDetection: ChangeDetectionStrategy.Eager, template: "<div>{{data?.message}}</div>\n<kendo-dialog-actions>\n  <button kendoButton (click)=\"onButton1()\" themeColor=\"primary\">{{button1Text}}</button>\n  <button kendoButton (click)=\"onButton2()\" *ngIf=\"button2Text\">{{button2Text}}</button>\n  <button kendoButton (click)=\"onButton3()\" *ngIf=\"button3Text\">{{button3Text}}</button>\n</kendo-dialog-actions>\n\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.Eager, template: "<div>{{data?.message}}</div>\n<!-- Button order (Studio action guideline \u00A72.2, app convention): dismissing buttons first (left),\n     the confirming / primary button last (right) - also for destructive confirmations. -->\n<kendo-dialog-actions>\n  <button kendoButton (click)=\"onButton3()\" *ngIf=\"button3Text\" data-action=\"cancel\">{{button3Text}}</button>\n  <button kendoButton (click)=\"onButton2()\" *ngIf=\"button2Text\" data-action=\"dismiss\">{{button2Text}}</button>\n  <button kendoButton (click)=\"onButton1()\" [themeColor]=\"data?.danger ? 'error' : 'primary'\" [attr.data-danger]=\"data?.danger ? 'true' : null\" data-action=\"confirm\">{{button1Text}}</button>\n</kendo-dialog-actions>\n" }]
         }], ctorParameters: () => [], propDecorators: { data: [{
                 type: Input
             }] } });
 
+const DEFAULT_DANGER_CONFIRMATION_MESSAGES = {
+    cancel: 'Cancel',
+    typeToConfirm: 'Type {name} to confirm',
+    environmentNotice: '{environment} environment. Check the target before you confirm.',
+    target: 'Target',
+};
+/** Word typed when the target name is empty and no confirm text is set either. */
+const DANGER_CONFIRM_FALLBACK_WORD = 'DELETE';
+/**
+ * The text the user has to type when `requireTypingName` is set: the target name, or — when the
+ * target name is empty/whitespace — the confirm button text, else {@link DANGER_CONFIRM_FALLBACK_WORD}.
+ * Never empty, so an empty input can never satisfy the type-to-confirm rule.
+ */
+function dangerConfirmTypingToken(options) {
+    return (options.targetName ?? '').trim() || (options.confirmText ?? '').trim() || DANGER_CONFIRM_FALLBACK_WORD;
+}
+/**
+ * True when `typed` matches the target name (trimmed, case-sensitive). An empty/whitespace target
+ * name never matches — use {@link dangerConfirmTypingToken} to get a non-empty word to type.
+ */
+function dangerConfirmNameMatches(typed, targetName) {
+    const expected = (targetName ?? '').trim();
+    return expected.length > 0 && (typed ?? '').trim() === expected;
+}
+/**
+ * Optional hook providing the current {@link DangerConfirmEnvironment}; evaluated each time a
+ * danger confirmation opens (so it may read signals). Absent = behaviour unchanged.
+ *
+ * ```ts
+ * { provide: DANGER_CONFIRM_ENVIRONMENT, useFactory: () => {
+ *   const mode = inject(MyEnvironmentService);
+ *   return () => ({ requireTypingName: mode.isProduction(), environmentLabel: mode.label() });
+ * } }
+ * ```
+ */
+const DANGER_CONFIRM_ENVIRONMENT = new InjectionToken('DANGER_CONFIRM_ENVIRONMENT');
+/** Applies the environment defaults to options that leave `requireTypingName` / `environmentLabel` unset. */
+function applyDangerConfirmEnvironment(options, environment) {
+    if (!environment) {
+        return options;
+    }
+    return {
+        ...options,
+        requireTypingName: options.requireTypingName ?? environment.requireTypingName,
+        environmentLabel: options.environmentLabel !== undefined ? options.environmentLabel : (environment.environmentLabel ?? null),
+    };
+}
+
+let nextId = 0;
+/** Selector of the element that gets the initial focus (never the destructive button). */
+function DANGER_CONFIRM_SAFE_FOCUS(requireTypingName) {
+    return requireTypingName ? '[data-type-to-confirm]' : '[data-action="cancel"]';
+}
+/** Result of the danger confirmation dialog: `true` only for the confirming button. */
+class DangerConfirmationResult {
+    confirmed;
+    constructor(confirmed) {
+        this.confirmed = confirmed;
+    }
+}
+/**
+ * Content of {@link ConfirmationService.showDangerConfirm} (AB#5578): environment notice,
+ * target, consequence, optional type-to-confirm input; Cancel left, danger confirm right.
+ */
+class DangerConfirmationWindowComponent extends DialogContentBase {
+    ref;
+    /** Set by the service right after opening. */
+    options = signal({ title: '', targetName: '', consequence: '', confirmText: '' }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    typed = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "typed" }] : /* istanbul ignore next */ []));
+    inputId = `mm-danger-confirm-${nextId++}`;
+    messages = computed(() => ({
+        ...DEFAULT_DANGER_CONFIRMATION_MESSAGES,
+        ...(this.options().messages ?? {}),
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    /** What has to be typed: the target name, or a non-empty fallback when it is empty. */
+    typingToken = computed(() => dangerConfirmTypingToken(this.options()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "typingToken" }] : /* istanbul ignore next */ []));
+    typeLabel = computed(() => this.messages().typeToConfirm.replace('{name}', this.typingToken()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "typeLabel" }] : /* istanbul ignore next */ []));
+    environmentNotice = computed(() => this.messages().environmentNotice.replace('{environment}', this.options().environmentLabel ?? ''), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "environmentNotice" }] : /* istanbul ignore next */ []));
+    canConfirm = computed(() => !this.options().requireTypingName || dangerConfirmNameMatches(this.typed(), this.typingToken()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "canConfirm" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const ref = inject(DialogRef);
+        super(ref);
+        this.ref = ref;
+    }
+    host = inject((ElementRef));
+    /**
+     * Initial focus never on the destructive button (Enter must not delete): the type-to-confirm
+     * input when required, else Cancel. The service also passes `autoFocusedElement`; this is the
+     * fallback for hosts that render the content themselves.
+     */
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        setTimeout(() => this.focusSafeElement());
+    }
+    /** Focuses the type-to-confirm input or Cancel (unless focus already sits on one of them). */
+    focusSafeElement() {
+        const root = this.host.nativeElement.closest('.k-dialog') ?? this.host.nativeElement;
+        const target = root.querySelector(DANGER_CONFIRM_SAFE_FOCUS(!!this.options().requireTypingName));
+        target?.focus();
+    }
+    cancel() {
+        this.ref.close(new DangerConfirmationResult(false));
+    }
+    confirm() {
+        if (this.canConfirm()) {
+            this.ref.close(new DangerConfirmationResult(true));
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: DangerConfirmationWindowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: DangerConfirmationWindowComponent, isStandalone: true, selector: "mm-danger-confirmation-window", usesInheritance: true, ngImport: i0, template: `
+    @let o = options();
+    <div class="mm-danger-confirmation" data-dialog="danger-confirm">
+      @if (o.environmentLabel) {
+        <p class="mm-danger-confirmation__environment" role="alert" data-production-warning>
+          {{ environmentNotice() }}
+        </p>
+      }
+      <p class="mm-danger-confirmation__target">
+        <span class="mm-danger-confirmation__target-label">{{ messages().target }}:</span>
+        <strong data-target>{{ o.targetName }}</strong>
+      </p>
+      <p class="mm-danger-confirmation__consequence" data-consequence>{{ o.consequence }}</p>
+      @if (o.requireTypingName) {
+        <label class="mm-danger-confirmation__type" [for]="inputId">{{ typeLabel() }}</label>
+        <input
+          class="k-textbox k-input k-input-md k-rounded-md mm-danger-confirmation__input"
+          [id]="inputId"
+          type="text"
+          autocomplete="off"
+          spellcheck="false"
+          data-type-to-confirm
+          [value]="typed()"
+          (input)="typed.set($any($event.target).value)"
+          (keydown.enter)="canConfirm() && confirm()"
+        />
+      }
+    </div>
+    <kendo-dialog-actions>
+      <button kendoButton data-action="cancel" (click)="cancel()">{{ o.cancelText ?? messages().cancel }}</button>
+      <button kendoButton themeColor="error" data-action="confirm" data-danger="true"
+              [disabled]="!canConfirm()" (click)="confirm()">{{ o.confirmText }}</button>
+    </kendo-dialog-actions>
+  `, isInline: true, styles: [".mm-danger-confirmation p{margin:0 0 var(--theme-space-3, 12px)}.mm-danger-confirmation__environment{padding:var(--theme-space-2, 8px) var(--theme-space-3, 12px);border-left:3px solid var(--theme-status-error, #c0385f);border-radius:var(--theme-radius-sm, 4px);background:var(--theme-status-error-subtle, rgba(192, 56, 95, .08));font-weight:600}.mm-danger-confirmation__target-label{color:var(--theme-text-muted, #75829a);margin-right:var(--theme-space-1, 4px)}.mm-danger-confirmation__type{display:block;margin-bottom:var(--theme-space-1, 4px)}.mm-danger-confirmation__input{width:100%}\n"], dependencies: [{ kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: DangerConfirmationWindowComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-danger-confirmation-window', standalone: true, imports: [DialogActionsComponent, ButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    @let o = options();
+    <div class="mm-danger-confirmation" data-dialog="danger-confirm">
+      @if (o.environmentLabel) {
+        <p class="mm-danger-confirmation__environment" role="alert" data-production-warning>
+          {{ environmentNotice() }}
+        </p>
+      }
+      <p class="mm-danger-confirmation__target">
+        <span class="mm-danger-confirmation__target-label">{{ messages().target }}:</span>
+        <strong data-target>{{ o.targetName }}</strong>
+      </p>
+      <p class="mm-danger-confirmation__consequence" data-consequence>{{ o.consequence }}</p>
+      @if (o.requireTypingName) {
+        <label class="mm-danger-confirmation__type" [for]="inputId">{{ typeLabel() }}</label>
+        <input
+          class="k-textbox k-input k-input-md k-rounded-md mm-danger-confirmation__input"
+          [id]="inputId"
+          type="text"
+          autocomplete="off"
+          spellcheck="false"
+          data-type-to-confirm
+          [value]="typed()"
+          (input)="typed.set($any($event.target).value)"
+          (keydown.enter)="canConfirm() && confirm()"
+        />
+      }
+    </div>
+    <kendo-dialog-actions>
+      <button kendoButton data-action="cancel" (click)="cancel()">{{ o.cancelText ?? messages().cancel }}</button>
+      <button kendoButton themeColor="error" data-action="confirm" data-danger="true"
+              [disabled]="!canConfirm()" (click)="confirm()">{{ o.confirmText }}</button>
+    </kendo-dialog-actions>
+  `, styles: [".mm-danger-confirmation p{margin:0 0 var(--theme-space-3, 12px)}.mm-danger-confirmation__environment{padding:var(--theme-space-2, 8px) var(--theme-space-3, 12px);border-left:3px solid var(--theme-status-error, #c0385f);border-radius:var(--theme-radius-sm, 4px);background:var(--theme-status-error-subtle, rgba(192, 56, 95, .08));font-weight:600}.mm-danger-confirmation__target-label{color:var(--theme-text-muted, #75829a);margin-right:var(--theme-space-1, 4px)}.mm-danger-confirmation__type{display:block;margin-bottom:var(--theme-space-1, 4px)}.mm-danger-confirmation__input{width:100%}\n"] }]
+        }], ctorParameters: () => [] });
+
 class ConfirmationService {
     dialogService = inject(DialogService);
+    /** Optional app-wide environment defaults (e.g. production → type the name), AB#5578. */
+    dangerEnvironment = inject(DANGER_CONFIRM_ENVIRONMENT, { optional: true });
     defaultMessages;
+    /** App-wide translations of {@link showDangerConfirm}; per-call `options.messages` win. */
+    defaultDangerMessages;
+    /**
+     * Danger confirmation that names the target (Studio action guideline §2.4, AB#5578): title +
+     * target + consequence, Cancel left / danger confirm right, initial focus on Cancel (or on the
+     * type-to-confirm input when `requireTypingName`, e.g. in production tenants). Resolves `true`
+     * only when the confirming button was used. Unset `requireTypingName` / `environmentLabel` fall
+     * back to the app's {@link DANGER_CONFIRM_ENVIRONMENT}, if provided.
+     */
+    async showDangerConfirm(callerOptions) {
+        const options = applyDangerConfirmEnvironment(callerOptions, this.dangerEnvironment?.());
+        const dialogRef = this.dialogService.open({
+            title: options.title,
+            content: DangerConfirmationWindowComponent,
+            cssClass: 'mm-dialog-danger',
+            autoFocusedElement: DANGER_CONFIRM_SAFE_FOCUS(!!options.requireTypingName),
+            minWidth: 'min(320px, calc(100vw - 32px))',
+            maxWidth: 'min(560px, calc(100vw - 32px))',
+        });
+        const component = dialogRef.content.instance;
+        component.options.set({
+            ...options,
+            messages: { ...(this.defaultDangerMessages ?? {}), ...(options.messages ?? {}) },
+        });
+        const result = await firstValueFrom(dialogRef.result);
+        return result instanceof DangerConfirmationResult && result.confirmed;
+    }
     async showYesNoConfirmationDialog(title, message, cssClass, buttonLabels, messages) {
         const dialogRef = this.openDialog(title, message, DialogType.YesNo, cssClass, buttonLabels, messages);
         const result = await firstValueFrom(dialogRef.result);
@@ -341,6 +573,16 @@ class ConfirmationService {
             return false;
         }
     }
+    /**
+     * Confirmation of a destructive action: explicit verb labels instead of Yes / No (e.g.
+     * "Rotate" / "Cancel") and the confirming button styled as danger. Resolves `true` only when
+     * the confirming button was clicked.
+     */
+    async showDestructiveConfirmationDialog(title, message, confirmLabel, cancelLabel = 'Cancel') {
+        const dialogRef = this.openDialog(title, message, DialogType.YesNo, undefined, { yes: confirmLabel, no: cancelLabel }, undefined, true);
+        const result = await firstValueFrom(dialogRef.result);
+        return result instanceof ConfirmationWindowResult && result.result === ButtonTypes.Yes;
+    }
     async showOkDialog(title, message, messages) {
         const dialogRef = this.openDialog(title, message, DialogType.Ok, undefined, undefined, messages);
         const result = await firstValueFrom(dialogRef.result);
@@ -351,11 +593,19 @@ class ConfirmationService {
             return false;
         }
     }
-    openDialog(title, message, dialogType, cssClass, buttonLabels, messages) {
+    openDialog(title, message, dialogType, cssClass, buttonLabels, messages, danger = false) {
+        // A confirmation is a short text: cap its width so a long message wraps instead of
+        // stretching the dialog over the whole viewport.
         const dialogRef = this.dialogService.open({
             title,
             content: ConfirmationWindowComponent,
-            cssClass
+            cssClass,
+            // Destructive confirmations focus the dismissing button first: Enter must never confirm a
+            // delete (AB#5578). Danger = showDestructiveConfirmationDialog, 'mm-dialog-danger' = production check.
+            ...(danger || cssClass?.includes('mm-dialog-danger') ? { autoFocusedElement: '[data-action="dismiss"], [data-action="cancel"]' } : {}),
+            // Both bounds leave a 16 px gutter on each side, so a phone (< 352 px) never overflows.
+            minWidth: 'min(320px, calc(100vw - 32px))',
+            maxWidth: 'min(560px, calc(100vw - 32px))'
         });
         const component = dialogRef.content.instance;
         component.data = {
@@ -364,6 +614,7 @@ class ConfirmationService {
             dialogType,
             buttonLabels,
             messages: messages ?? this.defaultMessages,
+            ...(danger ? { danger: true } : {}),
         };
         return dialogRef;
     }
@@ -682,7 +933,7 @@ class MessageDetailsDialogComponent {
         </button>
       </div>
     </div>
-  `, isInline: true, styles: [".message-details-content{display:flex;flex-direction:column;height:100%;padding:16px;box-sizing:border-box;overflow:hidden}.loading-section{flex:1;display:flex;align-items:center;justify-content:center}.details-pre{flex:1;margin:0;font-family:Courier New,monospace;font-size:13px;line-height:1.5;border:1px solid var(--kendo-color-border);background:var(--kendo-color-base-subtle);border-radius:4px;padding:12px;overflow:scroll;white-space:pre;min-height:0}.details-pre::-webkit-scrollbar{width:10px;height:10px}.details-pre::-webkit-scrollbar-track{background:var(--kendo-color-base-subtle, #f5f5f5);border-radius:4px}.details-pre::-webkit-scrollbar-thumb{background:var(--kendo-color-border, #ccc);border-radius:4px}.details-pre::-webkit-scrollbar-thumb:hover{background:#999}.dialog-actions{flex-shrink:0;padding-top:16px;margin-top:16px;border-top:1px solid var(--kendo-color-border);display:flex;flex-direction:row;justify-content:space-between;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+  `, isInline: true, styles: [".message-details-content{display:flex;flex-direction:column;height:100%;padding:16px;box-sizing:border-box;overflow:hidden}.loading-section{flex:1;display:flex;align-items:center;justify-content:center}.details-pre{flex:1;margin:0;font-family:Courier New,monospace;font-size:13px;line-height:1.5;border:1px solid var(--kendo-color-border);background:var(--kendo-color-base-subtle);border-radius:4px;padding:12px;overflow:scroll;white-space:pre;min-height:0}.details-pre::-webkit-scrollbar{width:10px;height:10px}.details-pre::-webkit-scrollbar-track{background:var(--kendo-color-base-subtle, #f5f5f5);border-radius:4px}.details-pre::-webkit-scrollbar-thumb{background:var(--kendo-color-border, #ccc);border-radius:4px}.details-pre::-webkit-scrollbar-thumb:hover{background:#999}.dialog-actions{flex-shrink:0;padding-top:16px;margin-top:16px;border-top:1px solid var(--kendo-color-border);display:flex;flex-direction:row;justify-content:space-between;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: MessageDetailsDialogComponent, decorators: [{
             type: Component,
@@ -944,13 +1195,29 @@ const DEFAULT_NOTIFICATION_DISPLAY_MESSAGES = {
     showDetails: 'Show Details',
 };
 
+const NOTIFICATION_DISPLAY_OPTIONS = new InjectionToken('NOTIFICATION_DISPLAY_OPTIONS');
+const DEFAULT_OPTIONS = {
+    errorHideAfter: 0,
+    warningHideAfter: 0,
+    maxVisible: 0,
+    dedupe: true,
+    stickyWithDetails: false,
+};
+/** Eviction order of the stack cap: lower goes first. */
+const SEVERITY = { success: 0, info: 0, warning: 1, error: 2 };
 class NotificationDisplayService {
     notificationService = inject(NotificationService);
     messageDetailsDialogService = inject(MessageDetailsDialogService);
     router = inject(Router);
     ngZone = inject(NgZone);
+    options = {
+        ...DEFAULT_OPTIONS,
+        ...(inject(NOTIFICATION_DISPLAY_OPTIONS, { optional: true }) ?? {}),
+    };
     notificationCounter = 0;
     activeNotifications = new Map();
+    /** Every visible toast, oldest first (dedupe, stack cap, auto-hide timers). */
+    toasts = [];
     subscriptions = [];
     interactionDebounceTime = 300; // ms
     gracePeriod = 1000; // ms - prevent immediate closure after opening
@@ -1051,6 +1318,7 @@ class NotificationDisplayService {
         toRemove.forEach(id => {
             this.activeNotifications.delete(id);
             this.notificationOpenTimes.delete(id);
+            this.forget(id);
         });
     }
     clearAllNotifications() {
@@ -1059,6 +1327,8 @@ class NotificationDisplayService {
         }
         this.activeNotifications.clear();
         this.notificationOpenTimes.clear();
+        this.toasts.forEach(toast => clearTimeout(toast.timer));
+        this.toasts = [];
     }
     /**
      * Helper method to create SVG icon HTML
@@ -1071,182 +1341,166 @@ class NotificationDisplayService {
      * Shows a success notification (auto-closes after 3 seconds)
      */
     showSuccess(title, hideAfter) {
-        console.log('showSuccess called with:', { title, hideAfter });
-        const autoHideTime = hideAfter ?? 3000;
-        const settings = {
-            content: title,
-            type: {
-                style: 'success',
-                icon: true
-            },
-            animation: { type: 'slide', duration: 400 },
-            hideAfter: 0, // Disable Kendo's auto-hide, we'll handle it manually
-            closable: true,
-            position: { horizontal: 'center', vertical: 'top' }
-        };
-        console.log('Success notification settings:', settings);
-        const notificationRef = this.notificationService.show(settings);
-        console.log('Notification ref created:', notificationRef);
-        if (notificationRef) {
-            console.log(`Success notification will auto-hide after ${autoHideTime}ms (manual)`);
-            // Manually hide the notification after the specified time
-            setTimeout(() => {
-                console.log('Manually hiding success notification');
-                notificationRef.hide();
-            }, autoHideTime);
-        }
+        this.present('success', title, undefined, hideAfter ?? 3000);
     }
     /**
-     * Shows an error notification (persists until user interaction or navigation)
+     * Shows an error notification. It persists until user interaction or navigation, or hides
+     * after `hideAfter` ms (default: `errorHideAfter` of the options; `0` = sticky).
      */
     showError(title, details, hideAfter) {
-        // Generate unique ID for this notification
-        const notificationId = `error-${++this.notificationCounter}-${Date.now()}`;
-        // Start with plain text content
-        const settings = {
-            ...this.defaultSettings,
-            content: title,
-            type: {
-                style: 'error',
-                icon: true
-            },
-            hideAfter: hideAfter ?? 0, // 0 means no auto-hide for errors
-            closable: true,
-            cssClass: `notification-${notificationId}` // Add unique class for targeting
-        };
-        const notificationRef = this.notificationService.show(settings);
-        if (notificationRef) {
-            this.activeNotifications.set(notificationId, notificationRef);
-            this.notificationOpenTimes.set(notificationId, Date.now());
-        }
-        if (details && notificationRef) {
-            // After notification is shown, find it by the unique class and modify its content
-            setTimeout(() => {
-                const notification = document.querySelector(`.notification-${notificationId}`);
-                if (notification) {
-                    const contentEl = notification.querySelector('.k-notification-content');
-                    if (contentEl && !contentEl.querySelector('.notification-details-btn')) {
-                        // Create wrapper div
-                        const wrapper = document.createElement('div');
-                        wrapper.style.cssText = 'display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px;';
-                        // Create text span
-                        const textSpan = document.createElement('span');
-                        textSpan.style.cssText = 'flex: 1; overflow: hidden; text-overflow: ellipsis;';
-                        textSpan.textContent = title;
-                        // Create details button with icon only
-                        const detailsBtn = document.createElement('button');
-                        detailsBtn.className = 'k-button k-button-sm k-button-flat k-button-flat-base notification-details-btn';
-                        detailsBtn.style.cssText = 'flex-shrink: 0; width: 32px; height: 32px; padding: 8px; display: flex; align-items: center; justify-content: center;';
-                        detailsBtn.innerHTML = this.createSvgIcon();
-                        detailsBtn.title = this.messages.showDetails;
-                        detailsBtn.onclick = (event) => {
-                            event.stopPropagation();
-                            this.messageDetailsDialogService.showDetailsDialog({
-                                title,
-                                details,
-                                level: 'error'
-                            });
-                        };
-                        // Assemble the elements
-                        wrapper.appendChild(textSpan);
-                        wrapper.appendChild(detailsBtn);
-                        // Replace content
-                        contentEl.innerHTML = '';
-                        contentEl.appendChild(wrapper);
-                    }
-                }
-            }, 50);
-        }
+        this.present('error', title, details, hideAfter ?? this.options.errorHideAfter);
     }
     /**
-     * Shows a warning notification (persists until user interaction or navigation)
+     * Shows a warning notification. It persists until user interaction or navigation, or hides
+     * after `hideAfter` ms (default: `warningHideAfter` of the options; `0` = sticky).
      */
     showWarning(title, details, hideAfter) {
-        // Generate unique ID for this notification
-        const notificationId = `warning-${++this.notificationCounter}-${Date.now()}`;
-        // Start with plain text content
+        this.present('warning', title, details, hideAfter ?? this.options.warningHideAfter);
+    }
+    /**
+     * Shows an info notification (auto-closes after 3 seconds)
+     */
+    showInfo(title, hideAfter) {
+        this.present('info', title, undefined, hideAfter ?? 3000);
+    }
+    /** The visible toasts as `[style, text]`, oldest first — for tests and diagnostics. */
+    visibleToasts() {
+        return this.toasts.map(toast => [toast.style, toast.title]);
+    }
+    present(style, title, details, hideAfter) {
+        const key = `${style}\u0000${title}\u0000${details ?? ''}`;
+        if (this.options.dedupe) {
+            const same = this.toasts.find(toast => toast.key === key);
+            if (same) {
+                // Already on screen: no second copy, the visible one just stays a while longer.
+                this.schedule(same);
+                return;
+            }
+        }
+        const sticky = style === 'error' || style === 'warning';
+        // An error or warning with details is read in the details dialog: it waits for the user.
+        const duration = sticky && details && this.options.stickyWithDetails ? 0 : hideAfter;
+        const notificationId = `${style}-${++this.notificationCounter}-${Date.now()}`;
         const settings = {
             ...this.defaultSettings,
             content: title,
-            type: {
-                style: 'warning',
-                icon: true
-            },
-            hideAfter: hideAfter ?? 0, // 0 means no auto-hide for warnings
+            type: { style, icon: true },
+            // Kendo ignores hideAfter on closable notifications: hiding is done by schedule().
+            hideAfter: 0,
             closable: true,
-            cssClass: `notification-${notificationId}` // Add unique class for targeting
+            cssClass: `notification-${notificationId}`,
         };
         const notificationRef = this.notificationService.show(settings);
-        if (notificationRef) {
+        if (!notificationRef) {
+            return;
+        }
+        if (sticky) {
             this.activeNotifications.set(notificationId, notificationRef);
             this.notificationOpenTimes.set(notificationId, Date.now());
         }
-        if (details && notificationRef) {
-            // After notification is shown, find it by the unique class and modify its content
-            setTimeout(() => {
-                const notification = document.querySelector(`.notification-${notificationId}`);
-                if (notification) {
-                    const contentEl = notification.querySelector('.k-notification-content');
-                    if (contentEl && !contentEl.querySelector('.notification-details-btn')) {
-                        // Create wrapper div
-                        const wrapper = document.createElement('div');
-                        wrapper.style.cssText = 'display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px;';
-                        // Create text span
-                        const textSpan = document.createElement('span');
-                        textSpan.style.cssText = 'flex: 1; overflow: hidden; text-overflow: ellipsis;';
-                        textSpan.textContent = title;
-                        // Create details button with icon only
-                        const detailsBtn = document.createElement('button');
-                        detailsBtn.className = 'k-button k-button-sm k-button-flat k-button-flat-base notification-details-btn';
-                        detailsBtn.style.cssText = 'flex-shrink: 0; width: 32px; height: 32px; padding: 8px; display: flex; align-items: center; justify-content: center;';
-                        detailsBtn.innerHTML = this.createSvgIcon();
-                        detailsBtn.title = this.messages.showDetails;
-                        detailsBtn.onclick = (event) => {
-                            event.stopPropagation();
-                            this.messageDetailsDialogService.showDetailsDialog({
-                                title,
-                                details,
-                                level: 'warning'
-                            });
-                        };
-                        // Assemble the elements
-                        wrapper.appendChild(textSpan);
-                        wrapper.appendChild(detailsBtn);
-                        // Replace content
-                        contentEl.innerHTML = '';
-                        contentEl.appendChild(wrapper);
-                    }
-                }
-            }, 50);
+        const toast = { id: notificationId, key, style, title, ref: notificationRef, hideAfter: duration, hovered: false, focused: false };
+        this.toasts.push(toast);
+        notificationRef.afterHide?.subscribe(() => this.forget(notificationId));
+        this.schedule(toast);
+        this.enforceLimit();
+        // The toast element exists once Kendo has rendered it.
+        setTimeout(() => {
+            this.watchPointerAndFocus(toast);
+            if (details && sticky) {
+                this.addDetailsButton(notificationId, title, details, style);
+            }
+        }, 50);
+    }
+    /** (Re)starts the auto-hide timer of a toast; a toast with `hideAfter` 0 stays, a hovered or focused one waits. */
+    schedule(toast) {
+        clearTimeout(toast.timer);
+        toast.timer = undefined;
+        if (toast.hideAfter > 0 && !toast.hovered && !toast.focused) {
+            toast.timer = setTimeout(() => this.hideToast(toast), toast.hideAfter);
         }
     }
-    /**
-     * Shows an info notification (auto-closes after 3 seconds)
-     */
-    showInfo(title, hideAfter) {
-        console.log('showInfo called with:', { title, hideAfter });
-        const autoHideTime = hideAfter ?? 3000;
-        const settings = {
-            content: title,
-            type: {
-                style: 'info',
-                icon: true
-            },
-            animation: { type: 'slide', duration: 400 },
-            hideAfter: 0, // Disable Kendo's auto-hide, we'll handle it manually
-            closable: true,
-            position: { horizontal: 'center', vertical: 'top' }
+    /** Pauses the auto-hide while the pointer is over the toast or focus is inside it; restarts it afterwards. */
+    watchPointerAndFocus(toast) {
+        const element = document.querySelector(`.notification-${toast.id}`);
+        if (!element || !this.toasts.includes(toast)) {
+            return;
+        }
+        const update = (change) => {
+            Object.assign(toast, change);
+            if (this.toasts.includes(toast)) {
+                this.schedule(toast);
+            }
         };
-        console.log('Info notification settings:', settings);
-        const notificationRef = this.notificationService.show(settings);
-        console.log('Notification ref created:', notificationRef);
-        if (notificationRef) {
-            console.log(`Info notification will auto-hide after ${autoHideTime}ms (manual)`);
-            // Manually hide the notification after the specified time
-            setTimeout(() => {
-                console.log('Manually hiding info notification');
-                notificationRef.hide();
-            }, autoHideTime);
+        element.addEventListener('mouseenter', () => update({ hovered: true }));
+        element.addEventListener('mouseleave', () => update({ hovered: false }));
+        element.addEventListener('focusin', () => update({ focused: true }));
+        element.addEventListener('focusout', (event) => {
+            if (!(event.relatedTarget instanceof Node && element.contains(event.relatedTarget))) {
+                update({ focused: false });
+            }
+        });
+    }
+    /** Beyond `maxVisible`, hides the oldest toast of the lowest severity (success/info before warning before error). */
+    enforceLimit() {
+        const max = this.options.maxVisible;
+        while (max > 0 && this.toasts.length > max) {
+            const lowest = Math.min(...this.toasts.map(toast => SEVERITY[toast.style]));
+            const victim = this.toasts.find(toast => SEVERITY[toast.style] === lowest);
+            if (!victim) {
+                return;
+            }
+            this.hideToast(victim);
+        }
+    }
+    hideToast(toast) {
+        toast.ref.hide();
+        this.activeNotifications.delete(toast.id);
+        this.notificationOpenTimes.delete(toast.id);
+        this.forget(toast.id);
+    }
+    forget(id) {
+        const toast = this.toasts.find(entry => entry.id === id);
+        if (toast) {
+            clearTimeout(toast.timer);
+            this.toasts = this.toasts.filter(entry => entry !== toast);
+        }
+    }
+    addDetailsButton(notificationId, title, details, level) {
+        // Called once the notification is rendered: find it by the unique class and modify its content
+        {
+            const notification = document.querySelector(`.notification-${notificationId}`);
+            if (notification) {
+                const contentEl = notification.querySelector('.k-notification-content');
+                if (contentEl && !contentEl.querySelector('.notification-details-btn')) {
+                    // Create wrapper div
+                    const wrapper = document.createElement('div');
+                    wrapper.style.cssText = 'display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px;';
+                    // Create text span
+                    const textSpan = document.createElement('span');
+                    textSpan.style.cssText = 'flex: 1; overflow: hidden; text-overflow: ellipsis;';
+                    textSpan.textContent = title;
+                    // Create details button with icon only
+                    const detailsBtn = document.createElement('button');
+                    detailsBtn.className = 'k-button k-button-sm k-button-flat k-button-flat-base notification-details-btn';
+                    detailsBtn.style.cssText = 'flex-shrink: 0; width: 32px; height: 32px; padding: 8px; display: flex; align-items: center; justify-content: center;';
+                    detailsBtn.innerHTML = this.createSvgIcon();
+                    detailsBtn.title = this.messages.showDetails;
+                    detailsBtn.onclick = (event) => {
+                        event.stopPropagation();
+                        this.messageDetailsDialogService.showDetailsDialog({
+                            title,
+                            details,
+                            level
+                        });
+                    };
+                    // Assemble the elements
+                    wrapper.appendChild(textSpan);
+                    wrapper.appendChild(detailsBtn);
+                    // Replace content
+                    contentEl.innerHTML = '';
+                    contentEl.appendChild(wrapper);
+                }
+            }
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: NotificationDisplayService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
@@ -1347,7 +1601,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
         }] });
 
 /**
- * Default English messages for the ListViewComponent.
+ * Default English messages for the ListViewComponent. Complete: every member, including the
+ * optional ones, has a value.
  */
 const DEFAULT_LIST_VIEW_MESSAGES = {
     searchPlaceholder: 'Search in all columns...',
@@ -1358,6 +1613,10 @@ const DEFAULT_LIST_VIEW_MESSAGES = {
     resetFilters: 'Reset Filters',
     commands: 'Commands',
     actionsColumnTitle: 'Actions',
+    rowActionsFor: 'Actions for {name}',
+    rowActions: 'Row actions',
+    rowActionUnavailable: 'Not available for this row',
+    rowActionsLoading: 'The list is loading',
     pdfPageTemplate: 'Page {pageNum} of {totalPages}',
     pagerItemsPerPage: 'items per page',
     pagerOf: 'of',
@@ -1368,7 +1627,30 @@ const DEFAULT_LIST_VIEW_MESSAGES = {
     pagerPreviousPage: 'Go to the previous page',
     pagerNextPage: 'Go to the next page',
     noRecords: 'No records available.',
+    noResultsTitle: 'No results',
+    noResultsText: 'Nothing matches the current search or filter.',
+    booleanYes: 'Yes',
+    booleanNo: 'No',
+    booleanIconLabel: '{column}: {value}',
 };
+/**
+ * Merges app-supplied list-view messages over {@link DEFAULT_LIST_VIEW_MESSAGES}. Members that
+ * are missing, `undefined` or `null` keep their default, so an app compiled against an older
+ * `ListViewMessages` shape (or one that leaves a translation unset) never renders an empty label.
+ */
+function resolveListViewMessages(messages) {
+    const resolved = { ...DEFAULT_LIST_VIEW_MESSAGES };
+    if (!messages) {
+        return resolved;
+    }
+    for (const key of Object.keys(messages)) {
+        const value = messages[key];
+        if (value !== undefined && value !== null) {
+            resolved[key] = value;
+        }
+    }
+    return resolved;
+}
 
 class PascalCasePipe {
     transform(value) {
@@ -1548,6 +1830,14 @@ class MmListViewDataBindingDirective extends DataBindingDirective {
     get isLoading() {
         return this.dataSource?.isLoading ?? false;
     }
+    /**
+     * Read-only view of the grid state (filter, sort, skip, take) Kendo keeps
+     * protected on the base directive. The list view consults it to decide
+     * whether anything is filtered right now.
+     */
+    get currentState() {
+        return this.state;
+    }
     _serviceSubscription;
     _executeFilterSubscription;
     _fetchAgainSubscription;
@@ -1762,6 +2052,313 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+/** Default number of row action slots (inline buttons incl. the overflow button). */
+const MM_ROW_ACTIONS_MAX_INLINE = 3;
+/**
+ * Canonical action icons (AB#5570). One verb, one icon, everywhere: pick from this map
+ * instead of importing a Kendo icon ad hoc, so "Edit" never shows a gear in one list and a
+ * pencil in the next.
+ */
+const MM_ACTION_ICONS = {
+    /** Create a new item ("New adapter", "Add mapping"). */
+    add: plusIcon,
+    /** Edit / open the editable form of the item. */
+    edit: pencilIcon,
+    /** Read-only view / preview. */
+    view: eyeIcon,
+    /** Open the item (or a related page) in its own view / new tab. */
+    open: hyperlinkOpenIcon,
+    /** Delete / remove the item (always `danger`). */
+    delete: trashIcon,
+    /** Clear a stored value without deleting the item ("Not needed", "Clear secret"). */
+    clear: eraserIcon,
+    /** Copy an id or value to the clipboard. */
+    copy: copyIcon,
+    /** Duplicate the item as a new item. */
+    duplicate: fileDataIcon,
+    /** Reload data. */
+    refresh: arrowRotateCwIcon,
+    /** Deploy to a pool / cluster. */
+    deploy: uploadIcon,
+    /** Undeploy. */
+    undeploy: xCircleIcon,
+    /** Run / execute / start. */
+    run: playIcon,
+    /** Stop / cancel a running job. */
+    stop: stopIcon,
+    /** Export data (file the user saves). */
+    export: exportIcon,
+    /** Import data. */
+    import: importIcon,
+    /** Download a file. */
+    download: downloadIcon,
+    /** Show a report / log. */
+    report: fileReportIcon,
+    /** Restore / roll back to a stored state (e.g. restore a dump); destructive restores are `danger`. */
+    restore: undoIcon,
+    /** Pin to a start page / favourites ("Pin to Home"). */
+    pin: pinIcon,
+    /** Remove a pin ("Unpin from Home"). */
+    unpin: unpinIcon,
+    /** Merge one item into another (e.g. merge users); usually `danger`. */
+    merge: cellsMergeIcon,
+    /** Reset / set a password. */
+    resetPassword: passwordIcon,
+    /** Fill a past time range from the source data (e.g. rollup backfill). */
+    backfill: clockArrowRotateIcon,
+    /** Recalculate derived values for a range (e.g. rollup recompute); not the same as `refresh`. */
+    recompute: calculatorIcon,
+};
+/** True when the action is disabled (non-empty {@link MmAction.disabledReason}). */
+function isActionDisabled(action) {
+    return !!action.disabledReason && action.disabledReason.trim().length > 0;
+}
+/** True unless the action is explicitly hidden. */
+function isActionVisible(action) {
+    return action.visible !== false;
+}
+/**
+ * Accessible name of an action on a named target: "Delete dump Encrypt run 2026-10-06 17:09".
+ * Without a target the label alone.
+ */
+function actionAccessibleName(action, targetLabel) {
+    const target = (targetLabel ?? '').trim();
+    return target ? `${action.label} ${target}` : action.label;
+}
+/** Tooltip: the label, plus the reason when disabled ("Delete dump — Requires SecretManagement"). */
+function actionTooltip(action) {
+    return isActionDisabled(action) ? `${action.label} — ${action.disabledReason.trim()}` : action.label;
+}
+/**
+ * Splits visible actions into inline buttons and overflow-menu items. At most `maxInline`
+ * slots are rendered: when the actions do not fit, the last slot becomes the overflow
+ * button. Actions with `overflow: true` always go to the menu (and need the overflow slot).
+ */
+function splitRowActions(actions, maxInline = MM_ROW_ACTIONS_MAX_INLINE) {
+    const visible = actions.filter(isActionVisible);
+    const forced = visible.filter((a) => a.overflow);
+    const candidates = visible.filter((a) => !a.overflow);
+    const slots = Math.max(1, Math.floor(maxInline));
+    const needsMenu = forced.length > 0 || candidates.length > slots;
+    if (!needsMenu) {
+        return { inline: candidates, menu: [] };
+    }
+    const inlineCount = Math.max(0, slots - 1);
+    return {
+        inline: candidates.slice(0, inlineCount),
+        menu: [...candidates.slice(inlineCount), ...forced],
+    };
+}
+
+let nextReasonId = 0;
+/**
+ * One action as a button (AB#5570), rendered from a shared {@link MmAction} definition.
+ *
+ * - `display="icon"`: icon-only, native tooltip = label (+ disabled reason), `aria-label`
+ *   = label + `targetLabel` ("Delete dump Encrypt run 2026-10-06 17:09").
+ * - `display="text"` / `"icon-text"`: visible label; `targetLabel` still extends the
+ *   accessible name when the same label repeats (one per row).
+ * - Disabled (`disabledReason`): stays focusable, `aria-disabled="true"`, the reason is
+ *   linked via `aria-describedby` and shown in the tooltip; clicks are swallowed.
+ * - `danger`: Kendo `themeColor="error"`. The consumer confirms before acting.
+ * - `primary` (page/toolbar context only): solid primary button for the one main action.
+ * - `link`: rendered as a real router link (`<a kendoButton [routerLink]>`, so open-in-new-tab
+ *   works); a disabled link action renders as a disabled button.
+ *
+ * ```html
+ * <mm-action-button [action]="refresh" context="toolbar" (triggered)="reload()" />
+ * <mm-action-button [action]="newAdapter" context="page" display="icon-text" primary (triggered)="create()" />
+ * ```
+ */
+class ActionButtonComponent {
+    /** The action definition. */
+    action = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "action" }] : /* istanbul ignore next */ []));
+    /** Name of the target (row) for the accessible name; required for repeated row actions. */
+    targetLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "targetLabel" }] : /* istanbul ignore next */ []));
+    context = input('row', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
+    display = input('icon', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "display" }] : /* istanbul ignore next */ []));
+    /** Solid primary emphasis — at most one per page header / toolbar. */
+    primary = input(false, { ...(ngDevMode ? { debugName: "primary" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Fires for enabled actions only. */
+    triggered = output();
+    reasonId = `mm-action-reason-${nextReasonId++}`;
+    disabled = computed(() => isActionDisabled(this.action()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Icon-only needs an icon; without one the button falls back to its text. */
+    iconOnly = computed(() => this.display() === 'icon' && !!this.action().icon, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "iconOnly" }] : /* istanbul ignore next */ []));
+    /** Visible text: `menuLabel` ("Delete dump…") when set, else the label. */
+    visibleLabel = computed(() => this.action().menuLabel || this.action().label, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "visibleLabel" }] : /* istanbul ignore next */ []));
+    showIcon = computed(() => this.display() !== 'text' && !!this.action().icon, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showIcon" }] : /* istanbul ignore next */ []));
+    tooltip = computed(() => this.iconOnly() || this.disabled() ? actionTooltip(this.action()) : null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tooltip" }] : /* istanbul ignore next */ []));
+    ariaLabel = computed(() => this.iconOnly() || this.targetLabel() ? actionAccessibleName(this.action(), this.targetLabel()) : null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** Kendo button classes for the link variant (same look as `button[kendoButton]`). */
+    linkClasses = computed(() => {
+        const size = this.context() === 'row' ? 'sm' : 'md';
+        const fill = this.primary() && !this.action().danger ? 'solid' : 'flat';
+        const theme = this.action().danger ? 'error' : this.primary() ? 'primary' : 'base';
+        return ['k-button', `k-button-${size}`, `k-button-${fill}`, `k-button-${theme}`, 'k-rounded-md',
+            this.iconOnly() ? 'k-icon-button' : ''].filter(Boolean).join(' ');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkClasses" }] : /* istanbul ignore next */ []));
+    onClick(event) {
+        if (this.disabled()) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+        }
+        const action = this.action();
+        this.triggered.emit({ id: action.id, action });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: ActionButtonComponent, isStandalone: true, selector: "mm-action-button", inputs: { action: { classPropertyName: "action", publicName: "action", isSignal: true, isRequired: true, transformFunction: null }, targetLabel: { classPropertyName: "targetLabel", publicName: "targetLabel", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, primary: { classPropertyName: "primary", publicName: "primary", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { triggered: "triggered" }, host: { properties: { "class.mm-action-button-host--disabled": "disabled()" }, classAttribute: "mm-action-button-host" }, ngImport: i0, template: `
+    @if (action().link && !disabled()) {
+      <!-- kendoButton only matches <button>: the link carries the same Kendo button classes itself. -->
+      <a
+        class="mm-action-button"
+        [class]="linkClasses()"
+        [class.mm-action-button--danger]="!!action().danger"
+        [class.mm-action-button--icon-only]="iconOnly()"
+        [class.mm-action-button--toolbar]="context() !== 'row'"
+        [attr.title]="tooltip()"
+        [attr.aria-label]="ariaLabel()"
+        [attr.data-action]="action().id"
+        [routerLink]="$any(action().link!.commands)"
+        [queryParams]="action().link!.queryParams ?? null"
+        (click)="onClick($event)"
+      >@if (showIcon()) {<kendo-svgicon class="k-button-icon" [icon]="action().icon!" />}@if (!iconOnly()) {<span class="k-button-text">{{ visibleLabel() }}</span>}</a>
+    } @else {
+      <button
+        kendoButton
+        type="button"
+      class="mm-action-button"
+      [class.mm-action-button--disabled]="disabled()"
+      [class.mm-action-button--danger]="!!action().danger"
+      [class.mm-action-button--icon-only]="iconOnly()"
+      [class.mm-action-button--toolbar]="context() !== 'row'"
+      [svgIcon]="showIcon() ? action().icon! : $any(undefined)"
+      [size]="context() === 'row' ? 'small' : 'medium'"
+      [fillMode]="primary() && !action().danger ? 'solid' : 'flat'"
+      [themeColor]="action().danger ? 'error' : primary() ? 'primary' : 'base'"
+      [attr.title]="tooltip()"
+      [attr.aria-label]="ariaLabel()"
+      [attr.data-action]="action().id"
+        [attr.aria-disabled]="disabled() ? 'true' : null"
+        [attr.aria-describedby]="disabled() ? reasonId : null"
+        (click)="onClick($event)"
+      >@if (!iconOnly()) { {{ visibleLabel() }} }</button>
+    }
+    @if (disabled()) {
+      <span class="mm-action-button__reason" [id]="reasonId">{{ action().disabledReason }}</span>
+    }
+  `, isInline: true, styles: [".mm-action-button-host{display:inline-flex;position:relative}.mm-action-button--toolbar.mm-action-button--icon-only .k-svg-icon{width:20px;height:20px}.mm-action-button--disabled{opacity:.45;cursor:not-allowed}.mm-action-button-host .mm-action-button:focus-visible{outline:none;box-shadow:var(--theme-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #2e8473)}.mm-action-button__reason{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mm-action-button-host--disabled:has(.mm-action-button:focus-visible) .mm-action-button__reason{top:calc(100% + 4px);left:0;z-index:20;width:max-content;max-width:280px;height:auto;margin:0;overflow:visible;clip:auto;padding:var(--theme-space-1, 4px) var(--theme-space-2, 8px);white-space:normal;font-size:.75rem;line-height:1.4;color:var(--theme-text-primary, #0f1c2e);background:var(--theme-bg-overlay, #ffffff);border:1px solid var(--theme-border-default, rgba(7, 23, 43, .12));border-radius:var(--theme-radius-sm, 4px);box-shadow:var(--theme-shadow-popup, 0 8px 24px rgba(7, 23, 43, .14));pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "ngmodule", type: SVGIconModule }, { kind: "component", type: i2.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ActionButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-action-button', standalone: true, imports: [ButtonModule, RouterLink, SVGIconModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'mm-action-button-host', '[class.mm-action-button-host--disabled]': 'disabled()' }, template: `
+    @if (action().link && !disabled()) {
+      <!-- kendoButton only matches <button>: the link carries the same Kendo button classes itself. -->
+      <a
+        class="mm-action-button"
+        [class]="linkClasses()"
+        [class.mm-action-button--danger]="!!action().danger"
+        [class.mm-action-button--icon-only]="iconOnly()"
+        [class.mm-action-button--toolbar]="context() !== 'row'"
+        [attr.title]="tooltip()"
+        [attr.aria-label]="ariaLabel()"
+        [attr.data-action]="action().id"
+        [routerLink]="$any(action().link!.commands)"
+        [queryParams]="action().link!.queryParams ?? null"
+        (click)="onClick($event)"
+      >@if (showIcon()) {<kendo-svgicon class="k-button-icon" [icon]="action().icon!" />}@if (!iconOnly()) {<span class="k-button-text">{{ visibleLabel() }}</span>}</a>
+    } @else {
+      <button
+        kendoButton
+        type="button"
+      class="mm-action-button"
+      [class.mm-action-button--disabled]="disabled()"
+      [class.mm-action-button--danger]="!!action().danger"
+      [class.mm-action-button--icon-only]="iconOnly()"
+      [class.mm-action-button--toolbar]="context() !== 'row'"
+      [svgIcon]="showIcon() ? action().icon! : $any(undefined)"
+      [size]="context() === 'row' ? 'small' : 'medium'"
+      [fillMode]="primary() && !action().danger ? 'solid' : 'flat'"
+      [themeColor]="action().danger ? 'error' : primary() ? 'primary' : 'base'"
+      [attr.title]="tooltip()"
+      [attr.aria-label]="ariaLabel()"
+      [attr.data-action]="action().id"
+        [attr.aria-disabled]="disabled() ? 'true' : null"
+        [attr.aria-describedby]="disabled() ? reasonId : null"
+        (click)="onClick($event)"
+      >@if (!iconOnly()) { {{ visibleLabel() }} }</button>
+    }
+    @if (disabled()) {
+      <span class="mm-action-button__reason" [id]="reasonId">{{ action().disabledReason }}</span>
+    }
+  `, styles: [".mm-action-button-host{display:inline-flex;position:relative}.mm-action-button--toolbar.mm-action-button--icon-only .k-svg-icon{width:20px;height:20px}.mm-action-button--disabled{opacity:.45;cursor:not-allowed}.mm-action-button-host .mm-action-button:focus-visible{outline:none;box-shadow:var(--theme-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #2e8473)}.mm-action-button__reason{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mm-action-button-host--disabled:has(.mm-action-button:focus-visible) .mm-action-button__reason{top:calc(100% + 4px);left:0;z-index:20;width:max-content;max-width:280px;height:auto;margin:0;overflow:visible;clip:auto;padding:var(--theme-space-1, 4px) var(--theme-space-2, 8px);white-space:normal;font-size:.75rem;line-height:1.4;color:var(--theme-text-primary, #0f1c2e);background:var(--theme-bg-overlay, #ffffff);border:1px solid var(--theme-border-default, rgba(7, 23, 43, .12));border-radius:var(--theme-radius-sm, 4px);box-shadow:var(--theme-shadow-popup, 0 8px 24px rgba(7, 23, 43, .14));pointer-events:none}\n"] }]
+        }], propDecorators: { action: [{ type: i0.Input, args: [{ isSignal: true, alias: "action", required: true }] }], targetLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "targetLabel", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], primary: [{ type: i0.Input, args: [{ isSignal: true, alias: "primary", required: false }] }], triggered: [{ type: i0.Output, args: ["triggered"] }] } });
+
+/**
+ * Human label of a list row (AB#5623) — the row's name in row action names ("Actions for <label>"),
+ * dialog titles and danger confirmations. Reads `field` (a dotted path such as `contact.displayName`
+ * also works, a flat key with dots wins), then each of `fallbacks` (default `rtWellKnownName`,
+ * `rtId`); the first non-blank value wins. `''` when none is set.
+ */
+function resolveListRowLabel(row, field, fallbacks = ['rtWellKnownName', 'rtId']) {
+    const record = (row ?? {});
+    for (const key of field ? [field, ...fallbacks] : fallbacks) {
+        const value = readRowPath(record, key);
+        if (value !== null && value !== undefined && typeof value !== 'object' && typeof value !== 'function' && String(value).trim() !== '') {
+            return String(value);
+        }
+    }
+    return '';
+}
+function readRowPath(row, path) {
+    if (path in row || path.indexOf('.') === -1) {
+        return row[path];
+    }
+    let value = row;
+    for (const key of path.split('.')) {
+        if (value === null || value === undefined || typeof value !== 'object') {
+            return undefined;
+        }
+        value = value[key];
+    }
+    return value;
+}
+/** Resolves the per-row callbacks of a {@link MmListRowAction}. */
+function resolveListRowAction(definition, row) {
+    const { disabledReason, visible, link, run: _run, ...rest } = definition;
+    return {
+        ...rest,
+        disabledReason: typeof disabledReason === 'function' ? disabledReason(row) ?? null : disabledReason ?? null,
+        visible: typeof visible === 'function' ? visible(row) : visible,
+        link: typeof link === 'function' ? link(row) ?? undefined : link,
+    };
+}
+/** Structural equality of two rendered actions (keeps object identity stable across change detection). */
+function sameAction(a, b) {
+    return a.id === b.id && a.label === b.label && a.menuLabel === b.menuLabel && a.icon === b.icon
+        && !!a.danger === !!b.danger && (a.disabledReason ?? null) === (b.disabledReason ?? null)
+        && a.visible === b.visible && !!a.overflow === !!b.overflow && sameLink(a.link, b.link);
+}
+function sameLink(a, b) {
+    if (a === b)
+        return true;
+    if (!a || !b)
+        return false;
+    return JSON.stringify(a) === JSON.stringify(b);
+}
+
 class BytesToSizePipe {
     transform(value, decimals = 2) {
         if (value === 0) {
@@ -1901,6 +2498,248 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                 }]
         }] });
 
+/** Pixel edge length of each {@link OctoBotSize}. */
+const OCTOBOT_SIZE_PX = { sm: 60, md: 120, lg: 240 };
+/**
+ * Length of one loop of each animation in ms (identical for all sizes; read from the WebP frame
+ * durations). Used by `playOnce`.
+ */
+const OCTOBOT_LOOP_MS = {
+    idle: 1900, blink: 2140, look: 2320, swim: 1750, thinking: 3520, wave: 2210
+};
+/**
+ * Base URL of the OctoBot images, with a trailing slash. Default `assets/octobot/` (relative to
+ * the document base). The files ship as library assets in
+ * `node_modules/@meshmakers/shared-ui/assets/octobot`; a host app copies them with an
+ * `angular.json` assets entry:
+ *
+ * ```json
+ * { "glob": "**\/*", "input": "node_modules/@meshmakers/shared-ui/assets/octobot", "output": "/assets/octobot" }
+ * ```
+ *
+ * Provide a different value when the app serves them elsewhere (a CDN, a sub path).
+ */
+const OCTOBOT_ASSET_BASE_URL = new InjectionToken('OCTOBOT_ASSET_BASE_URL', {
+    providedIn: 'root',
+    factory: () => 'assets/octobot/'
+});
+/**
+ * App-wide "show stills only" switch, e.g. bound to a user setting "Reduce animations". When
+ * `true`, every `mm-octobot` shows its still frame regardless of `prefers-reduced-motion`.
+ */
+const OCTOBOT_FORCE_STILL = new InjectionToken('OCTOBOT_FORCE_STILL', {
+    providedIn: 'root',
+    factory: () => false
+});
+const REDUCED_MOTION_QUERY = '(prefers-reduced-motion: reduce)';
+/**
+ * `mm-octobot` — the meshmakers OctoBot mascot as a small animated pixel-art image (AB#3444).
+ *
+ * Renders one `<img>` with a fixed width and height (no layout shift), `loading="lazy"` (or
+ * `eager` via the `loading` input),
+ * `decoding="async"` and `image-rendering: pixelated`. The image is an 8-frame animated WebP
+ * loaded by URL from {@link OCTOBOT_ASSET_BASE_URL} — nothing lands in the JS bundle.
+ *
+ * **Reduced motion:** while the user prefers reduced motion (`prefers-reduced-motion: reduce`,
+ * followed live via `matchMedia`), when {@link OCTOBOT_FORCE_STILL} is `true` or when the `still`
+ * input is set, the first frame is shown as a static PNG instead.
+ *
+ * **Accessibility:** without a `label` the figure is decorative (`alt=""`, `aria-hidden="true"`);
+ * the surrounding text must carry the meaning (e.g. "Thinking…" next to `thinking`). With a
+ * `label` the host gets `role="img"` and `aria-label`.
+ *
+ * **Placement rules (host responsibility, see `docs/actions.md` › OctoBot):** at most one
+ * animated OctoBot per view — empty states (once per page), page loading, the assistant panel,
+ * 404 / turned-off pages, onboarding. Never inside repeated elements (list rows, table cells,
+ * cockpit tiles, buttons) and never in toasts or error messages (a still frame is acceptable
+ * there if a figure is wanted at all).
+ *
+ * @example
+ * ```html
+ * <mm-octobot animation="idle" size="md" />
+ * <mm-octobot animation="thinking" size="sm" label="The assistant is thinking" />
+ * ```
+ */
+class OctoBotComponent {
+    baseUrl = inject(OCTOBOT_ASSET_BASE_URL);
+    forceStill = inject(OCTOBOT_FORCE_STILL);
+    /** Which animation to play. Default `idle`. */
+    animation = input('idle', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "animation" }] : /* istanbul ignore next */ []));
+    /** Rendered size. Default `md` (120 px). */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Accessible name; when empty the figure is decorative. */
+    label = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Image loading strategy; `eager` where the figure is visible right away. Default `lazy`. */
+    loading = input('lazy', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+    /** Show the still frame instead of the animation (e.g. after the assistant finished). */
+    still = input(false, { ...(ngDevMode ? { debugName: "still" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Plays the animation once ({@link OCTOBOT_LOOP_MS}) and then rests on the still frame — for
+     * greetings (`wave`) that should not loop forever. The WebPs themselves loop endlessly.
+     */
+    playOnce = input(false, { ...(ngDevMode ? { debugName: "playOnce" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    prefersReducedMotion = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "prefersReducedMotion" }] : /* istanbul ignore next */ []));
+    played = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "played" }] : /* istanbul ignore next */ []));
+    px = computed(() => OCTOBOT_SIZE_PX[this.size()] ?? OCTOBOT_SIZE_PX.md, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "px" }] : /* istanbul ignore next */ []));
+    showStill = computed(() => this.still() || this.forceStill || this.prefersReducedMotion() || this.played(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showStill" }] : /* istanbul ignore next */ []));
+    src = computed(() => {
+        const base = this.baseUrl.endsWith('/') ? this.baseUrl : `${this.baseUrl}/`;
+        const file = this.showStill() ? `octo_${this.animation()}_still.png` : `octo_${this.animation()}.webp`;
+        return `${base}${this.size()}/${file}`;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const destroyRef = inject(DestroyRef);
+        // Restart the single loop whenever the animation changes while playOnce is set.
+        effect((onCleanup) => {
+            const animation = this.animation();
+            this.played.set(false);
+            if (!this.playOnce()) {
+                return;
+            }
+            const timer = setTimeout(() => this.played.set(true), OCTOBOT_LOOP_MS[animation] ?? 2000);
+            onCleanup(() => clearTimeout(timer));
+        });
+        if (!isPlatformBrowser(inject(PLATFORM_ID)) || typeof window === 'undefined' || typeof window.matchMedia !== 'function') {
+            return;
+        }
+        const query = window.matchMedia(REDUCED_MOTION_QUERY);
+        if (!query) {
+            // Stubbed or partial matchMedia (tests, embedded webviews): keep the animation, no live updates.
+            return;
+        }
+        this.prefersReducedMotion.set(!!query.matches);
+        const listener = (event) => this.prefersReducedMotion.set(event.matches);
+        query.addEventListener?.('change', listener);
+        destroyRef.onDestroy(() => query.removeEventListener?.('change', listener));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OctoBotComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: OctoBotComponent, isStandalone: true, selector: "mm-octobot", inputs: { animation: { classPropertyName: "animation", publicName: "animation", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, still: { classPropertyName: "still", publicName: "still", isSignal: true, isRequired: false, transformFunction: null }, playOnce: { classPropertyName: "playOnce", publicName: "playOnce", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-size": "size()", "attr.role": "label() ? \"img\" : null", "attr.aria-label": "label() || null", "attr.aria-hidden": "label() ? null : \"true\"", "attr.data-animation": "animation()", "attr.data-still": "showStill() ? \"true\" : null" }, classAttribute: "mm-octobot" }, ngImport: i0, template: `<img
+    class="mm-octobot__img"
+    [attr.loading]="loading()"
+    [src]="src()"
+    [attr.width]="px()"
+    [attr.height]="px()"
+    alt=""
+    decoding="async"
+    draggable="false" />`, isInline: true, styles: [":host{display:inline-block;flex:none;line-height:0}.mm-octobot__img{display:block;max-width:none;image-rendering:pixelated;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: OctoBotComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-octobot', template: `<img
+    class="mm-octobot__img"
+    [attr.loading]="loading()"
+    [src]="src()"
+    [attr.width]="px()"
+    [attr.height]="px()"
+    alt=""
+    decoding="async"
+    draggable="false" />`, host: {
+                        'class': 'mm-octobot',
+                        '[attr.data-size]': 'size()',
+                        '[attr.role]': 'label() ? "img" : null',
+                        '[attr.aria-label]': 'label() || null',
+                        '[attr.aria-hidden]': 'label() ? null : "true"',
+                        '[attr.data-animation]': 'animation()',
+                        '[attr.data-still]': 'showStill() ? "true" : null'
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block;flex:none;line-height:0}.mm-octobot__img{display:block;max-width:none;image-rendering:pixelated;-webkit-user-select:none;user-select:none}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { animation: [{ type: i0.Input, args: [{ isSignal: true, alias: "animation", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], still: [{ type: i0.Input, args: [{ isSignal: true, alias: "still", required: false }] }], playOnce: [{ type: i0.Input, args: [{ isSignal: true, alias: "playOnce", required: false }] }] } });
+
+/** Default English "Try again" label of {@link EmptyStateComponent}. */
+const DEFAULT_EMPTY_STATE_RETRY_LABEL = 'Try again';
+/**
+ * `mm-empty-state` — the shared empty / no-results / error block of a page or list (AB#3444).
+ *
+ * One per page or list, never per row. The `empty` and `no-results` variants show one OctoBot
+ * (`idle` / `look`, decorative) above the title; the `error` variant shows no figure and announces
+ * itself as an alert. Project extra actions (e.g. "New data flow") as content.
+ *
+ * @example
+ * ```html
+ * <mm-empty-state heading="No data flows yet" text="Create your first data flow to start processing data." />
+ * <mm-empty-state variant="error" heading="The blueprints could not be loaded." showRetry (retry)="load()" />
+ * ```
+ */
+class EmptyStateComponent {
+    variant = input('empty', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    heading = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
+    text = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
+    /** OctoBot size of the `empty` / `no-results` variants. Default `md`. */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Shows the "Try again" button (error variant only). */
+    showRetry = input(false, { ...(ngDevMode ? { debugName: "showRetry" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    retryLabel = input(DEFAULT_EMPTY_STATE_RETRY_LABEL, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "retryLabel" }] : /* istanbul ignore next */ []));
+    /** Emitted by the "Try again" button. */
+    retry = output();
+    figure = computed(() => {
+        switch (this.variant()) {
+            case 'empty': return 'idle';
+            case 'no-results': return 'look';
+            default: return null;
+        }
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "figure" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: EmptyStateComponent, isStandalone: true, selector: "mm-empty-state", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showRetry: { classPropertyName: "showRetry", publicName: "showRetry", isSignal: true, isRequired: false, transformFunction: null }, retryLabel: { classPropertyName: "retryLabel", publicName: "retryLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { retry: "retry" }, host: { properties: { "attr.data-variant": "variant()" }, classAttribute: "mm-empty-state" }, ngImport: i0, template: `
+    @if (figure(); as animation) {
+      <mm-octobot class="mm-empty-state__figure" [animation]="animation" [size]="size()" loading="eager" />
+    }
+    <p class="mm-empty-state__title" [attr.role]="variant() === 'error' ? 'alert' : null">{{ heading() }}</p>
+    @if (text()) {
+      <p class="mm-empty-state__text">{{ text() }}</p>
+    }
+    @if (variant() === 'error' && showRetry()) {
+      <button kendoButton type="button" class="mm-empty-state__retry" (click)="retry.emit()">{{ retryLabel() }}</button>
+    }
+    <ng-content />
+  `, isInline: true, styles: [":host{display:flex;flex-direction:column;align-items:center;gap:var(--theme-space-2, 8px);padding:var(--theme-space-6, 24px) var(--theme-space-4, 16px);text-align:center;color:var(--theme-text-secondary)}.mm-empty-state__title{margin:0;color:var(--theme-text-primary);font-weight:600}:host([data-variant=\"error\"]) .mm-empty-state__title{color:var(--theme-status-error)}.mm-empty-state__text{margin:0;max-width:48ch}.mm-empty-state__retry{margin-top:var(--theme-space-1, 4px)}\n"], dependencies: [{ kind: "component", type: OctoBotComponent, selector: "mm-octobot", inputs: ["animation", "size", "label", "loading", "still", "playOnce"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EmptyStateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-empty-state', imports: [OctoBotComponent, ButtonComponent], template: `
+    @if (figure(); as animation) {
+      <mm-octobot class="mm-empty-state__figure" [animation]="animation" [size]="size()" loading="eager" />
+    }
+    <p class="mm-empty-state__title" [attr.role]="variant() === 'error' ? 'alert' : null">{{ heading() }}</p>
+    @if (text()) {
+      <p class="mm-empty-state__text">{{ text() }}</p>
+    }
+    @if (variant() === 'error' && showRetry()) {
+      <button kendoButton type="button" class="mm-empty-state__retry" (click)="retry.emit()">{{ retryLabel() }}</button>
+    }
+    <ng-content />
+  `, host: {
+                        'class': 'mm-empty-state',
+                        '[attr.data-variant]': 'variant()'
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;flex-direction:column;align-items:center;gap:var(--theme-space-2, 8px);padding:var(--theme-space-6, 24px) var(--theme-space-4, 16px);text-align:center;color:var(--theme-text-secondary)}.mm-empty-state__title{margin:0;color:var(--theme-text-primary);font-weight:600}:host([data-variant=\"error\"]) .mm-empty-state__title{color:var(--theme-status-error)}.mm-empty-state__text{margin:0;max-width:48ch}.mm-empty-state__retry{margin-top:var(--theme-space-1, 4px)}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: true }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], showRetry: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRetry", required: false }] }], retryLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "retryLabel", required: false }] }], retry: [{ type: i0.Output, args: ["retry"] }] } });
+
+/** Context/overflow menu class of `CommandItem.danger` items (AB#5570); styled globally in the list-view SCSS. */
+const DANGER_MENU_ITEM_CLASS = 'mm-list-view-menu-item--danger';
+function isOverflowRowActionData(data) {
+    return !!data && data.mmRowAction === true;
+}
+/** Menu text: `menuLabel` ("Delete…"), plus the disabled reason ("Delete… — The adapter is deployed"). */
+function entryMenuText(action) {
+    const text = action.menuLabel || action.label;
+    return isActionDisabled(action) ? `${text} — ${action.disabledReason.trim()}` : text;
+}
+function sameEntries(a, b) {
+    return a.length === b.length && a.every((entry, i) => entry.commandItem === b[i].commandItem && entry.rowAction === b[i].rowAction && sameAction(entry.action, b[i].action));
+}
 class ListViewComponent extends CommandBaseService {
     cronHumanizer = inject(CronHumanizerService);
     _columns = [];
@@ -1915,11 +2754,23 @@ class ListViewComponent extends CommandBaseService {
     // context menu (right click)
     _contextMenuSelectedRow = null;
     _actionMenuItems = [];
+    _rowActions = [];
+    /** Per-row resolved actions; identical results keep their identity (no NG0100, no re-render churn). */
+    rowActionCache = new WeakMap();
+    activatedRoute = inject(ActivatedRoute, { optional: true });
+    routerForActions = inject(Router, { optional: true });
     _contextMenuItems = [];
     _showRowFilter = false;
     /** Indicates if the data source is currently loading data */
     isLoading = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
+    /**
+     * Whether the data source reported "not loading" at least once (AB#3444). {@link isLoading}
+     * follows the data source one macrotask late (asyncScheduler), so the first render would
+     * otherwise show the empty state while the first fetch is already in flight.
+     */
+    loadSettled = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "loadSettled" }] : /* istanbul ignore next */ []));
     /**
      * The component's own width in pixels, kept current via ResizeObserver.
      * `null` until the first measurement (before that, all columns render visible
@@ -1991,6 +2842,25 @@ class ListViewComponent extends CommandBaseService {
         this._contextMenuCommandItems = commandItems;
         this._contextMenuItems = this.buildMenuItems(commandItems);
     }
+    /**
+     * Row actions from the shared action model (AB#5572) — preferred over `actionCommandItems`.
+     * Rendered after the `actionCommandItems` (which keep working through an adapter); together they
+     * get at most {@link maxInlineRowActions} slots, the rest goes into the row's overflow menu.
+     */
+    set rowActions(actions) {
+        this._rowActions = actions ?? [];
+        this.rowActionCache = new WeakMap();
+    }
+    get rowActions() {
+        return this._rowActions;
+    }
+    /**
+     * Row action slots incl. the overflow ("…") button (guideline §2.2: 3). When the actions do not
+     * fit, the last slot opens the overflow menu with the remaining actions and the context menu items.
+     */
+    maxInlineRowActions = MM_ROW_ACTIONS_MAX_INLINE;
+    /** An enabled {@link rowActions} action was triggered (inline or from the overflow menu). */
+    rowAction = new EventEmitter();
     excelExportFileName = 'Export.xlsx';
     pdfExportFileName = 'Export.pdf';
     pageable = {
@@ -2074,9 +2944,22 @@ class ListViewComponent extends CommandBaseService {
      * case the column has to be wide enough for.
      */
     get maxActionButtons() {
-        const actions = this._actionMenuItems.filter(item => !item.separator).length;
-        const contextButton = this._contextMenuItems.length > 0 && this.contextMenuType === 'actionMenu' ? 1 : 0;
-        return actions + contextButton;
+        const candidates = this._actionMenuItems.filter(item => !item.separator).length +
+            this._rowActions.filter(a => !a.overflow).length;
+        const forcedMenu = this.hasContextMenuButton || this._rowActions.some(a => a.overflow);
+        const slots = Math.max(1, Math.floor(this.maxInlineRowActions));
+        if (!forcedMenu && candidates <= slots) {
+            return candidates;
+        }
+        return Math.min(candidates, slots - 1) + 1;
+    }
+    /** The context menu is opened from the row's "…" button (not by right click). */
+    get hasContextMenuButton() {
+        return this._contextMenuCommandItems.length > 0 && this.contextMenuType === 'actionMenu';
+    }
+    /** The list renders an actions column / card actions at all. */
+    get hasRowActions() {
+        return this._actionMenuItems.length > 0 || this._rowActions.length > 0 || this.hasContextMenuButton;
     }
     /**
      * The actions column width actually used.
@@ -2133,6 +3016,58 @@ class ListViewComponent extends CommandBaseService {
      * the window ever resizing.
      */
     collapseCommandsBelow = 900;
+    /**
+     * Tells the list that the host holds filters of its own (quick-view bars,
+     * app-side field filters) that a reset would clear. The toolbar's reset
+     * button only shows while something is filtered, and the list cannot see
+     * those host filters by itself.
+     */
+    hasExternalFilters = false;
+    /**
+     * Empty state of the list (AB#3444): when set, a list without records shows the shared
+     * `mm-empty-state` — one OctoBot `idle` with {@link MmListEmptyState.title} / `text` — instead
+     * of the plain "No records available." line; while a search, row filter or host filter
+     * ({@link hasExternalFilters}) is active it shows OctoBot `look` with the "no results" texts.
+     * Nothing is shown while the list loads (including before the first fetch answered). The figure appears once per list, never in rows.
+     */
+    emptyState = null;
+    /**
+     * Fully custom empty state (wins over {@link emptyState}). Context: `$implicit` / `filtered`
+     * is `true` while a search or filter is active.
+     */
+    emptyTemplate = null;
+    /**
+     * Whether a search, row filter or host filter narrows the rows right now (sorting does not),
+     * i.e. an empty list means "no results" rather than "no records yet".
+     */
+    get isFiltered() {
+        if (this.hasExternalFilters || this.searchValue.trim().length > 0) {
+            return true;
+        }
+        return (this.dataBindingDirective?.currentState?.filter?.filters?.length ?? 0) > 0;
+    }
+    get emptyContext() {
+        const filtered = this.isFiltered;
+        return { $implicit: filtered, filtered };
+    }
+    /**
+     * Whether anything narrows or reorders the default view right now: a row
+     * filter, a column sort, free-text search, or host-side filters announced
+     * through {@link hasExternalFilters}. Paging is deliberately not counted —
+     * the pager already gets back to page 1.
+     */
+    get hasActiveFilters() {
+        if (this.hasExternalFilters || this.searchValue.trim().length > 0) {
+            return true;
+        }
+        const state = this.dataBindingDirective?.currentState;
+        if (!state) {
+            return false;
+        }
+        const hasRowFilter = (state.filter?.filters?.length ?? 0) > 0;
+        const hasSort = (state.sort ?? []).some(descriptor => !!descriptor.dir);
+        return hasRowFilter || hasSort;
+    }
     /** True while the command buttons are collapsed into the overflow menu. */
     get commandsCollapsed() {
         const width = this.containerWidth();
@@ -2142,15 +3077,22 @@ class ListViewComponent extends CommandBaseService {
      * The commands available right now, in toolbar order. The row filter is
      * omitted in card mode: cards have no column headers for a filter row to
      * appear in, and the grid already drops `filterable` there — leaving the
-     * button visible offered to toggle something that cannot exist. Reset stays
-     * available, or a filter set before the switch could never be cleared.
+     * button visible offered to toggle something that cannot exist. Reset shows
+     * only while something is actually filtered, sorted or searched (see
+     * {@link hasActiveFilters}); on the default view there is nothing to reset,
+     * so the button would only be noise. It is independent of card mode, so a
+     * filter set before the switch can still be cleared.
      */
     get toolbarCommands() {
         const commands = [];
         if (this.rowFilterEnabled && !this.isCardMode) {
             commands.push({ id: 'rowFilter', text: this._messages.showRowFilter, svgIcon: this.filterIcon });
         }
-        commands.push({ id: 'excel', text: this._messages.exportToExcel, svgIcon: this.excelSVG }, { id: 'pdf', text: this._messages.exportToPdf, svgIcon: this.pdfSVG }, { id: 'reset', text: this._messages.resetFilters, svgIcon: this.resetFilterIcon }, { id: 'refresh', text: this._messages.refreshData, svgIcon: this.refreshIcon });
+        commands.push({ id: 'excel', text: this._messages.exportToExcel, svgIcon: this.excelSVG }, { id: 'pdf', text: this._messages.exportToPdf, svgIcon: this.pdfSVG });
+        if (this.hasActiveFilters) {
+            commands.push({ id: 'reset', text: this._messages.resetFilters, svgIcon: this.resetFilterIcon });
+        }
+        commands.push({ id: 'refresh', text: this._messages.refreshData, svgIcon: this.refreshIcon });
         return commands;
     }
     /**
@@ -2207,9 +3149,13 @@ class ListViewComponent extends CommandBaseService {
      */
     rowClass;
     defaultRowClass = () => ({});
-    _messages = { ...DEFAULT_LIST_VIEW_MESSAGES };
+    _messages = resolveListViewMessages(undefined);
+    /**
+     * Translated messages. Partial: members that are not supplied (or are `undefined`) keep the
+     * English default from `DEFAULT_LIST_VIEW_MESSAGES`.
+     */
     set messages(value) {
-        this._messages = { ...DEFAULT_LIST_VIEW_MESSAGES, ...value };
+        this._messages = resolveListViewMessages(value);
     }
     get messages() {
         return this._messages;
@@ -2257,6 +3203,9 @@ class ListViewComponent extends CommandBaseService {
         if (this.dataBindingDirective) {
             this.dataBindingDirective.isLoading$.pipe(observeOn(asyncScheduler), takeUntil(this.destroy$)).subscribe(loading => {
                 this.isLoading.set(loading);
+                if (!loading) {
+                    this.loadSettled.set(true);
+                }
                 // Measure the fit-to-height page size only ONCE, when data first
                 // renders (initial default → fitted). After that, page-size changes come
                 // solely from the ResizeObserver (genuine viewport/density changes).
@@ -2425,7 +3374,7 @@ class ListViewComponent extends CommandBaseService {
         if (this.showCheckboxColumn()) {
             fixedWidth += this.checkboxColumnWidth;
         }
-        if (this._actionMenuItems.length > 0 || (this._contextMenuItems.length > 0 && this.contextMenuType == 'actionMenu')) {
+        if (this.hasRowActions) {
             fixedWidth += this.effectiveActionsColumnWidth;
         }
         const autoColumns = visibleColumns.filter(c => c.width === undefined);
@@ -2457,6 +3406,39 @@ class ListViewComponent extends CommandBaseService {
     getToolbarItemDisabled(commandItem) {
         return CommandBaseService.getIsDisabled(commandItem, this._selectedRows);
     }
+    /**
+     * Accessible name of a host toolbar action. A button with a visible text is named by that
+     * text; an icon-only one (no text) gets its tooltip as `aria-label`, because `title` alone is
+     * not reliably announced (action guideline §2.2: icon-only = tooltip + aria-label).
+     */
+    toolbarItemAriaLabel(commandItem) {
+        if (commandItem.text?.trim()) {
+            return null;
+        }
+        return commandItem.tooltip?.trim() ? commandItem.tooltip : null;
+    }
+    buttonAttributesCache = new Map();
+    static NO_BUTTON_ATTRIBUTES = {};
+    /**
+     * `buttonAttributes` for Kendo split / dropdown buttons: same rule as
+     * {@link toolbarItemAriaLabel}, cached per label so change detection sees a stable object.
+     */
+    toolbarItemButtonAttributes(commandItem) {
+        const label = this.toolbarItemAriaLabel(commandItem);
+        return label ? this.ariaLabelAttributes(label) : ListViewComponent.NO_BUTTON_ATTRIBUTES;
+    }
+    /** `buttonAttributes` of the icon-only menu the commands collapse into. */
+    get commandsMenuButtonAttributes() {
+        return this.ariaLabelAttributes(this._messages.commands);
+    }
+    ariaLabelAttributes(label) {
+        let attributes = this.buttonAttributesCache.get(label);
+        if (!attributes) {
+            attributes = { 'aria-label': label };
+            this.buttonAttributesCache.set(label, attributes);
+        }
+        return attributes;
+    }
     getValue(element, column) {
         if (column.field.indexOf('.') === -1) {
             return element[column.field];
@@ -2509,6 +3491,8 @@ class ListViewComponent extends CommandBaseService {
             case 'boolean':
             case 'date':
                 return column.dataType;
+            case 'booleanIcon':
+                return 'boolean';
             case 'numericRange':
             case 'progressBar':
                 return 'numeric';
@@ -2518,6 +3502,49 @@ class ListViewComponent extends CommandBaseService {
                 return 'text';
         }
     }
+    /**
+     * State of a `booleanIcon` cell (AB#5623): `'true'` / `'false'` for booleans (also the strings
+     * "true" / "false"), `null` for an empty or non-boolean value (empty cell).
+     */
+    booleanIconState(element, column) {
+        const value = this.getValue(element, column);
+        if (value === true || value === 'true')
+            return 'true';
+        if (value === false || value === 'false')
+            return 'false';
+        return null;
+    }
+    /** Icon of a `booleanIcon` cell: the column's `booleanIcons`, else check / x; `null` = no icon. */
+    booleanIcon(column, state) {
+        const icons = column.booleanIcons;
+        if (state === 'true') {
+            return icons?.true ?? checkIcon;
+        }
+        return icons?.false === null ? null : icons?.false ?? xIcon;
+    }
+    /** Accessible name of a `booleanIcon` cell: "<column>: Yes|No" from the messages (AB#5623). */
+    booleanIconLabel(column, state) {
+        const value = state === 'true' ? this._messages.booleanYes : this._messages.booleanNo;
+        const name = this.getDisplayName(column) ?? '';
+        return name ? this._messages.booleanIconLabel.replace('{column}', name).replace('{value}', value) : value;
+    }
+    /** Input attributes of a read-only boolean cell, cached per column and name (AB#5621). */
+    booleanCellAttributeCache = new WeakMap();
+    /**
+     * Input attributes of a `boolean` cell's read-only checkbox: its accessible name is the column's
+     * display name (AB#5621), so a screen reader announces "<column>, checked" instead of an unnamed
+     * checkbox.
+     */
+    booleanCellAttributes(column) {
+        const name = this.getDisplayName(column) ?? '';
+        const cached = this.booleanCellAttributeCache.get(column);
+        if (cached && cached.name === name) {
+            return cached.attributes;
+        }
+        const attributes = name ? { 'aria-label': name } : {};
+        this.booleanCellAttributeCache.set(column, { name, attributes });
+        return attributes;
+    }
     /**
      * Gets all status field configurations for a statusIcons column.
      * Returns an array of StatusFieldConfig, whether the column uses single or multi-field configuration.
@@ -2697,10 +3724,21 @@ class ListViewComponent extends CommandBaseService {
         this._selectedRows = [];
     }
     async onContextMenuSelect(_event) {
-        const commandItem = _event.item?.data?.data;
-        if (!commandItem) {
+        const data = _event.item?.data?.data;
+        if (!data) {
+            return;
+        }
+        if (isOverflowRowActionData(data)) {
+            const row = this._actionMenuSelectedRow;
+            if (data.entry.commandItem) {
+                await this.navigateAsync(data.entry.commandItem, row);
+            }
+            else {
+                await this.triggerRowAction(data.entry, row);
+            }
             return;
         }
+        const commandItem = data;
         if (this._actionMenuSelectedRow) {
             await this.navigateAsync(commandItem, this._actionMenuSelectedRow);
         }
@@ -2754,6 +3792,21 @@ class ListViewComponent extends CommandBaseService {
         }
         await this.navigateAsync(commandItem, dataItem);
     }
+    /**
+     * Row field naming a row for assistive technology (row menu "Actions for <name>", action
+     * buttons "<action> <name>"). Falls back to `rtWellKnownName`, then `rtId`. A dotted path
+     * (`contact.displayName`) reads a nested value (AB#5623).
+     */
+    rowLabelField = 'name';
+    /** Human name of a row (`rowLabelField`, `rtWellKnownName`, `rtId`), or '' when unknown. */
+    rowLabel(dataItem) {
+        return resolveListRowLabel(dataItem, this.rowLabelField);
+    }
+    /** Accessible name and tooltip of the row menu button. */
+    rowActionsLabel(dataItem) {
+        const name = this.rowLabel(dataItem);
+        return name ? this.messages.rowActionsFor.replace('{name}', name) : this.messages.rowActions;
+    }
     getMenuItemVisible(menuItem, dataItem) {
         const commandItem = menuItem.data;
         if (commandItem) {
@@ -2772,7 +3825,19 @@ class ListViewComponent extends CommandBaseService {
         this._actionMenuSelectedRow = dataItem;
         // Rebuild context menu items with updated disabled state for the current row.
         // A new array reference is needed so Kendo's kendoMenuHierarchyBinding detects the change.
-        this._contextMenuItems = this.buildContextMenuItemsWithDisabledState(this._contextMenuCommandItems, dataItem);
+        const overflow = this.rowActionsView(dataItem).menu.map((entry) => ({
+            text: entryMenuText(entry.action),
+            svgIcon: entry.action.icon,
+            data: { mmRowAction: true, entry },
+            disabled: isActionDisabled(entry.action),
+            cssClass: entry.action.danger ? DANGER_MENU_ITEM_CLASS : undefined,
+        }));
+        const contextItems = this.contextMenuType === 'actionMenu'
+            ? this.buildContextMenuItemsWithDisabledState(this._contextMenuCommandItems, dataItem)
+            : [];
+        this._contextMenuItems = overflow.length && contextItems.length
+            ? [...overflow, { separator: true }, ...contextItems]
+            : [...overflow, ...contextItems];
         this.gridContextMenu?.show({
             left: this.clampContextMenuX(e.pageX),
             top: e.pageY,
@@ -2795,6 +3860,7 @@ class ListViewComponent extends CommandBaseService {
                     data: commandItem,
                     items: childMenuItems,
                     disabled: CommandBaseService.getIsDisabled(commandItem, dataItem),
+                    cssClass: commandItem.danger ? DANGER_MENU_ITEM_CLASS : undefined,
                 });
             }
         }
@@ -2803,6 +3869,95 @@ class ListViewComponent extends CommandBaseService {
     onContextMenuClosed(_event) {
         this._contextMenuSelectedRow = null;
         this._actionMenuSelectedRow = null;
+        // Back to the static items: `hasContextMenuButton` and the column width rely on them.
+        this._contextMenuItems = this.buildMenuItems(this._contextMenuCommandItems);
+    }
+    /**
+     * Row actions of one row (AB#5572): `actionCommandItems` (adapter) followed by `rowActions`,
+     * split into inline buttons and overflow-menu entries (max {@link maxInlineRowActions} slots,
+     * context menu items and `overflow: true` actions force the "…" button).
+     */
+    rowActionsView(dataItem) {
+        const loadingReason = this.isLoading() ? this._messages.rowActionsLoading : null;
+        const resolved = [];
+        for (const commandItem of this._actionCommandItems) {
+            if (commandItem.type === 'separator' || !CommandBaseService.getIsVisibleSync(commandItem, dataItem)) {
+                continue;
+            }
+            resolved.push({ commandItem, action: this.commandItemAction(commandItem, dataItem, loadingReason) });
+        }
+        for (const rowAction of this._rowActions) {
+            const action = resolveListRowAction(rowAction, dataItem);
+            if (!isActionVisible(action)) {
+                continue;
+            }
+            resolved.push({ rowAction, action: loadingReason && !isActionDisabled(action) ? { ...action, disabledReason: loadingReason } : action });
+        }
+        const candidates = resolved.filter(e => !e.action.overflow);
+        const forced = resolved.filter(e => e.action.overflow);
+        const slots = Math.max(1, Math.floor(this.maxInlineRowActions));
+        const needsMenu = forced.length > 0 || candidates.length > slots || this.hasContextMenuButton;
+        const inlineCount = needsMenu ? Math.max(0, slots - 1) : candidates.length;
+        const view = {
+            inline: candidates.slice(0, inlineCount),
+            menu: [...candidates.slice(inlineCount), ...forced],
+            hasMenu: needsMenu,
+        };
+        return this.stableView(dataItem, view);
+    }
+    /** Accessible name of the row action group: "Actions for <row>". */
+    rowActionsGroupLabel(dataItem) {
+        return this.rowActionsLabel(dataItem);
+    }
+    async onInlineRowAction(entry, dataItem) {
+        if (entry.commandItem) {
+            // A routerLink-rendered action navigated already; CommandItems never use MmAction.link.
+            await this.navigateAsync(entry.commandItem, dataItem);
+            return;
+        }
+        // Inline link actions navigate via their own routerLink.
+        await this.triggerRowAction(entry, dataItem, !!entry.action.link);
+    }
+    async triggerRowAction(entry, row, navigated = false) {
+        const action = entry.action;
+        if (isActionDisabled(action)) {
+            return;
+        }
+        if (!navigated && action.link && this.routerForActions) {
+            const commands = typeof action.link.commands === 'string' ? [action.link.commands] : [...action.link.commands];
+            void this.routerForActions.navigate(commands, { queryParams: action.link.queryParams, relativeTo: this.activatedRoute ?? undefined });
+        }
+        this.rowAction.emit({ id: action.id, action, row });
+        await entry.rowAction?.run?.(row);
+    }
+    /** `CommandItem` → `MmAction` adapter (AB#5572): `isDisabled` → reason, `danger`, icon, text. */
+    commandItemAction(commandItem, dataItem, loadingReason) {
+        let disabledReason = null;
+        if (CommandBaseService.getIsDisabled(commandItem, dataItem)) {
+            const reason = typeof commandItem.disabledReason === 'function'
+                ? commandItem.disabledReason(dataItem)
+                : commandItem.disabledReason;
+            disabledReason = reason && reason.trim() ? reason : this._messages.rowActionUnavailable;
+        }
+        return {
+            id: commandItem.id,
+            label: commandItem.text || commandItem.tooltip || commandItem.id,
+            icon: commandItem.svgIcon,
+            danger: !!commandItem.danger,
+            disabledReason: disabledReason ?? loadingReason,
+        };
+    }
+    stableView(dataItem, view) {
+        if (typeof dataItem !== 'object' || dataItem === null) {
+            return view;
+        }
+        const previous = this.rowActionCache.get(dataItem);
+        if (previous && sameEntries(previous.inline, view.inline) && sameEntries(previous.menu, view.menu)
+            && previous.hasMenu === view.hasMenu) {
+            return previous;
+        }
+        this.rowActionCache.set(dataItem, view);
+        return view;
     }
     async onToolbarCommand(commandItem) {
         if (this._selectedRows.length === 1) {
@@ -2835,7 +3990,8 @@ class ListViewComponent extends CommandBaseService {
                     text: commandItem.text,
                     svgIcon: commandItem.svgIcon,
                     data: commandItem,
-                    items: childMenuItems
+                    items: childMenuItems,
+                    cssClass: commandItem.danger ? DANGER_MENU_ITEM_CLASS : undefined,
                 });
             }
         }
@@ -2856,7 +4012,7 @@ class ListViewComponent extends CommandBaseService {
      */
     commandsIcon = slidersIcon;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ListViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: ListViewComponent, isStandalone: true, selector: "mm-list-view", inputs: { pageSize: "pageSize", skip: "skip", autoPageSize: "autoPageSize", rowIsClickable: "rowIsClickable", showRowCheckBoxes: "showRowCheckBoxes", showRowSelectAllCheckBox: "showRowSelectAllCheckBox", contextMenuType: "contextMenuType", leftToolbarActions: "leftToolbarActions", rightToolbarActions: "rightToolbarActions", actionCommandItems: "actionCommandItems", contextMenuCommandItems: "contextMenuCommandItems", excelExportFileName: "excelExportFileName", pdfExportFileName: "pdfExportFileName", pageable: "pageable", sortable: "sortable", rowFilterEnabled: "rowFilterEnabled", searchTextBoxEnabled: "searchTextBoxEnabled", persistListState: "persistListState", listStateKey: "listStateKey", resizable: "resizable", actionsColumnWidth: "actionsColumnWidth", hideCheckboxesBelow: "hideCheckboxesBelow", cardModeBelow: "cardModeBelow", collapseCommandsBelow: "collapseCommandsBelow", rowClass: "rowClass", messages: "messages", selectable: "selectable", columns: "columns" }, outputs: { rowClicked: "rowClicked", resetFilters: "resetFilters" }, host: { properties: { "class.mm-list-view-narrow": "this.isNarrow", "class.mm-list-view-cards": "this.isCardMode" } }, queries: [{ propertyName: "filtersTemplate", first: true, predicate: ListViewFiltersDirective, descendants: true }], viewQueries: [{ propertyName: "gridComponent", first: true, predicate: GridComponent, descendants: true }, { propertyName: "dataBindingDirective", first: true, predicate: MmListViewDataBindingDirective, descendants: true }, { propertyName: "gridContextMenu", first: true, predicate: ["gridmenu"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Shared cell renderer (AB#4930): used by the regular grid columns AND the\n     card-mode body lines, so both render every dataType identically. -->\n<ng-template #cellContent let-element=\"element\" let-column=\"column\">\n  @if (column.formatter) {\n    {{ getFormattedValue(element, column) }}\n  } @else {\n    @switch (column.dataType) {\n      @case ('boolean') {\n        <kendo-checkbox type=\"checkbox\" [checkedState]=\"$any(getValue(element, column))\" [disabled]=\"true\" />\n      }\n      @case ('iso8601') {\n        {{ $any(getValue(element, column)) | date:column.format }}\n      }\n      @case ('bytes') {\n        {{ $any(getValue(element, column)) | bytesToSize }}\n      }\n      @case ('statusIcons') {\n        <span class=\"status-icons-cell\">\n          @for (fieldConfig of getStatusFields(column); track fieldConfig.field) {\n            @if (getStatusIconMapping(element, fieldConfig); as mapping) {\n              <span\n                class=\"status-icon\"\n                [title]=\"mapping.tooltip\"\n                [style.color]=\"mapping.color\">\n                <kendo-svg-icon [icon]=\"mapping.icon\"></kendo-svg-icon>\n              </span>\n            }\n          }\n        </span>\n      }\n      @case ('cronExpression') {\n        <span class=\"cron-expression-cell\">\n          <code class=\"cron-expression\">{{ getValue(element, column) }}</code>\n          <span class=\"cron-description\">{{ getCronHumanReadable(getValue(element, column)) }}</span>\n        </span>\n      }\n      @case ('numeric') {\n        {{ $any(getValue(element, column)) | number:column.format }}\n      }\n      @case ('progressBar') {\n        <span class=\"progress-bar-cell\">\n          <span class=\"progress-bar-track\">\n            <span class=\"progress-bar-fill\" [style.width.%]=\"getValue(element, column)\"></span>\n          </span>\n          <span class=\"progress-bar-label\">{{ getValue(element, column) }}%</span>\n        </span>\n      }\n      @case ('badge') {\n        @if (getBadgeMapping(element, column); as badge) {\n          <span\n            class=\"badge-cell\"\n            [title]=\"badge.tooltip ?? ''\"\n            [style.color]=\"badge.color\"\n            [style.background]=\"badge.backgroundColor\"\n            [style.borderColor]=\"badge.borderColor ?? badge.backgroundColor\">\n            {{ badge.label ?? getValue(element, column) }}\n          </span>\n        } @else if (!column.badgeHideUnmapped) {\n          <span class=\"badge-cell badge-cell-default\">{{ getValue(element, column) }}</span>\n        }\n      }\n      @case ('component') {\n        @if (column.cellComponent) {\n          <ng-container *ngComponentOutlet=\"column.cellComponent; inputs: getCellInputs(element, column)\" />\n        }\n      }\n      @default {\n        {{ getValue(element, column) }}\n      }\n    }\n  }\n</ng-template>\n\n<!-- Row actions (AB#4930): shared by the actions column and the card header. -->\n<ng-template #rowActions let-dataItem=\"dataItem\">\n  @if (_actionMenuItems.length > 0) {\n    @for (menuItem of _actionMenuItems; track menuItem.text) {\n      @if (!menuItem.separator && getMenuItemVisible(menuItem, dataItem)) {\n        <button kendoButton themeColor=\"primary\" fillMode=\"flat\"\n          [svgIcon]=\"menuItem.svgIcon!\"\n          [title]=\"menuItem.text ?? ''\"\n          [disabled]=\"getMenuItemDisabled(menuItem, dataItem) || isLoading()\"\n          (click)=\"onSelectOptionActionItem($event, dataItem, menuItem)\">\n        </button>\n      }\n    }\n  }\n\n  @if (_contextMenuItems.length > 0 && contextMenuType == 'actionMenu') {\n    <button kendoButton themeColor=\"primary\" fillMode=\"flat\" [svgIcon]=\"moreVerticalIcon\" [disabled]=\"isLoading()\" (click)=\"onContextMenu(dataItem, $event)\"></button>\n  }\n</ng-template>\n\n<kendo-grid\n  mmListViewDataBinding\n  [loading]=\"isLoading()\"\n  [pageSize]=\"effectivePageSize()\" [selectable]=\"selectable\" (pageChange)=\"onPageChange($event)\"\n  [skip]=\"skip\" (selectionChange)=\"onRowSelect($event)\" (cellClick)=\"onCellClick($event)\"\n  [pageable]=\"effectivePageable\"\n  [sortable]=\"sortable\"\n  [filterable]=\"_showRowFilter && !isCardMode\"\n  [resizable]=\"resizable\"\n  [rowClass]=\"rowClass ?? defaultRowClass\"\n>\n  <kendo-grid-messages\n    [pagerItemsPerPage]=\"_messages.pagerItemsPerPage\"\n    [pagerOf]=\"_messages.pagerOf\"\n    [pagerItems]=\"_messages.pagerItems\"\n    [pagerPage]=\"_messages.pagerPage\"\n    [pagerFirstPage]=\"_messages.pagerFirstPage\"\n    [pagerLastPage]=\"_messages.pagerLastPage\"\n    [pagerPreviousPage]=\"_messages.pagerPreviousPage\"\n    [pagerNextPage]=\"_messages.pagerNextPage\"\n    [noRecords]=\"_messages.noRecords\"\n  ></kendo-grid-messages>\n  <ng-template kendoGridToolbarTemplate>\n\n    @for (commandItem of leftToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Host scope/filter controls (view switches and the like). They steer the\n         table, so they sit in the table's own band instead of a second strip\n         stacked above the grid. -->\n    @if (filtersTemplate) {\n      <!-- A rule between the host's actions and its filters: both sit on the\n           left of the same band, but one acts on records and the other changes\n           what the list shows. Only drawn when actions precede them. -->\n      @if (leftToolbarActions.length > 0) {\n        <kendo-separator class=\"mm-toolbar-filters-separator\"></kendo-separator>\n      }\n      <div class=\"mm-toolbar-filters\">\n        <ng-container [ngTemplateOutlet]=\"filtersTemplate.templateRef\"></ng-container>\n      </div>\n    }\n\n    <kendo-grid-spacer></kendo-grid-spacer>\n    @if (searchTextBoxEnabled) {\n      <input\n        class=\"k-textbox k-input k-input-md k-rounded-md mm-search-input\"\n        [placeholder]=\"_messages.searchPlaceholder\"\n        [value]=\"searchValue\"\n        (input)=\"onFilter($any($event.target).value || null)\"\n      />\n    }\n\n    @for (commandItem of rightToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Commands: laid out while there is room, collapsed into one menu once\n         the list gets narrow. Same behaviour in every host app \u2014 a list this\n         wide has space for five buttons, and a list this narrow does not. -->\n    @if (commandsCollapsed) {\n      <kendo-dropdownbutton class=\"mm-toolbar-commands\" [data]=\"toolbarCommands\" textField=\"text\" [svgIcon]=\"commandsIcon\"\n                            fillMode=\"flat\" themeColor=\"primary\" [disabled]=\"isLoading()\"\n                            [title]=\"_messages.commands\"\n                            (itemClick)=\"onCommand($any($event).id)\"></kendo-dropdownbutton>\n    } @else {\n      @for (command of toolbarCommands; track command.id) {\n        @switch (command.id) {\n          @case ('excel') {\n            <button kendoTooltip kendoGridExcelCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"></button>\n          }\n          @case ('pdf') {\n            <button kendoTooltip kendoGridPDFCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"></button>\n          }\n          @default {\n            <button kendoTooltip kendoButton themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" (click)=\"onCommand(command.id)\"\n                    [disabled]=\"isLoading()\" [title]=\"command.text\"></button>\n          }\n        }\n      }\n    }\n  </ng-template>\n\n  @if (showCheckboxColumn()) {\n    <kendo-grid-checkbox-column [showSelectAll]=\"showRowSelectAllCheckBox\"\n                                [width]=\"effectiveCheckboxColumnWidth\"></kendo-grid-checkbox-column>\n  }\n\n  @if (!isCardMode) {\n  @for (column of columns; track column.field) {\n    <kendo-grid-column [field]=\"column.field\"\n                       [filter]=\"getFilterType(column)\" format=\"{{column.format}}\"\n                       [width]=\"$any(getEffectiveWidth(column))\"\n                       [minResizableWidth]=\"column.minWidth ?? 10\"\n                       [hidden]=\"isColumnHidden(column)\"\n                       [sortable]=\"column.sortable !== false\"\n                       [filterable]=\"column.filterable !== false\"\n                       [class]=\"alignClass(column)\"\n                       [headerClass]=\"alignClass(column)\"\n                       [title]=\"getDisplayName(column) | pascalCase\">\n      <ng-template kendoGridFilterCellTemplate let-filter let-gridColumn=\"column\">\n        @if (hasFilterOptions(column)) {\n          <kendo-dropdownlist\n            class=\"status-filter-dropdown\"\n            [data]=\"column.filterOptions!\"\n            textField=\"text\"\n            valueField=\"value\"\n            [valuePrimitive]=\"true\"\n            [value]=\"getSelectedFilterValue(column)\"\n            [defaultItem]=\"{ text: '', value: null }\"\n            [popupSettings]=\"{ width: 'auto' }\"\n            (valueChange)=\"onDropdownFilter($event, column)\"\n          >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span class=\"filter-status-item\">\n                  <span [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                </span>\n              } @else if (dataItem?.text) {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span style=\"display: inline-flex; align-items: center; gap: 8px;\">\n                  <span [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                  <span>{{ dataItem.text }}</span>\n                </span>\n              } @else {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n          </kendo-dropdownlist>\n        } @else if (column.dataType === 'numericRange') {\n          <span class=\"numeric-range-filter\">\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'gte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'gte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"From\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n            <span class=\"range-separator\">\u2013</span>\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'lte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'lte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"To\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n          </span>\n        } @else {\n          @switch (getFilterType(column)) {\n            @case ('numeric') {\n              <kendo-grid-numeric-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                              [spinners]=\"!isCompactFilter(column)\" [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-numeric-filter-cell>\n            }\n            @case ('boolean') {\n              <kendo-grid-boolean-filter-cell [column]=\"gridColumn\" [filter]=\"filter\"></kendo-grid-boolean-filter-cell>\n            }\n            @case ('date') {\n              <kendo-grid-date-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                           [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-date-filter-cell>\n            }\n            @default {\n              <kendo-grid-string-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"false\"></kendo-grid-string-filter-cell>\n            }\n          }\n        }\n      </ng-template>\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <span\n          [class.mm-cell-truncate]=\"column.truncate\"\n          [attr.title]=\"column.truncate ? getCellTitle(dataItem, column) : null\">\n          <ng-container\n            [ngTemplateOutlet]=\"cellContent\"\n            [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n          ></ng-container>\n        </span>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  @if (_actionMenuItems.length > 0 || (_contextMenuItems.length > 0 &&  contextMenuType == 'actionMenu')) {\n    <kendo-grid-command-column [title]=\"_messages.actionsColumnTitle\" [width]=\"effectiveActionsColumnWidth\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <ng-container\n          [ngTemplateOutlet]=\"rowActions\"\n          [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n        ></ng-container>\n      </ng-template>\n    </kendo-grid-command-column>\n  }\n  } @else {\n    <!-- Card mode (AB#4930): one full-width column renders the whole row as a\n         stacked card \u2014 title from the first column, labeled lines for the\n         rest (empty values skipped), row actions in the card header. -->\n    <kendo-grid-column [sortable]=\"false\" [filterable]=\"false\" title=\"\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <div class=\"mm-card\">\n          <div class=\"mm-card-header\">\n            @if (cardTitleColumn; as titleColumn) {\n              <span class=\"mm-card-title\">\n                <ng-container\n                  [ngTemplateOutlet]=\"cellContent\"\n                  [ngTemplateOutletContext]=\"{ element: dataItem, column: titleColumn }\"\n                ></ng-container>\n              </span>\n            }\n            <span class=\"mm-card-actions\">\n              <ng-container\n                [ngTemplateOutlet]=\"rowActions\"\n                [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n              ></ng-container>\n            </span>\n          </div>\n          <div class=\"mm-card-fields\">\n            @for (column of cardBodyColumns; track column.field) {\n              @if (hasCardValue(dataItem, column)) {\n                <div class=\"mm-card-field\">\n                  <span class=\"mm-card-label\">{{ getDisplayName(column) | pascalCase }}</span>\n                  <span class=\"mm-card-value\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n                    ></ng-container>\n                  </span>\n                </div>\n              }\n            }\n          </div>\n        </div>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  <kendo-grid-excel fileName=\"{{excelExportFileName}}\">\n    @for (column of columns; track column.field) {\n      <kendo-excelexport-column [field]=\"column.field\"\n                                [title]=\"getDisplayName(column) | pascalCase\">\n      </kendo-excelexport-column>\n    }\n  </kendo-grid-excel>\n\n  <kendo-grid-pdf fileName=\"{{pdfExportFileName}}\" paperSize=\"A4\" [repeatHeaders]=\"true\"\n                  [landscape]=\"true\">\n    @for (column of columns; track column.field) {\n      <kendo-grid-column [field]=\"column.field\"\n                         [filter]=\"getFilterType(column)\"\n                         [title]=\"getDisplayName(column) | pascalCase\"></kendo-grid-column>\n    }\n    <kendo-grid-pdf-margin top=\"1.5cm\" left=\"1cm\" right=\"1cm\" bottom=\"1.5cm\"></kendo-grid-pdf-margin>\n    <ng-template kendoGridPDFTemplate let-pageNum=\"pageNum\" let-totalPages=\"totalPages\">\n      <div class=\"page-template\">\n        <div class=\"footer\" style=\"position: absolute; bottom: 0; width: 100%; text-align: center; font-size: 9px; color: #666;\">\n          {{ getPdfPageText(pageNum, totalPages) }}\n        </div>\n      </div>\n    </ng-template>\n  </kendo-grid-pdf>\n</kendo-grid>\n\n<kendo-contextmenu\n  #gridmenu\n  [kendoMenuHierarchyBinding]=\"_contextMenuItems\"\n  [textField]=\"['text']\"\n  childrenField=\"items\"\n  svgIconField=\"svgIcon\"\n  separatorField=\"separator\"\n  disabledField=\"disabled\"\n  (popupClose)=\"onContextMenuClosed($event)\"\n  (select)=\"onContextMenuSelect($event)\"\n></kendo-contextmenu>\n", styles: [":host{display:flex;flex-direction:column;min-height:0}:host>kendo-grid{flex:1;min-height:0}.mm-search-input{width:165px}:host ::ng-deep .k-grid th:has(input[type=checkbox]),:host ::ng-deep .k-grid td:has(>kendo-checkbox){text-overflow:clip}:host ::ng-deep .k-command-cell{white-space:nowrap;overflow:hidden;vertical-align:middle}:host ::ng-deep .k-command-cell .k-button{display:inline-flex;vertical-align:middle;margin:0}:host ::ng-deep .k-command-cell .k-button+.k-button{margin-left:4px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar{flex-wrap:wrap;row-gap:6px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-search-input{width:100%;order:10}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar kendo-grid-spacer{display:none}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-toolbar-commands{margin-left:auto}:host ::ng-deep .k-grid td.mm-col-align-right{text-align:right;font-variant-numeric:tabular-nums}:host ::ng-deep .k-grid td.mm-col-align-center{text-align:center}:host ::ng-deep .k-grid th.mm-col-align-right .k-cell-inner>.k-link{justify-content:flex-end}:host ::ng-deep .k-grid th.mm-col-align-center .k-cell-inner>.k-link{justify-content:center}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-wrapper{gap:2px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-datepicker>.k-input-button{display:none}:host ::ng-deep .k-filter-row .mm-filter-compact .k-input-inner{padding-left:4px;padding-right:4px;font-size:12px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator{width:26px;min-width:0}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator .k-input-button{padding:2px}.mm-cell-truncate{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-icons-cell{display:inline-flex;align-items:center;gap:8px}.status-icons-cell .status-icon{display:inline-flex;align-items:center;justify-content:center;cursor:default}.status-icons-cell .status-icon kendo-svg-icon{width:18px;height:18px}:host ::ng-deep .filter-status-item{display:inline-flex;align-items:center;gap:10px}:host ::ng-deep .status-filter-dropdown .k-input-value-text{font-size:0}:host ::ng-deep .status-filter-dropdown .k-input-value-text .filter-status-item,:host ::ng-deep .status-filter-dropdown .k-input-value-text>span{font-size:14px}.numeric-range-filter{display:flex;align-items:center;gap:4px}.numeric-range-filter kendo-numerictextbox{flex:1;min-width:0}.numeric-range-filter .range-separator{flex-shrink:0;opacity:.6}.cron-expression-cell{display:flex;flex-direction:column;gap:2px}.cron-expression-cell .cron-expression{font-family:Roboto Mono,Consolas,monospace;font-size:.85em;background:var(--mm-cron-code-bg, #eeeeee);color:var(--mm-cron-code-text, #333333);padding:2px 6px;border-radius:3px}.cron-expression-cell .cron-description{font-size:.8em;color:var(--mm-cron-text-secondary, #666666)}.badge-cell{display:inline-block;padding:2px 10px;font-size:.75rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase;border-radius:12px;border:1px solid var(--mm-badge-default-border, transparent);background:var(--mm-badge-default-bg, rgba(127, 127, 127, .15));color:var(--mm-badge-default-color, inherit);white-space:nowrap;line-height:1.4}.badge-cell-default{opacity:.7;font-style:italic}.progress-bar-cell{display:inline-flex;align-items:center;gap:8px;width:100%}.progress-bar-cell .progress-bar-track{flex:1;height:8px;background:var(--mm-progress-track-bg, rgba(255, 255, 255, .1));border-radius:4px;overflow:hidden}.progress-bar-cell .progress-bar-fill{display:block;height:100%;background:var(--mm-progress-fill-color, #10b981);border-radius:4px;transition:width .3s ease}.progress-bar-cell .progress-bar-label{min-width:40px;text-align:right;font-size:.85em}:host-context(.k-pdf-export) .k-grid,:host-context(.k-pdf-export) .k-grid-header,:host-context(.k-pdf-export) .k-grid-content,:host-context(.k-pdf-export) .k-grid-header-wrap,:host-context(.k-pdf-export) .k-grid-content-locked,:host-context(.k-pdf-export) .k-grid-header-locked{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border-color:#000!important}:host-context(.k-pdf-export) .k-grid{border:1px solid #000!important;font-family:Arial,sans-serif!important;font-size:10px!important}:host-context(.k-pdf-export) .k-grid-header th,:host-context(.k-pdf-export) .k-header,:host-context(.k-pdf-export) .k-grid th{background:#f0f0f0!important;background-color:#f0f0f0!important;background-image:none!important;color:#000!important;border:1px solid #000!important;font-weight:700!important;padding:6px 8px!important;text-transform:none!important;letter-spacing:normal!important}:host-context(.k-pdf-export) .k-grid td,:host-context(.k-pdf-export) .k-grid-content td,:host-context(.k-pdf-export) .k-master-row td{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border:1px solid #000!important;padding:4px 8px!important}:host-context(.k-pdf-export) .k-grid tr,:host-context(.k-pdf-export) .k-master-row,:host-context(.k-pdf-export) .k-alt{background:#fff!important;background-color:#fff!important;background-image:none!important}:host-context(.k-pdf-export) .k-grid tr:hover,:host-context(.k-pdf-export) .k-grid tr.k-selected,:host-context(.k-pdf-export) .k-grid td:hover{background:#fff!important;background-color:#fff!important}:host-context(.k-pdf-export) .k-grid-toolbar,:host-context(.k-pdf-export) .k-pager,:host-context(.k-pdf-export) .k-grid-pager,:host-context(.k-pdf-export) .k-command-cell,:host-context(.k-pdf-export) .k-checkbox-column,:host-context(.k-pdf-export) kendo-grid-checkbox-column,:host-context(.k-pdf-export) .status-icons-cell,:host-context(.k-pdf-export) .status-icon,:host-context(.k-pdf-export) kendo-svg-icon{display:none!important}:host-context(.k-pdf-export) .badge-cell{background:transparent!important;border:none!important;color:inherit!important;padding:0!important;border-radius:0!important;text-transform:none!important;font-weight:inherit!important;letter-spacing:0!important;font-size:inherit!important}:host(.mm-list-view-cards) ::ng-deep .k-grid-header{display:none}:host(.mm-list-view-cards) ::ng-deep .k-grid td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td{border:none;background:transparent;padding:4px 2px;white-space:normal}:host(.mm-list-view-cards) ::ng-deep .k-grid td:has(>kendo-checkbox),:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td:has(>kendo-checkbox){padding-left:2px;padding-right:0}:host(.mm-list-view-cards) ::ng-deep .k-grid colgroup>col:first-child:not(:only-child){width:32px!important}:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row:hover,:host(.mm-list-view-cards) ::ng-deep .k-grid tr:hover{background:transparent}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected .mm-card,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected .mm-card{border-color:var(--kendo-color-primary, #ff6358)}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected>td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected>.k-table-td{background:transparent}.mm-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--kendo-color-border, #dee2e6);border-radius:8px;padding:10px 12px}.mm-card-header{display:flex;align-items:center;gap:8px}.mm-card-title{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.mm-card-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.mm-card-fields{display:flex;flex-direction:column;gap:3px}.mm-card-field{display:flex;align-items:baseline;gap:8px;font-size:.9em}.mm-card-label{flex:0 0 38%;max-width:160px;color:var(--kendo-color-subtle, #666666);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-card-value{flex:1;min-width:0;overflow-wrap:anywhere}::ng-deep .k-grid-toolbar .mm-toolbar-filters{display:flex;align-items:center;gap:12px;flex-wrap:wrap}::ng-deep .k-grid-toolbar .mm-toolbar-filters-separator{align-self:center;height:22px;margin:0 4px;border-left:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .16));border-top:none;width:0}\n"], dependencies: [{ kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "adaptiveMode", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "gridResizable", "rowReorderable", "navigable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "showInactiveTools", "isDetailExpanded", "isGroupExpanded", "dataLayoutMode", "pinnable", "pinnedTopRows", "pinnedBottomRows", "isRowPinnable"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "rowPinChange", "dataStateChange", "gridStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "csvExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "directive", type: MmListViewDataBindingDirective, selector: "[mmListViewDataBinding]" }, { kind: "component", type: ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterVariant", "filterable", "editable"] }, { kind: "directive", type: ToolbarTemplateDirective, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { kind: "component", type: GridSpacerComponent, selector: "kendo-grid-spacer", inputs: ["width"] }, { kind: "ngmodule", type: ExcelModule }, { kind: "component", type: i1$1.ExcelComponent, selector: "kendo-grid-excel", inputs: ["fileName", "filterable", "creator", "date", "forceProxy", "proxyURL", "fetchData", "paddingCellOptions", "headerPaddingCellOptions", "collapsible"], outputs: ["fileCreated"] }, { kind: "component", type: i1$1.ExcelCommandDirective, selector: "[kendoGridExcelCommand]" }, { kind: "component", type: i2.ColumnComponent, selector: "kendo-excelexport-column", inputs: ["field", "cellOptions", "groupHeaderCellOptions", "groupFooterCellOptions", "footerCellOptions"] }, { kind: "ngmodule", type: PDFModule }, { kind: "component", type: i1$1.PDFComponent, selector: "kendo-grid-pdf", inputs: ["allPages", "delay"] }, { kind: "component", type: i1$1.PDFMarginComponent, selector: "kendo-grid-pdf-margin" }, { kind: "component", type: i1$1.PDFCommandDirective, selector: "[kendoGridPDFCommand]" }, { kind: "directive", type: i1$1.PDFTemplateDirective, selector: "[kendoGridPDFTemplate]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "component", type: SplitButtonComponent, selector: "kendo-splitbutton", inputs: ["text", "icon", "svgIcon", "iconClass", "type", "imageUrl", "size", "rounded", "fillMode", "themeColor", "disabled", "popupSettings", "tabIndex", "textField", "data", "arrowButtonClass", "arrowButtonIcon", "arrowButtonSvgIcon", "buttonAttributes"], outputs: ["buttonClick", "itemClick", "focus", "blur", "open", "close"], exportAs: ["kendoSplitButton"] }, { kind: "component", type: CommandColumnComponent, selector: "kendo-grid-command-column" }, { kind: "directive", type: CellTemplateDirective, selector: "[kendoGridCellTemplate]" }, { kind: "component", type: ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { kind: "directive", type: HierarchyBindingDirective, selector: "[kendoMenuHierarchyBinding]", inputs: ["kendoMenuHierarchyBinding", "textField", "urlField", "iconField", "svgIconField", "disabledField", "cssClassField", "cssStyleField", "separatorField", "childrenField"], exportAs: ["kendoMenuHierarchyBinding"] }, { kind: "component", type: CheckboxColumnComponent, selector: "kendo-grid-checkbox-column", inputs: ["showSelectAll", "showDisabledCheckbox"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "ngmodule", type: SVGIconModule }, { kind: "component", type: i3.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }, { kind: "component", type: CustomMessagesComponent, selector: "kendo-grid-messages" }, { kind: "directive", type: FilterCellTemplateDirective, selector: "[kendoGridFilterCellTemplate]" }, { kind: "component", type: StringFilterCellComponent, selector: "kendo-grid-string-filter-cell", inputs: ["filterDelay", "showOperators", "placeholder"] }, { kind: "component", type: NumericFilterCellComponent, selector: "kendo-grid-numeric-filter-cell", inputs: ["filterDelay", "showOperators", "placeholder"] }, { kind: "component", type: BooleanFilterCellComponent, selector: "kendo-grid-boolean-filter-cell" }, { kind: "component", type: DateFilterCellComponent, selector: "kendo-grid-date-filter-cell", inputs: ["showOperators"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: ValueTemplateDirective, selector: "[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]" }, { kind: "directive", type: ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "component", type: NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: PascalCasePipe, name: "pascalCase" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: BytesToSizePipe, name: "bytesToSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: ListViewComponent, isStandalone: true, selector: "mm-list-view", inputs: { pageSize: "pageSize", skip: "skip", autoPageSize: "autoPageSize", rowIsClickable: "rowIsClickable", showRowCheckBoxes: "showRowCheckBoxes", showRowSelectAllCheckBox: "showRowSelectAllCheckBox", contextMenuType: "contextMenuType", leftToolbarActions: "leftToolbarActions", rightToolbarActions: "rightToolbarActions", actionCommandItems: "actionCommandItems", contextMenuCommandItems: "contextMenuCommandItems", rowActions: "rowActions", maxInlineRowActions: "maxInlineRowActions", excelExportFileName: "excelExportFileName", pdfExportFileName: "pdfExportFileName", pageable: "pageable", sortable: "sortable", rowFilterEnabled: "rowFilterEnabled", searchTextBoxEnabled: "searchTextBoxEnabled", persistListState: "persistListState", listStateKey: "listStateKey", resizable: "resizable", actionsColumnWidth: "actionsColumnWidth", hideCheckboxesBelow: "hideCheckboxesBelow", cardModeBelow: "cardModeBelow", collapseCommandsBelow: "collapseCommandsBelow", hasExternalFilters: "hasExternalFilters", emptyState: "emptyState", emptyTemplate: "emptyTemplate", rowClass: "rowClass", messages: "messages", selectable: "selectable", columns: "columns", rowLabelField: "rowLabelField" }, outputs: { rowClicked: "rowClicked", rowAction: "rowAction", resetFilters: "resetFilters" }, host: { properties: { "class.mm-list-view-narrow": "this.isNarrow", "class.mm-list-view-cards": "this.isCardMode" } }, queries: [{ propertyName: "filtersTemplate", first: true, predicate: ListViewFiltersDirective, descendants: true }], viewQueries: [{ propertyName: "gridComponent", first: true, predicate: GridComponent, descendants: true }, { propertyName: "dataBindingDirective", first: true, predicate: MmListViewDataBindingDirective, descendants: true }, { propertyName: "gridContextMenu", first: true, predicate: ["gridmenu"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Shared cell renderer (AB#4930): used by the regular grid columns AND the\n     card-mode body lines, so both render every dataType identically. -->\n<ng-template #cellContent let-element=\"element\" let-column=\"column\">\n  @if (column.formatter) {\n    {{ getFormattedValue(element, column) }}\n  } @else {\n    @switch (column.dataType) {\n      @case ('boolean') {\n        <!-- Read-only marker: named after its column so a screen reader says what is checked (AB#5621). -->\n        <kendo-checkbox type=\"checkbox\" [checkedState]=\"$any(getValue(element, column))\" [disabled]=\"true\"\n                        [inputAttributes]=\"booleanCellAttributes(column)\" />\n      }\n      @case ('booleanIcon') {\n        <!-- Boolean as icon (AB#5623): named \"<column>: Yes|No\" like the status icons (G13). -->\n        @if (booleanIconState(element, column); as state) {\n          @if (booleanIcon(column, state); as icon) {\n            <span\n              class=\"boolean-icon\"\n              [class.boolean-icon--true]=\"state === 'true'\"\n              [class.boolean-icon--false]=\"state === 'false'\"\n              role=\"img\"\n              [title]=\"booleanIconLabel(column, state)\"\n              [attr.aria-label]=\"booleanIconLabel(column, state)\"\n              [style.color]=\"state === 'true' ? column.booleanIcons?.trueColor : column.booleanIcons?.falseColor\">\n              <kendo-svg-icon [icon]=\"icon\"></kendo-svg-icon>\n            </span>\n          }\n        }\n      }\n      @case ('iso8601') {\n        {{ $any(getValue(element, column)) | date:column.format }}\n      }\n      @case ('bytes') {\n        {{ $any(getValue(element, column)) | bytesToSize }}\n      }\n      @case ('statusIcons') {\n        <span class=\"status-icons-cell\">\n          @for (fieldConfig of getStatusFields(column); track fieldConfig.field) {\n            @if (getStatusIconMapping(element, fieldConfig); as mapping) {\n              <!-- Icon-only status: the mapping's tooltip is also its accessible name (AB#5621). -->\n              <span\n                class=\"status-icon\"\n                role=\"img\"\n                [title]=\"mapping.tooltip\"\n                [attr.aria-label]=\"mapping.tooltip || null\"\n                [style.color]=\"mapping.color\">\n                <kendo-svg-icon [icon]=\"mapping.icon\"></kendo-svg-icon>\n              </span>\n            }\n          }\n        </span>\n      }\n      @case ('cronExpression') {\n        <span class=\"cron-expression-cell\">\n          <code class=\"cron-expression\">{{ getValue(element, column) }}</code>\n          <span class=\"cron-description\">{{ getCronHumanReadable(getValue(element, column)) }}</span>\n        </span>\n      }\n      @case ('numeric') {\n        {{ $any(getValue(element, column)) | number:column.format }}\n      }\n      @case ('progressBar') {\n        <span class=\"progress-bar-cell\">\n          <span class=\"progress-bar-track\">\n            <span class=\"progress-bar-fill\" [style.width.%]=\"getValue(element, column)\"></span>\n          </span>\n          <span class=\"progress-bar-label\">{{ getValue(element, column) }}%</span>\n        </span>\n      }\n      @case ('badge') {\n        @if (getBadgeMapping(element, column); as badge) {\n          <span\n            class=\"badge-cell\"\n            [title]=\"badge.tooltip ?? ''\"\n            [style.color]=\"badge.color\"\n            [style.background]=\"badge.backgroundColor\"\n            [style.borderColor]=\"badge.borderColor ?? badge.backgroundColor\">\n            {{ badge.label ?? getValue(element, column) }}\n          </span>\n        } @else if (!column.badgeHideUnmapped) {\n          <span class=\"badge-cell badge-cell-default\">{{ getValue(element, column) }}</span>\n        }\n      }\n      @case ('component') {\n        @if (column.cellComponent) {\n          <ng-container *ngComponentOutlet=\"column.cellComponent; inputs: getCellInputs(element, column)\" />\n        }\n      }\n      @default {\n        {{ getValue(element, column) }}\n      }\n    }\n  }\n</ng-template>\n\n<!-- Row actions (AB#4930, AB#5572): shared by the actions column and the card header. One MmAction\n     per action (CommandItems via adapter): neutral icon buttons, danger colour only for destructive\n     actions, max `maxInlineRowActions` slots, the rest (and the context menu) behind \"\u2026\". Disabled\n     actions stay focusable and announce their reason (mm-action-button). -->\n<ng-template #rowActions let-dataItem=\"dataItem\">\n  @let view = rowActionsView(dataItem);\n  @if (view.inline.length > 0 || view.hasMenu) {\n    <span class=\"mm-list-view-row-actions\" role=\"group\" [attr.aria-label]=\"rowActionsGroupLabel(dataItem)\">\n      @for (entry of view.inline; track entry.action.id) {\n        <!-- Clicks never reach the grid (no row selection / row navigation from an action). -->\n        <mm-action-button [action]=\"entry.action\" [targetLabel]=\"rowLabel(dataItem)\" context=\"row\" display=\"icon\"\n                          (click)=\"$event.stopPropagation()\"\n                          (triggered)=\"onInlineRowAction(entry, dataItem)\" />\n      }\n      @if (view.hasMenu) {\n        <button kendoButton themeColor=\"base\" fillMode=\"flat\" size=\"small\" class=\"mm-list-view-row-actions__more\"\n          [svgIcon]=\"moreVerticalIcon\" data-action=\"more\"\n          [title]=\"rowActionsLabel(dataItem)\" [attr.aria-label]=\"rowActionsLabel(dataItem)\" aria-haspopup=\"menu\"\n          [disabled]=\"isLoading()\" (click)=\"$event.stopPropagation(); onContextMenu(dataItem, $event)\"></button>\n      }\n    </span>\n  }\n</ng-template>\n\n<kendo-grid\n  mmListViewDataBinding\n  [loading]=\"isLoading()\"\n  [pageSize]=\"effectivePageSize()\" [selectable]=\"selectable\" (pageChange)=\"onPageChange($event)\"\n  [skip]=\"skip\" (selectionChange)=\"onRowSelect($event)\" (cellClick)=\"onCellClick($event)\"\n  [pageable]=\"effectivePageable\"\n  [sortable]=\"sortable\"\n  [filterable]=\"_showRowFilter && !isCardMode\"\n  [resizable]=\"resizable\"\n  [rowClass]=\"rowClass ?? defaultRowClass\"\n>\n  <kendo-grid-messages\n    [pagerItemsPerPage]=\"_messages.pagerItemsPerPage\"\n    [pagerOf]=\"_messages.pagerOf\"\n    [pagerItems]=\"_messages.pagerItems\"\n    [pagerPage]=\"_messages.pagerPage\"\n    [pagerFirstPage]=\"_messages.pagerFirstPage\"\n    [pagerLastPage]=\"_messages.pagerLastPage\"\n    [pagerPreviousPage]=\"_messages.pagerPreviousPage\"\n    [pagerNextPage]=\"_messages.pagerNextPage\"\n    [noRecords]=\"_messages.noRecords\"\n  ></kendo-grid-messages>\n  <!-- Empty state (AB#3444): one block per list, never per row. -->\n  <ng-template kendoGridNoRecordsTemplate>\n    @if (emptyTemplate) {\n      <ng-container *ngTemplateOutlet=\"emptyTemplate; context: emptyContext\"></ng-container>\n    } @else if (emptyState) {\n      @if (loadSettled() && !isLoading()) {\n        @if (isFiltered) {\n          <mm-empty-state class=\"mm-list-view-empty\" variant=\"no-results\"\n                          [heading]=\"emptyState.filteredTitle || _messages.noResultsTitle\"\n                          [text]=\"emptyState.filteredText || _messages.noResultsText\"></mm-empty-state>\n        } @else {\n          <mm-empty-state class=\"mm-list-view-empty\" variant=\"empty\"\n                          [heading]=\"emptyState.title\" [text]=\"emptyState.text\"></mm-empty-state>\n        }\n      }\n    } @else {\n      {{ _messages.noRecords }}\n    }\n  </ng-template>\n  <ng-template kendoGridToolbarTemplate>\n\n    @for (commandItem of leftToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Host scope/filter controls (view switches and the like). They steer the\n         table, so they sit in the table's own band instead of a second strip\n         stacked above the grid. -->\n    @if (filtersTemplate) {\n      <!-- A rule between the host's actions and its filters: both sit on the\n           left of the same band, but one acts on records and the other changes\n           what the list shows. Only drawn when actions precede them. -->\n      @if (leftToolbarActions.length > 0) {\n        <kendo-separator class=\"mm-toolbar-filters-separator\"></kendo-separator>\n      }\n      <div class=\"mm-toolbar-filters\">\n        <ng-container [ngTemplateOutlet]=\"filtersTemplate.templateRef\"></ng-container>\n      </div>\n    }\n\n    <kendo-grid-spacer></kendo-grid-spacer>\n    @if (searchTextBoxEnabled) {\n      <input\n        class=\"k-textbox k-input k-input-md k-rounded-md mm-search-input\"\n        [placeholder]=\"_messages.searchPlaceholder\"\n        [value]=\"searchValue\"\n        (input)=\"onFilter($any($event.target).value || null)\"\n      />\n    }\n\n    @for (commandItem of rightToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Commands: laid out while there is room, collapsed into one menu once\n         the list gets narrow. Same behaviour in every host app \u2014 a list this\n         wide has space for five buttons, and a list this narrow does not. -->\n    @if (commandsCollapsed) {\n      <kendo-dropdownbutton class=\"mm-toolbar-commands\" [data]=\"toolbarCommands\" textField=\"text\" [svgIcon]=\"commandsIcon\"\n                            fillMode=\"flat\" themeColor=\"primary\" [disabled]=\"isLoading()\"\n                            [title]=\"_messages.commands\"\n                            [buttonAttributes]=\"commandsMenuButtonAttributes\"\n                            (itemClick)=\"onCommand($any($event).id)\"></kendo-dropdownbutton>\n    } @else {\n      @for (command of toolbarCommands; track command.id) {\n        @switch (command.id) {\n          @case ('excel') {\n            <button kendoTooltip kendoGridExcelCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"\n                    [attr.aria-label]=\"command.text\" [attr.data-command]=\"command.id\"></button>\n          }\n          @case ('pdf') {\n            <button kendoTooltip kendoGridPDFCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"\n                    [attr.aria-label]=\"command.text\" [attr.data-command]=\"command.id\"></button>\n          }\n          @default {\n            <!-- The row filter is a toggle: its on state is shown (k-selected) and announced. -->\n            <button kendoTooltip kendoButton themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" (click)=\"onCommand(command.id)\"\n                    [class.k-selected]=\"command.id === 'rowFilter' && _showRowFilter\"\n                    [attr.aria-pressed]=\"command.id === 'rowFilter' ? _showRowFilter : null\"\n                    [attr.data-command]=\"command.id\"\n                    [disabled]=\"isLoading()\" [title]=\"command.text\" [attr.aria-label]=\"command.text\"></button>\n          }\n        }\n      }\n    }\n  </ng-template>\n\n  @if (showCheckboxColumn()) {\n    <kendo-grid-checkbox-column [showSelectAll]=\"showRowSelectAllCheckBox\"\n                                [width]=\"effectiveCheckboxColumnWidth\"></kendo-grid-checkbox-column>\n  }\n\n  @if (!isCardMode) {\n  @for (column of columns; track column.field) {\n    <kendo-grid-column [field]=\"column.field\"\n                       [filter]=\"getFilterType(column)\" format=\"{{column.format}}\"\n                       [width]=\"$any(getEffectiveWidth(column))\"\n                       [minResizableWidth]=\"column.minWidth ?? 10\"\n                       [hidden]=\"isColumnHidden(column)\"\n                       [sortable]=\"column.sortable !== false\"\n                       [filterable]=\"column.filterable !== false\"\n                       [class]=\"alignClass(column)\"\n                       [headerClass]=\"alignClass(column)\"\n                       [title]=\"getDisplayName(column) | pascalCase\">\n      <ng-template kendoGridFilterCellTemplate let-filter let-gridColumn=\"column\">\n        @if (hasFilterOptions(column)) {\n          <kendo-dropdownlist\n            class=\"status-filter-dropdown\"\n            [data]=\"column.filterOptions!\"\n            textField=\"text\"\n            valueField=\"value\"\n            [valuePrimitive]=\"true\"\n            [value]=\"getSelectedFilterValue(column)\"\n            [defaultItem]=\"{ text: '', value: null }\"\n            [popupSettings]=\"{ width: 'auto' }\"\n            (valueChange)=\"onDropdownFilter($event, column)\"\n          >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span class=\"filter-status-item\">\n                  <span role=\"img\" [attr.aria-label]=\"dataItem.text || mapping.tooltip || null\" [title]=\"dataItem.text || mapping.tooltip\"\n                        [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                </span>\n              } @else if (dataItem?.text) {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span style=\"display: inline-flex; align-items: center; gap: 8px;\">\n                  <span [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                  <span>{{ dataItem.text }}</span>\n                </span>\n              } @else {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n          </kendo-dropdownlist>\n        } @else if (column.dataType === 'numericRange') {\n          <span class=\"numeric-range-filter\">\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'gte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'gte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"From\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n            <span class=\"range-separator\">\u2013</span>\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'lte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'lte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"To\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n          </span>\n        } @else {\n          @switch (getFilterType(column)) {\n            @case ('numeric') {\n              <kendo-grid-numeric-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                              [spinners]=\"!isCompactFilter(column)\" [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-numeric-filter-cell>\n            }\n            @case ('boolean') {\n              <kendo-grid-boolean-filter-cell [column]=\"gridColumn\" [filter]=\"filter\"></kendo-grid-boolean-filter-cell>\n            }\n            @case ('date') {\n              <kendo-grid-date-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                           [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-date-filter-cell>\n            }\n            @default {\n              <kendo-grid-string-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"false\"></kendo-grid-string-filter-cell>\n            }\n          }\n        }\n      </ng-template>\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <span\n          [class.mm-cell-truncate]=\"column.truncate\"\n          [attr.title]=\"column.truncate ? getCellTitle(dataItem, column) : null\">\n          <ng-container\n            [ngTemplateOutlet]=\"cellContent\"\n            [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n          ></ng-container>\n        </span>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  @if (hasRowActions) {\n    <kendo-grid-command-column [title]=\"_messages.actionsColumnTitle\" [width]=\"effectiveActionsColumnWidth\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <ng-container\n          [ngTemplateOutlet]=\"rowActions\"\n          [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n        ></ng-container>\n      </ng-template>\n    </kendo-grid-command-column>\n  }\n  } @else {\n    <!-- Card mode (AB#4930): one full-width column renders the whole row as a\n         stacked card \u2014 title from the first column, labeled lines for the\n         rest (empty values skipped), row actions in the card header. -->\n    <kendo-grid-column [sortable]=\"false\" [filterable]=\"false\" title=\"\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <div class=\"mm-card\">\n          <div class=\"mm-card-header\">\n            @if (cardTitleColumn; as titleColumn) {\n              <span class=\"mm-card-title\">\n                <ng-container\n                  [ngTemplateOutlet]=\"cellContent\"\n                  [ngTemplateOutletContext]=\"{ element: dataItem, column: titleColumn }\"\n                ></ng-container>\n              </span>\n            }\n            <span class=\"mm-card-actions\">\n              <ng-container\n                [ngTemplateOutlet]=\"rowActions\"\n                [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n              ></ng-container>\n            </span>\n          </div>\n          <div class=\"mm-card-fields\">\n            @for (column of cardBodyColumns; track column.field) {\n              @if (hasCardValue(dataItem, column)) {\n                <div class=\"mm-card-field\">\n                  <span class=\"mm-card-label\">{{ getDisplayName(column) | pascalCase }}</span>\n                  <span class=\"mm-card-value\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n                    ></ng-container>\n                  </span>\n                </div>\n              }\n            }\n          </div>\n        </div>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  <kendo-grid-excel fileName=\"{{excelExportFileName}}\">\n    @for (column of columns; track column.field) {\n      <kendo-excelexport-column [field]=\"column.field\"\n                                [title]=\"getDisplayName(column) | pascalCase\">\n      </kendo-excelexport-column>\n    }\n  </kendo-grid-excel>\n\n  <kendo-grid-pdf fileName=\"{{pdfExportFileName}}\" paperSize=\"A4\" [repeatHeaders]=\"true\"\n                  [landscape]=\"true\">\n    @for (column of columns; track column.field) {\n      <kendo-grid-column [field]=\"column.field\"\n                         [filter]=\"getFilterType(column)\"\n                         [title]=\"getDisplayName(column) | pascalCase\"></kendo-grid-column>\n    }\n    <kendo-grid-pdf-margin top=\"1.5cm\" left=\"1cm\" right=\"1cm\" bottom=\"1.5cm\"></kendo-grid-pdf-margin>\n    <ng-template kendoGridPDFTemplate let-pageNum=\"pageNum\" let-totalPages=\"totalPages\">\n      <div class=\"page-template\">\n        <div class=\"footer\" style=\"position: absolute; bottom: 0; width: 100%; text-align: center; font-size: 9px; color: #666;\">\n          {{ getPdfPageText(pageNum, totalPages) }}\n        </div>\n      </div>\n    </ng-template>\n  </kendo-grid-pdf>\n</kendo-grid>\n\n<kendo-contextmenu\n  #gridmenu\n  [kendoMenuHierarchyBinding]=\"_contextMenuItems\"\n  [textField]=\"['text']\"\n  childrenField=\"items\"\n  svgIconField=\"svgIcon\"\n  separatorField=\"separator\"\n  disabledField=\"disabled\"\n  cssClassField=\"cssClass\"\n  (popupClose)=\"onContextMenuClosed($event)\"\n  (select)=\"onContextMenuSelect($event)\"\n></kendo-contextmenu>\n", styles: [":host{display:flex;flex-direction:column;min-height:0}:host>kendo-grid{flex:1;min-height:0}.mm-search-input{width:165px}:host ::ng-deep .k-grid th:has(input[type=checkbox]),:host ::ng-deep .k-grid td:has(>kendo-checkbox){text-overflow:clip}:host ::ng-deep .k-command-cell{white-space:nowrap;overflow:hidden;vertical-align:middle}:host ::ng-deep .k-command-cell .k-button{display:inline-flex;vertical-align:middle;margin:0}:host ::ng-deep .k-command-cell .k-button+.k-button{margin-left:4px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar{flex-wrap:wrap;row-gap:6px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-search-input{width:100%;order:10}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar kendo-grid-spacer{display:none}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-toolbar-commands{margin-left:auto}:host ::ng-deep .k-grid td.mm-col-align-right{text-align:right;font-variant-numeric:tabular-nums}:host ::ng-deep .k-grid td.mm-col-align-center{text-align:center}:host ::ng-deep .k-grid th.mm-col-align-right .k-cell-inner>.k-link{justify-content:flex-end}:host ::ng-deep .k-grid th.mm-col-align-center .k-cell-inner>.k-link{justify-content:center}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-wrapper{gap:2px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-datepicker>.k-input-button{display:none}:host ::ng-deep .k-filter-row .mm-filter-compact .k-input-inner{padding-left:4px;padding-right:4px;font-size:12px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator{width:26px;min-width:0}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator .k-input-button{padding:2px}.mm-cell-truncate{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-icons-cell{display:inline-flex;align-items:center;gap:8px}.status-icons-cell .status-icon{display:inline-flex;align-items:center;justify-content:center;cursor:default}.status-icons-cell .status-icon kendo-svg-icon{width:18px;height:18px}:host ::ng-deep .filter-status-item{display:inline-flex;align-items:center;gap:10px}:host ::ng-deep .status-filter-dropdown .k-input-value-text{font-size:0}:host ::ng-deep .status-filter-dropdown .k-input-value-text .filter-status-item,:host ::ng-deep .status-filter-dropdown .k-input-value-text>span{font-size:14px}.numeric-range-filter{display:flex;align-items:center;gap:4px}.numeric-range-filter kendo-numerictextbox{flex:1;min-width:0}.numeric-range-filter .range-separator{flex-shrink:0;opacity:.6}.cron-expression-cell{display:flex;flex-direction:column;gap:2px}.cron-expression-cell .cron-expression{font-family:Roboto Mono,Consolas,monospace;font-size:.85em;background:var(--mm-cron-code-bg, #eeeeee);color:var(--mm-cron-code-text, #333333);padding:2px 6px;border-radius:3px}.cron-expression-cell .cron-description{font-size:.8em;color:var(--mm-cron-text-secondary, #666666)}.badge-cell{display:inline-block;padding:2px 10px;font-size:.75rem;font-weight:600;border-radius:12px;border:1px solid var(--mm-badge-default-border, transparent);background:var(--mm-badge-default-bg, rgba(127, 127, 127, .15));color:var(--mm-badge-default-color, inherit);white-space:nowrap;line-height:1.4}.badge-cell-default{opacity:.7;font-style:italic}.progress-bar-cell{display:inline-flex;align-items:center;gap:8px;width:100%}.progress-bar-cell .progress-bar-track{flex:1;height:8px;background:var(--mm-progress-track-bg, rgba(255, 255, 255, .1));border-radius:4px;overflow:hidden}.progress-bar-cell .progress-bar-fill{display:block;height:100%;background:var(--mm-progress-fill-color, #10b981);border-radius:4px;transition:width .3s ease}.progress-bar-cell .progress-bar-label{min-width:40px;text-align:right;font-size:.85em}:host-context(.k-pdf-export) .k-grid,:host-context(.k-pdf-export) .k-grid-header,:host-context(.k-pdf-export) .k-grid-content,:host-context(.k-pdf-export) .k-grid-header-wrap,:host-context(.k-pdf-export) .k-grid-content-locked,:host-context(.k-pdf-export) .k-grid-header-locked{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border-color:#000!important}:host-context(.k-pdf-export) .k-grid{border:1px solid #000!important;font-family:Arial,sans-serif!important;font-size:10px!important}:host-context(.k-pdf-export) .k-grid-header th,:host-context(.k-pdf-export) .k-header,:host-context(.k-pdf-export) .k-grid th{background:#f0f0f0!important;background-color:#f0f0f0!important;background-image:none!important;color:#000!important;border:1px solid #000!important;font-weight:700!important;padding:6px 8px!important;text-transform:none!important;letter-spacing:normal!important}:host-context(.k-pdf-export) .k-grid td,:host-context(.k-pdf-export) .k-grid-content td,:host-context(.k-pdf-export) .k-master-row td{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border:1px solid #000!important;padding:4px 8px!important}:host-context(.k-pdf-export) .k-grid tr,:host-context(.k-pdf-export) .k-master-row,:host-context(.k-pdf-export) .k-alt{background:#fff!important;background-color:#fff!important;background-image:none!important}:host-context(.k-pdf-export) .k-grid tr:hover,:host-context(.k-pdf-export) .k-grid tr.k-selected,:host-context(.k-pdf-export) .k-grid td:hover{background:#fff!important;background-color:#fff!important}:host-context(.k-pdf-export) .k-grid-toolbar,:host-context(.k-pdf-export) .k-pager,:host-context(.k-pdf-export) .k-grid-pager,:host-context(.k-pdf-export) .k-command-cell,:host-context(.k-pdf-export) .k-checkbox-column,:host-context(.k-pdf-export) kendo-grid-checkbox-column,:host-context(.k-pdf-export) .status-icons-cell,:host-context(.k-pdf-export) .status-icon,:host-context(.k-pdf-export) kendo-svg-icon{display:none!important}:host-context(.k-pdf-export) .badge-cell{background:transparent!important;border:none!important;color:inherit!important;padding:0!important;border-radius:0!important;text-transform:none!important;font-weight:inherit!important;font-size:inherit!important}:host(.mm-list-view-cards) ::ng-deep .k-grid-header{display:none}:host(.mm-list-view-cards) ::ng-deep .k-grid td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td{border:none;background:transparent;padding:4px 2px;white-space:normal}:host(.mm-list-view-cards) ::ng-deep .k-grid td:has(>kendo-checkbox),:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td:has(>kendo-checkbox){padding-left:2px;padding-right:0}:host(.mm-list-view-cards) ::ng-deep .k-grid colgroup>col:first-child:not(:only-child){width:32px!important}:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row:hover,:host(.mm-list-view-cards) ::ng-deep .k-grid tr:hover{background:transparent}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected .mm-card,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected .mm-card{border-color:var(--kendo-color-primary, #ff6358)}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected>td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected>.k-table-td{background:transparent}.mm-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--kendo-color-border, #dee2e6);border-radius:8px;padding:10px 12px}.mm-card-header{display:flex;align-items:center;gap:8px}.mm-card-title{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.mm-card-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.mm-card-fields{display:flex;flex-direction:column;gap:3px}.mm-card-field{display:flex;align-items:baseline;gap:8px;font-size:.9em}.mm-card-label{flex:0 0 38%;max-width:160px;color:var(--kendo-color-subtle, #666666);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-card-value{flex:1;min-width:0;overflow-wrap:anywhere}::ng-deep .k-grid-toolbar .mm-toolbar-filters{display:flex;align-items:center;gap:12px;flex-wrap:wrap}::ng-deep .k-grid-toolbar .mm-toolbar-filters-separator{align-self:center;height:22px;margin:0 4px;border-left:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .16));border-top:none;width:0}::ng-deep .k-menu-group .mm-list-view-menu-item--danger>.k-link,::ng-deep .k-menu-group .mm-list-view-menu-item--danger>.k-menu-link{color:var(--theme-status-error, #c0385f)}.mm-list-view-row-actions{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;vertical-align:middle}.mm-list-view-row-actions .mm-list-view-row-actions__more:focus-visible{outline:none;box-shadow:var(--theme-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #2e8473)}.boolean-icon{display:inline-flex;align-items:center}.boolean-icon.boolean-icon--true{color:var(--mm-list-boolean-true-color, var(--kendo-color-success, #2fb37a))}.boolean-icon.boolean-icon--false{color:var(--mm-list-boolean-false-color, var(--kendo-color-subtle, #8a94a0))}\n"], dependencies: [{ kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "adaptiveMode", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "gridResizable", "rowReorderable", "navigable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "showInactiveTools", "isDetailExpanded", "isGroupExpanded", "dataLayoutMode", "pinnable", "pinnedTopRows", "pinnedBottomRows", "isRowPinnable"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "rowPinChange", "dataStateChange", "gridStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "csvExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "directive", type: MmListViewDataBindingDirective, selector: "[mmListViewDataBinding]" }, { kind: "component", type: ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterVariant", "filterable", "editable"] }, { kind: "directive", type: ToolbarTemplateDirective, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { kind: "component", type: GridSpacerComponent, selector: "kendo-grid-spacer", inputs: ["width"] }, { kind: "ngmodule", type: ExcelModule }, { kind: "component", type: i1$2.ExcelComponent, selector: "kendo-grid-excel", inputs: ["fileName", "filterable", "creator", "date", "forceProxy", "proxyURL", "fetchData", "paddingCellOptions", "headerPaddingCellOptions", "collapsible"], outputs: ["fileCreated"] }, { kind: "component", type: i1$2.ExcelCommandDirective, selector: "[kendoGridExcelCommand]" }, { kind: "component", type: i2$1.ColumnComponent, selector: "kendo-excelexport-column", inputs: ["field", "cellOptions", "groupHeaderCellOptions", "groupFooterCellOptions", "footerCellOptions"] }, { kind: "ngmodule", type: PDFModule }, { kind: "component", type: i1$2.PDFComponent, selector: "kendo-grid-pdf", inputs: ["allPages", "delay"] }, { kind: "component", type: i1$2.PDFMarginComponent, selector: "kendo-grid-pdf-margin" }, { kind: "component", type: i1$2.PDFCommandDirective, selector: "[kendoGridPDFCommand]" }, { kind: "directive", type: i1$2.PDFTemplateDirective, selector: "[kendoGridPDFTemplate]" }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "component", type: SplitButtonComponent, selector: "kendo-splitbutton", inputs: ["text", "icon", "svgIcon", "iconClass", "type", "imageUrl", "size", "rounded", "fillMode", "themeColor", "disabled", "popupSettings", "tabIndex", "textField", "data", "arrowButtonClass", "arrowButtonIcon", "arrowButtonSvgIcon", "buttonAttributes"], outputs: ["buttonClick", "itemClick", "focus", "blur", "open", "close"], exportAs: ["kendoSplitButton"] }, { kind: "component", type: CommandColumnComponent, selector: "kendo-grid-command-column" }, { kind: "directive", type: CellTemplateDirective, selector: "[kendoGridCellTemplate]" }, { kind: "component", type: ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }, { kind: "directive", type: HierarchyBindingDirective, selector: "[kendoMenuHierarchyBinding]", inputs: ["kendoMenuHierarchyBinding", "textField", "urlField", "iconField", "svgIconField", "disabledField", "cssClassField", "cssStyleField", "separatorField", "childrenField"], exportAs: ["kendoMenuHierarchyBinding"] }, { kind: "component", type: CheckboxColumnComponent, selector: "kendo-grid-checkbox-column", inputs: ["showSelectAll", "showDisabledCheckbox"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "component", type: SeparatorComponent, selector: "kendo-separator", inputs: ["orientation"] }, { kind: "ngmodule", type: SVGIconModule }, { kind: "component", type: i2.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }, { kind: "component", type: CustomMessagesComponent, selector: "kendo-grid-messages" }, { kind: "directive", type: FilterCellTemplateDirective, selector: "[kendoGridFilterCellTemplate]" }, { kind: "component", type: StringFilterCellComponent, selector: "kendo-grid-string-filter-cell", inputs: ["filterDelay", "showOperators", "placeholder"] }, { kind: "component", type: NumericFilterCellComponent, selector: "kendo-grid-numeric-filter-cell", inputs: ["filterDelay", "showOperators", "placeholder"] }, { kind: "component", type: BooleanFilterCellComponent, selector: "kendo-grid-boolean-filter-cell" }, { kind: "component", type: DateFilterCellComponent, selector: "kendo-grid-date-filter-cell", inputs: ["showOperators"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: ValueTemplateDirective, selector: "[kendoDropDownListValueTemplate],[kendoDropDownTreeValueTemplate]" }, { kind: "directive", type: ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "component", type: NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionButtonComponent, selector: "mm-action-button", inputs: ["action", "targetLabel", "context", "display", "primary"], outputs: ["triggered"] }, { kind: "directive", type: NoRecordsTemplateDirective, selector: "[kendoGridNoRecordsTemplate]" }, { kind: "component", type: EmptyStateComponent, selector: "mm-empty-state", inputs: ["variant", "heading", "text", "size", "showRetry", "retryLabel"], outputs: ["retry"] }, { kind: "pipe", type: PascalCasePipe, name: "pascalCase" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: BytesToSizePipe, name: "bytesToSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ListViewComponent, decorators: [{
             type: Component,
@@ -2894,8 +4050,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                         ItemTemplateDirective,
                         NumericTextBoxComponent,
                         NgComponentOutlet,
-                        NgTemplateOutlet
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Shared cell renderer (AB#4930): used by the regular grid columns AND the\n     card-mode body lines, so both render every dataType identically. -->\n<ng-template #cellContent let-element=\"element\" let-column=\"column\">\n  @if (column.formatter) {\n    {{ getFormattedValue(element, column) }}\n  } @else {\n    @switch (column.dataType) {\n      @case ('boolean') {\n        <kendo-checkbox type=\"checkbox\" [checkedState]=\"$any(getValue(element, column))\" [disabled]=\"true\" />\n      }\n      @case ('iso8601') {\n        {{ $any(getValue(element, column)) | date:column.format }}\n      }\n      @case ('bytes') {\n        {{ $any(getValue(element, column)) | bytesToSize }}\n      }\n      @case ('statusIcons') {\n        <span class=\"status-icons-cell\">\n          @for (fieldConfig of getStatusFields(column); track fieldConfig.field) {\n            @if (getStatusIconMapping(element, fieldConfig); as mapping) {\n              <span\n                class=\"status-icon\"\n                [title]=\"mapping.tooltip\"\n                [style.color]=\"mapping.color\">\n                <kendo-svg-icon [icon]=\"mapping.icon\"></kendo-svg-icon>\n              </span>\n            }\n          }\n        </span>\n      }\n      @case ('cronExpression') {\n        <span class=\"cron-expression-cell\">\n          <code class=\"cron-expression\">{{ getValue(element, column) }}</code>\n          <span class=\"cron-description\">{{ getCronHumanReadable(getValue(element, column)) }}</span>\n        </span>\n      }\n      @case ('numeric') {\n        {{ $any(getValue(element, column)) | number:column.format }}\n      }\n      @case ('progressBar') {\n        <span class=\"progress-bar-cell\">\n          <span class=\"progress-bar-track\">\n            <span class=\"progress-bar-fill\" [style.width.%]=\"getValue(element, column)\"></span>\n          </span>\n          <span class=\"progress-bar-label\">{{ getValue(element, column) }}%</span>\n        </span>\n      }\n      @case ('badge') {\n        @if (getBadgeMapping(element, column); as badge) {\n          <span\n            class=\"badge-cell\"\n            [title]=\"badge.tooltip ?? ''\"\n            [style.color]=\"badge.color\"\n            [style.background]=\"badge.backgroundColor\"\n            [style.borderColor]=\"badge.borderColor ?? badge.backgroundColor\">\n            {{ badge.label ?? getValue(element, column) }}\n          </span>\n        } @else if (!column.badgeHideUnmapped) {\n          <span class=\"badge-cell badge-cell-default\">{{ getValue(element, column) }}</span>\n        }\n      }\n      @case ('component') {\n        @if (column.cellComponent) {\n          <ng-container *ngComponentOutlet=\"column.cellComponent; inputs: getCellInputs(element, column)\" />\n        }\n      }\n      @default {\n        {{ getValue(element, column) }}\n      }\n    }\n  }\n</ng-template>\n\n<!-- Row actions (AB#4930): shared by the actions column and the card header. -->\n<ng-template #rowActions let-dataItem=\"dataItem\">\n  @if (_actionMenuItems.length > 0) {\n    @for (menuItem of _actionMenuItems; track menuItem.text) {\n      @if (!menuItem.separator && getMenuItemVisible(menuItem, dataItem)) {\n        <button kendoButton themeColor=\"primary\" fillMode=\"flat\"\n          [svgIcon]=\"menuItem.svgIcon!\"\n          [title]=\"menuItem.text ?? ''\"\n          [disabled]=\"getMenuItemDisabled(menuItem, dataItem) || isLoading()\"\n          (click)=\"onSelectOptionActionItem($event, dataItem, menuItem)\">\n        </button>\n      }\n    }\n  }\n\n  @if (_contextMenuItems.length > 0 && contextMenuType == 'actionMenu') {\n    <button kendoButton themeColor=\"primary\" fillMode=\"flat\" [svgIcon]=\"moreVerticalIcon\" [disabled]=\"isLoading()\" (click)=\"onContextMenu(dataItem, $event)\"></button>\n  }\n</ng-template>\n\n<kendo-grid\n  mmListViewDataBinding\n  [loading]=\"isLoading()\"\n  [pageSize]=\"effectivePageSize()\" [selectable]=\"selectable\" (pageChange)=\"onPageChange($event)\"\n  [skip]=\"skip\" (selectionChange)=\"onRowSelect($event)\" (cellClick)=\"onCellClick($event)\"\n  [pageable]=\"effectivePageable\"\n  [sortable]=\"sortable\"\n  [filterable]=\"_showRowFilter && !isCardMode\"\n  [resizable]=\"resizable\"\n  [rowClass]=\"rowClass ?? defaultRowClass\"\n>\n  <kendo-grid-messages\n    [pagerItemsPerPage]=\"_messages.pagerItemsPerPage\"\n    [pagerOf]=\"_messages.pagerOf\"\n    [pagerItems]=\"_messages.pagerItems\"\n    [pagerPage]=\"_messages.pagerPage\"\n    [pagerFirstPage]=\"_messages.pagerFirstPage\"\n    [pagerLastPage]=\"_messages.pagerLastPage\"\n    [pagerPreviousPage]=\"_messages.pagerPreviousPage\"\n    [pagerNextPage]=\"_messages.pagerNextPage\"\n    [noRecords]=\"_messages.noRecords\"\n  ></kendo-grid-messages>\n  <ng-template kendoGridToolbarTemplate>\n\n    @for (commandItem of leftToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Host scope/filter controls (view switches and the like). They steer the\n         table, so they sit in the table's own band instead of a second strip\n         stacked above the grid. -->\n    @if (filtersTemplate) {\n      <!-- A rule between the host's actions and its filters: both sit on the\n           left of the same band, but one acts on records and the other changes\n           what the list shows. Only drawn when actions precede them. -->\n      @if (leftToolbarActions.length > 0) {\n        <kendo-separator class=\"mm-toolbar-filters-separator\"></kendo-separator>\n      }\n      <div class=\"mm-toolbar-filters\">\n        <ng-container [ngTemplateOutlet]=\"filtersTemplate.templateRef\"></ng-container>\n      </div>\n    }\n\n    <kendo-grid-spacer></kendo-grid-spacer>\n    @if (searchTextBoxEnabled) {\n      <input\n        class=\"k-textbox k-input k-input-md k-rounded-md mm-search-input\"\n        [placeholder]=\"_messages.searchPlaceholder\"\n        [value]=\"searchValue\"\n        (input)=\"onFilter($any($event.target).value || null)\"\n      />\n    }\n\n    @for (commandItem of rightToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Commands: laid out while there is room, collapsed into one menu once\n         the list gets narrow. Same behaviour in every host app \u2014 a list this\n         wide has space for five buttons, and a list this narrow does not. -->\n    @if (commandsCollapsed) {\n      <kendo-dropdownbutton class=\"mm-toolbar-commands\" [data]=\"toolbarCommands\" textField=\"text\" [svgIcon]=\"commandsIcon\"\n                            fillMode=\"flat\" themeColor=\"primary\" [disabled]=\"isLoading()\"\n                            [title]=\"_messages.commands\"\n                            (itemClick)=\"onCommand($any($event).id)\"></kendo-dropdownbutton>\n    } @else {\n      @for (command of toolbarCommands; track command.id) {\n        @switch (command.id) {\n          @case ('excel') {\n            <button kendoTooltip kendoGridExcelCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"></button>\n          }\n          @case ('pdf') {\n            <button kendoTooltip kendoGridPDFCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"></button>\n          }\n          @default {\n            <button kendoTooltip kendoButton themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" (click)=\"onCommand(command.id)\"\n                    [disabled]=\"isLoading()\" [title]=\"command.text\"></button>\n          }\n        }\n      }\n    }\n  </ng-template>\n\n  @if (showCheckboxColumn()) {\n    <kendo-grid-checkbox-column [showSelectAll]=\"showRowSelectAllCheckBox\"\n                                [width]=\"effectiveCheckboxColumnWidth\"></kendo-grid-checkbox-column>\n  }\n\n  @if (!isCardMode) {\n  @for (column of columns; track column.field) {\n    <kendo-grid-column [field]=\"column.field\"\n                       [filter]=\"getFilterType(column)\" format=\"{{column.format}}\"\n                       [width]=\"$any(getEffectiveWidth(column))\"\n                       [minResizableWidth]=\"column.minWidth ?? 10\"\n                       [hidden]=\"isColumnHidden(column)\"\n                       [sortable]=\"column.sortable !== false\"\n                       [filterable]=\"column.filterable !== false\"\n                       [class]=\"alignClass(column)\"\n                       [headerClass]=\"alignClass(column)\"\n                       [title]=\"getDisplayName(column) | pascalCase\">\n      <ng-template kendoGridFilterCellTemplate let-filter let-gridColumn=\"column\">\n        @if (hasFilterOptions(column)) {\n          <kendo-dropdownlist\n            class=\"status-filter-dropdown\"\n            [data]=\"column.filterOptions!\"\n            textField=\"text\"\n            valueField=\"value\"\n            [valuePrimitive]=\"true\"\n            [value]=\"getSelectedFilterValue(column)\"\n            [defaultItem]=\"{ text: '', value: null }\"\n            [popupSettings]=\"{ width: 'auto' }\"\n            (valueChange)=\"onDropdownFilter($event, column)\"\n          >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span class=\"filter-status-item\">\n                  <span [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                </span>\n              } @else if (dataItem?.text) {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span style=\"display: inline-flex; align-items: center; gap: 8px;\">\n                  <span [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                  <span>{{ dataItem.text }}</span>\n                </span>\n              } @else {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n          </kendo-dropdownlist>\n        } @else if (column.dataType === 'numericRange') {\n          <span class=\"numeric-range-filter\">\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'gte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'gte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"From\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n            <span class=\"range-separator\">\u2013</span>\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'lte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'lte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"To\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n          </span>\n        } @else {\n          @switch (getFilterType(column)) {\n            @case ('numeric') {\n              <kendo-grid-numeric-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                              [spinners]=\"!isCompactFilter(column)\" [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-numeric-filter-cell>\n            }\n            @case ('boolean') {\n              <kendo-grid-boolean-filter-cell [column]=\"gridColumn\" [filter]=\"filter\"></kendo-grid-boolean-filter-cell>\n            }\n            @case ('date') {\n              <kendo-grid-date-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                           [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-date-filter-cell>\n            }\n            @default {\n              <kendo-grid-string-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"false\"></kendo-grid-string-filter-cell>\n            }\n          }\n        }\n      </ng-template>\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <span\n          [class.mm-cell-truncate]=\"column.truncate\"\n          [attr.title]=\"column.truncate ? getCellTitle(dataItem, column) : null\">\n          <ng-container\n            [ngTemplateOutlet]=\"cellContent\"\n            [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n          ></ng-container>\n        </span>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  @if (_actionMenuItems.length > 0 || (_contextMenuItems.length > 0 &&  contextMenuType == 'actionMenu')) {\n    <kendo-grid-command-column [title]=\"_messages.actionsColumnTitle\" [width]=\"effectiveActionsColumnWidth\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <ng-container\n          [ngTemplateOutlet]=\"rowActions\"\n          [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n        ></ng-container>\n      </ng-template>\n    </kendo-grid-command-column>\n  }\n  } @else {\n    <!-- Card mode (AB#4930): one full-width column renders the whole row as a\n         stacked card \u2014 title from the first column, labeled lines for the\n         rest (empty values skipped), row actions in the card header. -->\n    <kendo-grid-column [sortable]=\"false\" [filterable]=\"false\" title=\"\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <div class=\"mm-card\">\n          <div class=\"mm-card-header\">\n            @if (cardTitleColumn; as titleColumn) {\n              <span class=\"mm-card-title\">\n                <ng-container\n                  [ngTemplateOutlet]=\"cellContent\"\n                  [ngTemplateOutletContext]=\"{ element: dataItem, column: titleColumn }\"\n                ></ng-container>\n              </span>\n            }\n            <span class=\"mm-card-actions\">\n              <ng-container\n                [ngTemplateOutlet]=\"rowActions\"\n                [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n              ></ng-container>\n            </span>\n          </div>\n          <div class=\"mm-card-fields\">\n            @for (column of cardBodyColumns; track column.field) {\n              @if (hasCardValue(dataItem, column)) {\n                <div class=\"mm-card-field\">\n                  <span class=\"mm-card-label\">{{ getDisplayName(column) | pascalCase }}</span>\n                  <span class=\"mm-card-value\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n                    ></ng-container>\n                  </span>\n                </div>\n              }\n            }\n          </div>\n        </div>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  <kendo-grid-excel fileName=\"{{excelExportFileName}}\">\n    @for (column of columns; track column.field) {\n      <kendo-excelexport-column [field]=\"column.field\"\n                                [title]=\"getDisplayName(column) | pascalCase\">\n      </kendo-excelexport-column>\n    }\n  </kendo-grid-excel>\n\n  <kendo-grid-pdf fileName=\"{{pdfExportFileName}}\" paperSize=\"A4\" [repeatHeaders]=\"true\"\n                  [landscape]=\"true\">\n    @for (column of columns; track column.field) {\n      <kendo-grid-column [field]=\"column.field\"\n                         [filter]=\"getFilterType(column)\"\n                         [title]=\"getDisplayName(column) | pascalCase\"></kendo-grid-column>\n    }\n    <kendo-grid-pdf-margin top=\"1.5cm\" left=\"1cm\" right=\"1cm\" bottom=\"1.5cm\"></kendo-grid-pdf-margin>\n    <ng-template kendoGridPDFTemplate let-pageNum=\"pageNum\" let-totalPages=\"totalPages\">\n      <div class=\"page-template\">\n        <div class=\"footer\" style=\"position: absolute; bottom: 0; width: 100%; text-align: center; font-size: 9px; color: #666;\">\n          {{ getPdfPageText(pageNum, totalPages) }}\n        </div>\n      </div>\n    </ng-template>\n  </kendo-grid-pdf>\n</kendo-grid>\n\n<kendo-contextmenu\n  #gridmenu\n  [kendoMenuHierarchyBinding]=\"_contextMenuItems\"\n  [textField]=\"['text']\"\n  childrenField=\"items\"\n  svgIconField=\"svgIcon\"\n  separatorField=\"separator\"\n  disabledField=\"disabled\"\n  (popupClose)=\"onContextMenuClosed($event)\"\n  (select)=\"onContextMenuSelect($event)\"\n></kendo-contextmenu>\n", styles: [":host{display:flex;flex-direction:column;min-height:0}:host>kendo-grid{flex:1;min-height:0}.mm-search-input{width:165px}:host ::ng-deep .k-grid th:has(input[type=checkbox]),:host ::ng-deep .k-grid td:has(>kendo-checkbox){text-overflow:clip}:host ::ng-deep .k-command-cell{white-space:nowrap;overflow:hidden;vertical-align:middle}:host ::ng-deep .k-command-cell .k-button{display:inline-flex;vertical-align:middle;margin:0}:host ::ng-deep .k-command-cell .k-button+.k-button{margin-left:4px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar{flex-wrap:wrap;row-gap:6px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-search-input{width:100%;order:10}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar kendo-grid-spacer{display:none}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-toolbar-commands{margin-left:auto}:host ::ng-deep .k-grid td.mm-col-align-right{text-align:right;font-variant-numeric:tabular-nums}:host ::ng-deep .k-grid td.mm-col-align-center{text-align:center}:host ::ng-deep .k-grid th.mm-col-align-right .k-cell-inner>.k-link{justify-content:flex-end}:host ::ng-deep .k-grid th.mm-col-align-center .k-cell-inner>.k-link{justify-content:center}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-wrapper{gap:2px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-datepicker>.k-input-button{display:none}:host ::ng-deep .k-filter-row .mm-filter-compact .k-input-inner{padding-left:4px;padding-right:4px;font-size:12px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator{width:26px;min-width:0}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator .k-input-button{padding:2px}.mm-cell-truncate{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-icons-cell{display:inline-flex;align-items:center;gap:8px}.status-icons-cell .status-icon{display:inline-flex;align-items:center;justify-content:center;cursor:default}.status-icons-cell .status-icon kendo-svg-icon{width:18px;height:18px}:host ::ng-deep .filter-status-item{display:inline-flex;align-items:center;gap:10px}:host ::ng-deep .status-filter-dropdown .k-input-value-text{font-size:0}:host ::ng-deep .status-filter-dropdown .k-input-value-text .filter-status-item,:host ::ng-deep .status-filter-dropdown .k-input-value-text>span{font-size:14px}.numeric-range-filter{display:flex;align-items:center;gap:4px}.numeric-range-filter kendo-numerictextbox{flex:1;min-width:0}.numeric-range-filter .range-separator{flex-shrink:0;opacity:.6}.cron-expression-cell{display:flex;flex-direction:column;gap:2px}.cron-expression-cell .cron-expression{font-family:Roboto Mono,Consolas,monospace;font-size:.85em;background:var(--mm-cron-code-bg, #eeeeee);color:var(--mm-cron-code-text, #333333);padding:2px 6px;border-radius:3px}.cron-expression-cell .cron-description{font-size:.8em;color:var(--mm-cron-text-secondary, #666666)}.badge-cell{display:inline-block;padding:2px 10px;font-size:.75rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase;border-radius:12px;border:1px solid var(--mm-badge-default-border, transparent);background:var(--mm-badge-default-bg, rgba(127, 127, 127, .15));color:var(--mm-badge-default-color, inherit);white-space:nowrap;line-height:1.4}.badge-cell-default{opacity:.7;font-style:italic}.progress-bar-cell{display:inline-flex;align-items:center;gap:8px;width:100%}.progress-bar-cell .progress-bar-track{flex:1;height:8px;background:var(--mm-progress-track-bg, rgba(255, 255, 255, .1));border-radius:4px;overflow:hidden}.progress-bar-cell .progress-bar-fill{display:block;height:100%;background:var(--mm-progress-fill-color, #10b981);border-radius:4px;transition:width .3s ease}.progress-bar-cell .progress-bar-label{min-width:40px;text-align:right;font-size:.85em}:host-context(.k-pdf-export) .k-grid,:host-context(.k-pdf-export) .k-grid-header,:host-context(.k-pdf-export) .k-grid-content,:host-context(.k-pdf-export) .k-grid-header-wrap,:host-context(.k-pdf-export) .k-grid-content-locked,:host-context(.k-pdf-export) .k-grid-header-locked{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border-color:#000!important}:host-context(.k-pdf-export) .k-grid{border:1px solid #000!important;font-family:Arial,sans-serif!important;font-size:10px!important}:host-context(.k-pdf-export) .k-grid-header th,:host-context(.k-pdf-export) .k-header,:host-context(.k-pdf-export) .k-grid th{background:#f0f0f0!important;background-color:#f0f0f0!important;background-image:none!important;color:#000!important;border:1px solid #000!important;font-weight:700!important;padding:6px 8px!important;text-transform:none!important;letter-spacing:normal!important}:host-context(.k-pdf-export) .k-grid td,:host-context(.k-pdf-export) .k-grid-content td,:host-context(.k-pdf-export) .k-master-row td{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border:1px solid #000!important;padding:4px 8px!important}:host-context(.k-pdf-export) .k-grid tr,:host-context(.k-pdf-export) .k-master-row,:host-context(.k-pdf-export) .k-alt{background:#fff!important;background-color:#fff!important;background-image:none!important}:host-context(.k-pdf-export) .k-grid tr:hover,:host-context(.k-pdf-export) .k-grid tr.k-selected,:host-context(.k-pdf-export) .k-grid td:hover{background:#fff!important;background-color:#fff!important}:host-context(.k-pdf-export) .k-grid-toolbar,:host-context(.k-pdf-export) .k-pager,:host-context(.k-pdf-export) .k-grid-pager,:host-context(.k-pdf-export) .k-command-cell,:host-context(.k-pdf-export) .k-checkbox-column,:host-context(.k-pdf-export) kendo-grid-checkbox-column,:host-context(.k-pdf-export) .status-icons-cell,:host-context(.k-pdf-export) .status-icon,:host-context(.k-pdf-export) kendo-svg-icon{display:none!important}:host-context(.k-pdf-export) .badge-cell{background:transparent!important;border:none!important;color:inherit!important;padding:0!important;border-radius:0!important;text-transform:none!important;font-weight:inherit!important;letter-spacing:0!important;font-size:inherit!important}:host(.mm-list-view-cards) ::ng-deep .k-grid-header{display:none}:host(.mm-list-view-cards) ::ng-deep .k-grid td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td{border:none;background:transparent;padding:4px 2px;white-space:normal}:host(.mm-list-view-cards) ::ng-deep .k-grid td:has(>kendo-checkbox),:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td:has(>kendo-checkbox){padding-left:2px;padding-right:0}:host(.mm-list-view-cards) ::ng-deep .k-grid colgroup>col:first-child:not(:only-child){width:32px!important}:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row:hover,:host(.mm-list-view-cards) ::ng-deep .k-grid tr:hover{background:transparent}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected .mm-card,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected .mm-card{border-color:var(--kendo-color-primary, #ff6358)}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected>td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected>.k-table-td{background:transparent}.mm-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--kendo-color-border, #dee2e6);border-radius:8px;padding:10px 12px}.mm-card-header{display:flex;align-items:center;gap:8px}.mm-card-title{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.mm-card-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.mm-card-fields{display:flex;flex-direction:column;gap:3px}.mm-card-field{display:flex;align-items:baseline;gap:8px;font-size:.9em}.mm-card-label{flex:0 0 38%;max-width:160px;color:var(--kendo-color-subtle, #666666);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-card-value{flex:1;min-width:0;overflow-wrap:anywhere}::ng-deep .k-grid-toolbar .mm-toolbar-filters{display:flex;align-items:center;gap:12px;flex-wrap:wrap}::ng-deep .k-grid-toolbar .mm-toolbar-filters-separator{align-self:center;height:22px;margin:0 4px;border-left:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .16));border-top:none;width:0}\n"] }]
+                        NgTemplateOutlet,
+                        ActionButtonComponent,
+                        NoRecordsTemplateDirective,
+                        EmptyStateComponent
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Shared cell renderer (AB#4930): used by the regular grid columns AND the\n     card-mode body lines, so both render every dataType identically. -->\n<ng-template #cellContent let-element=\"element\" let-column=\"column\">\n  @if (column.formatter) {\n    {{ getFormattedValue(element, column) }}\n  } @else {\n    @switch (column.dataType) {\n      @case ('boolean') {\n        <!-- Read-only marker: named after its column so a screen reader says what is checked (AB#5621). -->\n        <kendo-checkbox type=\"checkbox\" [checkedState]=\"$any(getValue(element, column))\" [disabled]=\"true\"\n                        [inputAttributes]=\"booleanCellAttributes(column)\" />\n      }\n      @case ('booleanIcon') {\n        <!-- Boolean as icon (AB#5623): named \"<column>: Yes|No\" like the status icons (G13). -->\n        @if (booleanIconState(element, column); as state) {\n          @if (booleanIcon(column, state); as icon) {\n            <span\n              class=\"boolean-icon\"\n              [class.boolean-icon--true]=\"state === 'true'\"\n              [class.boolean-icon--false]=\"state === 'false'\"\n              role=\"img\"\n              [title]=\"booleanIconLabel(column, state)\"\n              [attr.aria-label]=\"booleanIconLabel(column, state)\"\n              [style.color]=\"state === 'true' ? column.booleanIcons?.trueColor : column.booleanIcons?.falseColor\">\n              <kendo-svg-icon [icon]=\"icon\"></kendo-svg-icon>\n            </span>\n          }\n        }\n      }\n      @case ('iso8601') {\n        {{ $any(getValue(element, column)) | date:column.format }}\n      }\n      @case ('bytes') {\n        {{ $any(getValue(element, column)) | bytesToSize }}\n      }\n      @case ('statusIcons') {\n        <span class=\"status-icons-cell\">\n          @for (fieldConfig of getStatusFields(column); track fieldConfig.field) {\n            @if (getStatusIconMapping(element, fieldConfig); as mapping) {\n              <!-- Icon-only status: the mapping's tooltip is also its accessible name (AB#5621). -->\n              <span\n                class=\"status-icon\"\n                role=\"img\"\n                [title]=\"mapping.tooltip\"\n                [attr.aria-label]=\"mapping.tooltip || null\"\n                [style.color]=\"mapping.color\">\n                <kendo-svg-icon [icon]=\"mapping.icon\"></kendo-svg-icon>\n              </span>\n            }\n          }\n        </span>\n      }\n      @case ('cronExpression') {\n        <span class=\"cron-expression-cell\">\n          <code class=\"cron-expression\">{{ getValue(element, column) }}</code>\n          <span class=\"cron-description\">{{ getCronHumanReadable(getValue(element, column)) }}</span>\n        </span>\n      }\n      @case ('numeric') {\n        {{ $any(getValue(element, column)) | number:column.format }}\n      }\n      @case ('progressBar') {\n        <span class=\"progress-bar-cell\">\n          <span class=\"progress-bar-track\">\n            <span class=\"progress-bar-fill\" [style.width.%]=\"getValue(element, column)\"></span>\n          </span>\n          <span class=\"progress-bar-label\">{{ getValue(element, column) }}%</span>\n        </span>\n      }\n      @case ('badge') {\n        @if (getBadgeMapping(element, column); as badge) {\n          <span\n            class=\"badge-cell\"\n            [title]=\"badge.tooltip ?? ''\"\n            [style.color]=\"badge.color\"\n            [style.background]=\"badge.backgroundColor\"\n            [style.borderColor]=\"badge.borderColor ?? badge.backgroundColor\">\n            {{ badge.label ?? getValue(element, column) }}\n          </span>\n        } @else if (!column.badgeHideUnmapped) {\n          <span class=\"badge-cell badge-cell-default\">{{ getValue(element, column) }}</span>\n        }\n      }\n      @case ('component') {\n        @if (column.cellComponent) {\n          <ng-container *ngComponentOutlet=\"column.cellComponent; inputs: getCellInputs(element, column)\" />\n        }\n      }\n      @default {\n        {{ getValue(element, column) }}\n      }\n    }\n  }\n</ng-template>\n\n<!-- Row actions (AB#4930, AB#5572): shared by the actions column and the card header. One MmAction\n     per action (CommandItems via adapter): neutral icon buttons, danger colour only for destructive\n     actions, max `maxInlineRowActions` slots, the rest (and the context menu) behind \"\u2026\". Disabled\n     actions stay focusable and announce their reason (mm-action-button). -->\n<ng-template #rowActions let-dataItem=\"dataItem\">\n  @let view = rowActionsView(dataItem);\n  @if (view.inline.length > 0 || view.hasMenu) {\n    <span class=\"mm-list-view-row-actions\" role=\"group\" [attr.aria-label]=\"rowActionsGroupLabel(dataItem)\">\n      @for (entry of view.inline; track entry.action.id) {\n        <!-- Clicks never reach the grid (no row selection / row navigation from an action). -->\n        <mm-action-button [action]=\"entry.action\" [targetLabel]=\"rowLabel(dataItem)\" context=\"row\" display=\"icon\"\n                          (click)=\"$event.stopPropagation()\"\n                          (triggered)=\"onInlineRowAction(entry, dataItem)\" />\n      }\n      @if (view.hasMenu) {\n        <button kendoButton themeColor=\"base\" fillMode=\"flat\" size=\"small\" class=\"mm-list-view-row-actions__more\"\n          [svgIcon]=\"moreVerticalIcon\" data-action=\"more\"\n          [title]=\"rowActionsLabel(dataItem)\" [attr.aria-label]=\"rowActionsLabel(dataItem)\" aria-haspopup=\"menu\"\n          [disabled]=\"isLoading()\" (click)=\"$event.stopPropagation(); onContextMenu(dataItem, $event)\"></button>\n      }\n    </span>\n  }\n</ng-template>\n\n<kendo-grid\n  mmListViewDataBinding\n  [loading]=\"isLoading()\"\n  [pageSize]=\"effectivePageSize()\" [selectable]=\"selectable\" (pageChange)=\"onPageChange($event)\"\n  [skip]=\"skip\" (selectionChange)=\"onRowSelect($event)\" (cellClick)=\"onCellClick($event)\"\n  [pageable]=\"effectivePageable\"\n  [sortable]=\"sortable\"\n  [filterable]=\"_showRowFilter && !isCardMode\"\n  [resizable]=\"resizable\"\n  [rowClass]=\"rowClass ?? defaultRowClass\"\n>\n  <kendo-grid-messages\n    [pagerItemsPerPage]=\"_messages.pagerItemsPerPage\"\n    [pagerOf]=\"_messages.pagerOf\"\n    [pagerItems]=\"_messages.pagerItems\"\n    [pagerPage]=\"_messages.pagerPage\"\n    [pagerFirstPage]=\"_messages.pagerFirstPage\"\n    [pagerLastPage]=\"_messages.pagerLastPage\"\n    [pagerPreviousPage]=\"_messages.pagerPreviousPage\"\n    [pagerNextPage]=\"_messages.pagerNextPage\"\n    [noRecords]=\"_messages.noRecords\"\n  ></kendo-grid-messages>\n  <!-- Empty state (AB#3444): one block per list, never per row. -->\n  <ng-template kendoGridNoRecordsTemplate>\n    @if (emptyTemplate) {\n      <ng-container *ngTemplateOutlet=\"emptyTemplate; context: emptyContext\"></ng-container>\n    } @else if (emptyState) {\n      @if (loadSettled() && !isLoading()) {\n        @if (isFiltered) {\n          <mm-empty-state class=\"mm-list-view-empty\" variant=\"no-results\"\n                          [heading]=\"emptyState.filteredTitle || _messages.noResultsTitle\"\n                          [text]=\"emptyState.filteredText || _messages.noResultsText\"></mm-empty-state>\n        } @else {\n          <mm-empty-state class=\"mm-list-view-empty\" variant=\"empty\"\n                          [heading]=\"emptyState.title\" [text]=\"emptyState.text\"></mm-empty-state>\n        }\n      }\n    } @else {\n      {{ _messages.noRecords }}\n    }\n  </ng-template>\n  <ng-template kendoGridToolbarTemplate>\n\n    @for (commandItem of leftToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Host scope/filter controls (view switches and the like). They steer the\n         table, so they sit in the table's own band instead of a second strip\n         stacked above the grid. -->\n    @if (filtersTemplate) {\n      <!-- A rule between the host's actions and its filters: both sit on the\n           left of the same band, but one acts on records and the other changes\n           what the list shows. Only drawn when actions precede them. -->\n      @if (leftToolbarActions.length > 0) {\n        <kendo-separator class=\"mm-toolbar-filters-separator\"></kendo-separator>\n      }\n      <div class=\"mm-toolbar-filters\">\n        <ng-container [ngTemplateOutlet]=\"filtersTemplate.templateRef\"></ng-container>\n      </div>\n    }\n\n    <kendo-grid-spacer></kendo-grid-spacer>\n    @if (searchTextBoxEnabled) {\n      <input\n        class=\"k-textbox k-input k-input-md k-rounded-md mm-search-input\"\n        [placeholder]=\"_messages.searchPlaceholder\"\n        [value]=\"searchValue\"\n        (input)=\"onFilter($any($event.target).value || null)\"\n      />\n    }\n\n    @for (commandItem of rightToolbarActions; track commandItem.id) {\n      @if (commandItem) {\n        @switch (commandItem.type) {\n          @case ('link') {\n            @if (commandItem.children && commandItem.children.length > 0 && commandItem.onClick) {\n              <kendo-splitbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (buttonClick)=\"onToolbarCommand(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-splitbutton>\n            } @else if (commandItem.children && commandItem.children.length > 0) {\n              <kendo-dropdownbutton\n                [data]=\"commandItem.children\"\n                [svgIcon]=\"$any(commandItem.svgIcon)\"\n                [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                [textField]=\"'text'\"\n                themeColor=\"primary\"\n                [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                [title]=\"commandItem.tooltip ?? commandItem.text\"\n                [buttonAttributes]=\"toolbarItemButtonAttributes(commandItem)\"\n                (itemClick)=\"onToolbarDropdownItemClick($event)\">\n                {{ commandItem.text }}\n              </kendo-dropdownbutton>\n            } @else if (commandItem.svgIcon) {\n              <button kendoTooltip kendoButton themeColor=\"primary\" [svgIcon]=\"commandItem.svgIcon\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            } @else {\n              <button kendoTooltip kendoButton themeColor=\"primary\"\n                      [fillMode]=\"$any(commandItem.fillMode ?? 'solid')\"\n                      [title]=\"commandItem.tooltip ?? commandItem.text\"\n                      [attr.aria-label]=\"toolbarItemAriaLabel(commandItem)\"\n                      [disabled]=\"getToolbarItemDisabled(commandItem) || isLoading()\"\n                      (click)=\"onToolbarCommand(commandItem)\">{{ commandItem.text }}\n              </button>\n            }\n          }\n          @case ('separator'){\n            <kendo-separator></kendo-separator>\n          }\n        }\n      }\n    }\n\n    <!-- Commands: laid out while there is room, collapsed into one menu once\n         the list gets narrow. Same behaviour in every host app \u2014 a list this\n         wide has space for five buttons, and a list this narrow does not. -->\n    @if (commandsCollapsed) {\n      <kendo-dropdownbutton class=\"mm-toolbar-commands\" [data]=\"toolbarCommands\" textField=\"text\" [svgIcon]=\"commandsIcon\"\n                            fillMode=\"flat\" themeColor=\"primary\" [disabled]=\"isLoading()\"\n                            [title]=\"_messages.commands\"\n                            [buttonAttributes]=\"commandsMenuButtonAttributes\"\n                            (itemClick)=\"onCommand($any($event).id)\"></kendo-dropdownbutton>\n    } @else {\n      @for (command of toolbarCommands; track command.id) {\n        @switch (command.id) {\n          @case ('excel') {\n            <button kendoTooltip kendoGridExcelCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"\n                    [attr.aria-label]=\"command.text\" [attr.data-command]=\"command.id\"></button>\n          }\n          @case ('pdf') {\n            <button kendoTooltip kendoGridPDFCommand themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" [disabled]=\"isLoading()\" [title]=\"command.text\"\n                    [attr.aria-label]=\"command.text\" [attr.data-command]=\"command.id\"></button>\n          }\n          @default {\n            <!-- The row filter is a toggle: its on state is shown (k-selected) and announced. -->\n            <button kendoTooltip kendoButton themeColor=\"primary\" fillMode=\"flat\"\n                    [svgIcon]=\"command.svgIcon\" (click)=\"onCommand(command.id)\"\n                    [class.k-selected]=\"command.id === 'rowFilter' && _showRowFilter\"\n                    [attr.aria-pressed]=\"command.id === 'rowFilter' ? _showRowFilter : null\"\n                    [attr.data-command]=\"command.id\"\n                    [disabled]=\"isLoading()\" [title]=\"command.text\" [attr.aria-label]=\"command.text\"></button>\n          }\n        }\n      }\n    }\n  </ng-template>\n\n  @if (showCheckboxColumn()) {\n    <kendo-grid-checkbox-column [showSelectAll]=\"showRowSelectAllCheckBox\"\n                                [width]=\"effectiveCheckboxColumnWidth\"></kendo-grid-checkbox-column>\n  }\n\n  @if (!isCardMode) {\n  @for (column of columns; track column.field) {\n    <kendo-grid-column [field]=\"column.field\"\n                       [filter]=\"getFilterType(column)\" format=\"{{column.format}}\"\n                       [width]=\"$any(getEffectiveWidth(column))\"\n                       [minResizableWidth]=\"column.minWidth ?? 10\"\n                       [hidden]=\"isColumnHidden(column)\"\n                       [sortable]=\"column.sortable !== false\"\n                       [filterable]=\"column.filterable !== false\"\n                       [class]=\"alignClass(column)\"\n                       [headerClass]=\"alignClass(column)\"\n                       [title]=\"getDisplayName(column) | pascalCase\">\n      <ng-template kendoGridFilterCellTemplate let-filter let-gridColumn=\"column\">\n        @if (hasFilterOptions(column)) {\n          <kendo-dropdownlist\n            class=\"status-filter-dropdown\"\n            [data]=\"column.filterOptions!\"\n            textField=\"text\"\n            valueField=\"value\"\n            [valuePrimitive]=\"true\"\n            [value]=\"getSelectedFilterValue(column)\"\n            [defaultItem]=\"{ text: '', value: null }\"\n            [popupSettings]=\"{ width: 'auto' }\"\n            (valueChange)=\"onDropdownFilter($event, column)\"\n          >\n            <ng-template kendoDropDownListValueTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span class=\"filter-status-item\">\n                  <span role=\"img\" [attr.aria-label]=\"dataItem.text || mapping.tooltip || null\" [title]=\"dataItem.text || mapping.tooltip\"\n                        [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                </span>\n              } @else if (dataItem?.text) {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n              @if (dataItem?.value && column.statusMapping?.[dataItem.value]; as mapping) {\n                <span style=\"display: inline-flex; align-items: center; gap: 8px;\">\n                  <span [style.color]=\"mapping.color\">\n                    <kendo-svg-icon [icon]=\"mapping.icon\" [size]=\"'small'\"></kendo-svg-icon>\n                  </span>\n                  <span>{{ dataItem.text }}</span>\n                </span>\n              } @else {\n                <span>{{ dataItem.text }}</span>\n              }\n            </ng-template>\n          </kendo-dropdownlist>\n        } @else if (column.dataType === 'numericRange') {\n          <span class=\"numeric-range-filter\">\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'gte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'gte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"From\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n            <span class=\"range-separator\">\u2013</span>\n            <kendo-numerictextbox\n              [value]=\"$any(getRangeFilterValue(column, 'lte'))\"\n              (valueChange)=\"onRangeFilterChange($event, column, 'lte')\"\n              [spinners]=\"false\"\n              [decimals]=\"2\"\n              placeholder=\"To\"\n              size=\"small\"\n            ></kendo-numerictextbox>\n          </span>\n        } @else {\n          @switch (getFilterType(column)) {\n            @case ('numeric') {\n              <kendo-grid-numeric-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                              [spinners]=\"!isCompactFilter(column)\" [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-numeric-filter-cell>\n            }\n            @case ('boolean') {\n              <kendo-grid-boolean-filter-cell [column]=\"gridColumn\" [filter]=\"filter\"></kendo-grid-boolean-filter-cell>\n            }\n            @case ('date') {\n              <kendo-grid-date-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"true\" [operator]=\"column.filterOperator || 'eq'\"\n                                           [class.mm-filter-compact]=\"isCompactFilter(column)\"></kendo-grid-date-filter-cell>\n            }\n            @default {\n              <kendo-grid-string-filter-cell [column]=\"gridColumn\" [filter]=\"filter\" [showOperators]=\"false\"></kendo-grid-string-filter-cell>\n            }\n          }\n        }\n      </ng-template>\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <span\n          [class.mm-cell-truncate]=\"column.truncate\"\n          [attr.title]=\"column.truncate ? getCellTitle(dataItem, column) : null\">\n          <ng-container\n            [ngTemplateOutlet]=\"cellContent\"\n            [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n          ></ng-container>\n        </span>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  @if (hasRowActions) {\n    <kendo-grid-command-column [title]=\"_messages.actionsColumnTitle\" [width]=\"effectiveActionsColumnWidth\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <ng-container\n          [ngTemplateOutlet]=\"rowActions\"\n          [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n        ></ng-container>\n      </ng-template>\n    </kendo-grid-command-column>\n  }\n  } @else {\n    <!-- Card mode (AB#4930): one full-width column renders the whole row as a\n         stacked card \u2014 title from the first column, labeled lines for the\n         rest (empty values skipped), row actions in the card header. -->\n    <kendo-grid-column [sortable]=\"false\" [filterable]=\"false\" title=\"\">\n      <ng-template kendoGridCellTemplate let-dataItem>\n        <div class=\"mm-card\">\n          <div class=\"mm-card-header\">\n            @if (cardTitleColumn; as titleColumn) {\n              <span class=\"mm-card-title\">\n                <ng-container\n                  [ngTemplateOutlet]=\"cellContent\"\n                  [ngTemplateOutletContext]=\"{ element: dataItem, column: titleColumn }\"\n                ></ng-container>\n              </span>\n            }\n            <span class=\"mm-card-actions\">\n              <ng-container\n                [ngTemplateOutlet]=\"rowActions\"\n                [ngTemplateOutletContext]=\"{ dataItem: dataItem }\"\n              ></ng-container>\n            </span>\n          </div>\n          <div class=\"mm-card-fields\">\n            @for (column of cardBodyColumns; track column.field) {\n              @if (hasCardValue(dataItem, column)) {\n                <div class=\"mm-card-field\">\n                  <span class=\"mm-card-label\">{{ getDisplayName(column) | pascalCase }}</span>\n                  <span class=\"mm-card-value\">\n                    <ng-container\n                      [ngTemplateOutlet]=\"cellContent\"\n                      [ngTemplateOutletContext]=\"{ element: dataItem, column: column }\"\n                    ></ng-container>\n                  </span>\n                </div>\n              }\n            }\n          </div>\n        </div>\n      </ng-template>\n    </kendo-grid-column>\n  }\n\n  <kendo-grid-excel fileName=\"{{excelExportFileName}}\">\n    @for (column of columns; track column.field) {\n      <kendo-excelexport-column [field]=\"column.field\"\n                                [title]=\"getDisplayName(column) | pascalCase\">\n      </kendo-excelexport-column>\n    }\n  </kendo-grid-excel>\n\n  <kendo-grid-pdf fileName=\"{{pdfExportFileName}}\" paperSize=\"A4\" [repeatHeaders]=\"true\"\n                  [landscape]=\"true\">\n    @for (column of columns; track column.field) {\n      <kendo-grid-column [field]=\"column.field\"\n                         [filter]=\"getFilterType(column)\"\n                         [title]=\"getDisplayName(column) | pascalCase\"></kendo-grid-column>\n    }\n    <kendo-grid-pdf-margin top=\"1.5cm\" left=\"1cm\" right=\"1cm\" bottom=\"1.5cm\"></kendo-grid-pdf-margin>\n    <ng-template kendoGridPDFTemplate let-pageNum=\"pageNum\" let-totalPages=\"totalPages\">\n      <div class=\"page-template\">\n        <div class=\"footer\" style=\"position: absolute; bottom: 0; width: 100%; text-align: center; font-size: 9px; color: #666;\">\n          {{ getPdfPageText(pageNum, totalPages) }}\n        </div>\n      </div>\n    </ng-template>\n  </kendo-grid-pdf>\n</kendo-grid>\n\n<kendo-contextmenu\n  #gridmenu\n  [kendoMenuHierarchyBinding]=\"_contextMenuItems\"\n  [textField]=\"['text']\"\n  childrenField=\"items\"\n  svgIconField=\"svgIcon\"\n  separatorField=\"separator\"\n  disabledField=\"disabled\"\n  cssClassField=\"cssClass\"\n  (popupClose)=\"onContextMenuClosed($event)\"\n  (select)=\"onContextMenuSelect($event)\"\n></kendo-contextmenu>\n", styles: [":host{display:flex;flex-direction:column;min-height:0}:host>kendo-grid{flex:1;min-height:0}.mm-search-input{width:165px}:host ::ng-deep .k-grid th:has(input[type=checkbox]),:host ::ng-deep .k-grid td:has(>kendo-checkbox){text-overflow:clip}:host ::ng-deep .k-command-cell{white-space:nowrap;overflow:hidden;vertical-align:middle}:host ::ng-deep .k-command-cell .k-button{display:inline-flex;vertical-align:middle;margin:0}:host ::ng-deep .k-command-cell .k-button+.k-button{margin-left:4px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar{flex-wrap:wrap;row-gap:6px}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-search-input{width:100%;order:10}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar kendo-grid-spacer{display:none}:host(.mm-list-view-narrow) ::ng-deep .k-grid-toolbar .mm-toolbar-commands{margin-left:auto}:host ::ng-deep .k-grid td.mm-col-align-right{text-align:right;font-variant-numeric:tabular-nums}:host ::ng-deep .k-grid td.mm-col-align-center{text-align:center}:host ::ng-deep .k-grid th.mm-col-align-right .k-cell-inner>.k-link{justify-content:flex-end}:host ::ng-deep .k-grid th.mm-col-align-center .k-cell-inner>.k-link{justify-content:center}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-wrapper{gap:2px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-datepicker>.k-input-button{display:none}:host ::ng-deep .k-filter-row .mm-filter-compact .k-input-inner{padding-left:4px;padding-right:4px;font-size:12px}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator{width:26px;min-width:0}:host ::ng-deep .k-filter-row .mm-filter-compact .k-filtercell-operator .k-dropdown-operator .k-input-button{padding:2px}.mm-cell-truncate{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-icons-cell{display:inline-flex;align-items:center;gap:8px}.status-icons-cell .status-icon{display:inline-flex;align-items:center;justify-content:center;cursor:default}.status-icons-cell .status-icon kendo-svg-icon{width:18px;height:18px}:host ::ng-deep .filter-status-item{display:inline-flex;align-items:center;gap:10px}:host ::ng-deep .status-filter-dropdown .k-input-value-text{font-size:0}:host ::ng-deep .status-filter-dropdown .k-input-value-text .filter-status-item,:host ::ng-deep .status-filter-dropdown .k-input-value-text>span{font-size:14px}.numeric-range-filter{display:flex;align-items:center;gap:4px}.numeric-range-filter kendo-numerictextbox{flex:1;min-width:0}.numeric-range-filter .range-separator{flex-shrink:0;opacity:.6}.cron-expression-cell{display:flex;flex-direction:column;gap:2px}.cron-expression-cell .cron-expression{font-family:Roboto Mono,Consolas,monospace;font-size:.85em;background:var(--mm-cron-code-bg, #eeeeee);color:var(--mm-cron-code-text, #333333);padding:2px 6px;border-radius:3px}.cron-expression-cell .cron-description{font-size:.8em;color:var(--mm-cron-text-secondary, #666666)}.badge-cell{display:inline-block;padding:2px 10px;font-size:.75rem;font-weight:600;border-radius:12px;border:1px solid var(--mm-badge-default-border, transparent);background:var(--mm-badge-default-bg, rgba(127, 127, 127, .15));color:var(--mm-badge-default-color, inherit);white-space:nowrap;line-height:1.4}.badge-cell-default{opacity:.7;font-style:italic}.progress-bar-cell{display:inline-flex;align-items:center;gap:8px;width:100%}.progress-bar-cell .progress-bar-track{flex:1;height:8px;background:var(--mm-progress-track-bg, rgba(255, 255, 255, .1));border-radius:4px;overflow:hidden}.progress-bar-cell .progress-bar-fill{display:block;height:100%;background:var(--mm-progress-fill-color, #10b981);border-radius:4px;transition:width .3s ease}.progress-bar-cell .progress-bar-label{min-width:40px;text-align:right;font-size:.85em}:host-context(.k-pdf-export) .k-grid,:host-context(.k-pdf-export) .k-grid-header,:host-context(.k-pdf-export) .k-grid-content,:host-context(.k-pdf-export) .k-grid-header-wrap,:host-context(.k-pdf-export) .k-grid-content-locked,:host-context(.k-pdf-export) .k-grid-header-locked{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border-color:#000!important}:host-context(.k-pdf-export) .k-grid{border:1px solid #000!important;font-family:Arial,sans-serif!important;font-size:10px!important}:host-context(.k-pdf-export) .k-grid-header th,:host-context(.k-pdf-export) .k-header,:host-context(.k-pdf-export) .k-grid th{background:#f0f0f0!important;background-color:#f0f0f0!important;background-image:none!important;color:#000!important;border:1px solid #000!important;font-weight:700!important;padding:6px 8px!important;text-transform:none!important;letter-spacing:normal!important}:host-context(.k-pdf-export) .k-grid td,:host-context(.k-pdf-export) .k-grid-content td,:host-context(.k-pdf-export) .k-master-row td{background:#fff!important;background-color:#fff!important;background-image:none!important;color:#000!important;border:1px solid #000!important;padding:4px 8px!important}:host-context(.k-pdf-export) .k-grid tr,:host-context(.k-pdf-export) .k-master-row,:host-context(.k-pdf-export) .k-alt{background:#fff!important;background-color:#fff!important;background-image:none!important}:host-context(.k-pdf-export) .k-grid tr:hover,:host-context(.k-pdf-export) .k-grid tr.k-selected,:host-context(.k-pdf-export) .k-grid td:hover{background:#fff!important;background-color:#fff!important}:host-context(.k-pdf-export) .k-grid-toolbar,:host-context(.k-pdf-export) .k-pager,:host-context(.k-pdf-export) .k-grid-pager,:host-context(.k-pdf-export) .k-command-cell,:host-context(.k-pdf-export) .k-checkbox-column,:host-context(.k-pdf-export) kendo-grid-checkbox-column,:host-context(.k-pdf-export) .status-icons-cell,:host-context(.k-pdf-export) .status-icon,:host-context(.k-pdf-export) kendo-svg-icon{display:none!important}:host-context(.k-pdf-export) .badge-cell{background:transparent!important;border:none!important;color:inherit!important;padding:0!important;border-radius:0!important;text-transform:none!important;font-weight:inherit!important;font-size:inherit!important}:host(.mm-list-view-cards) ::ng-deep .k-grid-header{display:none}:host(.mm-list-view-cards) ::ng-deep .k-grid td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td{border:none;background:transparent;padding:4px 2px;white-space:normal}:host(.mm-list-view-cards) ::ng-deep .k-grid td:has(>kendo-checkbox),:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-td:has(>kendo-checkbox){padding-left:2px;padding-right:0}:host(.mm-list-view-cards) ::ng-deep .k-grid colgroup>col:first-child:not(:only-child){width:32px!important}:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row:hover,:host(.mm-list-view-cards) ::ng-deep .k-grid tr:hover{background:transparent}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected .mm-card,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected .mm-card{border-color:var(--kendo-color-primary, #ff6358)}:host(.mm-list-view-cards) ::ng-deep .k-grid tr.k-selected>td,:host(.mm-list-view-cards) ::ng-deep .k-grid .k-table-row.k-selected>.k-table-td{background:transparent}.mm-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--kendo-color-border, #dee2e6);border-radius:8px;padding:10px 12px}.mm-card-header{display:flex;align-items:center;gap:8px}.mm-card-title{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.mm-card-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.mm-card-fields{display:flex;flex-direction:column;gap:3px}.mm-card-field{display:flex;align-items:baseline;gap:8px;font-size:.9em}.mm-card-label{flex:0 0 38%;max-width:160px;color:var(--kendo-color-subtle, #666666);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-card-value{flex:1;min-width:0;overflow-wrap:anywhere}::ng-deep .k-grid-toolbar .mm-toolbar-filters{display:flex;align-items:center;gap:12px;flex-wrap:wrap}::ng-deep .k-grid-toolbar .mm-toolbar-filters-separator{align-self:center;height:22px;margin:0 4px;border-left:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .16));border-top:none;width:0}::ng-deep .k-menu-group .mm-list-view-menu-item--danger>.k-link,::ng-deep .k-menu-group .mm-list-view-menu-item--danger>.k-menu-link{color:var(--theme-status-error, #c0385f)}.mm-list-view-row-actions{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;vertical-align:middle}.mm-list-view-row-actions .mm-list-view-row-actions__more:focus-visible{outline:none;box-shadow:var(--theme-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #2e8473)}.boolean-icon{display:inline-flex;align-items:center}.boolean-icon.boolean-icon--true{color:var(--mm-list-boolean-true-color, var(--kendo-color-success, #2fb37a))}.boolean-icon.boolean-icon--false{color:var(--mm-list-boolean-false-color, var(--kendo-color-subtle, #8a94a0))}\n"] }]
         }], ctorParameters: () => [], propDecorators: { filtersTemplate: [{
                 type: ContentChild,
                 args: [ListViewFiltersDirective]
@@ -2932,6 +4091,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                 type: Input
             }], contextMenuCommandItems: [{
                 type: Input
+            }], rowActions: [{
+                type: Input
+            }], maxInlineRowActions: [{
+                type: Input
+            }], rowAction: [{
+                type: Output
             }], excelExportFileName: [{
                 type: Input
             }], pdfExportFileName: [{
@@ -2961,6 +4126,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                 type: Input
             }], collapseCommandsBelow: [{
                 type: Input
+            }], hasExternalFilters: [{
+                type: Input
+            }], emptyState: [{
+                type: Input
+            }], emptyTemplate: [{
+                type: Input
             }], isCardMode: [{
                 type: HostBinding,
                 args: ['class.mm-list-view-cards']
@@ -2974,6 +4145,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                 type: Input
             }], resetFilters: [{
                 type: Output
+            }], rowLabelField: [{
+                type: Input
             }] } });
 
 class TreeComponent {
@@ -3344,14 +4517,14 @@ class BaseFormComponent {
         return this.form?.dirty ?? false;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: BaseFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: BaseFormComponent, isStandalone: true, selector: "mm-base-form", inputs: { form: "form", config: "config" }, outputs: { saveForm: "saveForm", cancelForm: "cancelForm" }, providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: BaseFormComponent }], queries: [{ propertyName: "titleExtra", first: true, predicate: FormTitleExtraDirective, descendants: true }], hostDirectives: [{ directive: UnsavedChangesDirective }], ngImport: i0, template: "<div class=\"mm-base-form-container\" [class.with-card]=\"config.showCard\" [class.without-card]=\"!config.showCard\">\n  <!-- Title (no card mode) -->\n  <div *ngIf=\"!config.showCard && (title || titleExtra)\" class=\"mm-form-title-row mm-form-title-standalone\">\n    <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n    <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n    <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n  </div>\n\n  <!-- Main form wrapper - styled as card or plain based on CSS class -->\n  <div class=\"mm-form-wrapper\" [style.maxWidth]=\"config.showCard ? (config.cardWidth || '800px') : null\">\n    <!-- Card header (only in card mode) -->\n    <div *ngIf=\"config.showCard && (title || titleExtra)\" class=\"mm-form-header\">\n      <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n      <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n      <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n    </div>\n\n    <!-- Form body with content projection -->\n    <div class=\"mm-form-body\">\n      <div *ngIf=\"config.isLoading && config.showLoadingOverlay\" class=\"mm-loading-overlay\">\n        <div class=\"k-loader k-loader-lg\"></div>\n        <p>{{ loadingText }}</p>\n      </div>\n      <ng-content></ng-content>\n    </div>\n\n    <!-- Form actions -->\n    <div class=\"mm-form-actions\">\n      <!-- Status indicator (left side) -->\n      <div class=\"mm-form-status\">\n        <span class=\"mm-status-indicator\" [class.modified]=\"config.hasChanges\">\n          <span class=\"mm-status-dot\"></span>\n          <span class=\"mm-status-text\">{{ config.hasChanges ? modifiedText : readyText }}</span>\n        </span>\n      </div>\n\n      <!-- Action buttons (right side) -->\n      <div class=\"mm-form-buttons\">\n        <button\n          *ngIf=\"showSaveButton\"\n          kendoButton\n          type=\"submit\"\n          [svgIcon]=\"saveIcon\"\n          themeColor=\"primary\"\n          [disabled]=\"saveButtonDisabled\"\n          (click)=\"onSave()\">\n          {{ saveButtonText }}\n        </button>\n        <button\n          *ngIf=\"showCancelButton\"\n          kendoButton\n          type=\"button\"\n          [svgIcon]=\"cancelIcon\"\n          [disabled]=\"!!config.isSaving\"\n          (click)=\"onCancel()\">\n          {{ cancelButtonText }}\n        </button>\n        <ng-content select=\"[additionalActions]\"></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [":host{--mm-form-bg: var(--kendo-color-surface);--mm-form-bg-alt: var(--kendo-color-surface-alt);--mm-form-bg-elevated: var(--kendo-color-surface-alt);--mm-form-border: var(--kendo-color-border);--mm-form-border-subtle: var(--kendo-color-border-alt, var(--mm-form-border));--mm-form-text: var(--kendo-color-on-app-surface);--mm-form-text-subtle: var(--kendo-color-subtle);--mm-form-text-label: var(--kendo-color-on-app-surface);--mm-form-accent: var(--kendo-color-primary);--mm-form-error: var(--kendo-color-error);--mm-form-status-ready: #37b400;--mm-form-status-modified: #da9162;--mm-form-padding: 1.5rem;--mm-form-padding-sm: 1rem;--mm-form-gap: .5rem;--mm-form-radius: 4px;--mm-form-shadow: 0 2px 6px rgba(0, 0, 0, .15);--mm-form-overlay-bg: var(--kendo-color-surface)}.mm-base-form-container{padding:var(--mm-form-padding);height:100%;overflow:auto}.mm-base-form-container .mm-form-wrapper{margin:0 auto}.mm-base-form-container.with-card .mm-form-wrapper{background:var(--mm-form-bg);border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);box-shadow:var(--mm-form-shadow)}.mm-base-form-container.with-card .mm-form-header{display:flex;align-items:center;gap:1rem;padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-bottom:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.with-card .mm-form-body{padding:var(--mm-form-padding)}.mm-base-form-container.with-card .mm-form-actions{padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-top:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.without-card .mm-form-wrapper{max-width:1200px}.mm-base-form-container.without-card .mm-form-title-standalone{margin-bottom:var(--mm-form-padding)}.mm-base-form-container.without-card .mm-form-actions{margin-top:var(--mm-form-padding);padding-top:var(--mm-form-padding);border-top:1px solid var(--mm-form-border)}.mm-base-form-container .mm-form-title-row{display:flex;align-items:center;gap:1rem}.mm-base-form-container .mm-form-title{font-size:1.5rem;font-weight:500;margin:0;color:var(--mm-form-text)}.mm-base-form-container .mm-modified-badge{display:inline-flex;align-items:center;padding:.25rem .75rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--mm-form-status-modified);background:#da916226;border:1px solid rgba(218,145,98,.4);border-radius:var(--mm-form-radius);animation:pulse-badge 2s ease-in-out infinite}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.mm-base-form-container .mm-form-body{position:relative;min-height:100px}.mm-base-form-container .mm-form-actions{display:flex;gap:var(--mm-form-gap);justify-content:space-between;align-items:center}.mm-base-form-container .mm-form-status{display:flex;align-items:center}.mm-base-form-container .mm-status-indicator{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;background:#37b4001a;border:1px solid rgba(55,180,0,.3);border-radius:var(--mm-form-radius)}.mm-base-form-container .mm-status-indicator .mm-status-dot{width:8px;height:8px;border-radius:50%;background:var(--mm-form-status-ready);box-shadow:0 0 8px #37b40099;animation:pulse-dot 2s ease-in-out infinite}.mm-base-form-container .mm-status-indicator .mm-status-text{font-size:.7rem;font-weight:600;letter-spacing:1px;color:var(--mm-form-status-ready);text-transform:uppercase}.mm-base-form-container .mm-status-indicator.modified{background:#da91621a;border-color:#da91624d}.mm-base-form-container .mm-status-indicator.modified .mm-status-dot{background:var(--mm-form-status-modified);box-shadow:0 0 8px #da916299}.mm-base-form-container .mm-status-indicator.modified .mm-status-text{color:var(--mm-form-status-modified)}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.6}}.mm-base-form-container .mm-form-buttons{display:flex;gap:var(--mm-form-gap)}.mm-base-form-container .mm-form-buttons button{min-width:100px}.mm-base-form-container .mm-loading-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--mm-form-overlay-bg);opacity:.95;z-index:10}.mm-base-form-container .mm-loading-overlay p{margin-top:1rem;color:var(--mm-form-text-subtle);font-size:1rem}::ng-deep .mm-base-form-container fieldset[kendoformfieldset],::ng-deep .mm-base-form-container .k-form-fieldset{border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);padding:var(--mm-form-padding);margin:0;background:var(--mm-form-bg-alt)}::ng-deep .mm-base-form-container fieldset[kendoformfieldset] legend,::ng-deep .mm-base-form-container fieldset[kendoformfieldset] .k-form-legend,::ng-deep .mm-base-form-container .k-form-fieldset legend,::ng-deep .mm-base-form-container .k-form-fieldset .k-form-legend{font-size:1.125rem;font-weight:500;color:var(--mm-form-accent);padding:0 .5rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label,::ng-deep .mm-base-form-container kendo-formfield .k-label,::ng-deep .mm-base-form-container .k-form-field kendo-label,::ng-deep .mm-base-form-container .k-form-field .k-label{font-weight:500;color:var(--mm-form-text-label);margin-bottom:.25rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label .k-required,::ng-deep .mm-base-form-container kendo-formfield .k-label .k-required,::ng-deep .mm-base-form-container .k-form-field kendo-label .k-required,::ng-deep .mm-base-form-container .k-form-field .k-label .k-required{color:var(--mm-form-error)}::ng-deep .mm-base-form-container kendo-formfield kendo-textbox,::ng-deep .mm-base-form-container kendo-formfield kendo-numerictextbox,::ng-deep .mm-base-form-container kendo-formfield kendo-textarea,::ng-deep .mm-base-form-container kendo-formfield kendo-datepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-datetimepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-timepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-dropdownlist,::ng-deep .mm-base-form-container kendo-formfield kendo-combobox,::ng-deep .mm-base-form-container kendo-formfield kendo-multiselect,::ng-deep .mm-base-form-container kendo-formfield kendo-autocomplete,::ng-deep .mm-base-form-container .k-form-field kendo-textbox,::ng-deep .mm-base-form-container .k-form-field kendo-numerictextbox,::ng-deep .mm-base-form-container .k-form-field kendo-textarea,::ng-deep .mm-base-form-container .k-form-field kendo-datepicker,::ng-deep .mm-base-form-container .k-form-field kendo-datetimepicker,::ng-deep .mm-base-form-container .k-form-field kendo-timepicker,::ng-deep .mm-base-form-container .k-form-field kendo-dropdownlist,::ng-deep .mm-base-form-container .k-form-field kendo-combobox,::ng-deep .mm-base-form-container .k-form-field kendo-multiselect,::ng-deep .mm-base-form-container .k-form-field kendo-autocomplete{width:100%}::ng-deep .mm-base-form-container kendo-formfield kendo-formhint,::ng-deep .mm-base-form-container kendo-formfield .k-form-hint,::ng-deep .mm-base-form-container .k-form-field kendo-formhint,::ng-deep .mm-base-form-container .k-form-field .k-form-hint{color:var(--mm-form-text-subtle);font-size:.875rem}::ng-deep .mm-base-form-container kendo-formfield kendo-formerror,::ng-deep .mm-base-form-container kendo-formfield .k-form-error,::ng-deep .mm-base-form-container .k-form-field kendo-formerror,::ng-deep .mm-base-form-container .k-form-field .k-form-error{color:var(--mm-form-error);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:var(--mm-form-radius);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator.success{background-color:var(--kendo-color-success-subtle);color:var(--kendo-color-success-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.warning{background-color:var(--kendo-color-warning-subtle);color:var(--kendo-color-warning-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.error{background-color:var(--kendo-color-error-subtle);color:var(--kendo-color-error-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.info{background-color:var(--kendo-color-info-subtle);color:var(--kendo-color-info-on-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: BaseFormComponent, isStandalone: true, selector: "mm-base-form", inputs: { form: "form", config: "config" }, outputs: { saveForm: "saveForm", cancelForm: "cancelForm" }, providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: BaseFormComponent }], queries: [{ propertyName: "titleExtra", first: true, predicate: FormTitleExtraDirective, descendants: true }], hostDirectives: [{ directive: UnsavedChangesDirective }], ngImport: i0, template: "<div class=\"mm-base-form-container\" [class.with-card]=\"config.showCard\" [class.without-card]=\"!config.showCard\">\n  <!-- Title (no card mode) -->\n  <div *ngIf=\"!config.showCard && (title || titleExtra)\" class=\"mm-form-title-row mm-form-title-standalone\">\n    <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n    <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n    <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n  </div>\n\n  <!-- Main form wrapper - styled as card or plain based on CSS class -->\n  <div class=\"mm-form-wrapper\" [style.maxWidth]=\"config.showCard ? (config.cardWidth || '800px') : null\">\n    <!-- Card header (only in card mode) -->\n    <div *ngIf=\"config.showCard && (title || titleExtra)\" class=\"mm-form-header\">\n      <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n      <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n      <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n    </div>\n\n    <!-- Form body with content projection -->\n    <div class=\"mm-form-body\">\n      <div *ngIf=\"config.isLoading && config.showLoadingOverlay\" class=\"mm-loading-overlay\">\n        <div class=\"k-loader k-loader-lg\"></div>\n        <p>{{ loadingText }}</p>\n      </div>\n      <ng-content></ng-content>\n    </div>\n\n    <!-- Form actions -->\n    <div class=\"mm-form-actions\">\n      <!-- Status indicator (left side) -->\n      <div class=\"mm-form-status\">\n        <span class=\"mm-status-indicator\" [class.modified]=\"config.hasChanges\">\n          <span class=\"mm-status-dot\"></span>\n          <span class=\"mm-status-text\">{{ config.hasChanges ? modifiedText : readyText }}</span>\n        </span>\n      </div>\n\n      <!-- Action buttons (right side) -->\n      <div class=\"mm-form-buttons\">\n        <button\n          *ngIf=\"showSaveButton\"\n          kendoButton\n          type=\"submit\"\n          [svgIcon]=\"saveIcon\"\n          themeColor=\"primary\"\n          [disabled]=\"saveButtonDisabled\"\n          (click)=\"onSave()\">\n          {{ saveButtonText }}\n        </button>\n        <button\n          *ngIf=\"showCancelButton\"\n          kendoButton\n          type=\"button\"\n          [svgIcon]=\"cancelIcon\"\n          [disabled]=\"!!config.isSaving\"\n          (click)=\"onCancel()\">\n          {{ cancelButtonText }}\n        </button>\n        <ng-content select=\"[additionalActions]\"></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [":host{--mm-form-bg: var(--kendo-color-surface);--mm-form-bg-alt: var(--kendo-color-surface-alt);--mm-form-bg-elevated: var(--kendo-color-surface-alt);--mm-form-border: var(--kendo-color-border);--mm-form-border-subtle: var(--kendo-color-border-alt, var(--mm-form-border));--mm-form-text: var(--kendo-color-on-app-surface);--mm-form-text-subtle: var(--kendo-color-subtle);--mm-form-text-label: var(--kendo-color-on-app-surface);--mm-form-accent: var(--kendo-color-primary);--mm-form-error: var(--kendo-color-error);--mm-form-status-ready: #37b400;--mm-form-status-modified: #da9162;--mm-form-padding: 1.5rem;--mm-form-padding-sm: 1rem;--mm-form-gap: .5rem;--mm-form-radius: 4px;--mm-form-shadow: 0 2px 6px rgba(0, 0, 0, .15);--mm-form-overlay-bg: var(--kendo-color-surface)}.mm-base-form-container{padding:var(--mm-form-padding);height:100%;overflow:auto}.mm-base-form-container .mm-form-wrapper{margin:0 auto}.mm-base-form-container.with-card .mm-form-wrapper{background:var(--mm-form-bg);border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);box-shadow:var(--mm-form-shadow)}.mm-base-form-container.with-card .mm-form-header{display:flex;align-items:center;gap:1rem;padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-bottom:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.with-card .mm-form-body{padding:var(--mm-form-padding)}.mm-base-form-container.with-card .mm-form-actions{padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-top:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.without-card .mm-form-wrapper{max-width:1200px}.mm-base-form-container.without-card .mm-form-title-standalone{margin-bottom:var(--mm-form-padding)}.mm-base-form-container.without-card .mm-form-actions{margin-top:var(--mm-form-padding);padding-top:var(--mm-form-padding);border-top:1px solid var(--mm-form-border)}.mm-base-form-container .mm-form-title-row{display:flex;align-items:center;gap:1rem}.mm-base-form-container .mm-form-title{font-size:1.5rem;font-weight:500;margin:0;color:var(--mm-form-text)}.mm-base-form-container .mm-modified-badge{display:inline-flex;align-items:center;padding:.25rem .75rem;font-size:.75rem;font-weight:600;color:var(--mm-form-status-modified);background:#da916226;border:1px solid rgba(218,145,98,.4);border-radius:var(--mm-form-radius);animation:pulse-badge 2s ease-in-out infinite}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.mm-base-form-container .mm-form-body{position:relative;min-height:100px}.mm-base-form-container .mm-form-actions{display:flex;gap:var(--mm-form-gap);justify-content:space-between;align-items:center}.mm-base-form-container .mm-form-status{display:flex;align-items:center}.mm-base-form-container .mm-status-indicator{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;background:#37b4001a;border:1px solid rgba(55,180,0,.3);border-radius:var(--mm-form-radius)}.mm-base-form-container .mm-status-indicator .mm-status-dot{width:8px;height:8px;border-radius:50%;background:var(--mm-form-status-ready);box-shadow:0 0 8px #37b40099;animation:pulse-dot 2s ease-in-out infinite}.mm-base-form-container .mm-status-indicator .mm-status-text{font-size:.7rem;font-weight:600;color:var(--mm-form-status-ready)}.mm-base-form-container .mm-status-indicator.modified{background:#da91621a;border-color:#da91624d}.mm-base-form-container .mm-status-indicator.modified .mm-status-dot{background:var(--mm-form-status-modified);box-shadow:0 0 8px #da916299}.mm-base-form-container .mm-status-indicator.modified .mm-status-text{color:var(--mm-form-status-modified)}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.6}}.mm-base-form-container .mm-form-buttons{display:flex;gap:var(--mm-form-gap)}.mm-base-form-container .mm-form-buttons button{min-width:100px}.mm-base-form-container .mm-loading-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--mm-form-overlay-bg);opacity:.95;z-index:10}.mm-base-form-container .mm-loading-overlay p{margin-top:1rem;color:var(--mm-form-text-subtle);font-size:1rem}::ng-deep .mm-base-form-container fieldset[kendoformfieldset],::ng-deep .mm-base-form-container .k-form-fieldset{border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);padding:var(--mm-form-padding);margin:0;background:var(--mm-form-bg-alt)}::ng-deep .mm-base-form-container fieldset[kendoformfieldset] legend,::ng-deep .mm-base-form-container fieldset[kendoformfieldset] .k-form-legend,::ng-deep .mm-base-form-container .k-form-fieldset legend,::ng-deep .mm-base-form-container .k-form-fieldset .k-form-legend{font-size:1.125rem;font-weight:500;color:var(--mm-form-accent);padding:0 .5rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label,::ng-deep .mm-base-form-container kendo-formfield .k-label,::ng-deep .mm-base-form-container .k-form-field kendo-label,::ng-deep .mm-base-form-container .k-form-field .k-label{font-weight:500;color:var(--mm-form-text-label);margin-bottom:.25rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label .k-required,::ng-deep .mm-base-form-container kendo-formfield .k-label .k-required,::ng-deep .mm-base-form-container .k-form-field kendo-label .k-required,::ng-deep .mm-base-form-container .k-form-field .k-label .k-required{color:var(--mm-form-error)}::ng-deep .mm-base-form-container kendo-formfield kendo-textbox,::ng-deep .mm-base-form-container kendo-formfield kendo-numerictextbox,::ng-deep .mm-base-form-container kendo-formfield kendo-textarea,::ng-deep .mm-base-form-container kendo-formfield kendo-datepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-datetimepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-timepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-dropdownlist,::ng-deep .mm-base-form-container kendo-formfield kendo-combobox,::ng-deep .mm-base-form-container kendo-formfield kendo-multiselect,::ng-deep .mm-base-form-container kendo-formfield kendo-autocomplete,::ng-deep .mm-base-form-container .k-form-field kendo-textbox,::ng-deep .mm-base-form-container .k-form-field kendo-numerictextbox,::ng-deep .mm-base-form-container .k-form-field kendo-textarea,::ng-deep .mm-base-form-container .k-form-field kendo-datepicker,::ng-deep .mm-base-form-container .k-form-field kendo-datetimepicker,::ng-deep .mm-base-form-container .k-form-field kendo-timepicker,::ng-deep .mm-base-form-container .k-form-field kendo-dropdownlist,::ng-deep .mm-base-form-container .k-form-field kendo-combobox,::ng-deep .mm-base-form-container .k-form-field kendo-multiselect,::ng-deep .mm-base-form-container .k-form-field kendo-autocomplete{width:100%}::ng-deep .mm-base-form-container kendo-formfield kendo-formhint,::ng-deep .mm-base-form-container kendo-formfield .k-form-hint,::ng-deep .mm-base-form-container .k-form-field kendo-formhint,::ng-deep .mm-base-form-container .k-form-field .k-form-hint{color:var(--mm-form-text-subtle);font-size:.875rem}::ng-deep .mm-base-form-container kendo-formfield kendo-formerror,::ng-deep .mm-base-form-container kendo-formfield .k-form-error,::ng-deep .mm-base-form-container .k-form-field kendo-formerror,::ng-deep .mm-base-form-container .k-form-field .k-form-error{color:var(--mm-form-error);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:var(--mm-form-radius);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator.success{background-color:var(--kendo-color-success-subtle);color:var(--kendo-color-success-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.warning{background-color:var(--kendo-color-warning-subtle);color:var(--kendo-color-warning-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.error{background-color:var(--kendo-color-error-subtle);color:var(--kendo-color-error-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.info{background-color:var(--kendo-color-info-subtle);color:var(--kendo-color-info-on-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: BaseFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mm-base-form', standalone: true, imports: [
                         CommonModule,
                         ButtonModule
-                    ], hostDirectives: [UnsavedChangesDirective], providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: BaseFormComponent }], changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"mm-base-form-container\" [class.with-card]=\"config.showCard\" [class.without-card]=\"!config.showCard\">\n  <!-- Title (no card mode) -->\n  <div *ngIf=\"!config.showCard && (title || titleExtra)\" class=\"mm-form-title-row mm-form-title-standalone\">\n    <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n    <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n    <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n  </div>\n\n  <!-- Main form wrapper - styled as card or plain based on CSS class -->\n  <div class=\"mm-form-wrapper\" [style.maxWidth]=\"config.showCard ? (config.cardWidth || '800px') : null\">\n    <!-- Card header (only in card mode) -->\n    <div *ngIf=\"config.showCard && (title || titleExtra)\" class=\"mm-form-header\">\n      <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n      <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n      <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n    </div>\n\n    <!-- Form body with content projection -->\n    <div class=\"mm-form-body\">\n      <div *ngIf=\"config.isLoading && config.showLoadingOverlay\" class=\"mm-loading-overlay\">\n        <div class=\"k-loader k-loader-lg\"></div>\n        <p>{{ loadingText }}</p>\n      </div>\n      <ng-content></ng-content>\n    </div>\n\n    <!-- Form actions -->\n    <div class=\"mm-form-actions\">\n      <!-- Status indicator (left side) -->\n      <div class=\"mm-form-status\">\n        <span class=\"mm-status-indicator\" [class.modified]=\"config.hasChanges\">\n          <span class=\"mm-status-dot\"></span>\n          <span class=\"mm-status-text\">{{ config.hasChanges ? modifiedText : readyText }}</span>\n        </span>\n      </div>\n\n      <!-- Action buttons (right side) -->\n      <div class=\"mm-form-buttons\">\n        <button\n          *ngIf=\"showSaveButton\"\n          kendoButton\n          type=\"submit\"\n          [svgIcon]=\"saveIcon\"\n          themeColor=\"primary\"\n          [disabled]=\"saveButtonDisabled\"\n          (click)=\"onSave()\">\n          {{ saveButtonText }}\n        </button>\n        <button\n          *ngIf=\"showCancelButton\"\n          kendoButton\n          type=\"button\"\n          [svgIcon]=\"cancelIcon\"\n          [disabled]=\"!!config.isSaving\"\n          (click)=\"onCancel()\">\n          {{ cancelButtonText }}\n        </button>\n        <ng-content select=\"[additionalActions]\"></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [":host{--mm-form-bg: var(--kendo-color-surface);--mm-form-bg-alt: var(--kendo-color-surface-alt);--mm-form-bg-elevated: var(--kendo-color-surface-alt);--mm-form-border: var(--kendo-color-border);--mm-form-border-subtle: var(--kendo-color-border-alt, var(--mm-form-border));--mm-form-text: var(--kendo-color-on-app-surface);--mm-form-text-subtle: var(--kendo-color-subtle);--mm-form-text-label: var(--kendo-color-on-app-surface);--mm-form-accent: var(--kendo-color-primary);--mm-form-error: var(--kendo-color-error);--mm-form-status-ready: #37b400;--mm-form-status-modified: #da9162;--mm-form-padding: 1.5rem;--mm-form-padding-sm: 1rem;--mm-form-gap: .5rem;--mm-form-radius: 4px;--mm-form-shadow: 0 2px 6px rgba(0, 0, 0, .15);--mm-form-overlay-bg: var(--kendo-color-surface)}.mm-base-form-container{padding:var(--mm-form-padding);height:100%;overflow:auto}.mm-base-form-container .mm-form-wrapper{margin:0 auto}.mm-base-form-container.with-card .mm-form-wrapper{background:var(--mm-form-bg);border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);box-shadow:var(--mm-form-shadow)}.mm-base-form-container.with-card .mm-form-header{display:flex;align-items:center;gap:1rem;padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-bottom:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.with-card .mm-form-body{padding:var(--mm-form-padding)}.mm-base-form-container.with-card .mm-form-actions{padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-top:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.without-card .mm-form-wrapper{max-width:1200px}.mm-base-form-container.without-card .mm-form-title-standalone{margin-bottom:var(--mm-form-padding)}.mm-base-form-container.without-card .mm-form-actions{margin-top:var(--mm-form-padding);padding-top:var(--mm-form-padding);border-top:1px solid var(--mm-form-border)}.mm-base-form-container .mm-form-title-row{display:flex;align-items:center;gap:1rem}.mm-base-form-container .mm-form-title{font-size:1.5rem;font-weight:500;margin:0;color:var(--mm-form-text)}.mm-base-form-container .mm-modified-badge{display:inline-flex;align-items:center;padding:.25rem .75rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--mm-form-status-modified);background:#da916226;border:1px solid rgba(218,145,98,.4);border-radius:var(--mm-form-radius);animation:pulse-badge 2s ease-in-out infinite}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.mm-base-form-container .mm-form-body{position:relative;min-height:100px}.mm-base-form-container .mm-form-actions{display:flex;gap:var(--mm-form-gap);justify-content:space-between;align-items:center}.mm-base-form-container .mm-form-status{display:flex;align-items:center}.mm-base-form-container .mm-status-indicator{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;background:#37b4001a;border:1px solid rgba(55,180,0,.3);border-radius:var(--mm-form-radius)}.mm-base-form-container .mm-status-indicator .mm-status-dot{width:8px;height:8px;border-radius:50%;background:var(--mm-form-status-ready);box-shadow:0 0 8px #37b40099;animation:pulse-dot 2s ease-in-out infinite}.mm-base-form-container .mm-status-indicator .mm-status-text{font-size:.7rem;font-weight:600;letter-spacing:1px;color:var(--mm-form-status-ready);text-transform:uppercase}.mm-base-form-container .mm-status-indicator.modified{background:#da91621a;border-color:#da91624d}.mm-base-form-container .mm-status-indicator.modified .mm-status-dot{background:var(--mm-form-status-modified);box-shadow:0 0 8px #da916299}.mm-base-form-container .mm-status-indicator.modified .mm-status-text{color:var(--mm-form-status-modified)}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.6}}.mm-base-form-container .mm-form-buttons{display:flex;gap:var(--mm-form-gap)}.mm-base-form-container .mm-form-buttons button{min-width:100px}.mm-base-form-container .mm-loading-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--mm-form-overlay-bg);opacity:.95;z-index:10}.mm-base-form-container .mm-loading-overlay p{margin-top:1rem;color:var(--mm-form-text-subtle);font-size:1rem}::ng-deep .mm-base-form-container fieldset[kendoformfieldset],::ng-deep .mm-base-form-container .k-form-fieldset{border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);padding:var(--mm-form-padding);margin:0;background:var(--mm-form-bg-alt)}::ng-deep .mm-base-form-container fieldset[kendoformfieldset] legend,::ng-deep .mm-base-form-container fieldset[kendoformfieldset] .k-form-legend,::ng-deep .mm-base-form-container .k-form-fieldset legend,::ng-deep .mm-base-form-container .k-form-fieldset .k-form-legend{font-size:1.125rem;font-weight:500;color:var(--mm-form-accent);padding:0 .5rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label,::ng-deep .mm-base-form-container kendo-formfield .k-label,::ng-deep .mm-base-form-container .k-form-field kendo-label,::ng-deep .mm-base-form-container .k-form-field .k-label{font-weight:500;color:var(--mm-form-text-label);margin-bottom:.25rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label .k-required,::ng-deep .mm-base-form-container kendo-formfield .k-label .k-required,::ng-deep .mm-base-form-container .k-form-field kendo-label .k-required,::ng-deep .mm-base-form-container .k-form-field .k-label .k-required{color:var(--mm-form-error)}::ng-deep .mm-base-form-container kendo-formfield kendo-textbox,::ng-deep .mm-base-form-container kendo-formfield kendo-numerictextbox,::ng-deep .mm-base-form-container kendo-formfield kendo-textarea,::ng-deep .mm-base-form-container kendo-formfield kendo-datepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-datetimepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-timepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-dropdownlist,::ng-deep .mm-base-form-container kendo-formfield kendo-combobox,::ng-deep .mm-base-form-container kendo-formfield kendo-multiselect,::ng-deep .mm-base-form-container kendo-formfield kendo-autocomplete,::ng-deep .mm-base-form-container .k-form-field kendo-textbox,::ng-deep .mm-base-form-container .k-form-field kendo-numerictextbox,::ng-deep .mm-base-form-container .k-form-field kendo-textarea,::ng-deep .mm-base-form-container .k-form-field kendo-datepicker,::ng-deep .mm-base-form-container .k-form-field kendo-datetimepicker,::ng-deep .mm-base-form-container .k-form-field kendo-timepicker,::ng-deep .mm-base-form-container .k-form-field kendo-dropdownlist,::ng-deep .mm-base-form-container .k-form-field kendo-combobox,::ng-deep .mm-base-form-container .k-form-field kendo-multiselect,::ng-deep .mm-base-form-container .k-form-field kendo-autocomplete{width:100%}::ng-deep .mm-base-form-container kendo-formfield kendo-formhint,::ng-deep .mm-base-form-container kendo-formfield .k-form-hint,::ng-deep .mm-base-form-container .k-form-field kendo-formhint,::ng-deep .mm-base-form-container .k-form-field .k-form-hint{color:var(--mm-form-text-subtle);font-size:.875rem}::ng-deep .mm-base-form-container kendo-formfield kendo-formerror,::ng-deep .mm-base-form-container kendo-formfield .k-form-error,::ng-deep .mm-base-form-container .k-form-field kendo-formerror,::ng-deep .mm-base-form-container .k-form-field .k-form-error{color:var(--mm-form-error);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:var(--mm-form-radius);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator.success{background-color:var(--kendo-color-success-subtle);color:var(--kendo-color-success-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.warning{background-color:var(--kendo-color-warning-subtle);color:var(--kendo-color-warning-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.error{background-color:var(--kendo-color-error-subtle);color:var(--kendo-color-error-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.info{background-color:var(--kendo-color-info-subtle);color:var(--kendo-color-info-on-subtle)}\n"] }]
+                    ], hostDirectives: [UnsavedChangesDirective], providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: BaseFormComponent }], changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"mm-base-form-container\" [class.with-card]=\"config.showCard\" [class.without-card]=\"!config.showCard\">\n  <!-- Title (no card mode) -->\n  <div *ngIf=\"!config.showCard && (title || titleExtra)\" class=\"mm-form-title-row mm-form-title-standalone\">\n    <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n    <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n    <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n  </div>\n\n  <!-- Main form wrapper - styled as card or plain based on CSS class -->\n  <div class=\"mm-form-wrapper\" [style.maxWidth]=\"config.showCard ? (config.cardWidth || '800px') : null\">\n    <!-- Card header (only in card mode) -->\n    <div *ngIf=\"config.showCard && (title || titleExtra)\" class=\"mm-form-header\">\n      <h2 *ngIf=\"title\" class=\"mm-form-title\">{{ title }}</h2>\n      <ng-container *ngIf=\"titleExtra\" [ngTemplateOutlet]=\"titleExtra.templateRef\"></ng-container>\n      <span *ngIf=\"config.hasChanges\" class=\"mm-modified-badge\">{{ unsavedChangesText }}</span>\n    </div>\n\n    <!-- Form body with content projection -->\n    <div class=\"mm-form-body\">\n      <div *ngIf=\"config.isLoading && config.showLoadingOverlay\" class=\"mm-loading-overlay\">\n        <div class=\"k-loader k-loader-lg\"></div>\n        <p>{{ loadingText }}</p>\n      </div>\n      <ng-content></ng-content>\n    </div>\n\n    <!-- Form actions -->\n    <div class=\"mm-form-actions\">\n      <!-- Status indicator (left side) -->\n      <div class=\"mm-form-status\">\n        <span class=\"mm-status-indicator\" [class.modified]=\"config.hasChanges\">\n          <span class=\"mm-status-dot\"></span>\n          <span class=\"mm-status-text\">{{ config.hasChanges ? modifiedText : readyText }}</span>\n        </span>\n      </div>\n\n      <!-- Action buttons (right side) -->\n      <div class=\"mm-form-buttons\">\n        <button\n          *ngIf=\"showSaveButton\"\n          kendoButton\n          type=\"submit\"\n          [svgIcon]=\"saveIcon\"\n          themeColor=\"primary\"\n          [disabled]=\"saveButtonDisabled\"\n          (click)=\"onSave()\">\n          {{ saveButtonText }}\n        </button>\n        <button\n          *ngIf=\"showCancelButton\"\n          kendoButton\n          type=\"button\"\n          [svgIcon]=\"cancelIcon\"\n          [disabled]=\"!!config.isSaving\"\n          (click)=\"onCancel()\">\n          {{ cancelButtonText }}\n        </button>\n        <ng-content select=\"[additionalActions]\"></ng-content>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [":host{--mm-form-bg: var(--kendo-color-surface);--mm-form-bg-alt: var(--kendo-color-surface-alt);--mm-form-bg-elevated: var(--kendo-color-surface-alt);--mm-form-border: var(--kendo-color-border);--mm-form-border-subtle: var(--kendo-color-border-alt, var(--mm-form-border));--mm-form-text: var(--kendo-color-on-app-surface);--mm-form-text-subtle: var(--kendo-color-subtle);--mm-form-text-label: var(--kendo-color-on-app-surface);--mm-form-accent: var(--kendo-color-primary);--mm-form-error: var(--kendo-color-error);--mm-form-status-ready: #37b400;--mm-form-status-modified: #da9162;--mm-form-padding: 1.5rem;--mm-form-padding-sm: 1rem;--mm-form-gap: .5rem;--mm-form-radius: 4px;--mm-form-shadow: 0 2px 6px rgba(0, 0, 0, .15);--mm-form-overlay-bg: var(--kendo-color-surface)}.mm-base-form-container{padding:var(--mm-form-padding);height:100%;overflow:auto}.mm-base-form-container .mm-form-wrapper{margin:0 auto}.mm-base-form-container.with-card .mm-form-wrapper{background:var(--mm-form-bg);border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);box-shadow:var(--mm-form-shadow)}.mm-base-form-container.with-card .mm-form-header{display:flex;align-items:center;gap:1rem;padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-bottom:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.with-card .mm-form-body{padding:var(--mm-form-padding)}.mm-base-form-container.with-card .mm-form-actions{padding:var(--mm-form-padding-sm) var(--mm-form-padding);border-top:1px solid var(--mm-form-border);background:var(--mm-form-bg-alt)}.mm-base-form-container.without-card .mm-form-wrapper{max-width:1200px}.mm-base-form-container.without-card .mm-form-title-standalone{margin-bottom:var(--mm-form-padding)}.mm-base-form-container.without-card .mm-form-actions{margin-top:var(--mm-form-padding);padding-top:var(--mm-form-padding);border-top:1px solid var(--mm-form-border)}.mm-base-form-container .mm-form-title-row{display:flex;align-items:center;gap:1rem}.mm-base-form-container .mm-form-title{font-size:1.5rem;font-weight:500;margin:0;color:var(--mm-form-text)}.mm-base-form-container .mm-modified-badge{display:inline-flex;align-items:center;padding:.25rem .75rem;font-size:.75rem;font-weight:600;color:var(--mm-form-status-modified);background:#da916226;border:1px solid rgba(218,145,98,.4);border-radius:var(--mm-form-radius);animation:pulse-badge 2s ease-in-out infinite}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.mm-base-form-container .mm-form-body{position:relative;min-height:100px}.mm-base-form-container .mm-form-actions{display:flex;gap:var(--mm-form-gap);justify-content:space-between;align-items:center}.mm-base-form-container .mm-form-status{display:flex;align-items:center}.mm-base-form-container .mm-status-indicator{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;background:#37b4001a;border:1px solid rgba(55,180,0,.3);border-radius:var(--mm-form-radius)}.mm-base-form-container .mm-status-indicator .mm-status-dot{width:8px;height:8px;border-radius:50%;background:var(--mm-form-status-ready);box-shadow:0 0 8px #37b40099;animation:pulse-dot 2s ease-in-out infinite}.mm-base-form-container .mm-status-indicator .mm-status-text{font-size:.7rem;font-weight:600;color:var(--mm-form-status-ready)}.mm-base-form-container .mm-status-indicator.modified{background:#da91621a;border-color:#da91624d}.mm-base-form-container .mm-status-indicator.modified .mm-status-dot{background:var(--mm-form-status-modified);box-shadow:0 0 8px #da916299}.mm-base-form-container .mm-status-indicator.modified .mm-status-text{color:var(--mm-form-status-modified)}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.6}}.mm-base-form-container .mm-form-buttons{display:flex;gap:var(--mm-form-gap)}.mm-base-form-container .mm-form-buttons button{min-width:100px}.mm-base-form-container .mm-loading-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--mm-form-overlay-bg);opacity:.95;z-index:10}.mm-base-form-container .mm-loading-overlay p{margin-top:1rem;color:var(--mm-form-text-subtle);font-size:1rem}::ng-deep .mm-base-form-container fieldset[kendoformfieldset],::ng-deep .mm-base-form-container .k-form-fieldset{border:1px solid var(--mm-form-border);border-radius:var(--mm-form-radius);padding:var(--mm-form-padding);margin:0;background:var(--mm-form-bg-alt)}::ng-deep .mm-base-form-container fieldset[kendoformfieldset] legend,::ng-deep .mm-base-form-container fieldset[kendoformfieldset] .k-form-legend,::ng-deep .mm-base-form-container .k-form-fieldset legend,::ng-deep .mm-base-form-container .k-form-fieldset .k-form-legend{font-size:1.125rem;font-weight:500;color:var(--mm-form-accent);padding:0 .5rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label,::ng-deep .mm-base-form-container kendo-formfield .k-label,::ng-deep .mm-base-form-container .k-form-field kendo-label,::ng-deep .mm-base-form-container .k-form-field .k-label{font-weight:500;color:var(--mm-form-text-label);margin-bottom:.25rem}::ng-deep .mm-base-form-container kendo-formfield kendo-label .k-required,::ng-deep .mm-base-form-container kendo-formfield .k-label .k-required,::ng-deep .mm-base-form-container .k-form-field kendo-label .k-required,::ng-deep .mm-base-form-container .k-form-field .k-label .k-required{color:var(--mm-form-error)}::ng-deep .mm-base-form-container kendo-formfield kendo-textbox,::ng-deep .mm-base-form-container kendo-formfield kendo-numerictextbox,::ng-deep .mm-base-form-container kendo-formfield kendo-textarea,::ng-deep .mm-base-form-container kendo-formfield kendo-datepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-datetimepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-timepicker,::ng-deep .mm-base-form-container kendo-formfield kendo-dropdownlist,::ng-deep .mm-base-form-container kendo-formfield kendo-combobox,::ng-deep .mm-base-form-container kendo-formfield kendo-multiselect,::ng-deep .mm-base-form-container kendo-formfield kendo-autocomplete,::ng-deep .mm-base-form-container .k-form-field kendo-textbox,::ng-deep .mm-base-form-container .k-form-field kendo-numerictextbox,::ng-deep .mm-base-form-container .k-form-field kendo-textarea,::ng-deep .mm-base-form-container .k-form-field kendo-datepicker,::ng-deep .mm-base-form-container .k-form-field kendo-datetimepicker,::ng-deep .mm-base-form-container .k-form-field kendo-timepicker,::ng-deep .mm-base-form-container .k-form-field kendo-dropdownlist,::ng-deep .mm-base-form-container .k-form-field kendo-combobox,::ng-deep .mm-base-form-container .k-form-field kendo-multiselect,::ng-deep .mm-base-form-container .k-form-field kendo-autocomplete{width:100%}::ng-deep .mm-base-form-container kendo-formfield kendo-formhint,::ng-deep .mm-base-form-container kendo-formfield .k-form-hint,::ng-deep .mm-base-form-container .k-form-field kendo-formhint,::ng-deep .mm-base-form-container .k-form-field .k-form-hint{color:var(--mm-form-text-subtle);font-size:.875rem}::ng-deep .mm-base-form-container kendo-formfield kendo-formerror,::ng-deep .mm-base-form-container kendo-formfield .k-form-error,::ng-deep .mm-base-form-container .k-form-field kendo-formerror,::ng-deep .mm-base-form-container .k-form-field .k-form-error{color:var(--mm-form-error);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:var(--mm-form-radius);font-size:.875rem}::ng-deep .mm-base-form-container .status-indicator.success{background-color:var(--kendo-color-success-subtle);color:var(--kendo-color-success-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.warning{background-color:var(--kendo-color-warning-subtle);color:var(--kendo-color-warning-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.error{background-color:var(--kendo-color-error-subtle);color:var(--kendo-color-error-on-subtle)}::ng-deep .mm-base-form-container .status-indicator.info{background-color:var(--kendo-color-info-subtle);color:var(--kendo-color-info-on-subtle)}\n"] }]
         }], propDecorators: { titleExtra: [{
                 type: ContentChild,
                 args: [FormTitleExtraDirective]
@@ -3914,7 +5087,7 @@ class EntitySelectDialogComponent {
         </button>
       </div>
     </div>
-  `, isInline: true, styles: [":host{display:flex;flex-direction:column;height:100%}.entity-select-dialog-content{display:flex;flex-direction:column;flex:1;min-height:0;padding:16px 20px;box-sizing:border-box;gap:12px}.search-toolbar{flex-shrink:0}.entity-grid{flex:1;min-height:200px;border:1px solid var(--kendo-color-border)}.selection-info{padding:8px 0;font-size:12px;color:var(--kendo-color-subtle);flex-shrink:0}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: WindowModule }, { kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "adaptiveMode", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "gridResizable", "rowReorderable", "navigable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "showInactiveTools", "isDetailExpanded", "isGroupExpanded", "dataLayoutMode", "pinnable", "pinnedTopRows", "pinnedBottomRows", "isRowPinnable"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "rowPinChange", "dataStateChange", "gridStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "csvExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "component", type: ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterVariant", "filterable", "editable"] }, { kind: "component", type: CheckboxColumnComponent, selector: "kendo-grid-checkbox-column", inputs: ["showSelectAll", "showDisabledCheckbox"] }, { kind: "component", type: CustomMessagesComponent, selector: "kendo-grid-messages" }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "pipe", type: PascalCasePipe, name: "pascalCase" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+  `, isInline: true, styles: [":host{display:flex;flex-direction:column;height:100%}.entity-select-dialog-content{display:flex;flex-direction:column;flex:1;min-height:0;padding:16px 20px;box-sizing:border-box;gap:12px}.search-toolbar{flex-shrink:0}.entity-grid{flex:1;min-height:200px;border:1px solid var(--kendo-color-border)}.selection-info{padding:8px 0;font-size:12px;color:var(--kendo-color-subtle);flex-shrink:0}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: WindowModule }, { kind: "component", type: GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "adaptiveMode", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "size", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "gridResizable", "rowReorderable", "navigable", "autoSize", "rowClass", "rowSticky", "rowSelected", "isRowSelectable", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "showInactiveTools", "isDetailExpanded", "isGroupExpanded", "dataLayoutMode", "pinnable", "pinnedTopRows", "pinnedBottomRows", "isRowPinnable"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "rowReorder", "rowPinChange", "dataStateChange", "gridStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "csvExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { kind: "component", type: ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterVariant", "filterable", "editable"] }, { kind: "component", type: CheckboxColumnComponent, selector: "kendo-grid-checkbox-column", inputs: ["showSelectAll", "showDisabledCheckbox"] }, { kind: "component", type: CustomMessagesComponent, selector: "kendo-grid-messages" }, { kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "pipe", type: PascalCasePipe, name: "pascalCase" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EntitySelectDialogComponent, decorators: [{
             type: Component,
@@ -4385,7 +5558,7 @@ class EntitySelectInputComponent {
               (click)="openAdvancedSearch()">
       </button>
     </div>
-  `, isInline: true, styles: [":host{display:block;width:100%}.entity-select-wrapper{position:relative;display:flex;align-items:center;width:100%;gap:4px}.entity-select-wrapper.disabled{opacity:.6;pointer-events:none}.entity-autocomplete{flex:1;min-width:0}.dialog-button{flex-shrink:0;height:30px;width:30px;padding:0;display:flex;align-items:center;justify-content:center}.clear-button{position:absolute;right:32px;top:50%;transform:translateY(-50%);z-index:1;padding:4px;min-width:auto;height:20px;width:20px}.entity-item{padding:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-data-message{padding:8px 12px;color:var(--kendo-color-subtle);font-style:italic;text-align:center}.advanced-search-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;color:var(--kendo-color-primary);border-top:1px solid var(--kendo-color-border);background:var(--kendo-color-surface-alt);transition:background-color .2s}.advanced-search-footer:hover{background:var(--kendo-color-base-hover)}::ng-deep .entity-autocomplete .k-input-inner{padding-right:60px!important}::ng-deep .entity-autocomplete.k-disabled .k-input-inner{padding-right:32px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i3$1.AutoCompleteComponent, selector: "kendo-autocomplete", inputs: ["highlightFirst", "showStickyHeader", "focusableId", "data", "value", "valueField", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "loading", "clearButton", "suggest", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoAutoComplete"] }, { kind: "directive", type: i3$1.FooterTemplateDirective, selector: "[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]" }, { kind: "directive", type: i3$1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i3$1.NoDataTemplateDirective, selector: "[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]" }, { kind: "ngmodule", type: LoaderModule }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: IconsModule }, { kind: "component", type: i3.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }, { kind: "ngmodule", type: SVGIconModule }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+  `, isInline: true, styles: [":host{display:block;width:100%}.entity-select-wrapper{position:relative;display:flex;align-items:center;width:100%;gap:4px}.entity-select-wrapper.disabled{opacity:.6;pointer-events:none}.entity-autocomplete{flex:1;min-width:0}.dialog-button{flex-shrink:0;height:30px;width:30px;padding:0;display:flex;align-items:center;justify-content:center}.clear-button{position:absolute;right:32px;top:50%;transform:translateY(-50%);z-index:1;padding:4px;min-width:auto;height:20px;width:20px}.entity-item{padding:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-data-message{padding:8px 12px;color:var(--kendo-color-subtle);font-style:italic;text-align:center}.advanced-search-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;color:var(--kendo-color-primary);border-top:1px solid var(--kendo-color-border);background:var(--kendo-color-surface-alt);transition:background-color .2s}.advanced-search-footer:hover{background:var(--kendo-color-base-hover)}::ng-deep .entity-autocomplete .k-input-inner{padding-right:60px!important}::ng-deep .entity-autocomplete.k-disabled .k-input-inner{padding-right:32px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i3.AutoCompleteComponent, selector: "kendo-autocomplete", inputs: ["highlightFirst", "showStickyHeader", "focusableId", "data", "value", "valueField", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "loading", "clearButton", "suggest", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoAutoComplete"] }, { kind: "directive", type: i3.FooterTemplateDirective, selector: "[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]" }, { kind: "directive", type: i3.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i3.NoDataTemplateDirective, selector: "[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]" }, { kind: "ngmodule", type: LoaderModule }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: IconsModule }, { kind: "component", type: i2.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }, { kind: "ngmodule", type: SVGIconModule }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EntitySelectInputComponent, decorators: [{
             type: Component,
@@ -4782,7 +5955,7 @@ class SaveAsDialogComponent extends DialogContentBase {
         {{ saveButtonText }}
       </button>
     </kendo-dialog-actions>
-  `, isInline: true, styles: [".save-as-container{padding:20px;min-width:350px}.form-group{display:flex;flex-direction:column;gap:8px}.name-input{width:100%}.validation-container{min-height:24px}.validation-message{font-size:12px;padding:4px 0}.validation-message.error{color:var(--kendo-color-error, #dc3545)}.validation-message.success{color:var(--kendo-color-success, #28a745)}.availability-check{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--kendo-color-subtle, #6c757d)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i3$2.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "ngmodule", type: LabelModule }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "ngmodule", type: IndicatorsModule }, { kind: "component", type: i7.LoaderComponent, selector: "kendo-loader", inputs: ["type", "themeColor", "size"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+  `, isInline: true, styles: [".save-as-container{padding:20px;min-width:350px}.form-group{display:flex;flex-direction:column;gap:8px}.name-input{width:100%}.validation-container{min-height:24px}.validation-message{font-size:12px;padding:4px 0}.validation-message.error{color:var(--kendo-color-error, #dc3545)}.validation-message.success{color:var(--kendo-color-success, #28a745)}.availability-check{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--kendo-color-subtle, #6c757d)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i3$1.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "ngmodule", type: LabelModule }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "ngmodule", type: IndicatorsModule }, { kind: "component", type: i7.LoaderComponent, selector: "kendo-loader", inputs: ["type", "themeColor", "size"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: SaveAsDialogComponent, decorators: [{
             type: Component,
@@ -5501,7 +6674,7 @@ class TimeRangePickerComponent {
         return this.selectedType() === type;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TimeRangePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: TimeRangePickerComponent, isStandalone: true, selector: "mm-time-range-picker", inputs: { config: "config", labels: "labels", initialSelection: "initialSelection" }, outputs: { rangeChange: "rangeChange", rangeChangeISO: "rangeChangeISO", selectionChange: "selectionChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"time-range-picker\">\n  <!-- Range Type Selection -->\n  <div class=\"picker-field type-field\">\n    <kendo-label [text]=\"mergedLabels().rangeType || 'Range Type'\">\n      <kendo-dropdownlist\n        [data]=\"typeOptions()\"\n        [value]=\"selectedType()\"\n        textField=\"label\"\n        valueField=\"value\"\n        [valuePrimitive]=\"true\"\n        (valueChange)=\"onTypeChange($event)\">\n      </kendo-dropdownlist>\n    </kendo-label>\n  </div>\n\n  <!-- Year Selection (for year, quarter, month, day types) -->\n  @if (isType('year') || isType('quarter') || isType('month') || isType('day')) {\n    <div class=\"picker-field year-field\">\n      <kendo-label [text]=\"mergedLabels().year || 'Year'\">\n        <kendo-dropdownlist\n          [data]=\"yearOptions()\"\n          [value]=\"selectedYear()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onYearChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Quarter Selection -->\n  @if (isType('quarter')) {\n    <div class=\"picker-field quarter-field\">\n      <kendo-label [text]=\"mergedLabels().quarter || 'Quarter'\">\n        <kendo-dropdownlist\n          [data]=\"quarterOptions()\"\n          [value]=\"selectedQuarter()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onQuarterChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Month Selection -->\n  @if (isType('month') || isType('day')) {\n    <div class=\"picker-field month-field\">\n      <kendo-label [text]=\"mergedLabels().month || 'Month'\">\n        <kendo-dropdownlist\n          [data]=\"monthOptions()\"\n          [value]=\"selectedMonth()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onMonthChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Day Selection -->\n  @if (isType('day')) {\n    <div class=\"picker-field day-field\">\n      <kendo-label [text]=\"mergedLabels().day || 'Day'\">\n        <kendo-dropdownlist\n          [data]=\"dayOptions()\"\n          [value]=\"selectedDay()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onDayChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n\n    <!-- Hour From Selection (optional) -->\n    <div class=\"picker-field hour-from-field\">\n      <kendo-label [text]=\"mergedLabels().hourFrom || 'From Hour'\">\n        <kendo-dropdownlist\n          [data]=\"hourFromOptions()\"\n          [value]=\"hourFrom()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          [defaultItem]=\"{ value: null, label: '\u2014' }\"\n          (valueChange)=\"onHourFromChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n\n    <!-- Hour To Selection (visible when hourFrom is set) -->\n    @if (hourFrom() !== null) {\n      <div class=\"picker-field hour-to-field\">\n        <kendo-label [text]=\"mergedLabels().hourTo || 'To Hour'\">\n          <kendo-dropdownlist\n            [data]=\"hourToOptions()\"\n            [value]=\"hourTo()\"\n            textField=\"label\"\n            valueField=\"value\"\n            [valuePrimitive]=\"true\"\n            (valueChange)=\"onHourToChange($event)\">\n          </kendo-dropdownlist>\n        </kendo-label>\n      </div>\n    }\n  }\n\n  <!-- Relative Time Selection -->\n  @if (isType('relative')) {\n    <div class=\"picker-field relative-value-field\">\n      <kendo-label [text]=\"mergedLabels().relativeValue || 'Last'\">\n        <kendo-numerictextbox\n          [value]=\"relativeValue()\"\n          [min]=\"1\"\n          [max]=\"9999\"\n          [decimals]=\"0\"\n          [format]=\"'n0'\"\n          [spinners]=\"true\"\n          (valueChange)=\"onRelativeValueChange($event)\">\n        </kendo-numerictextbox>\n      </kendo-label>\n    </div>\n\n    <div class=\"picker-field relative-unit-field\">\n      <kendo-label [text]=\"mergedLabels().relativeUnit || 'Unit'\">\n        <kendo-dropdownlist\n          [data]=\"relativeUnitOptions()\"\n          [value]=\"relativeUnit()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onRelativeUnitChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Custom Date Range -->\n  @if (isType('custom')) {\n    <div class=\"picker-field custom-from-field\">\n      <kendo-label [text]=\"mergedLabels().customFrom || 'From'\">\n        @if (showTime()) {\n          <kendo-datetimepicker\n            [value]=\"customFrom()\"\n            [min]=\"minDate()\"\n            [max]=\"customTo()\"\n            (valueChange)=\"onCustomFromChange($event)\">\n          </kendo-datetimepicker>\n        } @else {\n          <kendo-datepicker\n            [value]=\"customFrom()\"\n            [min]=\"minDate()\"\n            [max]=\"customTo()\"\n            (valueChange)=\"onCustomFromChange($event)\">\n          </kendo-datepicker>\n        }\n      </kendo-label>\n    </div>\n\n    <div class=\"picker-field custom-to-field\">\n      <kendo-label [text]=\"mergedLabels().customTo || 'To'\">\n        @if (showTime()) {\n          <kendo-datetimepicker\n            [value]=\"customTo()\"\n            [min]=\"customFrom()\"\n            [max]=\"maxDate()\"\n            (valueChange)=\"onCustomToChange($event)\">\n          </kendo-datetimepicker>\n        } @else {\n          <kendo-datepicker\n            [value]=\"customTo()\"\n            [min]=\"customFrom()\"\n            [max]=\"maxDate()\"\n            (valueChange)=\"onCustomToChange($event)\">\n          </kendo-datepicker>\n        }\n      </kendo-label>\n    </div>\n  }\n</div>\n", styles: [".time-range-picker{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end}.time-range-picker .picker-field{display:flex;flex-direction:column}.time-range-picker .picker-field kendo-label{display:flex;flex-direction:column;gap:.25rem}.time-range-picker .type-field{min-width:120px}.time-range-picker .year-field{min-width:100px}.time-range-picker .quarter-field{min-width:140px}.time-range-picker .month-field{min-width:130px}.time-range-picker .relative-value-field{min-width:80px}.time-range-picker .relative-value-field kendo-numerictextbox{width:100%}.time-range-picker .relative-unit-field{min-width:100px}.time-range-picker .custom-from-field,.time-range-picker .custom-to-field{min-width:150px}.time-range-picker .custom-from-field kendo-datepicker,.time-range-picker .custom-from-field kendo-datetimepicker,.time-range-picker .custom-to-field kendo-datepicker,.time-range-picker .custom-to-field kendo-datetimepicker{width:100%}@media(max-width:768px){.time-range-picker{gap:.75rem}.time-range-picker .picker-field{flex:1 1 calc(50% - .5rem);min-width:0}.time-range-picker .type-field{flex:1 1 100%}}@media(max-width:480px){.time-range-picker{flex-direction:column;gap:.5rem}.time-range-picker .picker-field{flex:1 1 100%;width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: DropDownListModule }, { kind: "component", type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$1.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "adaptiveTitle", "adaptiveSubtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "ngmodule", type: DateTimePickerModule }, { kind: "component", type: i2$1.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "weekDaysFormat", "showOtherMonthDays", "value", "format", "twoDigitYearMax", "tabindex", "disabledDates", "popupSettings", "adaptiveTitle", "adaptiveSubtitle", "disabled", "readonly", "readOnlyInput", "cancelButton", "formatPlaceholder", "placeholder", "steps", "focusedDate", "calendarType", "animateCalendarNavigation", "weekNumber", "min", "max", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "clearButton", "autoFill", "adaptiveMode", "inputAttributes", "defaultTab", "size", "rounded", "fillMode", "headerTemplate", "footerTemplate", "footer"], outputs: ["valueChange", "open", "close", "focus", "blur", "escape"], exportAs: ["kendo-datetimepicker"] }, { kind: "ngmodule", type: NumericTextBoxModule }, { kind: "component", type: i5.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "ngmodule", type: LabelModule }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: TimeRangePickerComponent, isStandalone: true, selector: "mm-time-range-picker", inputs: { config: "config", labels: "labels", initialSelection: "initialSelection" }, outputs: { rangeChange: "rangeChange", rangeChangeISO: "rangeChangeISO", selectionChange: "selectionChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"time-range-picker\">\n  <!-- Range Type Selection -->\n  <div class=\"picker-field type-field\">\n    <kendo-label [text]=\"mergedLabels().rangeType || 'Range Type'\">\n      <kendo-dropdownlist\n        [data]=\"typeOptions()\"\n        [value]=\"selectedType()\"\n        textField=\"label\"\n        valueField=\"value\"\n        [valuePrimitive]=\"true\"\n        (valueChange)=\"onTypeChange($event)\">\n      </kendo-dropdownlist>\n    </kendo-label>\n  </div>\n\n  <!-- Year Selection (for year, quarter, month, day types) -->\n  @if (isType('year') || isType('quarter') || isType('month') || isType('day')) {\n    <div class=\"picker-field year-field\">\n      <kendo-label [text]=\"mergedLabels().year || 'Year'\">\n        <kendo-dropdownlist\n          [data]=\"yearOptions()\"\n          [value]=\"selectedYear()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onYearChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Quarter Selection -->\n  @if (isType('quarter')) {\n    <div class=\"picker-field quarter-field\">\n      <kendo-label [text]=\"mergedLabels().quarter || 'Quarter'\">\n        <kendo-dropdownlist\n          [data]=\"quarterOptions()\"\n          [value]=\"selectedQuarter()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onQuarterChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Month Selection -->\n  @if (isType('month') || isType('day')) {\n    <div class=\"picker-field month-field\">\n      <kendo-label [text]=\"mergedLabels().month || 'Month'\">\n        <kendo-dropdownlist\n          [data]=\"monthOptions()\"\n          [value]=\"selectedMonth()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onMonthChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Day Selection -->\n  @if (isType('day')) {\n    <div class=\"picker-field day-field\">\n      <kendo-label [text]=\"mergedLabels().day || 'Day'\">\n        <kendo-dropdownlist\n          [data]=\"dayOptions()\"\n          [value]=\"selectedDay()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onDayChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n\n    <!-- Hour From Selection (optional) -->\n    <div class=\"picker-field hour-from-field\">\n      <kendo-label [text]=\"mergedLabels().hourFrom || 'From Hour'\">\n        <kendo-dropdownlist\n          [data]=\"hourFromOptions()\"\n          [value]=\"hourFrom()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          [defaultItem]=\"{ value: null, label: '\u2014' }\"\n          (valueChange)=\"onHourFromChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n\n    <!-- Hour To Selection (visible when hourFrom is set) -->\n    @if (hourFrom() !== null) {\n      <div class=\"picker-field hour-to-field\">\n        <kendo-label [text]=\"mergedLabels().hourTo || 'To Hour'\">\n          <kendo-dropdownlist\n            [data]=\"hourToOptions()\"\n            [value]=\"hourTo()\"\n            textField=\"label\"\n            valueField=\"value\"\n            [valuePrimitive]=\"true\"\n            (valueChange)=\"onHourToChange($event)\">\n          </kendo-dropdownlist>\n        </kendo-label>\n      </div>\n    }\n  }\n\n  <!-- Relative Time Selection -->\n  @if (isType('relative')) {\n    <div class=\"picker-field relative-value-field\">\n      <kendo-label [text]=\"mergedLabels().relativeValue || 'Last'\">\n        <kendo-numerictextbox\n          [value]=\"relativeValue()\"\n          [min]=\"1\"\n          [max]=\"9999\"\n          [decimals]=\"0\"\n          [format]=\"'n0'\"\n          [spinners]=\"true\"\n          (valueChange)=\"onRelativeValueChange($event)\">\n        </kendo-numerictextbox>\n      </kendo-label>\n    </div>\n\n    <div class=\"picker-field relative-unit-field\">\n      <kendo-label [text]=\"mergedLabels().relativeUnit || 'Unit'\">\n        <kendo-dropdownlist\n          [data]=\"relativeUnitOptions()\"\n          [value]=\"relativeUnit()\"\n          textField=\"label\"\n          valueField=\"value\"\n          [valuePrimitive]=\"true\"\n          (valueChange)=\"onRelativeUnitChange($event)\">\n        </kendo-dropdownlist>\n      </kendo-label>\n    </div>\n  }\n\n  <!-- Custom Date Range -->\n  @if (isType('custom')) {\n    <div class=\"picker-field custom-from-field\">\n      <kendo-label [text]=\"mergedLabels().customFrom || 'From'\">\n        @if (showTime()) {\n          <kendo-datetimepicker\n            [value]=\"customFrom()\"\n            [min]=\"minDate()\"\n            [max]=\"customTo()\"\n            (valueChange)=\"onCustomFromChange($event)\">\n          </kendo-datetimepicker>\n        } @else {\n          <kendo-datepicker\n            [value]=\"customFrom()\"\n            [min]=\"minDate()\"\n            [max]=\"customTo()\"\n            (valueChange)=\"onCustomFromChange($event)\">\n          </kendo-datepicker>\n        }\n      </kendo-label>\n    </div>\n\n    <div class=\"picker-field custom-to-field\">\n      <kendo-label [text]=\"mergedLabels().customTo || 'To'\">\n        @if (showTime()) {\n          <kendo-datetimepicker\n            [value]=\"customTo()\"\n            [min]=\"customFrom()\"\n            [max]=\"maxDate()\"\n            (valueChange)=\"onCustomToChange($event)\">\n          </kendo-datetimepicker>\n        } @else {\n          <kendo-datepicker\n            [value]=\"customTo()\"\n            [min]=\"customFrom()\"\n            [max]=\"maxDate()\"\n            (valueChange)=\"onCustomToChange($event)\">\n          </kendo-datepicker>\n        }\n      </kendo-label>\n    </div>\n  }\n</div>\n", styles: [".time-range-picker{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end}.time-range-picker .picker-field{display:flex;flex-direction:column}.time-range-picker .picker-field kendo-label{display:flex;flex-direction:column;gap:.25rem}.time-range-picker .type-field{min-width:120px}.time-range-picker .year-field{min-width:100px}.time-range-picker .quarter-field{min-width:140px}.time-range-picker .month-field{min-width:130px}.time-range-picker .relative-value-field{min-width:80px}.time-range-picker .relative-value-field kendo-numerictextbox{width:100%}.time-range-picker .relative-unit-field{min-width:100px}.time-range-picker .custom-from-field,.time-range-picker .custom-to-field{min-width:150px}.time-range-picker .custom-from-field kendo-datepicker,.time-range-picker .custom-from-field kendo-datetimepicker,.time-range-picker .custom-to-field kendo-datepicker,.time-range-picker .custom-to-field kendo-datetimepicker{width:100%}@media(max-width:768px){.time-range-picker{gap:.75rem}.time-range-picker .picker-field{flex:1 1 calc(50% - .5rem);min-width:0}.time-range-picker .type-field{flex:1 1 100%}}@media(max-width:480px){.time-range-picker{flex-direction:column;gap:.5rem}.time-range-picker .picker-field{flex:1 1 100%;width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: DropDownListModule }, { kind: "component", type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$2.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "clearButton", "inputAttributes", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "footer", "navigationItemTemplate", "weekDaysFormat", "showOtherMonthDays", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "autoFill", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "adaptiveTitle", "adaptiveSubtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close", "escape"], exportAs: ["kendo-datepicker"] }, { kind: "ngmodule", type: DateTimePickerModule }, { kind: "component", type: i2$2.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "weekDaysFormat", "showOtherMonthDays", "value", "format", "twoDigitYearMax", "tabindex", "disabledDates", "popupSettings", "adaptiveTitle", "adaptiveSubtitle", "disabled", "readonly", "readOnlyInput", "cancelButton", "formatPlaceholder", "placeholder", "steps", "focusedDate", "calendarType", "animateCalendarNavigation", "weekNumber", "min", "max", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "clearButton", "autoFill", "adaptiveMode", "inputAttributes", "defaultTab", "size", "rounded", "fillMode", "headerTemplate", "footerTemplate", "footer"], outputs: ["valueChange", "open", "close", "focus", "blur", "escape"], exportAs: ["kendo-datetimepicker"] }, { kind: "ngmodule", type: NumericTextBoxModule }, { kind: "component", type: i5.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "ngmodule", type: LabelModule }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TimeRangePickerComponent, decorators: [{
             type: Component,
@@ -6397,7 +7570,7 @@ class CronBuilderComponent {
                 useExisting: forwardRef(() => CronBuilderComponent),
                 multi: true
             }
-        ], ngImport: i0, template: "<div class=\"cron-builder\" [class.disabled]=\"disabled()\">\n  <!-- Expression Preview Section -->\n  <div class=\"expression-section\">\n    <div class=\"expression-display\">\n      <div class=\"expression-label\">Cron Expression</div>\n      <div class=\"expression-value-row\">\n        <code class=\"expression-value\" [class.invalid]=\"!validationResult().isValid\">\n          {{ expression() }}\n        </code>\n        @if (mergedConfig().showCopyButton) {\n          <button\n            kendoButton\n            [svgIcon]=\"copiedRecently() ? checkIcon : copyIcon\"\n            [title]=\"copiedRecently() ? 'Copied!' : 'Copy to clipboard'\"\n            fillMode=\"flat\"\n            class=\"copy-button\"\n            [class.copied]=\"copiedRecently()\"\n            (click)=\"onCopyExpression()\"\n            [disabled]=\"disabled()\">\n          </button>\n        }\n      </div>\n      @if (!validationResult().isValid) {\n        <div class=\"validation-error\">\n          <kendo-svg-icon [icon]=\"xIcon\" size=\"small\"></kendo-svg-icon>\n          {{ validationResult().error }}\n        </div>\n      }\n    </div>\n\n    @if (mergedConfig().showHumanReadable && validationResult().isValid) {\n      <div class=\"human-readable\">\n        <kendo-svg-icon [icon]=\"clockIcon\" size=\"small\"></kendo-svg-icon>\n        <span>{{ humanReadable() }}</span>\n      </div>\n    }\n  </div>\n\n  <!-- Preset Buttons -->\n  @if (mergedConfig().showPresets) {\n    <div class=\"presets-section\">\n      <div class=\"presets-label\">Quick Select</div>\n      <div class=\"presets-grid\">\n        @for (preset of presetsByCategory().frequent; track preset.id) {\n          <button\n            kendoButton\n            size=\"small\"\n            fillMode=\"outline\"\n            class=\"preset-button\"\n            [title]=\"preset.description\"\n            [disabled]=\"disabled()\"\n            (click)=\"onPresetSelect(preset)\">\n            {{ preset.label }}\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Schedule Type Tabs -->\n  <kendo-tabstrip\n    [animate]=\"false\"\n    [tabAlignment]=\"'start'\"\n    (tabSelect)=\"onTabSelect($event.index)\">\n\n    <!-- Seconds Tab -->\n    <kendo-tabstrip-tab [title]=\"'Seconds'\" [selected]=\"selectedTabIndex() === 0\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"secondIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"secondInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onSecondIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>*/{{ secondInterval() }} * * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Minutes Tab -->\n    <kendo-tabstrip-tab [title]=\"'Minutes'\" [selected]=\"selectedTabIndex() === 1\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"minuteInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onMinuteIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>0 */{{ minuteInterval() }} * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Hourly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Hourly'\" [selected]=\"selectedTabIndex() === 2\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"form-row\">\n            <kendo-label text=\"At minute\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourSecondChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"time-label\">(mm:ss)</span>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Daily Tab -->\n    <kendo-tabstrip-tab [title]=\"'Daily'\" [selected]=\"selectedTabIndex() === 3\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <kendo-label text=\"On\"></kendo-label>\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'every'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('every')\">\n                Every day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekdays'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekdays')\">\n                Weekdays\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekends'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekends')\">\n                Weekends\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('specific')\">\n                Specific days\n              </button>\n            </div>\n          </div>\n\n          @if (dailyMode() === 'specific') {\n            <div class=\"form-row days-row\">\n              <div class=\"day-buttons\">\n                @for (day of weekdayAbbreviations; track day.value) {\n                  <button\n                    kendoButton\n                    [selected]=\"isDaySelected(day.value)\"\n                    [disabled]=\"disabled()\"\n                    class=\"day-button\"\n                    (click)=\"onDayToggle(day.value)\">\n                    {{ day.label }}\n                  </button>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Weekly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Weekly'\" [selected]=\"selectedTabIndex() === 4\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row\">\n            <kendo-label text=\"On days\"></kendo-label>\n            <div class=\"day-buttons\">\n              @for (day of weekdayAbbreviations; track day.value) {\n                <button\n                  kendoButton\n                  [selected]=\"isDaySelected(day.value)\"\n                  [disabled]=\"disabled()\"\n                  class=\"day-button\"\n                  (click)=\"onDayToggle(day.value)\">\n                  {{ day.label }}\n                </button>\n              }\n            </div>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Monthly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Monthly'\" [selected]=\"selectedTabIndex() === 5\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('specific')\">\n                Specific day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'relative'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('relative')\">\n                Relative day\n              </button>\n            </div>\n          </div>\n\n          @if (monthlyMode() === 'specific') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On day\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"dayOfMonthOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"dayOfMonth()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onDayOfMonthChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n\n          @if (monthlyMode() === 'relative') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On the\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"relativeWeekOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeWeek()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeWeekChange($event)\">\n              </kendo-dropdownlist>\n              <kendo-dropdownlist\n                [data]=\"weekdayOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeDay()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeDayChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Custom/Advanced Tab -->\n    @if (mergedConfig().allowCustom) {\n      <kendo-tabstrip-tab [title]=\"'Custom'\" [selected]=\"selectedTabIndex() === 6\">\n        <ng-template kendoTabContent>\n          <div class=\"tab-content custom-tab\">\n            <div class=\"custom-fields\">\n              <div class=\"custom-field\">\n                <kendo-label text=\"Second\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customSecond()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('second', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Minute\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMinute()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('minute', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Hour\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customHour()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('hour', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-23, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Day\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfMonth', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-31, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Month\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('month', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-12, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Weekday\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfWeek()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfWeek', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-6 (Sun-Sat)</span>\n              </div>\n            </div>\n\n            <div class=\"syntax-reference\">\n              <div class=\"reference-title\">Syntax Reference</div>\n              <div class=\"reference-items\">\n                <span><code>*</code> any</span>\n                <span><code>*/N</code> every N</span>\n                <span><code>N-M</code> range</span>\n                <span><code>N,M</code> list</span>\n              </div>\n            </div>\n          </div>\n        </ng-template>\n      </kendo-tabstrip-tab>\n    }\n  </kendo-tabstrip>\n\n  <!-- Next Executions Section -->\n  @if (mergedConfig().showNextExecutions && validationResult().isValid && nextExecutions().length > 0) {\n    <div class=\"next-executions-section\">\n      <div class=\"next-executions-label\">Next Executions</div>\n      <ul class=\"next-executions-list\">\n        @for (execution of nextExecutions(); track $index) {\n          <li>{{ formatNextExecution(execution) }}</li>\n        }\n      </ul>\n    </div>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{--cron-bg: var(--mm-cron-bg, #ffffff);--cron-border: var(--mm-cron-border, #e0e0e0);--cron-border-radius: var(--mm-cron-border-radius, 8px);--cron-text: var(--mm-cron-text, #333333);--cron-text-secondary: var(--mm-cron-text-secondary, #666666);--cron-accent: var(--mm-cron-accent, #616161);--cron-accent-hover: var(--mm-cron-accent-hover, #424242);--cron-preview-bg: var(--mm-cron-preview-bg, #f5f5f5);--cron-tab-active-bg: var(--mm-cron-tab-active-bg, #eeeeee);--cron-tab-active-border: var(--mm-cron-tab-active-border, #616161);--cron-error: var(--mm-cron-error, #d32f2f);--cron-success: var(--mm-cron-success, #388e3c);--cron-code-bg: var(--mm-cron-code-bg, #eeeeee);--cron-code-text: var(--mm-cron-code-text, #333333);--cron-shadow: var(--mm-cron-shadow, 0 2px 8px rgba(0, 0, 0, .1));--cron-font-family: var(--mm-cron-font-family, inherit);--cron-font-mono: var(--mm-cron-font-mono, \"Roboto Mono\", \"Consolas\", monospace);display:block;font-family:var(--cron-font-family)}.cron-builder{background:var(--cron-bg);border:1px solid var(--cron-border);border-radius:var(--cron-border-radius);padding:16px;box-shadow:var(--cron-shadow)}.cron-builder.disabled{opacity:.6;pointer-events:none}.expression-section{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--cron-border)}.expression-display .expression-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--cron-text-secondary);margin-bottom:8px}.expression-display .expression-value-row{display:flex;align-items:center;gap:8px}.expression-display .expression-value{flex:1;font-family:var(--cron-font-mono);font-size:1.1rem;font-weight:500;padding:8px 12px;background:var(--cron-code-bg);color:var(--cron-code-text);border-radius:4px;letter-spacing:1px}.expression-display .expression-value.invalid{color:var(--cron-error);border:1px solid var(--cron-error)}.expression-display .copy-button{flex-shrink:0;transition:all .2s ease}.expression-display .copy-button.copied{color:var(--cron-success)!important}.expression-display .validation-error{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:.85rem;color:var(--cron-error)}.expression-display .validation-error kendo-svg-icon{flex-shrink:0}.human-readable{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;background:var(--cron-preview-bg);border-radius:4px;font-size:.9rem;color:var(--cron-text)}.human-readable kendo-svg-icon{color:var(--cron-accent);flex-shrink:0}.presets-section{margin-bottom:16px}.presets-section .presets-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--cron-text-secondary);margin-bottom:8px}.presets-section .presets-grid{display:flex;flex-wrap:wrap;gap:8px}.presets-section .preset-button{font-size:.8rem;padding:4px 12px;border-color:var(--cron-border);transition:all .2s ease}.presets-section .preset-button:hover:not(:disabled){border-color:var(--cron-accent);color:var(--cron-accent)}::ng-deep .k-tabstrip{background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items-wrapper{border-bottom:1px solid var(--cron-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item{color:var(--cron-text-secondary);background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items .k-item.k-active{color:var(--cron-accent);background:var(--cron-tab-active-bg);border-bottom:2px solid var(--cron-tab-active-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item:hover:not(.k-active){color:var(--cron-text);background:var(--cron-preview-bg)}::ng-deep .k-tabstrip .k-tabstrip-content{background:transparent;border:none;padding:16px 0}.tab-content{display:flex;flex-direction:column;gap:16px}.form-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.form-row kendo-label{min-width:80px;font-weight:500;color:var(--cron-text)}.form-row kendo-dropdownlist{min-width:140px}.form-row .separator{font-size:1.2rem;font-weight:700;color:var(--cron-text-secondary)}.form-row .time-label,.form-row .suffix-text{font-size:.85rem;color:var(--cron-text-secondary)}.mode-row .mode-buttons{display:flex;flex-wrap:wrap;gap:8px}.mode-row .mode-buttons button{transition:all .2s ease}.mode-row .mode-buttons button.k-selected,.mode-row .mode-buttons button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.days-row{padding-left:92px}.day-buttons{display:flex;flex-wrap:wrap;gap:6px}.day-buttons .day-button{min-width:48px;padding:6px 10px;font-size:.85rem;transition:all .2s ease}.day-buttons .day-button.k-selected,.day-buttons .day-button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.preview-text{font-size:.85rem;color:var(--cron-text-secondary)}.preview-text code{font-family:var(--cron-font-mono);background:var(--cron-preview-bg);padding:2px 6px;border-radius:3px}.custom-tab .custom-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.custom-tab .custom-field{display:flex;flex-direction:column;gap:4px}.custom-tab .custom-field kendo-label{font-size:.8rem;font-weight:600;color:var(--cron-text-secondary)}.custom-tab .custom-field kendo-textbox{font-family:var(--cron-font-mono)}.custom-tab .custom-field .field-hint{font-size:.7rem;color:var(--cron-text-secondary)}.custom-tab .syntax-reference{margin-top:16px;padding:12px;background:var(--cron-preview-bg);border-radius:4px}.custom-tab .syntax-reference .reference-title{font-size:.75rem;font-weight:600;text-transform:uppercase;color:var(--cron-text-secondary);margin-bottom:8px}.custom-tab .syntax-reference .reference-items{display:flex;flex-wrap:wrap;gap:16px;font-size:.85rem;color:var(--cron-text)}.custom-tab .syntax-reference .reference-items code{font-family:var(--cron-font-mono);background:var(--cron-code-bg);color:var(--cron-code-text);padding:2px 6px;border-radius:3px;margin-right:4px}.next-executions-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--cron-border)}.next-executions-section .next-executions-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--cron-text-secondary);margin-bottom:8px}.next-executions-section .next-executions-list{list-style:none;margin:0;padding:0}.next-executions-section .next-executions-list li{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:.9rem;color:var(--cron-text);font-family:var(--cron-font-mono)}.next-executions-section .next-executions-list li:before{content:\"\\25b8\";color:var(--cron-accent);font-size:.75rem}.next-executions-section .next-executions-list li:not(:last-child){border-bottom:1px dashed var(--cron-border)}@media(max-width:600px){.cron-builder{padding:12px}.form-row{flex-direction:column;align-items:flex-start}.form-row kendo-label{min-width:auto}.days-row{padding-left:0}.time-row{flex-direction:row;flex-wrap:wrap}.time-row kendo-label{width:100%;margin-bottom:8px}.custom-tab .custom-fields{grid-template-columns:repeat(2,1fr)}}@media(max-width:400px){.custom-tab .custom-fields{grid-template-columns:1fr}.presets-grid{flex-direction:column}.presets-grid .preset-button{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TabStripModule }, { kind: "component", type: i1$3.TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: i1$3.TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: i1$3.TabContentDirective, selector: "[kendoTabContent]" }, { kind: "ngmodule", type: DropDownListModule }, { kind: "component", type: i3$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: ButtonGroupModule }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "ngmodule", type: LabelModule }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "ngmodule", type: SVGIconModule }, { kind: "component", type: i3.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+        ], ngImport: i0, template: "<div class=\"cron-builder\" [class.disabled]=\"disabled()\">\n  <!-- Expression Preview Section -->\n  <div class=\"expression-section\">\n    <div class=\"expression-display\">\n      <div class=\"expression-label\">Cron Expression</div>\n      <div class=\"expression-value-row\">\n        <code class=\"expression-value\" [class.invalid]=\"!validationResult().isValid\">\n          {{ expression() }}\n        </code>\n        @if (mergedConfig().showCopyButton) {\n          <button\n            kendoButton\n            [svgIcon]=\"copiedRecently() ? checkIcon : copyIcon\"\n            [title]=\"copiedRecently() ? 'Copied!' : 'Copy to clipboard'\"\n            fillMode=\"flat\"\n            class=\"copy-button\"\n            [class.copied]=\"copiedRecently()\"\n            (click)=\"onCopyExpression()\"\n            [disabled]=\"disabled()\">\n          </button>\n        }\n      </div>\n      @if (!validationResult().isValid) {\n        <div class=\"validation-error\">\n          <kendo-svg-icon [icon]=\"xIcon\" size=\"small\"></kendo-svg-icon>\n          {{ validationResult().error }}\n        </div>\n      }\n    </div>\n\n    @if (mergedConfig().showHumanReadable && validationResult().isValid) {\n      <div class=\"human-readable\">\n        <kendo-svg-icon [icon]=\"clockIcon\" size=\"small\"></kendo-svg-icon>\n        <span>{{ humanReadable() }}</span>\n      </div>\n    }\n  </div>\n\n  <!-- Preset Buttons -->\n  @if (mergedConfig().showPresets) {\n    <div class=\"presets-section\">\n      <div class=\"presets-label\">Quick Select</div>\n      <div class=\"presets-grid\">\n        @for (preset of presetsByCategory().frequent; track preset.id) {\n          <button\n            kendoButton\n            size=\"small\"\n            fillMode=\"outline\"\n            class=\"preset-button\"\n            [title]=\"preset.description\"\n            [disabled]=\"disabled()\"\n            (click)=\"onPresetSelect(preset)\">\n            {{ preset.label }}\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Schedule Type Tabs -->\n  <kendo-tabstrip\n    [animate]=\"false\"\n    [tabAlignment]=\"'start'\"\n    (tabSelect)=\"onTabSelect($event.index)\">\n\n    <!-- Seconds Tab -->\n    <kendo-tabstrip-tab [title]=\"'Seconds'\" [selected]=\"selectedTabIndex() === 0\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"secondIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"secondInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onSecondIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>*/{{ secondInterval() }} * * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Minutes Tab -->\n    <kendo-tabstrip-tab [title]=\"'Minutes'\" [selected]=\"selectedTabIndex() === 1\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"minuteInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onMinuteIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>0 */{{ minuteInterval() }} * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Hourly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Hourly'\" [selected]=\"selectedTabIndex() === 2\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"form-row\">\n            <kendo-label text=\"At minute\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourSecondChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"time-label\">(mm:ss)</span>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Daily Tab -->\n    <kendo-tabstrip-tab [title]=\"'Daily'\" [selected]=\"selectedTabIndex() === 3\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <kendo-label text=\"On\"></kendo-label>\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'every'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('every')\">\n                Every day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekdays'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekdays')\">\n                Weekdays\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekends'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekends')\">\n                Weekends\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('specific')\">\n                Specific days\n              </button>\n            </div>\n          </div>\n\n          @if (dailyMode() === 'specific') {\n            <div class=\"form-row days-row\">\n              <div class=\"day-buttons\">\n                @for (day of weekdayAbbreviations; track day.value) {\n                  <button\n                    kendoButton\n                    [selected]=\"isDaySelected(day.value)\"\n                    [disabled]=\"disabled()\"\n                    class=\"day-button\"\n                    (click)=\"onDayToggle(day.value)\">\n                    {{ day.label }}\n                  </button>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Weekly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Weekly'\" [selected]=\"selectedTabIndex() === 4\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row\">\n            <kendo-label text=\"On days\"></kendo-label>\n            <div class=\"day-buttons\">\n              @for (day of weekdayAbbreviations; track day.value) {\n                <button\n                  kendoButton\n                  [selected]=\"isDaySelected(day.value)\"\n                  [disabled]=\"disabled()\"\n                  class=\"day-button\"\n                  (click)=\"onDayToggle(day.value)\">\n                  {{ day.label }}\n                </button>\n              }\n            </div>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Monthly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Monthly'\" [selected]=\"selectedTabIndex() === 5\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('specific')\">\n                Specific day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'relative'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('relative')\">\n                Relative day\n              </button>\n            </div>\n          </div>\n\n          @if (monthlyMode() === 'specific') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On day\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"dayOfMonthOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"dayOfMonth()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onDayOfMonthChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n\n          @if (monthlyMode() === 'relative') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On the\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"relativeWeekOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeWeek()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeWeekChange($event)\">\n              </kendo-dropdownlist>\n              <kendo-dropdownlist\n                [data]=\"weekdayOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeDay()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeDayChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Custom/Advanced Tab -->\n    @if (mergedConfig().allowCustom) {\n      <kendo-tabstrip-tab [title]=\"'Custom'\" [selected]=\"selectedTabIndex() === 6\">\n        <ng-template kendoTabContent>\n          <div class=\"tab-content custom-tab\">\n            <div class=\"custom-fields\">\n              <div class=\"custom-field\">\n                <kendo-label text=\"Second\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customSecond()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('second', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Minute\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMinute()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('minute', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Hour\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customHour()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('hour', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-23, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Day\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfMonth', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-31, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Month\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('month', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-12, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Weekday\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfWeek()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfWeek', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-6 (Sun-Sat)</span>\n              </div>\n            </div>\n\n            <div class=\"syntax-reference\">\n              <div class=\"reference-title\">Syntax Reference</div>\n              <div class=\"reference-items\">\n                <span><code>*</code> any</span>\n                <span><code>*/N</code> every N</span>\n                <span><code>N-M</code> range</span>\n                <span><code>N,M</code> list</span>\n              </div>\n            </div>\n          </div>\n        </ng-template>\n      </kendo-tabstrip-tab>\n    }\n  </kendo-tabstrip>\n\n  <!-- Next Executions Section -->\n  @if (mergedConfig().showNextExecutions && validationResult().isValid && nextExecutions().length > 0) {\n    <div class=\"next-executions-section\">\n      <div class=\"next-executions-label\">Next Executions</div>\n      <ul class=\"next-executions-list\">\n        @for (execution of nextExecutions(); track $index) {\n          <li>{{ formatNextExecution(execution) }}</li>\n        }\n      </ul>\n    </div>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{--cron-bg: var(--mm-cron-bg, #ffffff);--cron-border: var(--mm-cron-border, #e0e0e0);--cron-border-radius: var(--mm-cron-border-radius, 8px);--cron-text: var(--mm-cron-text, #333333);--cron-text-secondary: var(--mm-cron-text-secondary, #666666);--cron-accent: var(--mm-cron-accent, #616161);--cron-accent-hover: var(--mm-cron-accent-hover, #424242);--cron-preview-bg: var(--mm-cron-preview-bg, #f5f5f5);--cron-tab-active-bg: var(--mm-cron-tab-active-bg, #eeeeee);--cron-tab-active-border: var(--mm-cron-tab-active-border, #616161);--cron-error: var(--mm-cron-error, #d32f2f);--cron-success: var(--mm-cron-success, #388e3c);--cron-code-bg: var(--mm-cron-code-bg, #eeeeee);--cron-code-text: var(--mm-cron-code-text, #333333);--cron-shadow: var(--mm-cron-shadow, 0 2px 8px rgba(0, 0, 0, .1));--cron-font-family: var(--mm-cron-font-family, inherit);--cron-font-mono: var(--mm-cron-font-mono, \"Roboto Mono\", \"Consolas\", monospace);display:block;font-family:var(--cron-font-family)}.cron-builder{background:var(--cron-bg);border:1px solid var(--cron-border);border-radius:var(--cron-border-radius);padding:16px;box-shadow:var(--cron-shadow)}.cron-builder.disabled{opacity:.6;pointer-events:none}.expression-section{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--cron-border)}.expression-display .expression-label{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.expression-display .expression-value-row{display:flex;align-items:center;gap:8px}.expression-display .expression-value{flex:1;font-family:var(--cron-font-mono);font-size:1.1rem;font-weight:500;padding:8px 12px;background:var(--cron-code-bg);color:var(--cron-code-text);border-radius:4px}.expression-display .expression-value.invalid{color:var(--cron-error);border:1px solid var(--cron-error)}.expression-display .copy-button{flex-shrink:0;transition:all .2s ease}.expression-display .copy-button.copied{color:var(--cron-success)!important}.expression-display .validation-error{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:.85rem;color:var(--cron-error)}.expression-display .validation-error kendo-svg-icon{flex-shrink:0}.human-readable{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;background:var(--cron-preview-bg);border-radius:4px;font-size:.9rem;color:var(--cron-text)}.human-readable kendo-svg-icon{color:var(--cron-accent);flex-shrink:0}.presets-section{margin-bottom:16px}.presets-section .presets-label{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.presets-section .presets-grid{display:flex;flex-wrap:wrap;gap:8px}.presets-section .preset-button{font-size:.8rem;padding:4px 12px;border-color:var(--cron-border);transition:all .2s ease}.presets-section .preset-button:hover:not(:disabled){border-color:var(--cron-accent);color:var(--cron-accent)}::ng-deep .k-tabstrip{background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items-wrapper{border-bottom:1px solid var(--cron-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item{color:var(--cron-text-secondary);background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items .k-item.k-active{color:var(--cron-accent);background:var(--cron-tab-active-bg);border-bottom:2px solid var(--cron-tab-active-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item:hover:not(.k-active){color:var(--cron-text);background:var(--cron-preview-bg)}::ng-deep .k-tabstrip .k-tabstrip-content{background:transparent;border:none;padding:16px 0}.tab-content{display:flex;flex-direction:column;gap:16px}.form-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.form-row kendo-label{min-width:80px;font-weight:500;color:var(--cron-text)}.form-row kendo-dropdownlist{min-width:140px}.form-row .separator{font-size:1.2rem;font-weight:700;color:var(--cron-text-secondary)}.form-row .time-label,.form-row .suffix-text{font-size:.85rem;color:var(--cron-text-secondary)}.mode-row .mode-buttons{display:flex;flex-wrap:wrap;gap:8px}.mode-row .mode-buttons button{transition:all .2s ease}.mode-row .mode-buttons button.k-selected,.mode-row .mode-buttons button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.days-row{padding-left:92px}.day-buttons{display:flex;flex-wrap:wrap;gap:6px}.day-buttons .day-button{min-width:48px;padding:6px 10px;font-size:.85rem;transition:all .2s ease}.day-buttons .day-button.k-selected,.day-buttons .day-button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.preview-text{font-size:.85rem;color:var(--cron-text-secondary)}.preview-text code{font-family:var(--cron-font-mono);background:var(--cron-preview-bg);padding:2px 6px;border-radius:3px}.custom-tab .custom-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.custom-tab .custom-field{display:flex;flex-direction:column;gap:4px}.custom-tab .custom-field kendo-label{font-size:.8rem;font-weight:600;color:var(--cron-text-secondary)}.custom-tab .custom-field kendo-textbox{font-family:var(--cron-font-mono)}.custom-tab .custom-field .field-hint{font-size:.7rem;color:var(--cron-text-secondary)}.custom-tab .syntax-reference{margin-top:16px;padding:12px;background:var(--cron-preview-bg);border-radius:4px}.custom-tab .syntax-reference .reference-title{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.custom-tab .syntax-reference .reference-items{display:flex;flex-wrap:wrap;gap:16px;font-size:.85rem;color:var(--cron-text)}.custom-tab .syntax-reference .reference-items code{font-family:var(--cron-font-mono);background:var(--cron-code-bg);color:var(--cron-code-text);padding:2px 6px;border-radius:3px;margin-right:4px}.next-executions-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--cron-border)}.next-executions-section .next-executions-label{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.next-executions-section .next-executions-list{list-style:none;margin:0;padding:0}.next-executions-section .next-executions-list li{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:.9rem;color:var(--cron-text);font-family:var(--cron-font-mono)}.next-executions-section .next-executions-list li:before{content:\"\\25b8\";color:var(--cron-accent);font-size:.75rem}.next-executions-section .next-executions-list li:not(:last-child){border-bottom:1px dashed var(--cron-border)}@media(max-width:600px){.cron-builder{padding:12px}.form-row{flex-direction:column;align-items:flex-start}.form-row kendo-label{min-width:auto}.days-row{padding-left:0}.time-row{flex-direction:row;flex-wrap:wrap}.time-row kendo-label{width:100%;margin-bottom:8px}.custom-tab .custom-fields{grid-template-columns:repeat(2,1fr)}}@media(max-width:400px){.custom-tab .custom-fields{grid-template-columns:1fr}.presets-grid{flex-direction:column}.presets-grid .preset-button{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TabStripModule }, { kind: "component", type: i1$4.TabStripComponent, selector: "kendo-tabstrip", inputs: ["height", "animate", "tabAlignment", "tabPosition", "keepTabContent", "closable", "scrollable", "size", "closeIcon", "closeIconClass", "closeSVGIcon", "showContentArea"], outputs: ["tabSelect", "tabClose", "tabScroll"], exportAs: ["kendoTabStrip"] }, { kind: "component", type: i1$4.TabStripTabComponent, selector: "kendo-tabstrip-tab", inputs: ["title", "disabled", "cssClass", "cssStyle", "selected", "closable", "closeIcon", "closeIconClass", "closeSVGIcon"], exportAs: ["kendoTabStripTab"] }, { kind: "directive", type: i1$4.TabContentDirective, selector: "[kendoTabContent]" }, { kind: "ngmodule", type: DropDownListModule }, { kind: "component", type: i3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: ButtonGroupModule }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "ngmodule", type: LabelModule }, { kind: "component", type: i6.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "ngmodule", type: SVGIconModule }, { kind: "component", type: i2.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CronBuilderComponent, decorators: [{
             type: Component,
@@ -6417,7 +7590,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
                             useExisting: forwardRef(() => CronBuilderComponent),
                             multi: true
                         }
-                    ], template: "<div class=\"cron-builder\" [class.disabled]=\"disabled()\">\n  <!-- Expression Preview Section -->\n  <div class=\"expression-section\">\n    <div class=\"expression-display\">\n      <div class=\"expression-label\">Cron Expression</div>\n      <div class=\"expression-value-row\">\n        <code class=\"expression-value\" [class.invalid]=\"!validationResult().isValid\">\n          {{ expression() }}\n        </code>\n        @if (mergedConfig().showCopyButton) {\n          <button\n            kendoButton\n            [svgIcon]=\"copiedRecently() ? checkIcon : copyIcon\"\n            [title]=\"copiedRecently() ? 'Copied!' : 'Copy to clipboard'\"\n            fillMode=\"flat\"\n            class=\"copy-button\"\n            [class.copied]=\"copiedRecently()\"\n            (click)=\"onCopyExpression()\"\n            [disabled]=\"disabled()\">\n          </button>\n        }\n      </div>\n      @if (!validationResult().isValid) {\n        <div class=\"validation-error\">\n          <kendo-svg-icon [icon]=\"xIcon\" size=\"small\"></kendo-svg-icon>\n          {{ validationResult().error }}\n        </div>\n      }\n    </div>\n\n    @if (mergedConfig().showHumanReadable && validationResult().isValid) {\n      <div class=\"human-readable\">\n        <kendo-svg-icon [icon]=\"clockIcon\" size=\"small\"></kendo-svg-icon>\n        <span>{{ humanReadable() }}</span>\n      </div>\n    }\n  </div>\n\n  <!-- Preset Buttons -->\n  @if (mergedConfig().showPresets) {\n    <div class=\"presets-section\">\n      <div class=\"presets-label\">Quick Select</div>\n      <div class=\"presets-grid\">\n        @for (preset of presetsByCategory().frequent; track preset.id) {\n          <button\n            kendoButton\n            size=\"small\"\n            fillMode=\"outline\"\n            class=\"preset-button\"\n            [title]=\"preset.description\"\n            [disabled]=\"disabled()\"\n            (click)=\"onPresetSelect(preset)\">\n            {{ preset.label }}\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Schedule Type Tabs -->\n  <kendo-tabstrip\n    [animate]=\"false\"\n    [tabAlignment]=\"'start'\"\n    (tabSelect)=\"onTabSelect($event.index)\">\n\n    <!-- Seconds Tab -->\n    <kendo-tabstrip-tab [title]=\"'Seconds'\" [selected]=\"selectedTabIndex() === 0\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"secondIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"secondInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onSecondIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>*/{{ secondInterval() }} * * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Minutes Tab -->\n    <kendo-tabstrip-tab [title]=\"'Minutes'\" [selected]=\"selectedTabIndex() === 1\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"minuteInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onMinuteIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>0 */{{ minuteInterval() }} * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Hourly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Hourly'\" [selected]=\"selectedTabIndex() === 2\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"form-row\">\n            <kendo-label text=\"At minute\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourSecondChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"time-label\">(mm:ss)</span>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Daily Tab -->\n    <kendo-tabstrip-tab [title]=\"'Daily'\" [selected]=\"selectedTabIndex() === 3\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <kendo-label text=\"On\"></kendo-label>\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'every'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('every')\">\n                Every day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekdays'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekdays')\">\n                Weekdays\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekends'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekends')\">\n                Weekends\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('specific')\">\n                Specific days\n              </button>\n            </div>\n          </div>\n\n          @if (dailyMode() === 'specific') {\n            <div class=\"form-row days-row\">\n              <div class=\"day-buttons\">\n                @for (day of weekdayAbbreviations; track day.value) {\n                  <button\n                    kendoButton\n                    [selected]=\"isDaySelected(day.value)\"\n                    [disabled]=\"disabled()\"\n                    class=\"day-button\"\n                    (click)=\"onDayToggle(day.value)\">\n                    {{ day.label }}\n                  </button>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Weekly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Weekly'\" [selected]=\"selectedTabIndex() === 4\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row\">\n            <kendo-label text=\"On days\"></kendo-label>\n            <div class=\"day-buttons\">\n              @for (day of weekdayAbbreviations; track day.value) {\n                <button\n                  kendoButton\n                  [selected]=\"isDaySelected(day.value)\"\n                  [disabled]=\"disabled()\"\n                  class=\"day-button\"\n                  (click)=\"onDayToggle(day.value)\">\n                  {{ day.label }}\n                </button>\n              }\n            </div>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Monthly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Monthly'\" [selected]=\"selectedTabIndex() === 5\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('specific')\">\n                Specific day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'relative'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('relative')\">\n                Relative day\n              </button>\n            </div>\n          </div>\n\n          @if (monthlyMode() === 'specific') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On day\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"dayOfMonthOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"dayOfMonth()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onDayOfMonthChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n\n          @if (monthlyMode() === 'relative') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On the\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"relativeWeekOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeWeek()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeWeekChange($event)\">\n              </kendo-dropdownlist>\n              <kendo-dropdownlist\n                [data]=\"weekdayOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeDay()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeDayChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Custom/Advanced Tab -->\n    @if (mergedConfig().allowCustom) {\n      <kendo-tabstrip-tab [title]=\"'Custom'\" [selected]=\"selectedTabIndex() === 6\">\n        <ng-template kendoTabContent>\n          <div class=\"tab-content custom-tab\">\n            <div class=\"custom-fields\">\n              <div class=\"custom-field\">\n                <kendo-label text=\"Second\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customSecond()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('second', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Minute\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMinute()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('minute', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Hour\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customHour()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('hour', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-23, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Day\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfMonth', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-31, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Month\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('month', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-12, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Weekday\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfWeek()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfWeek', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-6 (Sun-Sat)</span>\n              </div>\n            </div>\n\n            <div class=\"syntax-reference\">\n              <div class=\"reference-title\">Syntax Reference</div>\n              <div class=\"reference-items\">\n                <span><code>*</code> any</span>\n                <span><code>*/N</code> every N</span>\n                <span><code>N-M</code> range</span>\n                <span><code>N,M</code> list</span>\n              </div>\n            </div>\n          </div>\n        </ng-template>\n      </kendo-tabstrip-tab>\n    }\n  </kendo-tabstrip>\n\n  <!-- Next Executions Section -->\n  @if (mergedConfig().showNextExecutions && validationResult().isValid && nextExecutions().length > 0) {\n    <div class=\"next-executions-section\">\n      <div class=\"next-executions-label\">Next Executions</div>\n      <ul class=\"next-executions-list\">\n        @for (execution of nextExecutions(); track $index) {\n          <li>{{ formatNextExecution(execution) }}</li>\n        }\n      </ul>\n    </div>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{--cron-bg: var(--mm-cron-bg, #ffffff);--cron-border: var(--mm-cron-border, #e0e0e0);--cron-border-radius: var(--mm-cron-border-radius, 8px);--cron-text: var(--mm-cron-text, #333333);--cron-text-secondary: var(--mm-cron-text-secondary, #666666);--cron-accent: var(--mm-cron-accent, #616161);--cron-accent-hover: var(--mm-cron-accent-hover, #424242);--cron-preview-bg: var(--mm-cron-preview-bg, #f5f5f5);--cron-tab-active-bg: var(--mm-cron-tab-active-bg, #eeeeee);--cron-tab-active-border: var(--mm-cron-tab-active-border, #616161);--cron-error: var(--mm-cron-error, #d32f2f);--cron-success: var(--mm-cron-success, #388e3c);--cron-code-bg: var(--mm-cron-code-bg, #eeeeee);--cron-code-text: var(--mm-cron-code-text, #333333);--cron-shadow: var(--mm-cron-shadow, 0 2px 8px rgba(0, 0, 0, .1));--cron-font-family: var(--mm-cron-font-family, inherit);--cron-font-mono: var(--mm-cron-font-mono, \"Roboto Mono\", \"Consolas\", monospace);display:block;font-family:var(--cron-font-family)}.cron-builder{background:var(--cron-bg);border:1px solid var(--cron-border);border-radius:var(--cron-border-radius);padding:16px;box-shadow:var(--cron-shadow)}.cron-builder.disabled{opacity:.6;pointer-events:none}.expression-section{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--cron-border)}.expression-display .expression-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--cron-text-secondary);margin-bottom:8px}.expression-display .expression-value-row{display:flex;align-items:center;gap:8px}.expression-display .expression-value{flex:1;font-family:var(--cron-font-mono);font-size:1.1rem;font-weight:500;padding:8px 12px;background:var(--cron-code-bg);color:var(--cron-code-text);border-radius:4px;letter-spacing:1px}.expression-display .expression-value.invalid{color:var(--cron-error);border:1px solid var(--cron-error)}.expression-display .copy-button{flex-shrink:0;transition:all .2s ease}.expression-display .copy-button.copied{color:var(--cron-success)!important}.expression-display .validation-error{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:.85rem;color:var(--cron-error)}.expression-display .validation-error kendo-svg-icon{flex-shrink:0}.human-readable{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;background:var(--cron-preview-bg);border-radius:4px;font-size:.9rem;color:var(--cron-text)}.human-readable kendo-svg-icon{color:var(--cron-accent);flex-shrink:0}.presets-section{margin-bottom:16px}.presets-section .presets-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--cron-text-secondary);margin-bottom:8px}.presets-section .presets-grid{display:flex;flex-wrap:wrap;gap:8px}.presets-section .preset-button{font-size:.8rem;padding:4px 12px;border-color:var(--cron-border);transition:all .2s ease}.presets-section .preset-button:hover:not(:disabled){border-color:var(--cron-accent);color:var(--cron-accent)}::ng-deep .k-tabstrip{background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items-wrapper{border-bottom:1px solid var(--cron-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item{color:var(--cron-text-secondary);background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items .k-item.k-active{color:var(--cron-accent);background:var(--cron-tab-active-bg);border-bottom:2px solid var(--cron-tab-active-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item:hover:not(.k-active){color:var(--cron-text);background:var(--cron-preview-bg)}::ng-deep .k-tabstrip .k-tabstrip-content{background:transparent;border:none;padding:16px 0}.tab-content{display:flex;flex-direction:column;gap:16px}.form-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.form-row kendo-label{min-width:80px;font-weight:500;color:var(--cron-text)}.form-row kendo-dropdownlist{min-width:140px}.form-row .separator{font-size:1.2rem;font-weight:700;color:var(--cron-text-secondary)}.form-row .time-label,.form-row .suffix-text{font-size:.85rem;color:var(--cron-text-secondary)}.mode-row .mode-buttons{display:flex;flex-wrap:wrap;gap:8px}.mode-row .mode-buttons button{transition:all .2s ease}.mode-row .mode-buttons button.k-selected,.mode-row .mode-buttons button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.days-row{padding-left:92px}.day-buttons{display:flex;flex-wrap:wrap;gap:6px}.day-buttons .day-button{min-width:48px;padding:6px 10px;font-size:.85rem;transition:all .2s ease}.day-buttons .day-button.k-selected,.day-buttons .day-button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.preview-text{font-size:.85rem;color:var(--cron-text-secondary)}.preview-text code{font-family:var(--cron-font-mono);background:var(--cron-preview-bg);padding:2px 6px;border-radius:3px}.custom-tab .custom-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.custom-tab .custom-field{display:flex;flex-direction:column;gap:4px}.custom-tab .custom-field kendo-label{font-size:.8rem;font-weight:600;color:var(--cron-text-secondary)}.custom-tab .custom-field kendo-textbox{font-family:var(--cron-font-mono)}.custom-tab .custom-field .field-hint{font-size:.7rem;color:var(--cron-text-secondary)}.custom-tab .syntax-reference{margin-top:16px;padding:12px;background:var(--cron-preview-bg);border-radius:4px}.custom-tab .syntax-reference .reference-title{font-size:.75rem;font-weight:600;text-transform:uppercase;color:var(--cron-text-secondary);margin-bottom:8px}.custom-tab .syntax-reference .reference-items{display:flex;flex-wrap:wrap;gap:16px;font-size:.85rem;color:var(--cron-text)}.custom-tab .syntax-reference .reference-items code{font-family:var(--cron-font-mono);background:var(--cron-code-bg);color:var(--cron-code-text);padding:2px 6px;border-radius:3px;margin-right:4px}.next-executions-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--cron-border)}.next-executions-section .next-executions-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--cron-text-secondary);margin-bottom:8px}.next-executions-section .next-executions-list{list-style:none;margin:0;padding:0}.next-executions-section .next-executions-list li{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:.9rem;color:var(--cron-text);font-family:var(--cron-font-mono)}.next-executions-section .next-executions-list li:before{content:\"\\25b8\";color:var(--cron-accent);font-size:.75rem}.next-executions-section .next-executions-list li:not(:last-child){border-bottom:1px dashed var(--cron-border)}@media(max-width:600px){.cron-builder{padding:12px}.form-row{flex-direction:column;align-items:flex-start}.form-row kendo-label{min-width:auto}.days-row{padding-left:0}.time-row{flex-direction:row;flex-wrap:wrap}.time-row kendo-label{width:100%;margin-bottom:8px}.custom-tab .custom-fields{grid-template-columns:repeat(2,1fr)}}@media(max-width:400px){.custom-tab .custom-fields{grid-template-columns:1fr}.presets-grid{flex-direction:column}.presets-grid .preset-button{width:100%}}\n"] }]
+                    ], template: "<div class=\"cron-builder\" [class.disabled]=\"disabled()\">\n  <!-- Expression Preview Section -->\n  <div class=\"expression-section\">\n    <div class=\"expression-display\">\n      <div class=\"expression-label\">Cron Expression</div>\n      <div class=\"expression-value-row\">\n        <code class=\"expression-value\" [class.invalid]=\"!validationResult().isValid\">\n          {{ expression() }}\n        </code>\n        @if (mergedConfig().showCopyButton) {\n          <button\n            kendoButton\n            [svgIcon]=\"copiedRecently() ? checkIcon : copyIcon\"\n            [title]=\"copiedRecently() ? 'Copied!' : 'Copy to clipboard'\"\n            fillMode=\"flat\"\n            class=\"copy-button\"\n            [class.copied]=\"copiedRecently()\"\n            (click)=\"onCopyExpression()\"\n            [disabled]=\"disabled()\">\n          </button>\n        }\n      </div>\n      @if (!validationResult().isValid) {\n        <div class=\"validation-error\">\n          <kendo-svg-icon [icon]=\"xIcon\" size=\"small\"></kendo-svg-icon>\n          {{ validationResult().error }}\n        </div>\n      }\n    </div>\n\n    @if (mergedConfig().showHumanReadable && validationResult().isValid) {\n      <div class=\"human-readable\">\n        <kendo-svg-icon [icon]=\"clockIcon\" size=\"small\"></kendo-svg-icon>\n        <span>{{ humanReadable() }}</span>\n      </div>\n    }\n  </div>\n\n  <!-- Preset Buttons -->\n  @if (mergedConfig().showPresets) {\n    <div class=\"presets-section\">\n      <div class=\"presets-label\">Quick Select</div>\n      <div class=\"presets-grid\">\n        @for (preset of presetsByCategory().frequent; track preset.id) {\n          <button\n            kendoButton\n            size=\"small\"\n            fillMode=\"outline\"\n            class=\"preset-button\"\n            [title]=\"preset.description\"\n            [disabled]=\"disabled()\"\n            (click)=\"onPresetSelect(preset)\">\n            {{ preset.label }}\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Schedule Type Tabs -->\n  <kendo-tabstrip\n    [animate]=\"false\"\n    [tabAlignment]=\"'start'\"\n    (tabSelect)=\"onTabSelect($event.index)\">\n\n    <!-- Seconds Tab -->\n    <kendo-tabstrip-tab [title]=\"'Seconds'\" [selected]=\"selectedTabIndex() === 0\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"secondIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"secondInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onSecondIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>*/{{ secondInterval() }} * * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Minutes Tab -->\n    <kendo-tabstrip-tab [title]=\"'Minutes'\" [selected]=\"selectedTabIndex() === 1\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"minuteInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onMinuteIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"preview-text\">\n            Generates: <code>0 */{{ minuteInterval() }} * * * *</code>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Hourly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Hourly'\" [selected]=\"selectedTabIndex() === 2\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row\">\n            <kendo-label text=\"Run every\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourIntervalOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourInterval()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourIntervalChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"form-row\">\n            <kendo-label text=\"At minute\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"hourSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onHourSecondChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"time-label\">(mm:ss)</span>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Daily Tab -->\n    <kendo-tabstrip-tab [title]=\"'Daily'\" [selected]=\"selectedTabIndex() === 3\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <kendo-label text=\"On\"></kendo-label>\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'every'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('every')\">\n                Every day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekdays'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekdays')\">\n                Weekdays\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'weekends'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('weekends')\">\n                Weekends\n              </button>\n              <button\n                kendoButton\n                [selected]=\"dailyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onDailyModeChange('specific')\">\n                Specific days\n              </button>\n            </div>\n          </div>\n\n          @if (dailyMode() === 'specific') {\n            <div class=\"form-row days-row\">\n              <div class=\"day-buttons\">\n                @for (day of weekdayAbbreviations; track day.value) {\n                  <button\n                    kendoButton\n                    [selected]=\"isDaySelected(day.value)\"\n                    [disabled]=\"disabled()\"\n                    class=\"day-button\"\n                    (click)=\"onDayToggle(day.value)\">\n                    {{ day.label }}\n                  </button>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Weekly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Weekly'\" [selected]=\"selectedTabIndex() === 4\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row\">\n            <kendo-label text=\"On days\"></kendo-label>\n            <div class=\"day-buttons\">\n              @for (day of weekdayAbbreviations; track day.value) {\n                <button\n                  kendoButton\n                  [selected]=\"isDaySelected(day.value)\"\n                  [disabled]=\"disabled()\"\n                  class=\"day-button\"\n                  (click)=\"onDayToggle(day.value)\">\n                  {{ day.label }}\n                </button>\n              }\n            </div>\n          </div>\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Monthly Tab -->\n    <kendo-tabstrip-tab [title]=\"'Monthly'\" [selected]=\"selectedTabIndex() === 5\">\n      <ng-template kendoTabContent>\n        <div class=\"tab-content\">\n          <div class=\"form-row time-row\">\n            <kendo-label text=\"At\"></kendo-label>\n            <kendo-dropdownlist\n              [data]=\"hourOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeHour()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeHourChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeMinute()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeMinuteChange($event)\">\n            </kendo-dropdownlist>\n            <span class=\"separator\">:</span>\n            <kendo-dropdownlist\n              [data]=\"minuteOptions\"\n              [textField]=\"'label'\"\n              [valueField]=\"'value'\"\n              [value]=\"timeSecond()\"\n              [valuePrimitive]=\"true\"\n              [disabled]=\"disabled()\"\n              (valueChange)=\"onTimeSecondChange($event)\">\n            </kendo-dropdownlist>\n          </div>\n\n          <div class=\"form-row mode-row\">\n            <div class=\"mode-buttons\">\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'specific'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('specific')\">\n                Specific day\n              </button>\n              <button\n                kendoButton\n                [selected]=\"monthlyMode() === 'relative'\"\n                [disabled]=\"disabled()\"\n                (click)=\"onMonthlyModeChange('relative')\">\n                Relative day\n              </button>\n            </div>\n          </div>\n\n          @if (monthlyMode() === 'specific') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On day\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"dayOfMonthOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"dayOfMonth()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onDayOfMonthChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n\n          @if (monthlyMode() === 'relative') {\n            <div class=\"form-row\">\n              <kendo-label text=\"On the\"></kendo-label>\n              <kendo-dropdownlist\n                [data]=\"relativeWeekOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeWeek()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeWeekChange($event)\">\n              </kendo-dropdownlist>\n              <kendo-dropdownlist\n                [data]=\"weekdayOptions\"\n                [textField]=\"'label'\"\n                [valueField]=\"'value'\"\n                [value]=\"relativeDay()\"\n                [valuePrimitive]=\"true\"\n                [disabled]=\"disabled()\"\n                (valueChange)=\"onRelativeDayChange($event)\">\n              </kendo-dropdownlist>\n              <span class=\"suffix-text\">of every month</span>\n            </div>\n          }\n        </div>\n      </ng-template>\n    </kendo-tabstrip-tab>\n\n    <!-- Custom/Advanced Tab -->\n    @if (mergedConfig().allowCustom) {\n      <kendo-tabstrip-tab [title]=\"'Custom'\" [selected]=\"selectedTabIndex() === 6\">\n        <ng-template kendoTabContent>\n          <div class=\"tab-content custom-tab\">\n            <div class=\"custom-fields\">\n              <div class=\"custom-field\">\n                <kendo-label text=\"Second\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customSecond()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('second', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Minute\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMinute()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('minute', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-59, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Hour\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customHour()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('hour', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-23, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Day\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfMonth', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-31, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Month\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customMonth()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('month', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">1-12, *, /</span>\n              </div>\n              <div class=\"custom-field\">\n                <kendo-label text=\"Weekday\"></kendo-label>\n                <kendo-textbox\n                  [value]=\"customDayOfWeek()\"\n                  [disabled]=\"disabled()\"\n                  (valueChange)=\"onCustomFieldChange('dayOfWeek', $event || '*')\">\n                </kendo-textbox>\n                <span class=\"field-hint\">0-6 (Sun-Sat)</span>\n              </div>\n            </div>\n\n            <div class=\"syntax-reference\">\n              <div class=\"reference-title\">Syntax Reference</div>\n              <div class=\"reference-items\">\n                <span><code>*</code> any</span>\n                <span><code>*/N</code> every N</span>\n                <span><code>N-M</code> range</span>\n                <span><code>N,M</code> list</span>\n              </div>\n            </div>\n          </div>\n        </ng-template>\n      </kendo-tabstrip-tab>\n    }\n  </kendo-tabstrip>\n\n  <!-- Next Executions Section -->\n  @if (mergedConfig().showNextExecutions && validationResult().isValid && nextExecutions().length > 0) {\n    <div class=\"next-executions-section\">\n      <div class=\"next-executions-label\">Next Executions</div>\n      <ul class=\"next-executions-list\">\n        @for (execution of nextExecutions(); track $index) {\n          <li>{{ formatNextExecution(execution) }}</li>\n        }\n      </ul>\n    </div>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";:host{--cron-bg: var(--mm-cron-bg, #ffffff);--cron-border: var(--mm-cron-border, #e0e0e0);--cron-border-radius: var(--mm-cron-border-radius, 8px);--cron-text: var(--mm-cron-text, #333333);--cron-text-secondary: var(--mm-cron-text-secondary, #666666);--cron-accent: var(--mm-cron-accent, #616161);--cron-accent-hover: var(--mm-cron-accent-hover, #424242);--cron-preview-bg: var(--mm-cron-preview-bg, #f5f5f5);--cron-tab-active-bg: var(--mm-cron-tab-active-bg, #eeeeee);--cron-tab-active-border: var(--mm-cron-tab-active-border, #616161);--cron-error: var(--mm-cron-error, #d32f2f);--cron-success: var(--mm-cron-success, #388e3c);--cron-code-bg: var(--mm-cron-code-bg, #eeeeee);--cron-code-text: var(--mm-cron-code-text, #333333);--cron-shadow: var(--mm-cron-shadow, 0 2px 8px rgba(0, 0, 0, .1));--cron-font-family: var(--mm-cron-font-family, inherit);--cron-font-mono: var(--mm-cron-font-mono, \"Roboto Mono\", \"Consolas\", monospace);display:block;font-family:var(--cron-font-family)}.cron-builder{background:var(--cron-bg);border:1px solid var(--cron-border);border-radius:var(--cron-border-radius);padding:16px;box-shadow:var(--cron-shadow)}.cron-builder.disabled{opacity:.6;pointer-events:none}.expression-section{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--cron-border)}.expression-display .expression-label{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.expression-display .expression-value-row{display:flex;align-items:center;gap:8px}.expression-display .expression-value{flex:1;font-family:var(--cron-font-mono);font-size:1.1rem;font-weight:500;padding:8px 12px;background:var(--cron-code-bg);color:var(--cron-code-text);border-radius:4px}.expression-display .expression-value.invalid{color:var(--cron-error);border:1px solid var(--cron-error)}.expression-display .copy-button{flex-shrink:0;transition:all .2s ease}.expression-display .copy-button.copied{color:var(--cron-success)!important}.expression-display .validation-error{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:.85rem;color:var(--cron-error)}.expression-display .validation-error kendo-svg-icon{flex-shrink:0}.human-readable{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;background:var(--cron-preview-bg);border-radius:4px;font-size:.9rem;color:var(--cron-text)}.human-readable kendo-svg-icon{color:var(--cron-accent);flex-shrink:0}.presets-section{margin-bottom:16px}.presets-section .presets-label{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.presets-section .presets-grid{display:flex;flex-wrap:wrap;gap:8px}.presets-section .preset-button{font-size:.8rem;padding:4px 12px;border-color:var(--cron-border);transition:all .2s ease}.presets-section .preset-button:hover:not(:disabled){border-color:var(--cron-accent);color:var(--cron-accent)}::ng-deep .k-tabstrip{background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items-wrapper{border-bottom:1px solid var(--cron-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item{color:var(--cron-text-secondary);background:transparent;border:none}::ng-deep .k-tabstrip .k-tabstrip-items .k-item.k-active{color:var(--cron-accent);background:var(--cron-tab-active-bg);border-bottom:2px solid var(--cron-tab-active-border)}::ng-deep .k-tabstrip .k-tabstrip-items .k-item:hover:not(.k-active){color:var(--cron-text);background:var(--cron-preview-bg)}::ng-deep .k-tabstrip .k-tabstrip-content{background:transparent;border:none;padding:16px 0}.tab-content{display:flex;flex-direction:column;gap:16px}.form-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.form-row kendo-label{min-width:80px;font-weight:500;color:var(--cron-text)}.form-row kendo-dropdownlist{min-width:140px}.form-row .separator{font-size:1.2rem;font-weight:700;color:var(--cron-text-secondary)}.form-row .time-label,.form-row .suffix-text{font-size:.85rem;color:var(--cron-text-secondary)}.mode-row .mode-buttons{display:flex;flex-wrap:wrap;gap:8px}.mode-row .mode-buttons button{transition:all .2s ease}.mode-row .mode-buttons button.k-selected,.mode-row .mode-buttons button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.days-row{padding-left:92px}.day-buttons{display:flex;flex-wrap:wrap;gap:6px}.day-buttons .day-button{min-width:48px;padding:6px 10px;font-size:.85rem;transition:all .2s ease}.day-buttons .day-button.k-selected,.day-buttons .day-button[ng-reflect-selected=true]{background:var(--cron-accent)!important;border-color:var(--cron-accent)!important;color:#fff!important}.preview-text{font-size:.85rem;color:var(--cron-text-secondary)}.preview-text code{font-family:var(--cron-font-mono);background:var(--cron-preview-bg);padding:2px 6px;border-radius:3px}.custom-tab .custom-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px}.custom-tab .custom-field{display:flex;flex-direction:column;gap:4px}.custom-tab .custom-field kendo-label{font-size:.8rem;font-weight:600;color:var(--cron-text-secondary)}.custom-tab .custom-field kendo-textbox{font-family:var(--cron-font-mono)}.custom-tab .custom-field .field-hint{font-size:.7rem;color:var(--cron-text-secondary)}.custom-tab .syntax-reference{margin-top:16px;padding:12px;background:var(--cron-preview-bg);border-radius:4px}.custom-tab .syntax-reference .reference-title{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.custom-tab .syntax-reference .reference-items{display:flex;flex-wrap:wrap;gap:16px;font-size:.85rem;color:var(--cron-text)}.custom-tab .syntax-reference .reference-items code{font-family:var(--cron-font-mono);background:var(--cron-code-bg);color:var(--cron-code-text);padding:2px 6px;border-radius:3px;margin-right:4px}.next-executions-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--cron-border)}.next-executions-section .next-executions-label{font-size:.75rem;font-weight:600;color:var(--cron-text-secondary);margin-bottom:8px}.next-executions-section .next-executions-list{list-style:none;margin:0;padding:0}.next-executions-section .next-executions-list li{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:.9rem;color:var(--cron-text);font-family:var(--cron-font-mono)}.next-executions-section .next-executions-list li:before{content:\"\\25b8\";color:var(--cron-accent);font-size:.75rem}.next-executions-section .next-executions-list li:not(:last-child){border-bottom:1px dashed var(--cron-border)}@media(max-width:600px){.cron-builder{padding:12px}.form-row{flex-direction:column;align-items:flex-start}.form-row kendo-label{min-width:auto}.days-row{padding-left:0}.time-row{flex-direction:row;flex-wrap:wrap}.time-row kendo-label{width:100%;margin-bottom:8px}.custom-tab .custom-fields{grid-template-columns:repeat(2,1fr)}}@media(max-width:400px){.custom-tab .custom-fields{grid-template-columns:1fr}.presets-grid{flex-direction:column}.presets-grid .preset-button{width:100%}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { config: [{
                 type: Input
             }] } });
@@ -6466,7 +7639,7 @@ class CopyableTextComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CopyableTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: CopyableTextComponent, isStandalone: true, selector: "mm-copyable-text", inputs: { value: "value", label: "label", copyLabel: "copyLabel", buttonTitle: "buttonTitle" }, outputs: { copied: "copied" }, ngImport: i0, template: "<div class=\"mm-copyable-text\">\n  @if (label) {\n    <label class=\"label\">{{ label }}</label>\n  }\n  <div class=\"value-container\">\n    <span class=\"value\">{{ hasValue ? value : '\u2014' }}</span>\n    @if (hasValue) {\n      <button\n        kendoButton\n        type=\"button\"\n        fillMode=\"flat\"\n        [svgIcon]=\"copyIcon\"\n        [title]=\"buttonTitle\"\n        class=\"copy-button\"\n        (click)=\"copyToClipboard()\">\n      </button>\n    }\n  </div>\n</div>\n", styles: [".mm-copyable-text{display:flex;flex-direction:column;gap:4px}.mm-copyable-text .label{font-size:.875rem;font-weight:500;color:var(--kendo-color-subtle, #6c757d)}.mm-copyable-text .value-container{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--theme-bg-elevated, rgba(31, 46, 64, .4));border:1px solid var(--theme-border-subtle, rgba(100, 206, 185, .15));border-radius:4px;transition:border-color .2s ease,box-shadow .2s ease}.mm-copyable-text .value-container:hover{border-color:var(--theme-border-hover, rgba(100, 206, 185, .3))}.mm-copyable-text .value-container .value{flex:1;font-family:Roboto Mono,Consolas,Monaco,monospace;font-size:.875rem;color:var(--theme-text-primary, rgba(var(--octo-text-color), .9));word-break:break-all;-webkit-user-select:text;user-select:text}.mm-copyable-text .value-container .copy-button{flex-shrink:0;opacity:.7;transition:opacity .2s ease}.mm-copyable-text .value-container .copy-button:hover{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: SVGIconModule }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: CopyableTextComponent, isStandalone: true, selector: "mm-copyable-text", inputs: { value: "value", label: "label", copyLabel: "copyLabel", buttonTitle: "buttonTitle" }, outputs: { copied: "copied" }, ngImport: i0, template: "<div class=\"mm-copyable-text\">\n  @if (label) {\n    <label class=\"label\">{{ label }}</label>\n  }\n  <div class=\"value-container\">\n    <span class=\"value\">{{ hasValue ? value : '\u2014' }}</span>\n    @if (hasValue) {\n      <button\n        kendoButton\n        type=\"button\"\n        fillMode=\"flat\"\n        [svgIcon]=\"copyIcon\"\n        [title]=\"buttonTitle\"\n        class=\"copy-button\"\n        (click)=\"copyToClipboard()\">\n      </button>\n    }\n  </div>\n</div>\n", styles: [".mm-copyable-text{display:flex;flex-direction:column;gap:4px}.mm-copyable-text .label{font-size:.875rem;font-weight:500;color:var(--kendo-color-subtle, #6c757d)}.mm-copyable-text .value-container{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--theme-bg-elevated, rgba(31, 46, 64, .4));border:1px solid var(--theme-border-subtle, rgba(100, 206, 185, .15));border-radius:4px;transition:border-color .2s ease,box-shadow .2s ease}.mm-copyable-text .value-container:hover{border-color:var(--theme-border-hover, rgba(100, 206, 185, .3))}.mm-copyable-text .value-container .value{flex:1;font-family:Roboto Mono,Consolas,Monaco,monospace;font-size:.875rem;color:var(--theme-text-primary, rgba(var(--octo-text-color), .9));word-break:break-all;-webkit-user-select:text;user-select:text}.mm-copyable-text .value-container .copy-button{flex-shrink:0;opacity:.7;transition:opacity .2s ease}.mm-copyable-text .value-container .copy-button:hover{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: SVGIconModule }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CopyableTextComponent, decorators: [{
             type: Component,
@@ -6546,6 +7719,180 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
             type: Injectable
         }] });
 
+const DEFAULT_ROW_ACTIONS_MESSAGES = {
+    actionsFor: 'Actions for {name}',
+    actions: 'Actions',
+    moreActionsFor: 'More actions for {name}',
+    moreActions: 'More actions',
+};
+/** App-wide translations of `mm-row-actions`. Partial: members left out keep their English default. */
+const MM_ROW_ACTIONS_MESSAGES = new InjectionToken('MM_ROW_ACTIONS_MESSAGES');
+/**
+ * Merges overrides over {@link DEFAULT_ROW_ACTIONS_MESSAGES}, later sources winning; members that
+ * are missing, `undefined` or `null` keep the earlier value.
+ */
+function resolveRowActionsMessages(...overrides) {
+    const resolved = { ...DEFAULT_ROW_ACTIONS_MESSAGES };
+    for (const messages of overrides) {
+        if (!messages) {
+            continue;
+        }
+        for (const key of Object.keys(messages)) {
+            const value = messages[key];
+            if (value !== undefined && value !== null) {
+                resolved[key] = value;
+            }
+        }
+    }
+    return resolved;
+}
+
+/**
+ * The actions of one table row (AB#5570): icon buttons (16 px) with tooltip and an accessible
+ * name that includes the row ("Edit Mesh Adapter"), from one shared action definition.
+ * At most `maxInline` slots (default 3): when the actions do not fit, the last slot becomes a
+ * "More actions for …" menu. Disabled actions stay focusable and announce their reason;
+ * in the menu the reason is shown under the item text.
+ *
+ * Texts ("Actions for …", "More actions for …") come from {@link MM_ROW_ACTIONS_MESSAGES} and the
+ * `messages` input (the input wins), English by default.
+ *
+ * The component only emits — destructive handlers confirm first (danger dialog naming the target).
+ *
+ * ```html
+ * <td class="actions">
+ *   <mm-row-actions [actions]="rowActions(run)" [rowLabel]="runLabel(run)" (triggered)="onAction($event, run)" />
+ * </td>
+ * ```
+ */
+class RowActionsComponent {
+    /** Action definitions for this row (hidden ones are filtered out). */
+    actions = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
+    /** Human name of the row ("Mesh Adapter", "Encrypt run 2026-10-06 17:09"); part of every accessible name. */
+    rowLabel = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "rowLabel" }] : /* istanbul ignore next */ []));
+    /** Slots incl. the overflow button. */
+    maxInline = input(MM_ROW_ACTIONS_MAX_INLINE, { ...(ngDevMode ? { debugName: "maxInline" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /** Translations for this instance; members left out come from `MM_ROW_ACTIONS_MESSAGES`, else English. */
+    messages = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    /** Fires for enabled actions only, inline or from the menu. */
+    triggered = output();
+    router = inject(Router, { optional: true });
+    /** Menu links resolve like the inline `routerLink`: relative to the hosting route. */
+    route = inject(ActivatedRoute, { optional: true });
+    injectedMessages = inject(MM_ROW_ACTIONS_MESSAGES, { optional: true });
+    moreIcon = moreVerticalIcon;
+    m = computed(() => resolveRowActionsMessages(this.injectedMessages, this.messages()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "m" }] : /* istanbul ignore next */ []));
+    split = computed(() => splitRowActions(this.actions(), this.maxInline()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "split" }] : /* istanbul ignore next */ []));
+    menuItems = computed(() => this.split().menu.map((action) => ({
+        text: action.menuLabel || action.label,
+        svgIcon: action.icon,
+        disabled: isActionDisabled(action),
+        action,
+    })), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "menuItems" }] : /* istanbul ignore next */ []));
+    /** No group semantics for an empty cell (all actions hidden). */
+    hasActions = computed(() => this.split().inline.length > 0 || this.split().menu.length > 0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
+    moreLabel = computed(() => this.format(this.m().moreActionsFor, this.m().moreActions), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "moreLabel" }] : /* istanbul ignore next */ []));
+    groupLabel = computed(() => this.format(this.m().actionsFor, this.m().actions), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "groupLabel" }] : /* istanbul ignore next */ []));
+    format(withName, withoutName) {
+        const name = (this.rowLabel() ?? '').trim();
+        return name ? withName.split('{name}').join(name) : withoutName;
+    }
+    onMenuItem(item) {
+        if (!item || item.disabled) {
+            return;
+        }
+        const link = item.action.link;
+        if (link && this.router) {
+            const commands = typeof link.commands === 'string' ? [link.commands] : [...link.commands];
+            void this.router.navigate(commands, { queryParams: link.queryParams, relativeTo: this.route ?? undefined });
+        }
+        this.triggered.emit({ id: item.action.id, action: item.action });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: RowActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: RowActionsComponent, isStandalone: true, selector: "mm-row-actions", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: true, transformFunction: null }, rowLabel: { classPropertyName: "rowLabel", publicName: "rowLabel", isSignal: true, isRequired: true, transformFunction: null }, maxInline: { classPropertyName: "maxInline", publicName: "maxInline", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { triggered: "triggered" }, host: { properties: { "attr.role": "hasActions() ? \"group\" : null", "attr.aria-label": "hasActions() ? groupLabel() : null" }, classAttribute: "mm-row-actions" }, ngImport: i0, template: `
+    @for (action of split().inline; track action.id) {
+      <mm-action-button [action]="action" [targetLabel]="rowLabel()" context="row" display="icon"
+                        (triggered)="triggered.emit($event)" />
+    }
+    @if (menuItems().length) {
+      <kendo-dropdownbutton
+        class="mm-row-actions__more"
+        [data]="menuItems()"
+        [svgIcon]="moreIcon"
+        size="small"
+        fillMode="flat"
+        themeColor="base"
+        [buttonAttributes]="{ title: moreLabel(), 'aria-label': moreLabel(), 'data-action': 'more' }"
+        (itemClick)="onMenuItem($event)"
+      >
+        <ng-template kendoDropDownButtonItemTemplate let-item>
+          <span class="mm-row-actions__item" [class.mm-row-actions__item--danger]="!!item.action.danger"
+                [attr.data-action]="item.action.id">
+            @if (item.svgIcon) {
+              <kendo-svgicon [icon]="item.svgIcon" />
+            }
+            <span class="mm-row-actions__item-text">
+              <span>{{ item.text }}</span>
+              @if (item.disabled) {
+                <span class="mm-row-actions__item-reason">{{ item.action.disabledReason }}</span>
+              }
+            </span>
+          </span>
+        </ng-template>
+      </kendo-dropdownbutton>
+    }
+  `, isInline: true, styles: [".mm-row-actions{display:inline-flex;align-items:center;gap:var(--theme-space-1, 4px)}.mm-row-actions__item{display:inline-flex;align-items:flex-start;gap:var(--theme-space-2, 8px)}.mm-row-actions__item-text{display:inline-flex;flex-direction:column}.mm-row-actions__item-reason{font-size:.85em;color:var(--theme-text-muted, #75829a);white-space:normal;max-width:280px}.mm-row-actions__item--danger{color:var(--theme-status-error, #c0385f)}.mm-row-actions__more .k-button:focus-visible{outline:none;box-shadow:var(--theme-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #2e8473)}\n"], dependencies: [{ kind: "ngmodule", type: DropDownButtonModule }, { kind: "component", type: i1$1.DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }, { kind: "directive", type: i1$1.ButtonItemTemplateDirective, selector: "[kendoDropDownButtonItemTemplate],[kendoSplitButtonItemTemplate]" }, { kind: "ngmodule", type: SVGIconModule }, { kind: "component", type: i2.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }, { kind: "component", type: ActionButtonComponent, selector: "mm-action-button", inputs: ["action", "targetLabel", "context", "display", "primary"], outputs: ["triggered"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: RowActionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-row-actions', standalone: true, imports: [DropDownButtonModule, SVGIconModule, ActionButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        class: 'mm-row-actions',
+                        '[attr.role]': 'hasActions() ? "group" : null',
+                        '[attr.aria-label]': 'hasActions() ? groupLabel() : null',
+                    }, template: `
+    @for (action of split().inline; track action.id) {
+      <mm-action-button [action]="action" [targetLabel]="rowLabel()" context="row" display="icon"
+                        (triggered)="triggered.emit($event)" />
+    }
+    @if (menuItems().length) {
+      <kendo-dropdownbutton
+        class="mm-row-actions__more"
+        [data]="menuItems()"
+        [svgIcon]="moreIcon"
+        size="small"
+        fillMode="flat"
+        themeColor="base"
+        [buttonAttributes]="{ title: moreLabel(), 'aria-label': moreLabel(), 'data-action': 'more' }"
+        (itemClick)="onMenuItem($event)"
+      >
+        <ng-template kendoDropDownButtonItemTemplate let-item>
+          <span class="mm-row-actions__item" [class.mm-row-actions__item--danger]="!!item.action.danger"
+                [attr.data-action]="item.action.id">
+            @if (item.svgIcon) {
+              <kendo-svgicon [icon]="item.svgIcon" />
+            }
+            <span class="mm-row-actions__item-text">
+              <span>{{ item.text }}</span>
+              @if (item.disabled) {
+                <span class="mm-row-actions__item-reason">{{ item.action.disabledReason }}</span>
+              }
+            </span>
+          </span>
+        </ng-template>
+      </kendo-dropdownbutton>
+    }
+  `, styles: [".mm-row-actions{display:inline-flex;align-items:center;gap:var(--theme-space-1, 4px)}.mm-row-actions__item{display:inline-flex;align-items:flex-start;gap:var(--theme-space-2, 8px)}.mm-row-actions__item-text{display:inline-flex;flex-direction:column}.mm-row-actions__item-reason{font-size:.85em;color:var(--theme-text-muted, #75829a);white-space:normal;max-width:280px}.mm-row-actions__item--danger{color:var(--theme-status-error, #c0385f)}.mm-row-actions__more .k-button:focus-visible{outline:none;box-shadow:var(--theme-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #2e8473)}\n"] }]
+        }], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: true }] }], rowLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowLabel", required: true }] }], maxInline: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxInline", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], triggered: [{ type: i0.Output, args: ["triggered"] }] } });
+
 /*
  * Public API Surface of shared-ui
  */
@@ -6569,5 +7916,5 @@ function provideMmSharedUi() {
  * Generated bundle index. Do not edit.
  */
 
-export { BaseFormComponent, BaseTreeDetailComponent, ButtonTypes, BytesToSizePipe, CRON_PRESETS, ConfirmationService, ConfirmationWindowComponent, ConfirmationWindowResult, CopyableTextComponent, CronBuilderComponent, CronHumanizerService, CronParserService, DEFAULT_CONFIRMATION_WINDOW_MESSAGES, DEFAULT_CRON_BUILDER_CONFIG, DEFAULT_ENTITY_SELECT_DIALOG_MESSAGES, DEFAULT_ENTITY_SELECT_INPUT_MESSAGES, DEFAULT_INPUT_DIALOG_MESSAGES, DEFAULT_LIST_VIEW_MESSAGES, DEFAULT_MESSAGE_DETAILS_DIALOG_MESSAGES, DEFAULT_NOTIFICATION_DISPLAY_MESSAGES, DEFAULT_PROGRESS_WINDOW_MESSAGES, DEFAULT_RESPONSIVE_COLSPAN, DEFAULT_SAVE_AS_DIALOG_MESSAGES, DEFAULT_TIME_RANGE_LABELS, DataSourceBase, DataSourceTyped, DialogType, EntitySelectDialogComponent, EntitySelectDialogService, EntitySelectInputComponent, FetchResultBase, FetchResultTyped, FileUploadResult, FileUploadService, FormTitleExtraDirective, HAS_UNSAVED_CHANGES, HOUR_INTERVALS, HierarchyDataSource, HierarchyDataSourceBase, ImportStrategyDialogComponent, ImportStrategyDialogResult, ImportStrategyDialogService, ImportStrategyDto, InputDialogComponent, InputService, ListStateService, ListViewComponent, ListViewFiltersDirective, MINUTE_INTERVALS, MessageDetailsDialogComponent, MessageDetailsDialogService, MessageListenerService, MmListViewDataBindingDirective, NotificationDisplayService, PascalCasePipe, ProgressValue, ProgressWindowComponent, ProgressWindowService, RELATIVE_WEEKS, SECOND_INTERVALS, SaveAsDialogComponent, SaveAsDialogService, TimeRangePickerComponent, TimeRangeUtils, TreeComponent, UnsavedChangesDirective, UnsavedChangesGuard, UploadFileDialogComponent, WEEKDAYS, WEEKDAY_ABBREVIATIONS, WindowStateService, generateDayOfMonthOptions, generateHourOptions, generateMinuteOptions, provideMmSharedUi };
+export { ActionButtonComponent, BaseFormComponent, BaseTreeDetailComponent, ButtonTypes, BytesToSizePipe, CRON_PRESETS, ConfirmationService, ConfirmationWindowComponent, ConfirmationWindowResult, CopyableTextComponent, CronBuilderComponent, CronHumanizerService, CronParserService, DANGER_CONFIRM_ENVIRONMENT, DANGER_CONFIRM_FALLBACK_WORD, DANGER_CONFIRM_SAFE_FOCUS, DEFAULT_CONFIRMATION_WINDOW_MESSAGES, DEFAULT_CRON_BUILDER_CONFIG, DEFAULT_DANGER_CONFIRMATION_MESSAGES, DEFAULT_EMPTY_STATE_RETRY_LABEL, DEFAULT_ENTITY_SELECT_DIALOG_MESSAGES, DEFAULT_ENTITY_SELECT_INPUT_MESSAGES, DEFAULT_INPUT_DIALOG_MESSAGES, DEFAULT_LIST_VIEW_MESSAGES, DEFAULT_MESSAGE_DETAILS_DIALOG_MESSAGES, DEFAULT_NOTIFICATION_DISPLAY_MESSAGES, DEFAULT_PROGRESS_WINDOW_MESSAGES, DEFAULT_RESPONSIVE_COLSPAN, DEFAULT_ROW_ACTIONS_MESSAGES, DEFAULT_SAVE_AS_DIALOG_MESSAGES, DEFAULT_TIME_RANGE_LABELS, DangerConfirmationResult, DangerConfirmationWindowComponent, DataSourceBase, DataSourceTyped, DialogType, EmptyStateComponent, EntitySelectDialogComponent, EntitySelectDialogService, EntitySelectInputComponent, FetchResultBase, FetchResultTyped, FileUploadResult, FileUploadService, FormTitleExtraDirective, HAS_UNSAVED_CHANGES, HOUR_INTERVALS, HierarchyDataSource, HierarchyDataSourceBase, ImportStrategyDialogComponent, ImportStrategyDialogResult, ImportStrategyDialogService, ImportStrategyDto, InputDialogComponent, InputService, ListStateService, ListViewComponent, ListViewFiltersDirective, MINUTE_INTERVALS, MM_ACTION_ICONS, MM_ROW_ACTIONS_MAX_INLINE, MM_ROW_ACTIONS_MESSAGES, MessageDetailsDialogComponent, MessageDetailsDialogService, MessageListenerService, MmListViewDataBindingDirective, NOTIFICATION_DISPLAY_OPTIONS, NotificationDisplayService, OCTOBOT_ASSET_BASE_URL, OCTOBOT_FORCE_STILL, OCTOBOT_LOOP_MS, OCTOBOT_SIZE_PX, OctoBotComponent, PascalCasePipe, ProgressValue, ProgressWindowComponent, ProgressWindowService, RELATIVE_WEEKS, RowActionsComponent, SECOND_INTERVALS, SaveAsDialogComponent, SaveAsDialogService, TimeRangePickerComponent, TimeRangeUtils, TreeComponent, UnsavedChangesDirective, UnsavedChangesGuard, UploadFileDialogComponent, WEEKDAYS, WEEKDAY_ABBREVIATIONS, WindowStateService, actionAccessibleName, actionTooltip, applyDangerConfirmEnvironment, dangerConfirmNameMatches, dangerConfirmTypingToken, generateDayOfMonthOptions, generateHourOptions, generateMinuteOptions, isActionDisabled, isActionVisible, provideMmSharedUi, resolveListRowAction, resolveListRowLabel, resolveListViewMessages, resolveRowActionsMessages, sameAction, splitRowActions };
 //# sourceMappingURL=meshmakers-shared-ui.mjs.map